docs: add workflow and js sdk reference pages for commerce modules (#10898)

* docs: add workflow and js sdk reference pages for commerce modules

* resolve build errors

www/apps/resources/components/CommerceModuleSections/index.tsx

@@ -1,36 +1,16 @@
 "use client"
 
-import { H2, Hr, useChildDocs } from "docs-ui"
-import React, { useMemo } from "react"
+import { Hr, useChildDocs } from "docs-ui"
+import React from "react"
 
-type CommerceModuleSectionsProps = {
-  name: string
-}
-
-export const CommerceModuleSections = ({
-  name,
-}: CommerceModuleSectionsProps) => {
+export const CommerceModuleSections = () => {
   const guideComponents: (JSX.Element | JSX.Element[])[] = []
   const referenceComponents: (JSX.Element | JSX.Element[])[] = []
-  const { items: workflowItems, component: workflowsComponent } = useChildDocs({
-    showItems: ["Workflows"],
-    titleLevel: 3,
-    itemsPerRow: 2,
-  })
-  const { items: stepItems, component: stepsComponent } = useChildDocs({
-    showItems: ["Steps"],
-    titleLevel: 3,
-    itemsPerRow: 2,
-  })
-
-  const hideWorkflowsSection = useMemo(() => {
-    return !workflowItems?.default.length && !stepItems?.default.length
-  }, [workflowItems, stepItems])
 
   const { items: serverGuideItems, component: serverGuidesComponent } =
     useChildDocs({
       showItems: ["Server Guides"],
-      itemsPerRow: 2,
+      defaultItemsPerRow: 2,
     })
   if (serverGuideItems?.default.length) {
     guideComponents.push(serverGuidesComponent)
@@ -38,7 +18,7 @@ export const CommerceModuleSections = ({
   const { items: storefrontGuideItems, component: storefrontGuidesComponent } =
     useChildDocs({
       showItems: ["Storefront Guides"],
-      itemsPerRow: 2,
+      defaultItemsPerRow: 2,
     })
   if (storefrontGuideItems?.default.length) {
     guideComponents.push(storefrontGuidesComponent)
@@ -46,7 +26,7 @@ export const CommerceModuleSections = ({
   const { items: adminGuideItems, component: adminGuidesComponent } =
     useChildDocs({
       showItems: ["Admin Guides"],
-      itemsPerRow: 2,
+      defaultItemsPerRow: 2,
     })
   if (adminGuideItems?.default.length) {
     guideComponents.push(adminGuidesComponent)
@@ -54,7 +34,7 @@ export const CommerceModuleSections = ({
   const { items: userGuideItems, component: userGuidesComponent } =
     useChildDocs({
       showItems: ["User Guides"],
-      itemsPerRow: 2,
+      defaultItemsPerRow: 2,
     })
   if (userGuideItems?.default.length) {
     guideComponents.push(userGuidesComponent)
@@ -69,7 +49,7 @@ export const CommerceModuleSections = ({
   const { items: referenceItems, component: referencesComponent } =
     useChildDocs({
       showItems: ["References"],
-      itemsPerRow: 2,
+      defaultItemsPerRow: 2,
     })
   if (referenceItems?.default.length) {
     referenceComponents.push(referencesComponent)
@@ -85,23 +65,11 @@ export const CommerceModuleSections = ({
           </>
         </React.Fragment>
       ))}
-      {!hideWorkflowsSection && (
-        <>
-          {guideComponents.length > 0 && <Hr />}
-          <H2 id="medusa-workflows-and-steps">Medusa Workflows and Steps</H2>
-          <p>
-            Medusa provides the following workflows and steps that use the{" "}
-            {name} Module. You can use these workflows and steps in your
-            customizations:
-          </p>
-          {workflowsComponent}
-          {stepsComponent}
-        </>
-      )}
+      {guideComponents.length > 0 && referenceComponents.length > 0 && <Hr />}
       {referenceComponents.map((component, i) => (
         <React.Fragment key={i}>
           <>
-            {(i !== 0 || !hideWorkflowsSection) && <Hr />}
+            {i !== 0 && <Hr />}
             {component}
           </>
         </React.Fragment>