docs: add documentation for Locking Module (#11824)

* add locking docs

* fix main navbar

* added implementation example links

* generate refs

* update architecture

* fix vale error

www/packages/docs-ui/src/components/MainNav/Items/Dropdown/index.tsx

@@ -38,6 +38,7 @@ export const MainNavItemDropdown = ({
               className={clsx("transition-transform", isOpen && "rotate-180")}
             />
           }
+          className="!flex"
         />
       )
     }

www/packages/docs-ui/src/components/MainNav/Items/Link/index.tsx

@@ -9,19 +9,22 @@ type MainNavItemLinkProps = {
   item: NavigationItemLink
   isActive: boolean
   icon?: React.ReactNode
+  className?: string
 }
 
 export const MainNavItemLink = ({
   item,
   isActive,
   icon,
+  className,
 }: MainNavItemLinkProps) => {
   return (
     <LinkButton
       href={item.link}
       className={clsx(
         isActive && "text-medusa-fg-base",
-        !isActive && "text-medusa-fg-muted hover:text-medusa-fg-subtle"
+        !isActive && "text-medusa-fg-muted hover:text-medusa-fg-subtle",
+        className
       )}
     >
       {item.title}

www/packages/docs-ui/src/constants.tsx

@@ -30,6 +30,7 @@ export const navDropdownItems: NavigationItem[] = [
   {
     type: "dropdown",
     title: "Build",
+    project: "resources",
     children: [
       {
         type: "link",
@@ -57,6 +58,7 @@ export const navDropdownItems: NavigationItem[] = [
     type: "dropdown",
     title: "Tools",
     link: "/resources/tools",
+    project: "resources",
     children: [
       {
         type: "sub-menu",
@@ -94,6 +96,8 @@ export const navDropdownItems: NavigationItem[] = [
   {
     type: "dropdown",
     title: "Reference",
+    project: "resources",
+    link: "/resources/references-overview",
     children: [
       {
         type: "link",

www/packages/docs-ui/src/providers/MainNav/index.tsx

@@ -2,7 +2,7 @@
 
 import { usePathname } from "next/navigation"
 import React, { createContext, useContext, useMemo } from "react"
-import { NavigationItem } from "types"
+import { MenuItem, NavigationItem, NavigationItemDropdown } from "types"
 import { useSiteConfig } from "../SiteConifg"
 
 export type MainNavContext = {
@@ -28,6 +28,46 @@ export const MainNavProvider = ({
 
   const baseUrl = `${config.baseUrl}${config.basePath}`
 
+  const findActiveItem = (
+    items: NavigationItemDropdown["children"],
+    currentUrl: string
+  ) => {
+    let item: MenuItem | undefined
+    let fallbackIndex: number | undefined
+    items.some((childItem, index) => {
+      if (childItem.type !== "link" && childItem.type !== "sub-menu") {
+        return false
+      }
+
+      if (childItem.type === "sub-menu") {
+        const activeChildRes = findActiveItem(childItem.items, currentUrl)
+        item = activeChildRes.item
+        fallbackIndex = activeChildRes.fallbackIndex
+        return !!item
+      }
+
+      const isItemActive = currentUrl.startsWith(childItem.link)
+
+      if (!isItemActive) {
+        return false
+      }
+
+      if (childItem.useAsFallback && fallbackIndex === undefined) {
+        fallbackIndex = index
+        return false
+      }
+
+      item = childItem
+
+      return true
+    })
+
+    return {
+      item,
+      fallbackIndex,
+    }
+  }
+
   const activeItemIndex = useMemo(() => {
     const currentUrl = `${baseUrl}${pathname}`.replace(/\/$/, "")
 
@@ -35,24 +75,15 @@ export const MainNavProvider = ({
 
     const index = navItems.findIndex((item, index) => {
       if (item.type === "dropdown") {
-        return item.children.some((childItem) => {
-          if (childItem.type !== "link") {
-            return
-          }
+        const { item: activeChild, fallbackIndex: childFallbackIndex } =
+          findActiveItem(item.children, currentUrl)
 
-          const isItemActive = currentUrl.startsWith(childItem.link)
+        if (activeChild) {
+          fallbackIndex = childFallbackIndex
+          return true
+        }
 
-          if (
-            isItemActive &&
-            childItem.useAsFallback &&
-            fallbackIndex === undefined
-          ) {
-            fallbackIndex = index
-            return false
-          }
-
-          return isItemActive
-        })
+        return item.link && currentUrl.startsWith(item.link)
       }
 
       if (item.project && item.project !== config.project.key) {

www/packages/tags/src/tags/how-to.ts

@@ -35,6 +35,14 @@ export const howTo = [
     "title": "Create Fulfillment Provider",
     "path": "https://docs.medusajs.com/resources/references/fulfillment/provider"
   },
+  {
+    "title": "Use Locking Module",
+    "path": "https://docs.medusajs.com/resources/references/locking-service"
+  },
+  {
+    "title": "Create Locking Provider",
+    "path": "https://docs.medusajs.com/resources/references/locking-module-provider"
+  },
   {
     "title": "Create Notification Provider",
     "path": "https://docs.medusajs.com/resources/references/notification-provider-module"

www/packages/tags/src/tags/index.ts

@@ -1,45 +1,45 @@
 export * from "./user-guide.js"
-export * from "./fulfillment.js"
+export * from "./order.js"
 export * from "./payment.js"
 export * from "./cache.js"
 export * from "./how-to.js"
-export * from "./pricing.js"
 export * from "./server.js"
 export * from "./product.js"
-export * from "./order.js"
-export * from "./inventory.js"
-export * from "./auth.js"
+export * from "./pricing.js"
 export * from "./event.js"
 export * from "./promotion.js"
-export * from "./customer.js"
-export * from "./user.js"
+export * from "./notification.js"
+export * from "./auth.js"
 export * from "./api-key.js"
 export * from "./workflow.js"
 export * from "./stock-location.js"
-export * from "./notification.js"
-export * from "./region.js"
-export * from "./cart.js"
-export * from "./tutorial.js"
+export * from "./inventory.js"
 export * from "./sales-channel.js"
-export * from "./tax.js"
+export * from "./user.js"
+export * from "./region.js"
 export * from "./store.js"
-export * from "./query.js"
-export * from "./checkout.js"
-export * from "./storefront.js"
+export * from "./cart.js"
 export * from "./currency.js"
 export * from "./extend-module.js"
-export * from "./example.js"
-export * from "./product-category.js"
-export * from "./stripe.js"
+export * from "./tutorial.js"
+export * from "./fulfillment.js"
+export * from "./tax.js"
 export * from "./concept.js"
-export * from "./remote-query.js"
-export * from "./step.js"
-export * from "./link.js"
+export * from "./stripe.js"
+export * from "./storefront.js"
+export * from "./product-category.js"
+export * from "./query.js"
+export * from "./checkout.js"
 export * from "./publishable-api-key.js"
-export * from "./logger.js"
-export * from "./event-bus.js"
-export * from "./locking.js"
 export * from "./product-collection.js"
+export * from "./step.js"
+export * from "./example.js"
+export * from "./customer.js"
+export * from "./locking.js"
+export * from "./remote-query.js"
+export * from "./link.js"
+export * from "./event-bus.js"
+export * from "./logger.js"
 export * from "./file.js"
 export * from "./js-sdk.js"
 export * from "./admin.js"

www/packages/tags/src/tags/locking.ts

@@ -42,5 +42,13 @@ export const locking = [
   {
     "title": "createReservationsWorkflow",
     "path": "https://docs.medusajs.com/resources/references/medusa-workflows/createReservationsWorkflow"
+  },
+  {
+    "title": "Use Locking Module",
+    "path": "https://docs.medusajs.com/resources/references/locking-service"
+  },
+  {
+    "title": "Create Locking Provider",
+    "path": "https://docs.medusajs.com/resources/references/locking-module-provider"
   }
 ]

www/packages/tags/src/tags/server.ts

@@ -63,6 +63,14 @@ export const server = [
     "title": "Create Fulfillment Provider",
     "path": "https://docs.medusajs.com/resources/references/fulfillment/provider"
   },
+  {
+    "title": "Use Locking Module",
+    "path": "https://docs.medusajs.com/resources/references/locking-service"
+  },
+  {
+    "title": "Create Locking Provider",
+    "path": "https://docs.medusajs.com/resources/references/locking-module-provider"
+  },
   {
     "title": "Create Notification Provider",
     "path": "https://docs.medusajs.com/resources/references/notification-provider-module"