asyavee/medusa-store
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

docs: add prepare script to generate sidebar (#11894)

Browse Source
This commit is contained in:
Shahed Nasser
2025-03-18 17:37:51 +02:00
committed by GitHub
parent eb2aa8da3c
commit 9ead47c51e
72 changed files with 1709 additions and 295 deletions
Download Patch File Download Diff File Expand all files Collapse all files
www/packages/docs-ui/src/components/Sidebar/Item/Category/index.tsx
+11 -8
View File
@@ -4,7 +4,7 @@
import React, { useEffect, useMemo, useState } from "react"
import { Sidebar } from "types"
import { Loading, SidebarItem, useSidebar } from "../../../.."
import { Badge, Loading, SidebarItem, useSidebar } from "../../../.."
import clsx from "clsx"
import { MinusMini, PlusMini } from "@medusajs/icons"
@@ -106,6 +106,9 @@ export const SidebarItemCategory = ({
{item.title}
</span>
{item.additionalElms}
{item.badge && (
<Badge variant={item.badge.variant}>{item.badge.text}</Badge>
)}
{!item.additionalElms && (
<>
{open && <MinusMini />}
@@ -123,13 +126,6 @@ export const SidebarItemCategory = ({
!open && "overflow-hidden m-0 h-0"
)}
>
{showLoading && (
<Loading
count={3}
className="!mb-0 !px-docs_0.5"
barClassName="h-[20px]"
/>
)}
{item.children?.map((childItem, index) => (
<SidebarItem
item={childItem}
@@ -137,6 +133,13 @@ export const SidebarItemCategory = ({
isParentCategoryOpen={open}
/>
))}
{showLoading && (
<Loading
count={3}
className="!mb-0 !px-docs_0.5"
barClassName="h-[20px]"
/>
)}
</ul>
)}
</div>
www/packages/docs-ui/src/components/Sidebar/Item/Link/index.tsx
+4
View File
@@ -5,6 +5,7 @@
import React, { useCallback, useEffect, useMemo, useRef } from "react"
import { Sidebar } from "types"
import {
Badge,
checkSidebarItemVisibility,
SidebarItem,
useMobile,
@@ -147,6 +148,9 @@ export const SidebarItemLink = ({
{item.title}
</span>
{item.additionalElms}
{item.badge && (
<Badge variant={item.badge.variant}>{item.badge.text}</Badge>
)}
</Link>
</span>
{hasChildren && (
www/packages/docs-ui/src/components/Sidebar/Item/Sidebar/index.tsx
+4 -1
View File
@@ -4,7 +4,7 @@
import React, { useMemo } from "react"
import { Sidebar } from "types"
import { useSidebar } from "../../../.."
import { Badge, useSidebar } from "../../../.."
import clsx from "clsx"
import Link from "next/link"
@@ -56,6 +56,9 @@ export const SidebarItemSidebar = ({
{item.title}
</span>
{item.additionalElms}
{item.badge && (
<Badge variant={item.badge.variant}>{item.badge.text}</Badge>
)}
</Link>
</span>
</li>
www/packages/docs-ui/src/components/Sidebar/Item/SubCategory/index.tsx
+4 -1
View File
@@ -4,7 +4,7 @@
import React, { useMemo, useRef } from "react"
import { Sidebar } from "types"
import { SidebarItem } from "../../../.."
import { Badge, SidebarItem } from "../../../.."
import clsx from "clsx"
export type SidebarItemSubCategoryProps = {
@@ -53,6 +53,9 @@ export const SidebarItemSubCategory = ({
{item.title}
</span>
{item.additionalElms}
{item.badge && (
<Badge variant={item.badge.variant}>{item.badge.text}</Badge>
)}
</span>
</span>
{hasChildren && (
www/packages/docs-ui/src/providers/Sidebar/index.tsx
+109 -37
View File
@@ -21,6 +21,7 @@ import { useSiteConfig } from "../SiteConifg"
import { useIsBrowser } from "../BrowserProvider"
import { getScrolledTop } from "../../utils"
import { usePathname, useRouter } from "next/navigation"
import { SidebarItemCategory, SidebarItemSidebar } from "types/dist/sidebar"
export type SidebarActionOptions = {
sidebar_id: string
@@ -53,6 +54,24 @@ export type SidebarStyleOptions = {
disableActiveTransition?: boolean
}
export type UpdateSidebarItemTypes =
| Partial<Pick<Sidebar.SidebarItemLink, "path" | "title" | "additionalElms">>
| Partial<
Pick<SidebarItemCategory, "title" | "loaded" | "onOpen" | "children">
>
| Partial<Pick<SidebarItemSidebar, "title" | "children">>
export type UpdateActionType = {
sidebar_id: string
items: {
existingItem: Sidebar.SidebarItem
newItem: UpdateSidebarItemTypes
options?: {
setChildrenBehavior: "replace" | "merge"
}
}[]
}
export type SidebarContextType = {
sidebars: Sidebar.Sidebar[]
/**
@@ -75,6 +94,7 @@ export type SidebarContextType = {
items: Sidebar.SidebarItem[],
options?: SidebarActionOptions
) => void
updateItems: (options: UpdateActionType) => void
removeItems: (options: {
items: Sidebar.SidebarItem[]
sidebar_id: string
@@ -125,7 +145,7 @@ export const SidebarContext = createContext<SidebarContextType | null>(null)
export type ActionType =
| {
type: "add" | "update"
type: "add" | "update-child"
items: Sidebar.SidebarItem[]
options?: SidebarActionOptions
}
@@ -138,32 +158,73 @@ export type ActionType =
items: Sidebar.SidebarItem[]
sidebar_id: string
}
| ({
type: "update"
} & UpdateActionType)
export const reducer = (
state: Sidebar.Sidebar[],
actionData: ActionType
): Sidebar.Sidebar[] => {
if (actionData.type === "replace") {
return actionData.sidebars
}
if (actionData.type === "remove") {
const { sidebar_id, items: itemsToRemove } = actionData
return state.map((sidebar) => {
if (sidebar.sidebar_id === sidebar_id) {
return {
...sidebar,
items: sidebar.items.filter((item) => {
return !itemsToRemove.some((itemToRemove) =>
areSidebarItemsEqual({
itemA: item,
itemB: itemToRemove,
})
)
}),
switch (actionData.type) {
case "replace":
return actionData.sidebars
case "remove": {
const { sidebar_id, items: itemsToRemove } = actionData
return state.map((sidebar) => {
if (sidebar.sidebar_id === sidebar_id) {
return {
...sidebar,
items: sidebar.items.filter((item) => {
return !itemsToRemove.some((itemToRemove) =>
areSidebarItemsEqual({
itemA: item,
itemB: itemToRemove,
})
)
}),
}
}
}
return sidebar
})
return sidebar
})
}
case "update":
return state.map((sidebar) => {
if (sidebar.sidebar_id === actionData.sidebar_id) {
return {
...sidebar,
items: sidebar.items.map((item) => {
const itemToUpdate = actionData.items.find((i) =>
areSidebarItemsEqual({
itemA: item,
itemB: i.existingItem,
})
)
if (itemToUpdate) {
const updatedItem = {
...item,
...itemToUpdate.newItem,
} as Sidebar.SidebarItem
if ("children" in updatedItem) {
updatedItem.children =
itemToUpdate.options?.setChildrenBehavior === "merge"
? [
...((item as Sidebar.InteractiveSidebarItem)
.children || []),
...(updatedItem.children || []),
]
: updatedItem.children
}
return updatedItem
}
return item
}),
}
}
return sidebar
})
}
const { type, options } = actionData
@@ -207,7 +268,7 @@ export const reducer = (
},
...state.slice(sidebarIndex + 1),
]
case "update":
case "update-child":
// find item index
return [
...state.slice(0, sidebarIndex),
@@ -406,12 +467,20 @@ export const SidebarProvider = ({
options?: SidebarActionOptions
) => {
dispatch({
type: options?.parent ? "update" : "add",
type: options?.parent ? "update-child" : "add",
items: newItems,
options,
})
}
const updateItems = ({ sidebar_id, items }: UpdateActionType) => {
dispatch({
type: "update",
items,
sidebar_id,
})
}
const removeItems = ({
items,
sidebar_id,
@@ -452,30 +521,32 @@ export const SidebarProvider = ({
}
}, [shouldHandleHashChange])
const handleScroll = useCallback(() => {
const scrolledTop = getScrolledTop(resolvedScrollableElement)
// account for navbar height
if (scrolledTop >= 0 && scrolledTop <= 56) {
const firstChild = getFirstLinkChild(activeMainSidebar.items)
if (firstChild) {
setActivePath(firstChild.path)
router.push(`#${firstChild.path}`, {
scroll: false,
})
}
}
}, [activeMainSidebar, resolvedScrollableElement])
useEffect(() => {
if (!shouldHandleHashChange || !resolvedScrollableElement) {
return
}
const handleScroll = () => {
if (getScrolledTop(resolvedScrollableElement) === 0) {
const firstChild = getFirstLinkChild(activeMainSidebar.items)
if (firstChild) {
setActivePath(firstChild.path)
router.push(`#${firstChild.path}`, {
scroll: false,
})
}
}
}
resolvedScrollableElement.addEventListener("scroll", handleScroll)
return () => {
resolvedScrollableElement.removeEventListener("scroll", handleScroll)
}
}, [shouldHandleHashChange, resolvedScrollableElement])
}, [shouldHandleHashChange, resolvedScrollableElement, handleScroll])
useEffect(() => {
if (!shouldHandleHashChange || !isBrowser) {
@@ -635,6 +706,7 @@ export const SidebarProvider = ({
setActivePath,
isItemActive,
addItems,
updateItems,
removeItems,
mobileSidebarOpen,
setMobileSidebarOpen,