chore: reorganize docs apps (#7228)

* reorganize docs apps

* add README

* fix directory

* add condition for old docs

www/apps/user-guide/.content.eslintrc.js

@@ -0,0 +1,6 @@
+module.exports = {
+  root: true,
+  extends: [
+    "docs/content"
+  ],
+}

www/apps/user-guide/.eslintrc.js

@@ -0,0 +1,14 @@
+module.exports = {
+  root: true,
+  extends: [
+    "docs/next"
+  ],
+  settings: {
+    next: {
+      rootDir: ".",
+    },
+  },
+  ignorePatterns: [
+    "generated"
+  ]
+}

www/apps/user-guide/.gitignore

@@ -0,0 +1,36 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+.yarn/install-state.gz
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

www/apps/user-guide/README.md

@@ -0,0 +1,36 @@
+This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
+
+## Getting Started
+
+First, run the development server:
+
+```bash
+npm run dev
+# or
+yarn dev
+# or
+pnpm dev
+# or
+bun dev
+```
+
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+
+You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
+
+This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
+
+## Learn More
+
+To learn more about Next.js, take a look at the following resources:
+
+- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
+- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+
+You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
+
+## Deploy on Vercel
+
+The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
+
+Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.

www/apps/user-guide/app/customers/groups/page.mdx

@@ -0,0 +1,88 @@
+---
+sidebar_position: 2
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Customer Groups`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to manage customer groups, including customers in these groups.
+
+## Create a Customer Group
+
+To create a customer group:
+
+1. Go to the Customers → Customer Groups page.
+2. Click the Create button.
+3. In the form that opens, enter the customer group's name.
+4. Click the Create button.
+
+---
+
+## View Customer Group Details
+
+To view the details of a customer group:
+
+1. Go to the Customers → Customer Groups page.
+2. Click on the group you want to view.
+
+---
+
+## Edit a Customer Group
+
+To edit a customer group:
+
+1. Go to the customer group’s details page.
+2. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right of the first section.
+3. Click on Edit in the dropdown.
+4. In the drawer that opens, edit the group's name.
+5. Once you’re done, click on the Edit Group button.
+
+---
+
+## Manage Customers in a Group
+
+### View List of Customers in a Group
+
+To view the list of customers in a customer group:
+
+1. Go to the customer group’s details page.
+2. Under the Customers section, you’ll find all customers that belong to this customer group.
+
+### Add Customers to a Group
+
+To add customers to a customer group:
+
+1. Go to the customer group’s details page.
+2. Under the Customers section, click the Add button at the top right.
+3. Check the box next to every customer you want to add to the group.
+4. Once you're done, click on the Add button.
+
+### Remove a Customer from a Group
+
+To remove customers from a customer group:
+
+1. Go to the customer group’s details page.
+2. Under the Customer section, click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon next to the customer you want to remove from the group.
+3. Choose Remove from the dropdown.
+4. Confirm removing the customer by clicking the Continue button in the pop-up.
+
+---
+
+## Delete Customer Group
+
+<Note type="warning">
+
+Deleting a customer group is irreversible.
+
+</Note>
+
+To delete a customer group:
+
+1. Go to the customer group’s details page.
+2. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right of the first section.
+3. Choose Delete from the dropdown.

www/apps/user-guide/app/customers/manage/page.mdx

@@ -0,0 +1,52 @@
+---
+sidebar_position: 1
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Customers`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to manage customers and their details.
+
+## Create a Customer
+
+To create a customer:
+
+1. Go to the Customers page.
+2. Click the Create button.
+3. In the form that opens, enter the customer's details such as first and last name, email, and password.
+4. Once you're done, click the Create button.
+
+---
+
+## View Customer Details
+
+To view a customer’s details:
+
+1. Go to the Customers page.
+2. Click on the customer you want to view.
+
+---
+
+## Edit Customer Details
+
+To edit a customer’s details:
+
+1. Go to a Customer’s details page.
+2. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon in the first section.
+3. Choose Edit from the dropdown.
+4. In the drawer that opens, edit the customer’s details.
+5. Once you’re done, click the Save button.
+
+---
+
+## View Customer Orders
+
+To view the orders of a customer:
+
+1. Go to a Customer’s details page.
+2. Find the customer's orders under the Orders section.

www/apps/user-guide/app/customers/page.mdx

@@ -0,0 +1,34 @@
+---
+sidebar_autogenerate_exclude: true
+---
+
+export const metadata = {
+  title: `Customers`,
+}
+
+# {metadata.title}
+
+In this document, you’ll get an overview of the customer listing page.
+
+## Overview
+
+The Customers page shows you the list of registered customers in your store. For each of those customers, view details such as their orders, or personal information.
+
+Part of the Customers domain is also Customer Groups. Customer groups allow you to put together a set of customers for business purposes.
+
+For example, you can create a VIP customer group for customers that you want to give special discounts.
+
+---
+
+## View List of Customer Groups
+
+To view the list of customer groups, go to the Customers page, then go to the Customer Groups sub-item in the sidebar.
+
+On the Customer Groups page, you'll find the list of customer groups with their details.
+
+---
+
+## Learn More About Customers
+
+- [Manage and View a Customer’s Details](./manage/page.mdx)
+- [Manage and View a Customer Group](./groups/page.mdx)

www/apps/user-guide/app/discounts/create/page.mdx

@@ -0,0 +1,44 @@
+---
+sidebar_position: 1
+---
+
+export const metadata = {
+  title: `Create a Discount`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to create a discount.
+
+## How to Create a Discount
+
+{/* TODO check info for correctness */}
+
+To create a discount:
+
+1. Go to Discounts.
+2. Click the Create button.
+3. In the form that opens:
+    1. Choose the one of the following discount types:
+        - **Percentage:** discount a specific percentage.
+        - **Fixed amount:** discount a specific amount.
+        - **Free shipping:** Remove any shipping amount available during checkout.
+    2. In the "Choose valid regions" field, choose the region(s) that the discount can be used in. If you chose the "Fixed amount" type, you can only choose one region.
+    3. Enter the discount code in the Code field.
+    4. If you chose the Percentage type, enter the percentage amount to discount in the Percentage field.
+    5. If you chose the "Fixed amount" type, enter the amount to discount in the Amount field.
+    6. You can optionally enter a description for the discount.
+    7. To use this discount as a parent discount to other discounts, check the "Is this a template discount?" checkbox. This is useful when you want to re-use rules and conditions across multiple discounts.
+    8. To add a start date for the discount, toggle the "Discount has a start date" field and enter the start date in the field shown. If you keep this field disabled, the discount starts immediately after creating the discount.
+    9. To add an expiry date for the discount, toggle the "Discount has an expiry date" field and enter the end date in the field shown. If you keep this field disabled, the discount doesn't have an expiry date.
+    10. To limit the number of times a discount can be used by all customers, toggle the "Limit the number of redemptions?" field and enter the limit in the field shown. If you keep this field disabled, the discount can be used unlimited times.
+    11. To set the duration that the discount runs for, toggle the "Availability duration" field and enter the duration in years, months, days, hours, and minutes.
+    12. Under the Conditions section, you can add discount's conditions that limits which products, customer groups, or shipping methods that the discount can be used with.
+        - To add a condition, click the "Add condition" button.
+        - A condition is segmented to editable fields:
+            - The first field specifies the criteria of the conditon. For example, "products" to apply the condition on the products.
+            - The second field specifies the limit of the condition. For example, "all" to apply the condition on all products.
+            - The third field can be used to specify additions or exceptions to the condition. For example, "except" to add a condition that applies the discount to all products except.
+            - The fourth field specifies the value of the third field's condition. For example, "Shirt" to add a condition that applies the discount to all products except the product "Shirt".
+    13. Under the Metadata section, optionally add additional information as key-value pairs.
+4. Once you're done, click the Save button.

www/apps/user-guide/app/discounts/manage/page.mdx

@@ -0,0 +1,101 @@
+---
+sidebar_position: 2
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Discounts`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to manage discounts including editing and deleting a discount.
+
+## View Discount Details
+
+To view a discount’s details:
+
+1. Go to Discounts.
+2. Click on the discount you want to view its details
+
+This opens the discount’s details page.
+
+---
+
+## Edit a Discount
+
+### Change Discount Status
+
+{/* TODO check for correctness */}
+
+<Note>
+
+Changing a discount’s status to published makes it available for customers to use. Changing a discount’s status to draft makes it unavailable for customers to use.
+
+</Note>
+
+To change a discount’s status:
+
+1. Go to the discount details page.
+2. At the top right of the first section, you’ll see the status of the discount (for example, Active). Click on it.
+3. Choose from the dropdown the opposite status (for example, Inactive)
+
+### Edit General Information
+
+To edit a discount’s general information:
+
+1. Go to the discount details page.
+2. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon at the top right of the first section.
+3. Choose Edit from the dropdown.
+4. In the drawer that opens, edit any of the discount information.
+5. Once done, click the Save button.
+
+---
+
+## Edit Discount Configurations
+
+To edit a discount’s configuration:
+
+1. Go to the discount details page.
+2. Under the Configurations section, click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon at the top right.
+3. Choose Edit from the dropdown.
+4. In the drawer that opens, edit any of the configurations.
+5. Once done, click the Save button.
+
+---
+
+## Manage Discount Conditions
+
+{/* TODO check for correctness */}
+
+To manage a discount's conditions:
+
+1. Go to the discount details page.
+2. Under the Conditions section, click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon at the top right.
+3. Choose Edit from the dropdown.
+4. In the drawer that opens, you can remove or edit an existing discount, or add a new one. Similar to when you created the discount:
+    - To add a condition, click the "Add condition" button.
+    - A condition is segmented to editable fields:
+        - The first field specifies the criteria of the conditon. For example, "products" to apply the condition on the products.
+        - The second field specifies the limit of the condition. For example, "all" to apply the condition on all products.
+        - The third field can be used to specify additions or exceptions to the condition. For example, "except" to add a condition that applies the discount to all products except.
+        - The fourth field specifies the value of the third field's condition. For example, "Shirt" to add a condition that applies the discount to all products except the product "Shirt".
+5. Once you're done, click the Save button.
+
+---
+
+## Delete a Discount
+
+<Note type="warning">
+
+Deleting a discount is irreversible.
+
+</Note>
+
+To delete a discount:
+
+1. Go to the discount details page.
+2. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon at the top right of the first section.
+3. Choose Delete from the dropdown.
+4. Confirm deleting the discount by entering its code and clicking the Delete button in the pop-up.

www/apps/user-guide/app/discounts/page.mdx

@@ -0,0 +1,36 @@
+---
+sidebar_autogenerate_exclude: true
+---
+
+export const metadata = {
+  title: `Discounts`,
+}
+
+# {metadata.title}
+
+In this document, you’ll get an overview of types of discounts and the Discounts page.
+
+## Overview
+
+You can create discounts of different types in Medusa that customers use on checkout:
+
+- **Percentage Discounts** to deduct a percentage of the total amount of an order.
+- **Fixed Discounts** to deduct a fixed amount from the total amount of an order.
+- **Free Shipping** to override the delivery amount of an order and make it free.
+
+Discounts are in the form of a code that your customers use. Discounts have conditions and options, such as start and end dates, or what products is the discount applied to.
+
+---
+
+## View List of Discounts
+
+You can view the list of available discounts in your ecommerce store by clicking on Discounts from the sidebar menu.
+
+The list shows discount details such as the code, description, value, and status.
+
+---
+
+## Learn More About Discounts
+
+- [Create a Discount](./create/page.mdx)
+- [Manage Discounts](./manage/page.mdx)

www/apps/user-guide/app/globals.css

@@ -0,0 +1,33 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+:root {
+  --foreground-rgb: 0, 0, 0;
+  --background-start-rgb: 214, 219, 220;
+  --background-end-rgb: 255, 255, 255;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --foreground-rgb: 255, 255, 255;
+    --background-start-rgb: 0, 0, 0;
+    --background-end-rgb: 0, 0, 0;
+  }
+}
+
+body {
+  color: rgb(var(--foreground-rgb));
+  background: linear-gradient(
+      to bottom,
+      transparent,
+      rgb(var(--background-end-rgb))
+    )
+    rgb(var(--background-start-rgb));
+}
+
+@layer utilities {
+  .text-balance {
+    text-wrap: balance;
+  }
+}

www/apps/user-guide/app/inventory/inventory/page.mdx

@@ -0,0 +1,41 @@
+---
+sidebar_position: 1
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Inventory`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to manage inventory in the Medusa Admin.
+
+## Check Inventory
+
+To check your store’s inventory, go to the Inventory page. Here, you’ll see the all available inventory of product variants.
+
+### Filter by Location
+
+To filter the shown results by location:
+
+1. Click on the "Add filter" button.
+2. Select Location from the dropdown.
+3. Select the location(s) to filter ther results by.
+
+---
+
+## Change Variant Inventory Quantity
+
+{/* TODO check info for correctness */}
+
+To change a product variant’s inventory quantity:
+
+1. Go to the Inventory page.
+2. Click the product variant to edit its inventory.
+3. Under the "Location levels" section, find the location to edit the quantity in.
+4. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the right of the location.
+5. Choose "Adjust availability" from the dropdown.
+6. In the drawer that opens, edit the "In Stock" field with the new stock quantity of the variant.
+7. Once you're done, click the Save button.

www/apps/user-guide/app/inventory/page.mdx

@@ -0,0 +1,33 @@
+---
+sidebar_autogenerate_exclude: true
+---
+
+export const metadata = {
+  title: `Inventory`,
+}
+
+# {metadata.title}
+
+In this document, you’ll get an overview of the inventory domain of the Medusa Admin.
+
+## Overview
+
+When a product variant's "Manage Inventory" is enabled, inventory items are created for that variant to manage its quantity.
+
+An inventory item has different quantities for each [location](../settings/locations/page.mdx).
+
+<Note>
+
+The following aren't explained within this section of the user guide:
+
+- Item allocation and locations in orders: this is explained in the [Manage Orders guide](../orders/manage/page.mdx).
+- Managing general inventory of a product variant: this is explained in the [Manage Products guide](../products/manage/page.mdx).
+
+</Note>
+
+---
+
+## Learn More About Inventory
+
+- [Manage Inventory](./inventory/page.mdx)
+- [Manage Reservations](./reservations/page.mdx)

www/apps/user-guide/app/inventory/reservations/page.mdx

@@ -0,0 +1,79 @@
+---
+sidebar_position: 3
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Reservations`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to manage reservations in your store.
+
+## View Reservations
+
+To view reservations, go to Inventory from the sidebar, the click the Reservations sub-item shown in the sidebar.
+
+In the reservations page, you can view all reservations.
+
+### Filter by Location
+
+To filter reservations by location:
+
+1. Click the "Add filter" button.
+2. Choose Location from the dropdown.
+3. Choose the locations(s) to filter the list by.
+
+---
+
+## Create a Reservation
+
+{/* TODO check info for correctness */}
+
+Reservations are created manually when an order is created. You can also manage them from the order’s page.
+
+To manually create a reservation item:
+
+1. Go to Inventory → Reservations.
+2. Click on the Create button.
+3. In the form that opens:
+    1. For the “Location” field, select the location the reservation is created in.
+    2. For the “Item to reserve” field, enter or choose the SKU of the item you want to create a reservation for.
+    3. Set the reserved quantity in the "Reserve amount" field.
+    4. You can optionally add a description in the Description field, or add additional data as key-value pairs under the Metadata section.
+4. Once you’re done, click the Save button.
+
+---
+
+## Edit Reservation
+
+{/* TODO check info for correctness */}
+
+To edit a reservation:
+
+1. Go to Inventory → Reservations
+2. Find the reservation you want to edit, and click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon on its right.
+3. Choose Edit from the dropdown.
+4. In the drawer that opens, edit the reservation's details.
+5. Once you’re done, click the Save button.
+
+---
+
+## Delete Reservation
+
+<Note type="warning">
+
+Deleting a reservation is irreversible.
+
+</Note>
+
+{/* TODO check info for correctness */}
+
+To delete a reservation:
+
+1. Go to Inventory → Reservations
+2. Find the reservation you want to delete, and click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon on its right.
+3. Choose Delete from the dropdown.
+4. Confirm deleting the reservation by clicking the Remove button in the pop-up.

www/apps/user-guide/app/layout.tsx

@@ -0,0 +1,54 @@
+import type { Metadata } from "next"
+import { Inter, Roboto_Mono } from "next/font/google"
+
+import Navbar from "@/components/Navbar"
+import Providers from "@/providers"
+import "../css/globals.css"
+import { TightLayout } from "docs-ui"
+import { config } from "@/config"
+import clsx from "clsx"
+import Feedback from "../components/Feedback"
+import EditButton from "../components/EditButton"
+
+export const metadata: Metadata = {
+  title: {
+    template: `%s - ${config.titleSuffix}`,
+    default: config.titleSuffix || "",
+  },
+  description: "Explore and learn how to use the Medusa Admin.",
+  metadataBase: new URL(
+    process.env.NEXT_PUBLIC_BASE_URL || "http://localhost:3000"
+  ),
+}
+
+export const inter = Inter({
+  subsets: ["latin"],
+  variable: "--font-inter",
+  weight: ["400", "500"],
+})
+
+export const robotoMono = Roboto_Mono({
+  subsets: ["latin"],
+  variable: "--font-roboto-mono",
+})
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  return (
+    <TightLayout
+      ProvidersComponent={Providers}
+      NavbarComponent={Navbar}
+      sidebarProps={{
+        expandItems: true,
+      }}
+      bodyClassName={clsx(inter.variable, robotoMono.variable)}
+    >
+      {children}
+      <Feedback className="my-2" />
+      <EditButton />
+    </TightLayout>
+  )
+}

www/apps/user-guide/app/orders/claims/page.mdx

@@ -0,0 +1,202 @@
+---
+sidebar_position: 8
+---
+
+import { 
+  EllipsisHorizontal, 
+} from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Order's Claims`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn what claims are, how to create them, and more.
+
+## Overview
+
+If a customer receives a faulty or incorrect items for an order, you can create a claim to either refund or replace the item(s).
+
+---
+
+## Create a Claim
+
+<Note type="warning">
+
+If the claim has a refund amount, the refund is issued to the customer right after the claim is created.
+
+</Note>
+
+<Note type="check">
+
+You must capture the order’s payment and create fulfillment in the order for the items included in the claim first.
+
+</Note>
+
+{/* TODO check steps for correctness */}
+
+1. Open the order details page.
+2. In the Timeline section, click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon at the top right.
+3. Choose "Register claim" from the dropdown.
+4. In the new form that opens, there are two steps:
+    1. In the first step, choose the items to claim, then click the Continue button.2
+    2. In the second step:
+        1. For each item under the "Items to claim" section, enter the quantity, choose the return reason, and optionally enter a note that the customer can view.
+        2. Under the "Shipping for claimed items" section:
+            1. Choose the location to return the items to.
+            2. Choose the shipping method used to return the items.
+        3. Under the "Items to Replace" section:
+            1. To add items, click on the "Add items" button, choose products from the drawer, then click the "Add products" button.
+            2. To change the quantity sent of an item, change the value under its Quantity column.
+        4. If you chose items to replace in the previous section, a "Shipping for replacement items section is shown".
+            - Choose the shipping method used to send the item to the customer. Note that its price is considered `0` as the customer isn't expected to pay for it.
+        5. If there's an amount to be refunded, change that amount by toggling the "Custom refund" button and entering the new refund amount in the field shown.
+        6. To disable sending a notification to the customer about the created claim, toggle the "Send notifications" button.
+5. Once you’re done, click on the Save button.
+
+---
+
+## View Claim Details
+
+{/* TODO check steps for correctness */}
+
+To view an order’s claim details:
+
+1. Open the order details page.
+2. In the Timeline section, find the claim and click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon at its right.
+3. Click on More Details in the dropdown.
+
+---
+
+## Manage a Claim’s Returns
+
+{/* TODO check steps for correctness */}
+
+### Receive a Claim’s Return
+
+To mark a claim’s return as received:
+
+1. Open the order details page.
+2. In the Timeline section, find the return requested.
+3. Click on the Receive Return button.
+4. Check or uncheck the items that have been received.
+5. Click the Complete button.
+
+### Cancel a Claim’s Return
+
+{/* TODO check steps for correctness */}
+
+<Note type="warning">
+
+Canceling a return is irreversible.
+
+</Note>
+
+To cancel a return of a claim:
+
+1. Open the order details page.
+2. In the Timeline section, find the return requested and click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon.
+3. Click on “Cancel return” in the dropdown.
+
+---
+
+## Manage a Claim’s Fulfillments
+
+<Note type="warning">
+
+This section only applies if the claim has replacement items.
+
+</Note>
+
+### Create a Fulfillment for a Claim
+
+{/* TODO check steps for correctness */}
+
+You can create fulfillment for items in the claim that you are sending to the customer as a replacement. You can create more than one fulfillment, with each having at least one item.
+
+To create a fulfillment for a claim:
+
+1. Open the order details page.
+2. In the Timeline section, find the claim and click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon.
+3. Click on Fulfill Claim in the dropdown.
+4. In the form that opens:
+    - Choose the items you want to fulfill. You can change the quantity of the items you’re fulfilling using the plus and minus icons.
+    - Optionally add under Metadata any additional information that might be necessary for the fulfillment.
+    - If you don’t want the customer to receive a notification that a fulfillment for the claim items has been created, uncheck the “Send notifications” checkbox.
+5. Once you’re done, click on the Complete button.
+
+### Mark a Claim’s Fulfillment Shipped
+
+{/* TODO check steps for correctness */}
+
+To mark a claim’s fulfillment as shipped:
+
+1. Open the order details page.
+2. Scroll down to the Fulfillment section.
+3. Find the fulfillment you want to mark as shipped. A claim’s fulfillment’s title should be prefixed with “Claim fulfillment”.
+4. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon next to it.
+5. Click on Mark Shipped in the dropdown.
+6. In the new form that opens:
+    - Enter a tracking number for the shipment.
+    - If you have more than one tracking number, click on the “Add Additional Tracking Number” to add more numbers.
+    - If you don’t want the customer to receive a notification that the fulfillment has been shipped, uncheck the “Send notifications” checkbox.
+7. Once you’re done, click the Complete button.
+
+Shipment details can be seen in the Timeline section.
+
+### Cancel a Claim’s Fulfillment
+
+<Note type="warning">
+
+Canceling a fulfillment is irreversible.
+
+</Note>
+
+<Note type="check">
+
+Only a fulfillment that hasn’t been marked as shipped can be canceled.
+
+</Note>
+
+{/* TODO check steps for correctness */}
+
+To cancel a claim’s fulfillment:
+
+1. Open the order details page.
+2. Scroll down to the Fulfillment section.
+3. Find the fulfillment you want to cancel. A claim’s fulfillment’s title should be prefixed with “Claim fulfillment”.
+4. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon next to it.
+5. Click on Cancel Fulfillment in the dropdown.
+6. Confirm canceling the fulfillment by clicking the “Yes, confirm” button in the pop-up.
+
+---
+
+## Cancel a Claim
+
+{/* TODO check info for correctness */}
+
+### For Refund Claims
+
+A claim of type Refund can be canceled by just [canceling the return of the claim](#cancel-a-claims-return). However, the refund can not be reverted.
+
+### For Replace Claims
+
+<Note type="warning">
+
+Canceling a claim is irreversible.
+
+</Note>
+
+<Note type="check">
+
+The [return of the claim must be canceled](#cancel-a-claims-return) before the claim itself is canceled.
+
+</Note>
+
+To cancel a claim of type Replace:
+
+1. Open the order details page.
+2. In the Timeline section, find the claim and click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon.
+3. Click on Cancel Claim in the dropdown.
+4. Confirm canceling the fulfillment by clicking the “Yes, remove” button in the pop-up.

www/apps/user-guide/app/orders/drafts/page.mdx

@@ -0,0 +1,139 @@
+---
+sidebar_position: 5
+---
+
+import { 
+  EllipsisHorizontal, 
+} from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Draft Orders`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn more about draft orders, how to create them, and more.
+
+## Overview
+
+Draft orders are orders created by an admin user. Products or custom items are added to the order as purchased items. You can also specify custom shipping amounts.
+
+After a draft order is created and is marked as paid, an order is created based on that draft order and it appears as part of the Orders list.
+
+---
+
+## Create a Draft Order
+
+To create a draft order:
+
+{/* TODO check steps after #3 */}
+
+1. Go to Orders → Draft Orders.
+2. Click on Create button at the top right.
+3. A new window opens with two steps to create the draft order:
+    1. In the first step:
+        1. Under the Region section, choose the region this draft order belongs to.
+        2. Under the Existing Items section, you can add existing products to the draft order. To do that:
+            1. Click on the "Add products" button.
+            2. In the drawer that opens, choose the products you want to add into the draft order by clicking the checkbox at the left of the product.
+            3. Once done, click on the "Add products" button.
+        3. Under the Custom Items section, you can add custom items to the draft order. To do that:
+            1. In the table, enter the item's title, quantity, and price.
+            2. To add another item, press the <Kbd>tab</Kbd> key, then enter that item's details in the new row.
+            3. Once done, click on the "Add custom item" button.
+        4. Under the Shipping section:
+            1. Choose the shipping method of the draft order.
+            2. To optionally change the price of the chosen shipping method, enter the price in the "Custom shipping price" field.
+        5. Under the Customer section, enter the customer's details:
+            1. If the customer exists, choose it from the "Find existing customer" field. You can search the list of customers by name or email. This fills out the other fields in the section.
+            2. If this is a new customer, enter the customer's details such as first name or email.
+        6. Under the Shipping Address section, enter the customer's shipping address details.
+        7. Under the Billing Address section, either:
+            1. Check the "Same as shipping address" checkbox to use the same details as the shipping address;
+            2. Or uncheck the "Same as shipping address" checkbox and enter the billing address's details.
+        8. Under the Metadata section, optionally enter custom key-value pairs.
+        9. Once you're done, click on the Save button.
+    6. In the last step, confirm that all the information is correct:
+        1. To edit any of the information, click on the "Details" step to go back.
+        2. To add a discount, toggle the "Add discount" button and enter the discount code.
+        3. To disable sending a notification to the customer about their draft order, toggle the "Send notifications" button.
+4. Once you’re done, click on the Save button.
+
+---
+
+## Open Draft Order’s Details
+
+To open a draft order’s details page:
+
+1. Go to Orders → Draft Orders.
+2. Select the draft order you want to view.
+
+---
+
+## Edit Shipping Address
+
+{/* TODO check steps after #3 */}
+
+To edit the shipping address of a draft order:
+
+1. Open the draft order details page.
+2. In the Customer section, click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon at the top right.
+3. Choose "Edit shipping address" from the dropdown.
+4. This opens a new window to edit the shipping address’s info.
+5. Once you’re done click on the "Save and close" button.
+
+---
+
+## Cancel Draft Order
+
+<Note type="warning">
+
+Canceling a draft order is irreversible.
+
+</Note>
+
+{/* TODO check steps after #2 */}
+
+To cancel a draft order:
+
+1. Open the draft order details page.
+2. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon at the top right of the first section.
+3. Choose Cancel from the dropdown.
+4. Confirm canceling the draft order by clicking the “Yes, remove” button in the pop-up.
+
+---
+
+## Mark Draft Order as Paid
+
+<Note>
+
+Marking a draft order as paid creates a new order associated with this draft order.
+
+</Note>
+
+{/* TODO check steps after #2 */}
+
+To mark a draft order as paid:
+
+1. Open the draft order details page.
+2. In the Summary section, click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon at the top right.
+3. Choose "Mark as paid" from the dropdown.
+4. Confirm your action by clicking the “Mark paid” button in the pop-up.
+
+You can find the created order in the Orders page.
+
+---
+
+## Go to Associated Order
+
+<Note type="check">
+
+The draft order must be [marked as paid](#mark-draft-order-as-paid) first.
+
+</Note>
+
+To go to the order associated with the draft order.
+
+1. Go to Orders → Draft Orders.
+2. Find the draft order you're looking for in the list.
+3. Click the link under the Order column.

www/apps/user-guide/app/orders/edit/page.mdx

@@ -0,0 +1,98 @@
+---
+sidebar_position: 4
+---
+
+import { 
+  EllipsisHorizontal, 
+} from "@medusajs/icons"
+
+export const metadata = {
+  title: `Edit an Order’s Items`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to edit items in an order. This includes adding, updating, or deleting items.
+
+## Overview
+
+Using the Medusa Admin, you can edit an order to:
+
+- Add a new item to the order.
+- Edit the quantity of an existing item in the order.
+- Delete an item from the order.
+
+When you request an order edit, the changes aren’t saved on the order until the order edit is confirmed.
+
+There are two ways to confirm an order edit request:
+
+1. The customer reviews the order edit. If they accept the order edit and an additional payment is required, then they’ll have to authorize that payment. The customer can also reject the order edit;
+2. Or you force-confirm the order edit. If there are any additional payment required, you have to handle that manually with the customer.
+
+---
+
+## Request an Order Edit
+
+<Note type="check">
+
+You can’t request an order edit for an order if another order edit is already requested.
+
+</Note>
+
+{/* TODO check info for correctness */}
+
+To request an order edit:
+
+1. Open the order details page.
+2. In the Summary section, click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon.
+3. In the new form that opens:
+    1. To add an item:
+        1. Click on the “Add items” button.
+        2. In the drawer that opens, click on the checkbox next to the items you want to add.
+        3. Once done, click on the “Add products” button.
+    2. To update an item’s quantity:
+        1. Find the item in the table under the "Current Items" section.
+        2. Change the value under the Quantity column.
+    5. To delete an item:
+        1. Find the item in the table under the "Current Items" section.
+        2. Change the value under the Quantity column to `0`.
+    6. Optionally enter a note for the customer to see in the Note field.
+4. Once done, click on the Save button.
+
+---
+
+## Force Confirm an Order
+
+<Note type="warning">
+
+Force-confirming an order makes irreversible changes to the order.
+
+</Note>
+
+<Note>
+
+If the order edit requires additional payment, you’ll have to manually receive that payment from the customer.
+
+</Note>
+
+{/* TODO check info for correctness */}
+
+To force confirm an order:
+
+1. Open the order details page.
+2. Find the order edit in the Timeline section.
+3. Click on the “Force Confirm” button.
+4. Confirm your action by clicking the “Yes, Force Confirm” button in the pop-up.
+
+---
+
+## Cancel an Order Edit Request
+
+To cancel an order-edit request:
+
+{/* TODO check info for correctness */}
+
+1. Open the order details page.
+2. Find the order edit in the Timeline section.
+3. Click on the “Cancel Order Edit” button.
+4. Click the button again to confirm canceling the order.

www/apps/user-guide/app/orders/exchange/page.mdx

@@ -0,0 +1,98 @@
+---
+sidebar_position: 7
+---
+
+import { 
+  EllipsisHorizontal, 
+} from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Exchanges`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to manage order exchanges including how to find customers’ requested order exchanges, how to create them, and how to fulfill them.
+
+## Find Requested Order Exchanges
+
+{/* TODO check info for correctness */}
+
+To find customers’ requested order exchanges:
+
+1. Go to an order’s details page.
+2. In the Timeline section, if there are any requested exchanges you’ll find them with the title “Exchange Requested”.
+
+---
+
+## Create an Order Exchange
+
+{/* TODO check steps for correctness */}
+
+<Note type="check">
+
+The order’s payment must be captured and the order's items must be fulfilled first.
+
+</Note>
+
+To create an order exchange:
+
+1. Go to an order’s details page.
+2. In the Timeline section, click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon.
+3. Click on Register Exchange from the dropdown.
+4. In the new form that opens, there are two steps:
+    1. In the first step, choose the items to return to the customer. Once you're done, click on the Continue button.
+    2. In the second step:
+        1. For each item under the "Items to return" section, enter the item's quantity, choose the return reason, and optionally provide a note that's shown to the customer.
+        2. Under the Shipping section:
+            1. Choose the location the item is returned to.
+            2. Choose the shipping method used to return the item.
+        3. Under the "Items to send" section:
+            1. To add items to send, click the "Add items" button and choose the Products from the drawer, then click "Add products".
+            2. To change an item's quantity, change the value under its Quantity column.
+        4. If a refund is required, you can change the amount refunded by toggling the "Custom refund" button and entering the new amount in the field shown.
+        5. To disable sending a notification to the customer regarding the exchange, toggle the "Send notifications" button.
+5. Once you’re done, click the Save button.
+
+---
+
+## Mark an Exchange’s Return as Received
+
+{/* TODO check steps for correctness */}
+
+To mark a return that is part of an exchange as received:
+
+1. Go to an order’s details page.
+2. In the Timeline section, find the order exchange.
+3. Click on the Receive Return button.
+4. Check the items you want to mark as received.
+5. Click the Complete button.
+
+---
+
+## Cancel an Exchange
+
+<Note type="warning">
+
+Canceling an exchange is irreversible.
+
+</Note>
+
+<Note type="check">
+
+The return of the exchange must be canceled first. If the return has been marked as received, the exchange can’t be canceled.
+
+</Note>
+
+{/* TODO check steps for correctness */}
+
+To cancel an exchange:
+
+1. Go to an order’s details page.
+2. In the Timeline section, find the order exchange.
+3. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon next to it.
+4. Click on “Cancel return” from the dropdown.
+5. Confirm canceling the return by clicking the “Yes, cancel” button in the pop-up.
+6. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon again next to the order exchange.
+7. Click on “Cancel exchange” from the dropdown.
+8. Confirm canceling the exchange by clicking the “Yes, cancel” button in the pop-up.

www/apps/user-guide/app/orders/export/page.mdx

@@ -0,0 +1,63 @@
+---
+sidebar_position: 9
+---
+
+import { BellAlert, ArrowDownTray } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Export Orders`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to export all orders in your Medusa store.
+
+When you export your orders, you download a CSV file with the orders' details.
+
+## Export List of Orders
+
+{/* TODO check for correctness */}
+
+To export orders:
+
+1. Go to Orders page.
+2. Click on the Export button at the top right.
+3. Click Export in the window that opens.
+4. To check the export's status, click the <InlineIcon Icon={BellAlert} alt="bell" /> icon at the top right of the page. You should see your new export loading.
+6. Once the export is ready, click the <InlineIcon Icon={ArrowDownTray} alt="download" /> icon.
+
+<Note>
+
+If you face any errors or difficulties, please contact your technical support team as this could be an issue in the storage integration used.
+
+</Note>
+
+---
+
+## Cancel an Order Export
+
+{/* TODO check for correctness and if feature is still available */}
+
+To cancel an order export:
+
+1. Click on the <InlineIcon Icon={BellAlert} alt="bell" /> icon at the top right of the page.
+2. Find the export you want to cancel.
+3. Click on the cancel button.
+
+---
+
+## Delete an Order Export
+
+{/* TODO check for correctness and if feature is still available */}
+
+<Note>
+
+You can only delete a finished order export.
+
+</Note>
+
+To delete an order export:
+
+1. Click on the <InlineIcon Icon={BellAlert} alt="bell" /> icon at the top right of the page.
+2. Find the export you want to delete.
+3. Click on the Delete button.

www/apps/user-guide/app/orders/fulfillments/page.mdx

@@ -0,0 +1,93 @@
+---
+sidebar_position: 3
+sidebar_label: Manage Fulfillments
+---
+
+import { 
+  EllipsisHorizontal, 
+} from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Order's Fulfillments`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn about order fulfillments and how to manage them, including how to create fulfillments and mark them as shipped.
+
+## Create Fulfillment
+
+{/* TODO check after #4 */}
+
+To create a fulfillment for an order:
+
+1. Open the order details page.
+2. Scroll down to the Unfulfilled Items section.
+3. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon.
+4. Choose "Create Fulfillment" from the dropdown.
+5. In the form that opens:
+    - Choose the location you want to fulfill the items from.
+    - Under Items to fulfill, enter the quantity of the items you want to fulfill.
+    - Optionally enter any additional information you want to associate with the fulfillment under the Metadata section.
+    - If you don’t want the customer to receive a notification that a fulfillment has been created, uncheck the “Send notifications” checkbox.
+6. Once done, click on the "Create fulfillment" button.
+
+Check the fulfillment details in the Fulfillment and Timeline sections.
+
+---
+
+## Mark a Fulfillment Shipped
+
+<Note type="warning">
+
+Marking a fulfillment shipped is irreversible.
+
+</Note>
+
+<Note type="check">
+
+You must [create a fulfillment](#create-fulfillment) first.
+
+</Note>
+
+{/* TODO check after #4 */}
+
+To mark a fulfillment as shipped in an order:
+
+1. Open the order details page.
+2. Scroll down to the Fulfillment section. If you have more than one fulfillment, find the fulfillment you're looking for.
+3. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right of the section.
+4. Click on Mark Shipped in the dropdown.
+5. In the new window that opens:
+    - Enter a tracking number for the shipment.
+    - If you have more than one tracking number, click on the “Add Additional Tracking Number” to add more numbers.
+    - If you don’t want the customer to receive a notification that the fulfillment has been shipped, uncheck the “Send notifications” checkbox.
+6. Once you’re done, click the Complete button.
+
+Shipment details are shown in the Timeline section.
+
+---
+
+## Cancel a Fulfillment
+
+<Note type="warning">
+
+Canceling a fulfillment is irreversible.
+
+</Note>
+
+<Note type="check">
+
+Only a fulfillment that hasn’t been marked as shipped can be canceled.
+
+</Note>
+
+{/* TODO check after #4 */}
+
+To cancel a fulfillment in an order:
+
+1. Open the order details page.
+2. Scroll down to the Fulfillment section. If you have more than one fulfillment, find the fulfillment you're looking for.
+3. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right of the section.
+4. Click on Cancel Fulfillment in the dropdown.
+5. Confirm canceling the fulfillment by clicking the “Yes, confirm” button in the pop-up.

www/apps/user-guide/app/orders/manage/page.mdx

@@ -0,0 +1,230 @@
+---
+sidebar_position: 1
+sidebar_label: Manage Details
+---
+
+import { 
+  ArrowsPointingOut, 
+  EllipsisHorizontal, 
+  FaceSmile,
+  ArrowUpCircleSolid
+} from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Order Details`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to find an order’s details page, what information you find on the order details page, and how to manage the order’s details.
+
+## Open Order’s Details
+
+To open an order’s details:
+
+1. Go to Orders.
+2. Select one of the orders.
+
+This opens the order’s details page.
+
+---
+
+## Sections of the Order Details Page
+
+### First Section
+
+The first section of the page shows the summary of the order, including its number, payment and fulfillment status, date created, sales channel, and more.
+
+### Summary
+
+This section includes the summary of the items the customer purchased as well as totals related to taxes, shipping, and more.
+
+### Customer
+
+This section includes the customer’s details, including their contact information and shipping address.
+
+### Activity
+
+{/* TODO check if these details are correct */}
+
+This section of the order details page shows a summary of the order’s history. This includes updates to the order’s status, requests for return or exchange, notes, and more.
+
+### Payments
+
+This section includes details related to the order’s payments, showing a full history of the changes in the payment's status. It also provides actions such as capture the authorized payment.
+
+## Unfulfilled Items
+
+This section includes the details of items that haven't been fulfilled yet. It also provides the action to fulfill items.
+
+### Fulfillment
+
+For every fulfillment you create, a new fulfillment section is added with its number in the title. The section includes details of the fulfillment and actions to perform on it.
+
+### JSON
+
+This section is useful for developers to view the JSON structure of the order's data.
+
+To view the JSON structure, click on the <InlineIcon Icon={ArrowsPointingOut} alt="Expand" /> icon. 
+
+---
+
+## Manage Item Allocation
+
+When a customer places an order, the ordered quantity of the items's underlying product variant is considered reserved (or allocated) in a stock location. This is only applied to product variants that have "Manage Inventory" enabled.
+
+Manage the item's allocation by managing the location that the item's quantity is reserved from.
+
+{/* TODO check information in this section for correctness */}
+
+{/* TODO maybe the following sections belong to one section. */}
+
+### Allocate an Item
+
+Items are allocated by default. However, in some edge cases you may need to allocate an item manually.
+
+To allocate an item:
+
+{/* TODO check information after #5 */}
+
+1. Go to the order details page.
+2. Scroll to the Summary section.
+3. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon at the top right of the section.
+4. Choose "Allocate items" from the dropdown.
+5. In the form that opens:
+  1. For the Location field, choose the location to allocate the item from.
+  2. In the Items to Allocate section, choose the quantity to allocate for each item.
+6. Once you're done, click the "Save allocation" button.
+
+### Edit Item Allocation
+
+If an item is already allocated, you can edit its allocation by following these steps:
+
+{/* TODO check information after #5 */}
+
+1. Go to the order details page.
+2. Scroll to the Summary section.
+3. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon at the top right of the section.
+4. Choose "Allocate items" from the dropdown.
+5. In the new window that opens:
+  1. In the Locations field, choose the location to allocate this item from.
+  2. Once done, click the "Save and close" button.
+
+### Delete Item Allocation
+
+{/* TODO check information after #5 */}
+
+To delete an item allocation:
+
+1. Go to the order details page.
+2. Scroll to the Summary section.
+3. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon at the top right of the section.
+4. Choose "Allocate items" from the dropdown.
+5. In the new window that opens, click on the "Delete allocation" button.
+
+---
+
+## Edit the Shipping Address
+
+{/* TODO check information after #4 */}
+
+To edit the shipping address used for an order:
+
+1. Open the order details page.
+2. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon at the top right of the Customer section.
+3. Click on "Edit shipping address" from the dropdown.
+4. This opens a drawer to edit the shipping address.
+5. Once you’re done, click on the Save button.
+
+---
+
+## Edit the Billing Address
+
+{/* TODO check information after #4 */}
+
+To edit the billing address used for an order:
+
+1. Open the order details page.
+2. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon at the top right of the Customer section.
+3. Click on "Edit billing address" from the dropdown.
+4. This opens a drawer to edit the billing address.
+5. Once you’re done, click on the Save button.
+
+---
+
+## Edit Email Address
+
+{/* TODO check information after #4 */}
+
+To edit the email address associated with an order:
+
+1. Open the order details page.
+2. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon at the top right of the Customer section.
+3. Click on "Edit email" from the dropdown.
+4. This opens a drawer to edit the email address.
+5. Once you’re done, click on the Save button.
+
+---
+
+## Transfer Customer Ownership
+
+{/* TODO check information after #4 */}
+
+To change the customer that placed this order:
+
+1. Open the order details page.
+2. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon at the top right of the Customer section.
+3. Click on "Transfer ownership" from the dropdown.
+4. In the new window that opens choose the new customer to own this order.
+5. Once done, click on the Confirm button.
+
+---
+
+## Add a Note
+
+{/* TODO check information for correctness */}
+
+To add a note to an order:
+
+1. Open the order details page.
+2. In the Timeline section, enter the note in the text field. You can also choose emojis by clicking the <InlineIcon Icon={FaceSmile} alt="emoji" /> icon.
+3. Once done, click on the <InlineIcon Icon={ArrowUpCircleSolid} alt="send" /> icon.
+
+The note is added and shown in the timeline.
+
+---
+
+## Delete a Note
+
+{/* TODO check information for correctness */}
+
+<Note type="warning">
+
+Deleting notes is irreversible.
+
+</Note>
+
+To delete a note in an order:
+
+1. Open the order details page.
+2. In the Timeline section, find the note you want to delete from the timeline.
+3. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon next to the note.
+4. Click on Delete from the dropdown.
+5. Confirm deleting the note by clicking the “Yes, delete” button in the pop-up.
+
+---
+
+## Cancel an Order
+
+<Note type="warning">
+
+Canceling an order is irreversible.
+
+</Note>
+
+To cancel an order:
+
+1. Open the order details page.
+2. In the first section showing the order’s number, click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> at the top right.
+3. Click on Cancel Order from the dropdown.
+4. Confirm canceling the order by clicking the “Continue” button in the pop-up.

www/apps/user-guide/app/orders/page.mdx

@@ -0,0 +1,48 @@
+---
+sidebar_autogenerate_exclude: true
+---
+
+export const metadata = {
+  title: `Orders`,
+}
+
+# {metadata.title}
+
+In this document, you’ll get an overview of the orders listing page.
+
+## Overview
+
+When customers buy one or more products, their order appears on the Orders page. There, view an order’s information, capture payment, create shipments and fulfillments, register returns or exchanges of the order, and more.
+
+The Orders domain also contains draft orders. Draft orders are orders that you create from the Medusa Admin. After you fill out the order and mark it paid, it’s transformed into an order that appears as part of the Orders page.
+
+---
+
+## View List of Orders
+
+View the list of available orders in your ecommerce store by clicking on Orders from the sidebar menu.
+
+In the list, you can see order details such as the ID, date, customer, sales channel, and fulfillment and payment status.
+
+---
+
+## View List of Draft Orders
+
+When you open the Orders page, the Draft Orders sub-item is shown in the sidebar. Click it to view the list of draft orders.
+
+{/* TODO check if the details are correct. */}
+
+In the list, you can see draft order details such as ID, the ID of the order the draft order belongs to, the date, the customer, and the status of the draft order.
+
+---
+
+## Learn More About Orders
+
+- [Manage Order Details](./manage/page.mdx)
+- [Manage Order’s Payment](./payments/page.mdx)
+- [Manage Order’s Fulfillment](./fulfillments/page.mdx)
+- [Manage Draft Orders](./drafts/page.mdx)
+- [Manage Order Returns](./returns/page.mdx)
+- [Manage Order Claims](./claims/page.mdx)
+- [Manage Order Exchanges](./exchange/page.mdx)
+- [Export Orders](./export/page.mdx)

www/apps/user-guide/app/orders/payments/page.mdx

@@ -0,0 +1,71 @@
+---
+sidebar_position: 2
+sidebar_label: Manage Payments
+---
+
+import { 
+  EllipsisHorizontal, 
+} from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Order's Payments`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to manage an order’s payment, including capturing and refunding the payment.
+
+## Overview
+
+When a customer places an order, using the payment provider they choose during checkout, they authorize the payment.
+
+The payment isn’t automatically captured. You must capture it manually from the Medusa Admin.
+
+---
+
+## Capture Payment
+
+<Note>
+
+Payment is only captured once.
+
+</Note>
+
+To capture an order’s payment:
+
+1. Open the order details page.
+2. Scroll to the Payments section.
+3. Click on the Capture button.
+
+---
+
+## Refund Payment
+
+<Note type="warning">
+
+Refunding payments is irreversible.
+
+</Note>
+
+<Note type="check">
+
+Payment can only be refunded if it's captured.
+
+</Note>
+
+{/* TODO check info after #5 */}
+
+To refund an order’s payment:
+
+1. Open the order details page.
+2. Scroll to the Payment section.
+3. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon.
+4. Choose "Refund" from the dropdown.
+5. In the drawer that opens:
+    - Enter the amount to refund in the "Refund amount" field.
+    - In the Reason field, choose a reason for the refund.
+    - Optionally enter a note that the customer can view in the Note field.
+    - If you don’t want the customer to receive a notification that the payment has been refunded, uncheck the “Send notifications” checkbox.
+6. Once you’re done, click on the Complete button.
+
+Check refund details in the Payment, Summary, and Timeline sections.

www/apps/user-guide/app/orders/returns/page.mdx

@@ -0,0 +1,112 @@
+---
+sidebar_position: 6
+sidebar_label: Manage Returns
+---
+
+import { 
+  EllipsisHorizontal, 
+} from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Order’s Returns`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn more about order returns, how to request a return, and more.
+
+## Overview
+
+Part of the order management system that Medusa provides is automating and managing order returns.
+
+There are two ways order returns can be requested:
+
+1. The customer requests a return for an order through the storefront, which the admin user can view on the admin.
+2. The admin user requests to receive a return from the customer. The customer is informed about this through an email.
+
+After a return is requested, the admin user chooses to either cancel the return or mark it as received. When a return is marked as received, a refund is issued to the customer.
+
+---
+
+## Find Return Requests of an Order
+
+To find return requests of an order:
+
+1. Open the order details page.
+2. On the Timeline section, find any returns requested, whether by admin users or by customers.
+
+---
+
+## Request a Return for an Order
+
+{/* TODO check info for correctness */}
+
+To request a return for an order:
+
+1. Open the order details page.
+2. In the Timeline section, click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right.
+3. Choose "Request Return" from the dropdown.
+4. In the new window that opens, there are two steps to follow:
+    1. In the first step:
+        1. Choose the items in the order that you want to request the return.
+        2. Once you're done, click on the "Continue" button.
+    2. In the second step:
+        1. For each item under the "Items to return" section, enter the quantity, choose the [Reason](../../settings/return-reasons/page.mdx), and optionally add a note.
+        2. Under the Shipping section:
+            1. Choose the location to return items to.
+            2. Choose the shipping method used to return the items.
+        3. To change the refunded value:
+            1. Toggle the "Custom refund" button.
+            2. Enter the custom amount in the field shown.
+        4. To disable sending a notification to the customer that the order return is requested, toggle the "Send notifications" button
+5. Once done, click on the Save button.
+
+---
+
+## Receive Return
+
+<Note type="warning">
+
+Once the return is marked as received, a refund is issued to the customer.
+
+</Note>
+
+<Note type="check">
+
+The order's payment must be captured first.
+
+</Note>
+
+{/* TODO check info for correctness */}
+
+To mark a return as received:
+
+1. Open the order details page.
+2. In the Timeline section, find the return requested.
+3. Click on the Receive Return button.
+4. Check or uncheck the items that have been received.
+5. Click the Complete button.
+
+---
+
+## Cancel a Return
+
+<Note type="warning">
+
+Canceling a return is irreversible.
+
+</Note>
+
+<Note type="check">
+
+The return must be [marked as received](#receive-return) first.
+
+</Note>
+
+{/* TODO check info for correctness */}
+
+To cancel a return:
+
+1. Open the order details page.
+2. In the Timeline section, find the return requested and click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon.
+3. Click on “Cancel return” in the dropdown.

www/apps/user-guide/app/page.mdx

@@ -0,0 +1,95 @@
+import { BellAlert, Sidebar } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Medusa Admin User Guide`,
+}
+
+# {metadata.title}
+
+This user guide is intended to help users learn how they can use the Medusa Admin to perform different operational and ecommerce tasks.
+
+{/* TODO change image */}
+
+![Medusa Admin Overview](https://res.cloudinary.com/dza7lstvk/image/upload/v1710228410/User%20Guide/Screenshot_2024-03-12_at_9.24.45_AM_wllqvq.png)
+
+## Access the Medusa Admin
+
+To access the admin panel of your ecommerce store, open the URL of your local or deployed website.
+
+You’ll be asked to log in.
+
+![Log In Page](https://res.cloudinary.com/dza7lstvk/image/upload/v1710228558/User%20Guide/Screenshot_2024-03-12_at_9.29.08_AM_cqjgq3.png)
+
+You must use your user’s email and password to log in. If you’re unsure what your email and password are, please contact the technical personnel that deployed your Medusa application and admin.
+
+<Note title="Technical Tip">
+
+Refer to [this documentation](!resources!/medusa-cli#user) on how to create a user.
+
+</Note>
+
+## Tour of Medusa Admin
+
+After you log into your Medusa Admin, you see a sidebar menu to the left, a search bar at the top, some icons at the top right, and in the middle the content of the page you’re currently on.
+
+### Sidebar Menu
+
+The sidebar menu includes the main navigation of your Medusa Admin. You can use it to navigate between different pages, such as Products or Orders pages.
+
+{/* TODO update image */}
+
+![Sidebar Menu](https://res.cloudinary.com/dza7lstvk/image/upload/v1697793775/Medusa%20Docs/User%20Guide/Screenshot_2023-10-20_at_12.22.43_PM_shbr0e.png)
+
+You can hide the sidebar by clicking the <InlineIcon Icon={Sidebar} alt="sidebar" /> icon at the top next to the sidebar. Clicking it again shows the sidebar.
+
+### Search Bar
+
+You’ll find at the top of the page a search bar. Use this search bar to search orders, products, customers, and more information available in your Medusa Admin.
+
+<Note title="Tip">
+
+You can open the search window using the shortcuts:
+
+Windows and Linux: <Kbd>CTRL</Kbd> + <Kbd>K</Kbd>
+
+Mac OS: <Kbd>⌘</Kbd> + <Kbd>K</Kbd>
+
+</Note>
+
+{/* TODO check if image needs updating */}
+
+![Search Window](https://res.cloudinary.com/dza7lstvk/image/upload/v1710228839/User%20Guide/Screenshot_2024-03-12_at_9.33.46_AM_ywdvpb.png)
+
+You can select a result with your mouse, or use the up and down arrows on your keyboard to navigate between the results, then choose a result by hitting the <Kbd>Enter</Kbd> key.
+
+### Check Notifications
+
+At the top right you’ll find a <InlineIcon Icon={BellAlert} alt="Bell" /> icon. Clicking this icon opens a side window to view any notifications you might have. Use this to view notifications such as completed product exports.
+
+{/* TODO change images */}
+
+![Notifications Window](https://res.cloudinary.com/dza7lstvk/image/upload/v1710243446/User%20Guide/XS_from_Figma_mkn3i2.jpg)
+
+### Change Language
+
+The Medusa Admin supports multiple-languages, with English being the default one. Check out available languages [here](./tips/languages/page.mdx).
+
+Learn how to change the language in [this guide](./settings/profile/page.mdx#change-admin-language).
+
+### Quick Actions
+
+At the top right in the sidebar, you’ll find an avatar icon with your email or name. By clicking this icon, you’ll see a dropdown. Use this dropdown to access settings or sign out.
+
+{/* TODO check if image needs updating */}
+
+![Quick Actions Dropdown](https://res.cloudinary.com/dza7lstvk/image/upload/v1710229778/User%20Guide/Screenshot_2024-03-12_at_9.49.26_AM_j3f1pu.png)
+
+### Change Theme
+
+The Medusa Admin supports both light and dark modes.
+
+![Dark mode](https://res.cloudinary.com/dza7lstvk/image/upload/v1710323255/User%20Guide/Screenshot_2024-03-13_at_11.46.52_AM_atvw1e.png)
+
+You can switch the theme by opening the quick actions dropdown, choosing theme, then choosing the prefered mode.
+
+![Switch modes](https://res.cloudinary.com/dza7lstvk/image/upload/v1710323157/User%20Guide/Screenshot_2024-03-13_at_11.43.01_AM_giyhto.png)

www/apps/user-guide/app/pricing/_import/page.mdx

@@ -0,0 +1,83 @@
+---
+sidebar_position: 2
+---
+
+export const metadata = {
+  title: `Import Prices`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to import prices into your Medusa store.
+
+## Overview
+
+To import prices, you must have the prices in a CSV file. You can see a template of the CSV file during the import process.
+
+<Note>
+
+For a list of accepted columns, refer to [this guide](../../modules/price-lists/admin/_import-prices.mdx#csv-file).
+
+</Note>
+
+<Note type="warning">
+
+When you import prices into a price list, it removes existing prices and adds new prices.
+
+</Note>
+
+---
+
+## Import Prices into a Price List
+
+To import prices into a price list:
+
+1. Go to the price list’s details page.
+2. In the Prices section, click on the <InlineThemeImage light="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999308/Medusa%20Docs/UI%20Icons/1ordBC6_ssysel.png" dark="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999308/Medusa%20Docs/UI%20Icons/1ordBC6_ssysel.png" alt="three dots" /> icon.
+3. Click on “Import price list” from the dropdown.
+4. In the new window:
+    1. If you’re unsure of what the CSV file’s format must be like, you can download a template CSV file by clicking the <InlineThemeImage light="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999458/Medusa%20Docs/UI%20Icons/fhRqHS3_kwmafj.png" dark="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999458/Medusa%20Docs/UI%20Icons/fhRqHS3_kwmafj.png" alt="download" /> icon.
+    2. To upload the CSV file you want to import prices from, either:
+        1. Drag and drop the file into the dashed box;
+        2. Or click on the dashed box and choose the file you want to import the prices from.
+    3. After you upload the CSV file:
+        1. You can check the number of prices to be added above the uploaded file’s name.
+        2. You can remove the file you choose by clicking the <InlineThemeImage light="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999273/Medusa%20Docs/UI%20Icons/7hztVhj_mj6mxu.png" dark="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999273/Medusa%20Docs/UI%20Icons/7hztVhj_mj6mxu.png" alt="trash" /> icon.
+5. Once you’re done choosing a file to import prices from, click on the Import List button.
+
+This starts the import process. Based on the number of prices you’re importing, it can take some time.
+
+<Note>
+
+If you face any errors or difficulties, please contact your technical support team as this could be an issue in the storage integration used.
+
+</Note>
+
+### Check Import Status
+
+To check the status of the import:
+
+1. Click on the <InlineThemeImage light="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999016/Medusa%20Docs/UI%20Icons/mWhpxNX_xteuos.png" dark="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999016/Medusa%20Docs/UI%20Icons/mWhpxNX_xteuos.png" alt="bell" /> icon at the top right of the page.
+2. Find the price import, which should be the latest item on the list.
+
+If a loading indicator is showing, then the import process is still in progress.
+
+If the import is done, you should see the text “Import of prices is done.”
+
+Once the import is done, you should find the news prices on the price list’s details page.
+
+---
+
+## Cancel Import
+
+<Note>
+
+You can only cancel an unfinished prices import.
+
+</Note>
+
+To cancel a price import:
+
+1. Click on the <InlineThemeImage light="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999016/Medusa%20Docs/UI%20Icons/mWhpxNX_xteuos.png" dark="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999016/Medusa%20Docs/UI%20Icons/mWhpxNX_xteuos.png" alt="bell" /> icon at the top right of the page.
+2. Find the import you want to cancel.
+3. Click on the cancel button.

www/apps/user-guide/app/pricing/create/page.mdx

@@ -0,0 +1,32 @@
+---
+sidebar_position: 1
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Create a Price List`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to create a price list.
+
+{/* TODO check for correctness */}
+
+To create a price list:
+
+1. Go to the Pricing page.
+2. Click on the Create button.
+3. A form opens to create a price list. The form is split into three steps:
+    1. In the first step:
+        1. Under the Type section, choose the price list's type. It can be either Sale or Override.
+        2. Enter the title and description of the price list in their respective fields.
+        3. If the prices in the price list include taxes, enable the "Tax inclusive prices" field.
+        4. If the price list has a start or end date, set those in their respective fields.
+        5. To limit which customer groups can use the price list, enable the "Customer availability" field and check the checkbox next to the customer groups allowed to use the price list.
+        6. Once you're done, click the Continue button.
+    2. In the second step, choose the products that the price list applies to. Once you're done, click the Continue button.
+    3. In the third step, enter the price of each product variant. The price editor uses the [bulk editor](../../tips/bulk-editor/page.mdx).
+        - To add a currency, click on the "Add currency" button and select the currency.
+4. Once you're done, click the Save button.

www/apps/user-guide/app/pricing/manage/page.mdx

@@ -0,0 +1,121 @@
+---
+sidebar_position: 2
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Price Lists`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to manage price lists and their related information.
+
+## View Price List Details
+
+To view a price list’s details:
+
+1. Go to the Pricing page.
+2. Click on the price list you want to view.
+
+---
+
+## Change Price List Status
+
+{/* TODO check for correctness */}
+
+<Note>
+
+Publishing a price list makes it and its prices available to customers. Unpublishing a price list makes it and its prices unavailable to customers.
+
+</Note>
+
+To change a price list’s status:
+
+1. Go to the Pricing page.
+2. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon next to the price list.
+3. If the price list is a draft, click on "Mark as active" in the dropdown to publish it. Otherwise, if the price list is active or published, click on the "Mark as draft" in the dropdown to unpublish it.
+
+---
+
+## Edit Price List’s Details
+
+{/* TODO check for correctness */}
+
+To edit a price list’s details:
+
+1. Go to the price list’s details page.
+2. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon in the first section.
+3. Choose Edit from the dropdown.
+4. In the drawer that opens, edit the price list's details.
+5. Once you’re done , click on the Save button.
+
+---
+
+## Manage Prices
+
+### Add Products
+
+{/* TODO check for correctness */}
+
+To add new products to the price list:
+
+1. Go to the price list’s details page.
+2. Under the Prices section, click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon.
+3. Choose “Add products" in the dropdown.
+4. This opens a form with two steps:
+    1. In the first step, choose the products to add to the price list. Once you're done, click the Continue button.
+    2. In the second step, enter the prices of each product variant. The prices editor is based on the [bulk editor](../../tips/bulk-editor/page.mdx).
+        - To add a currency, click on the "Add currency" button and select the currency.
+5. Once you're done, click the Save button.
+
+### Edit a Product’s Prices
+
+{/* TODO check for correctness */}
+
+To edit the prices of a product in the price list:
+
+1. Go to the price list’s details page.
+2. In the Prices section, click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon.
+3. Choose “Edit prices" from the dropdown.
+4. This opens the prices editor, which is based on the [bulk editor](../../tips/bulk-editor/page.mdx).
+    - To add a currency, click on the "Add currency" button and select the currency.
+5. Once you're done, click the Save button.
+
+### Remove a Product From Price List
+
+{/* TODO check for correctness */}
+
+<Note type="warning">
+
+Removing a product from a price list is irreversible.
+
+</Note>
+
+To remove a product from a price list:
+
+1. Go to the price list’s details page.
+2. Find the product you want to delete in the Prices section.
+3. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon to its right.
+4. Choose Remove from the dropdown.
+5. Confirm deleting the product's prices by clicking the “Confirm” button in the pop-up.
+
+---
+
+## Delete Price List
+
+{/* TODO check for correctness */}
+
+<Note type="warning">
+
+Deleting a price list is irreversible.
+
+</Note>
+
+To delete a price list:
+
+1. Go to the Pricing page.
+2. Find the price list to delete and click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon to its right.
+3. Choose Delete from the dropdown.
+4. Confirm deleting the price list by entering the price list's name, then clicking the Confirm button.

www/apps/user-guide/app/pricing/page.mdx

@@ -0,0 +1,33 @@
+---
+sidebar_autogenerate_exclude: true
+---
+
+export const metadata = {
+  title: `Pricing`,
+}
+
+# {metadata.title}
+
+In this document, you learn about what price lists are and get an overview of the Pricing page.
+
+## Overview
+
+Price lists are used to create a sale or override the pricing of one or more products based on specific conditions.
+
+Adding a price list on a set of products changes the prices of these products to the amount you set. You can set the start and end dates of these prices.
+
+You can also specify customer groups to which these prices will be applied. For example, you may apply reduced pricing for VIP customers.
+
+---
+
+## View List of Price Lists
+
+The Pricing page includes a list of price lists.
+
+In the list, you can see price list details such as the title, description, and status of the price list.
+
+---
+
+## Learn More About Price Lists
+
+- [Manage a Price List](./manage/page.mdx)

www/apps/user-guide/app/products/categories/page.mdx

@@ -0,0 +1,91 @@
+---
+sidebar_position: 3
+---
+
+import { DotsSix, TriangleRightMini, EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Product Categories`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to create a category, edit existing categories, delete a category, and more.
+
+## Create a Category
+
+{/* TODO check for correctness */}
+
+To create a product category:
+
+1. Go to the Product → Categories page.
+2. Click on the “Create” button at the top right.
+3. In the form that opens, there are two steps:
+    1. In the first step:
+      1. Enter the category's name in the Title field. This is the only required field.
+      2. In the Handle field, enter a dash (`-`) separated string that's used as part of the category's URL when the customer views it on the storefront. If not specified, the handle is generated from the Title field's value.
+      3. Optionally set the category's description in the Description field.
+      4. In the Status field, you can change the status to “Inactive” if you’re creating the category, but you’re still not ready to use it.
+      5. In the Visibility field, you can change the visibility to “Private” if you’re creating an internal category that shouldn’t be shown to the customer.
+      6. Optionally, you can add under the Metadata section additional information in key-value pairs.
+      7. Once you're done, click the "Continue" button.
+    2. In the second step, you can nest the new category within other categories. To move categories around, use the <InlineIcon Icon={DotsSix} alt="drag" /> icon to drag categories to their correct position.
+4. Once you’re done, click the Save button.
+
+---
+
+## Edit a Category
+
+{/* TODO check for correctness */}
+
+To edit a product category:
+
+1. Go to the Product → Categories page.
+2. Click on the category to edit. If the category is nested in another, you may need to expand the parent category by clicking the <InlineIcon Icon={TriangleRightMini} alt="expand" /> icon.
+3. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon in the first section of the category page.
+4. Choose Edit from the dropdown.
+4. In the drawer that opens, edit any of the fields of the category.
+5. Once you’re done, click the Save button.
+
+---
+
+## Change Products in a Category
+
+{/* TODO check for correctness */}
+
+To add or remove products from a category:
+
+1. Go to the Product → Categories page.
+2. Click on the category to edit. If the category is nested in another, you may need to expand the parent category by clicking the <InlineIcon Icon={TriangleRightMini} alt="expand" /> icon.
+3. In the Products section, click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon.
+4. Choose "Edit Products" from the dropdown.
+5. In the drawer that opens, check or uncheck the products based on what you're adding or removing.
+5. Once you’re done, click the Save button.
+
+---
+
+## Edit Categories Ranking
+
+{/* TODO check for correctness */}
+
+To edit the categories' ranking or hierarchy:
+
+1. Go to the Product → Categories page.
+2. Click on the "Edit ranking" button.
+3. In the form that opens, change the ranking of the categories. To move categories around, use the <InlineIcon Icon={DotsSix} alt="drag" /> icon to drag categories to their correct position.
+4. Once done, click the Save button.
+
+---
+
+## Delete a Category
+
+<Note type="warning">
+
+Deleting a category is irreversible.
+
+</Note>
+
+1. Go to the Product → Categories page.
+2. Click on the category to edit. If the category is nested in another, you may need to expand the parent category by clicking the <InlineIcon Icon={TriangleRightMini} alt="expand" /> icon.
+3. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon in the first section of the category page.
+4. Choose Delete from the dropdown.

www/apps/user-guide/app/products/collections/page.mdx

@@ -0,0 +1,85 @@
+---
+sidebar_position: 2
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Product Collections`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to create a new product collection, edit an existing collection, delete a collection, and more.
+
+## Create a Collection
+
+To create a collection:
+
+1. Go to the Products → Collections page.
+2. Click on the Create button.
+3. In the form that opens:
+    1. Enter the collection's name in the Title field.
+    2. In the Handle field, enter a dash (`-`) separated string that's used as part of the collection's URL when the customer views it on the storefront. If not specified, the handle is generated from the Title field's value.
+5. Once done, click the Create button.
+
+---
+
+## View a collection's details
+
+To view a collection's details:
+
+1. Go to the Products → Collections page.
+2. From the table, choose the collection you want to view.
+
+---
+
+## Edit a Collection
+
+To edit a collection:
+
+1. Go to the collection's details page.
+2. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon at the top right of the first section.
+3. Choose Edit from the dropdown.
+4. In the drawer that opens, edit any of the collection details.
+5. Once done, click the Save button.
+
+---
+
+## Manage a Collection’s Products
+
+### Add Products to a Collection
+
+To add products to a collection:
+
+1. Go to the collection's details page.
+2. In the Products section, click the Add button.
+3. From the list of products, check the box next to the products you want to add to the collection.
+4. Once done, click on the Save button.
+
+### Remove a Product from a Collection
+
+To remove a product from a collection:
+
+1. Go to the collection's details page.
+2. In the Products section, find the product you want to remove from the collection.
+3. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon at the right of the product.
+4. Choose Remove from the dropdown.
+5. Confirm removing the product by clicking the “Remove" button in the pop-up.
+
+---
+
+## Delete a Collection
+
+<Note type="warning">
+
+Deleting a collection is irreversible.
+
+</Note>
+
+To delete a collection:
+
+1. Go to the collection's details page.
+2. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three dots" /> icon at the top right of the first section.
+3. Choose Delete from the dropdown.
+4. Confirm deleting the collection by clicking the “Confirm" button in the pop-up.

www/apps/user-guide/app/products/export/page.mdx

@@ -0,0 +1,57 @@
+---
+sidebar_position: 6
+---
+
+import { BellAlert, ArrowDownTray } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Export Products`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to export all products in your Medusa store.
+
+When you export your products, you download a CSV with the products' details.
+
+## Export Products
+
+{/* TODO check info for correctness */}
+
+To export products:
+
+1. Go to the Products page.
+2. Click on the Export button at the top right.
+3. Click Export in the window that opens.
+4. To check the export's status, click the <InlineIcon Icon={BellAlert} alt="bell" /> icon at the top right of the page. You should see your new export loading.
+5. Once the export is ready, click the <InlineIcon Icon={ArrowDownTray} alt="download" /> icon.
+
+<Note>
+
+If you face any errors or difficulties, please contact your technical support team as this could be an issue in the storage integration used.
+
+</Note>
+
+---
+
+## Cancel a Product Export
+
+{/* TODO check for correctness and if feature is still available */}
+
+To cancel a product export:
+
+1. Click on the <InlineIcon Icon={BellAlert} alt="bell" /> icon at the top right of the page.
+2. Find the export you want to cancel.
+3. Click on the cancel button.
+
+---
+
+## Delete a Product Export
+
+{/* TODO check for correctness and if feature is still available */}
+
+To delete a product export:
+
+1. Click on the <InlineIcon Icon={BellAlert} alt="bell" /> icon at the top right of the page.
+2. Find the export you want to delete.
+3. Click on the Delete button.

www/apps/user-guide/app/products/gift-cards/customer-gift-card/page.mdx

@@ -0,0 +1,66 @@
+---
+sidebar_position: 2
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage a Customer Gift Card`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn about managing customer gift cards, including how to create, edit, and delete them.
+
+## Create Customer Gift Card
+
+To create a customer gift card:
+
+1. Go to Products → Gift Cards.
+2. Click on the Create button.
+3. In the form that opens:
+    1. In the Region field, choose the region that the gift card can be used in.
+    2. In the Balance field, specify the gift card's balance.
+    3. Enable or disable the gift card by toggling the Enabled field.
+    4. To set an expiry date, toggle the "Expiry date" field and enter the date in the field shown.
+    5. In the Email field, specify the email of the customer that the gift card belongs to.
+    6. Optionally enter in the "Personal message" field a message that the customer sees when they receive the gift card.
+4. Once you're done, click the Save button.
+
+---
+
+## View Customer Gift Card Details
+
+To view a customer gift card:
+
+1. Go to Products → Gift Cards.
+2. Click on the gift card to view its details.
+
+---
+
+## Edit Customer Gift Card
+
+To edit a customer gift card:
+
+1. Go to the gift card's details page.
+2. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top of the first section.
+3. Choose Edit from the dropdown.
+3. In the drawer that opens, edit the gift card's details.
+4. Once you're done, click the Save button.
+
+---
+
+## Delete Customer Gift Card
+
+<Note type="warning">
+
+Deleting a customer gift card is irreversible.
+
+</Note>
+
+To delete a customer gift card:
+
+1. Go to the gift card's details page.
+2. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top of the first section.
+3. Choose Delete from the dropdown.
+4. Confirm deleting the gift card by clicking the Delete button in the pop-up.

www/apps/user-guide/app/products/gift-cards/page.mdx

@@ -0,0 +1,40 @@
+---
+sidebar_position: 4
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Gift Cards`,
+}
+
+# {metadata.title}
+
+In this document, you'll learn about the types of gift cards and get an overview of the Gift Cards page.
+
+## Types of Gift Cards
+
+In the Medusa Admin, there are two types of gift cards:
+
+- **Product gift card**: A gift card that customers can purchase in your store.
+- **Customer gift card**: A gift card that admin users create for a specific customer email. This gift card can't be purchased by other customers.
+
+---
+
+## Gift Cards Page
+
+The Gift Cards page shows you the list of customer gift cards and allows you to create both types of Gift Cards.
+
+As for product gift cards, they're displayed in the Products page. You can view them either by:
+
+{/* TODO check filter name */}
+
+- Clicking the "View gift card products" button in the Gift Cards page.
+- Applying the Gift Card filter on the Gift Cards page.
+
+---
+
+## Learn More About Gift Cards
+
+- [Manage product gift cards](./product-gift-card/page.mdx)
+- [Manage customer gift cards](./customer-gift-card/page.mdx)

www/apps/user-guide/app/products/gift-cards/product-gift-card/page.mdx

@@ -0,0 +1,115 @@
+---
+sidebar_position: 1
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage a Product Gift Card`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn about managing product gift cards, including how to create, edit, and delete them.
+
+## Create Product Gift Card
+
+{/* TODO check info for correctness */}
+
+To create a product gift card:
+
+1. Go to Products → Gift Cards.
+2. Click the "Add gift card products" button.
+3. In the form that opens, there are two steps:
+    1. In the first step:
+        1. Enter the gift card's title and description in their respective fields.
+        2. Under the Denominations section, for each denomination, enter its name and amount in the store's default currency.
+        3. Under the Organize section, you can add a type, collection, categories, or tags that the product gift card belongs to.
+        4. Under the "Sales channels" section:
+            1. Enable the field if you want to enable the gift card in sales channels other than the default one.
+            2. If you enable the field, check the checkbox next to the sales channels that the gift card is available in.
+        5. Under the Thumbnail section, upload an image that's used as the thumbnail of the gift card.
+        6. Under the Media section, upload images of the gift card.
+        7. Once you're done, click the Continue button.
+    2. In the second step, add prices of the gift card for different currencies in your store using the [bulk editor](../../../tips/bulk-editor/page.mdx). You can add a currency by clicking the "Add currency" button.
+4. Once you're done, click the Save button.
+
+---
+
+## View Product Gift Card
+
+{/* TODO check info for correctness */}
+
+To view product gift cards:
+
+1. Go to Products → Gift Cards.
+2. Click the "View gift card products" button.
+3. This takes you to the Products page with the Gift Card filter applied.
+4. Find the gift card to view and click on it.
+
+This opens the gift card's details page, which is similar to the regular product's details page.
+
+---
+
+## Edit a Product Gift Card's General Details
+
+{/* TODO check info for correctness */}
+
+To edit a product gift card's details:
+
+1. Go to the product gift card's details page.
+2. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right of the first section.
+3. Choose Edit from the dropdown.
+4. In the drawer that opens, edit the gift card's details.
+5. Once you're done, click the Confirm button.
+
+---
+
+## Edit a Product Gift Card's Denominations
+
+{/* TODO check info for correctness */}
+
+To edit a product gift card's denominations:
+
+1. Go to the product gift card's details page.
+2. Under the Denominations section, click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right.
+3. Choose Edit from the dropdown.
+4. In the drawer that opens, edit the gift card's denominations in the store's default currency.
+5. Once you're done, click the Save button.
+
+---
+
+## Edit a Product Gift Card's Prices
+
+{/* TODO check info for correctness */}
+
+To edit a product gift card's prices:
+
+1. Go to the product gift card's details page.
+2. Under the Variants section, click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right.
+3. Choose Edit from the dropdown.
+4. In the [bulk editor](../../../tips/bulk-editor/page.mdx) form that opens, edit the gift card's prices in different currencies. You can add currencies by clicking the "Add currency" button.
+5. Once you're done, click the Save button.
+
+---
+
+## Edit Other Product Gift Card's Details
+
+To edit other details of the product gift card, such as its images or sales channels availability, refer to the [manage products guide](../../manage/page.mdx).
+
+---
+
+## Delete Product Gift Card
+
+<Note type="warning">
+
+Deleting a product gift card is irreversible.
+
+</Note>
+
+To delete a product gift card:
+
+1. Go to the product gift card's details page.
+2. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right of the first section.
+3. Choose Delete from the dropdown.
+4. Confirm deleting the product by clicking the “Yes, confirm” button in the pop-up.

www/apps/user-guide/app/products/import/page.mdx

@@ -0,0 +1,82 @@
+---
+sidebar_position: 5
+---
+
+import { ArrowDownTray, Trash, BellAlert } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Import Products`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to import products into your Medusa store.
+
+## Overview
+
+To import products, you must have the products in a CSV file. You can see a template of the CSV file during the import process.
+
+{/* <Note>
+
+TODO add link [this guide](../../modules/products/admin/import-products.mdx#csv-file)
+
+For a list of accepted columns, refer to this guide.
+
+</Note> */}
+
+When you import products into your Medusa store, you’ll either create new products or update existing ones.
+
+---
+
+## Import List of Products
+
+{/* TODO check info for correctness */}
+
+To import products:
+
+1. Go to the Products page.
+2. Click on the Import button at the top right.
+3. In the new window:
+    1. If you’re unsure of what the CSV file’s format must be like, you can download a template CSV file by clicking the <InlineIcon Icon={ArrowDownTray} alt="download" /> icon.
+    2. To upload the CSV file you want to import products from, either:
+        1. Drag and drop the file into the dashed box;
+        2. Or click on the dashed box and choose the file you want to import the products from.
+    3. After you upload the CSV file:
+        1. Check the number of products to be created or updated above the uploaded file’s name.
+        2. You can remove the file you choose by clicking the <InlineIcon Icon={Trash} alt="trash" /> icon.
+4. Once you’re done choosing a file to import products from, click on the Import List button.
+
+This starts the import process. Based on the number of products you’re importing, it can take some time.
+
+<Note>
+
+If you face any errors or difficulties, please contact your technical support team as this could be an issue in the storage integration used.
+
+</Note>
+
+### Check Import Status
+
+{/* TODO check info for correctness */}
+
+To check the status of the import:
+
+1. Click on the <InlineIcon Icon={BellAlert} alt="bell" /> icon at the top right of the page.
+2. Find the product import, which should be the latest item on the list.
+
+If a loading indicator is showing, then the import process is still in progress.
+
+If the import is done, you should see the text “Import of products is done.”
+
+Once the import is done, you should find the created/updated products on the Products page.
+
+---
+
+## Cancel Import
+
+{/* TODO check for correctness and if feature is still available */}
+
+To cancel a product import:
+
+1. Click on the <InlineIcon Icon={BellAlert} alt="bell" /> icon at the top right of the page.
+2. Find the import you want to cancel.
+3. Click on the cancel button.

www/apps/user-guide/app/products/manage/page.mdx

@@ -0,0 +1,338 @@
+---
+sidebar_position: 1
+---
+
+import { DotsSix, EllipsisHorizontal, XMark } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Products`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to create new products, edit a product's details, and more.
+
+## Create a Product
+
+{/* TODO check for correctness */}
+
+To create a new product:
+
+1. Go to the Products page.
+2. Click on the Create button at the top right.
+3. In the new form that opens, there are two steps:
+    1. In the first step:
+        1. Enter the product's name under the Title field. This is the only required field in the form.
+        2. Optionally enter the values of the Subtitle, Material, and Description fields.
+        3. In the Handle field, enter a dash (`-`) separated string that's used as part of the product's URL when the customer views it on the storefront. If not specified, the handle is generated from the Title field's value.
+        4. If you don't want discounts to be applied on the product, toggle the Discountable button.
+        5. Under the Organize section, all fields are optional:
+            1. Choose types, collections, categories, or tags that the product belongs to.
+            2. To add sales channels that the product is available in:
+                1. Click on the Add Sales Channel button.
+                2. In the drawer that opens, choose the sales channels to add the products to.
+                3. Once done, click on the "Add channels" button.
+        6. Under the Variants section:
+            1. To add a product option:
+                1. Enter the title (for example, "Color") and the variations (for example, "Black") into the "Product options" table.
+                2. To add multiple variations, set the variations' value to a comma-separated list of values (for example, "Black, White").
+                3. To add a new option, press <Kbd>tab</Kbd> when at the last column of the current row to add a new row.
+            2. After you add options, product variants are created automatically from these options.
+                - You can disable creating a product variant by unchecking its checkbox.
+                - You can re-order the product variants by dragging the <InlineIcon Icon={DotsSix} alt="drag" /> icon.
+        7. Under the Attributes section, enter stock and shipping related details of the product, such as width, height, MID code, and more.
+        8. Under the Thumbnail section, upload an image used as the thumbnail of the product.
+        9. Under the Medusa section, upload the product's images.
+        10. Once you're done, click on the Continue button.
+    2. In the second step, enter the details of the product's variants, such as title, SKU, or price.
+4. Once done, click the Save button.
+
+---
+
+## View Product Details
+
+To view a product’s details:
+
+1. Go to the Products page.
+2. Click on the product you want to view.
+
+---
+
+## Edit a Product’s General Information
+
+{/* TODO check for correctness */}
+
+To edit a product’s general information:
+
+1. Go to the product’s details page.
+2. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon at the top right of the first section.
+3. Choose “Edit General Information” from the dropdown.
+4. In the drawer that opens, edit any of the product's general information.
+5. Once done, click on the Confirm button.
+
+---
+
+## Change a Product’s Status
+
+{/* TODO check for correctness */}
+
+To change a product’s status:
+
+1. Go to the product’s details page.
+2. Click on the status at the top right of the first section. For example, if the current status of the product is Active, you should see Active written at the top right of the first section.
+3. Click on the status in the dropdown to change the status.
+
+---
+
+## Manage Product Media
+
+{/* TODO check for correctness */}
+
+To manage the product's media:
+
+1. Go to the product's details page.
+2. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon in the top right of the Media section.
+3. Choose Edit from the dropdown.
+4. In the form that opens:
+    1. To upload an image, drag and drop the image to the box at the right, or click the box to select media to upload.
+    2. To set an image as a thumbnail image:
+        1. Hover over the image.
+        2. Click the checkbox shown at the top right of the image.
+        3. Press <Kbd>T</Kbd> to make the image a thumbnail.
+    3. To delete one or more images:
+        1. Hover over the image.
+        2. Click the checkbox shown at the top right of the images to select.
+        3. Press <Kbd>D</Kbd> to delete the images.
+5. Once you're done, click the Save button.
+
+---
+
+## Add Product Option
+
+{/* TODO check for correctness */}
+
+To add a product option:
+
+1. Go to the product’s details page.
+2. In the Options section, click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon at the top right.
+3. Choose Create from the dropdown.
+4. In the drawer that opens, enter the product option's title.
+5. Once you're done, click the Save button.
+
+<Note>
+
+To add values to the new product option, add a variant.
+
+</Note>
+
+{/* TODO check if product options can be edited */}
+
+{/* ## Manage Product Options
+
+<Note>
+
+After a product is created, the only way to add values to an option is when you add or edit a variant. Adding a new option automatically creates the value “Default Value”. An option’s value is deleted if no variant is using it.
+
+</Note>
+
+To manage a product’s option:
+
+1. Go to the product’s details page.
+2. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon in the top right of the Variants section.
+3. Click on Edit Options from the dropdown.
+4. In the new window that opens:
+    1. You can add a new option by clicking the “Add an option” button.
+    2. You can edit an option’s name by changing its name in the field.
+    3. You can delete an option by clicking the <InlineThemeImage light="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999273/Medusa%20Docs/UI%20Icons/7hztVhj_mj6mxu.png" dark="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999273/Medusa%20Docs/UI%20Icons/7hztVhj_mj6mxu.png" alt="trash" /> icon.
+5. Once you’re done, click on the "Save and close" button. */}
+
+---
+
+## Manage Product Variants
+
+### Add a Variant
+
+{/* TODO check for correctness */}
+
+<Note>
+
+Multiple variants can’t have the same options combination.
+
+</Note>
+
+To add a variant to a product:
+
+1. Go to the product’s details page.
+2. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon in the top right of the Variants section.
+3. Choose "Add variant" from the dropdown.
+4. In the new form that opens:
+    1. Enter the variant's name in the Title field.
+    2. Optionally enter the variant's material in the Material field.
+    3. You'll find a field for each product option to specify its value. You can choose an existing value or enter a new one.
+    4. Under the Stock & Inventory section:
+        1. Enter the general inventory details such as SKU or EAN.
+        2. If you disable the "Manage inventory" field, Medusa assumes the product is always in stock.
+        2. If you enable the "Manage inventory" field, choose the stock locations of the variant in the Locations field.
+        3. If "Allow backorders" is enabled, customers can purchase this variant even if it’s out-of-stock. You can only enable "Allow Backorders" if "Manage Inventory" is enabled.
+    5. Under the Attributes section, enter general details related to shipping such as width, height or MID code.
+5. Once you’re done, click on the Save button.
+
+{/* TODO check if this feature is still available */}
+
+{/* ### Edit Variants Position
+
+To edit variants’ position in a product:
+
+1. Go to the product’s details page.
+2. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon in the top right of the Variants section.
+3. Click on Edit Variants from the dropdown.
+4. In the window that opens:
+    1. Click and hold the <InlineThemeImage light="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999654/Medusa%20Docs/UI%20Icons/zp2QTbO_io0f7i.png" dark="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999654/Medusa%20Docs/UI%20Icons/zp2QTbO_io0f7i.png" alt="grip" /> icon next to the variant, then drag it to the position you want.
+    2. You can also change the inventory of the variants.
+5. Once you’re done, click on the “Save and close” button. */}
+
+### Edit a Variant
+
+{/* TODO check for correctness */}
+
+To edit a variant:
+
+1. Go to the product’s details page.
+2. Find the variant you want to edit in the Variants section.
+3. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon at its right.
+4. Choose "Edit variant" from the dropdown.
+5. In the drawer that opens, edit the variant’s information.
+6. Once you’re done, click on the Confirm button.
+
+### Duplicate a Variant
+
+{/* TODO check for correctness */}
+
+To duplicate a variant:
+
+1. Go to the product’s details page.
+2. Find the variant you want to duplicate in the Variants section.
+3. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon at its right.
+4. Choose "Duplicate variant" from the dropdown.
+5. This opens a new form with almost all fields filled except for the selected Options.
+6. Once you’re done, click on the Save button.
+
+### Delete a Variant
+
+{/* TODO check for correctness */}
+
+<Note type="warning">
+
+Deleting a variant is irreversible.
+
+</Note>
+
+To delete a variant:
+
+1. Go to the product’s details page.
+2. Find the variant you want to duplicate in the Variants section.
+3. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon at its right.
+4. Choose "Delete variant" from the dropdown.
+
+---
+
+## Edit Product Variant Prices
+
+{/* TODO check for correctness */}
+
+The prices bulk editor allows you to edit the prices of a product's variants using a spreadsheet interface.
+
+To open the prices bulk editor:
+
+1. Go to the product's details page.
+2. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon at the top right of the Variants section.
+3. Choose "Edit prices" from the dropdown.
+
+This opens the prices bulk editor. Refer to the [Bulk Editor](../../tips/bulk-editor/page.mdx) guide to learn tips about how to use the bulk editor.
+
+Once you're done making changes:
+
+1. Save your changes by clicking the Save button.
+2. In the pop-up that opens:
+    - If you made edits to a value in a currency or region that's now hidden, you'll be shown the option to save all changes or just save the changes made in the currently visible currencies and regions. Choose one of the options then click the "Save changes" button.
+    - Otherwise, you can directly click the "Save changes" button.
+
+To discard the changes you made:
+
+1. Either press <Kbd>esc</Kbd> or click the <InlineIcon Icon={XMark} alt="X" /> icon at the top left.
+2. Confirm discarding the changes by clicking the “Yes, close” button in the pop-up.
+
+---
+
+## Edit Sales Channel Availability
+
+{/* TODO check for correctness */}
+
+To edit the product's availability in sales channels:
+
+1. Go to the product’s details page.
+2. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon in the top right of the Sales Channels section.
+3. Choose Edit from the dropdown.
+4. In the form that opens, check or uncheck the sales channels to add or remove availability.
+5. Once you're done, click the Save button.
+
+---
+
+## Edit Product Organization
+
+{/* TODO check for correctness */}
+
+To edit the product's organization details:
+
+1. Go to the product’s details page.
+2. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon in the top right of the Organization section.
+3. Choose Edit from the dropdown.
+4. In the drawer that opens, edit the types, collections, categories, and tags that the product belongs to.
+4. Once you're done, click the Save button.
+
+---
+
+## Edit a Product’s Attributes
+
+{/* TODO check for correctness */}
+
+To edit a product’s attributes:
+
+1. Go to the product’s details page.
+2. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon in the top right of the Attributes section.
+3. Choose "Edit attributes" from the dropdown.
+4. In the drawer that opens, edit the attribute information of the product.
+5. Once you’re done, click on the Save button.
+
+---
+
+## Duplicate a Product
+
+{/* TODO check if feature is still available */}
+
+To duplicate a product:
+
+1. Go to the Products page.
+2. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon next to the product you want to duplicate.
+3. Choose Duplicate from the dropdown.
+
+This creates a product with the same information as the original but as a draft.
+
+---
+
+## Delete a Product
+
+{/* TODO check info for correctness */}
+
+<Note type="warning">
+
+Deleting a product is irreversible.
+
+</Note>
+
+To delete a product:
+
+1. Go to the Products page.
+2. Click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dot" /> icon next to the product you want to delete.
+3. Choose Delete from the dropdown.
+4. Confirm deleting the product by clicking the “Yes, confirm” button in the pop-up.

www/apps/user-guide/app/products/page.mdx

@@ -0,0 +1,38 @@
+---
+sidebar_autogenerate_exclude: true
+---
+
+export const metadata = {
+  title: `Products`,
+}
+
+# {metadata.title}
+
+In this document, you’ll get an overview of the product listing page.
+
+## Overview
+
+The Products page shows all your products and allows you to view their details.
+
+The Products domain also contains the following sub-sections:
+
+- Collections and Categories for better product organization.
+- Gift Cards to manage gift-card products associated with a specific customer.
+
+---
+
+## View List of Products
+
+View the list of available products in your ecommerce store by clicking on Products from the sidebar menu.
+
+In the list, find product details such as the name, collection, status, and more.
+
+---
+
+## Learn More About Products
+
+- [Manage Products](./manage/page.mdx)
+- [Manage Categories](./categories/page.mdx)
+- [Manage Collections](./collections/page.mdx)
+- [Export Products](./export/page.mdx)
+- [Import Products](./import/page.mdx)

www/apps/user-guide/app/settings/developer/api-key-management/page.mdx

@@ -0,0 +1,89 @@
+---
+sidebar_position: 1
+---
+
+import { SquareTwoStack, EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `API Key Management`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to manage publishable API keys in the Medusa Admin.
+
+## What is a Publishable API Key
+
+Publishable API key define resources associated with a public API key. This API key is used by developers when developing a storefront.
+
+Currently, publishable API keys are only associated with sales channels.
+
+---
+
+## Create a Publishable API Key
+
+To create a publishable API key:
+
+1. Go to Settings → API key management.
+2. Click on the Create button at the top right.
+3. In the new form that opens, enter the title of the API key.
+4. Click the Save button.
+
+---
+
+## Copy Token of Publishable API Key
+
+To copy the token of an API key:
+
+1. Go to Settings → API key management.
+2. Find the API key you want to copy.
+3. Click the <InlineIcon Icon={SquareTwoStack} alt="copy" /> icon in the Key column of the API key.
+
+---
+
+## Edit Publishable API Key Details
+
+To edit the details of an API key:
+
+1. Go to Settings → API key management.
+2. Find the publishable API key in the list and click on it.
+3. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right of the first section.
+4. Choose Edit from the dropdown.
+5. In the drawer that opens, edit the publishable API key's details.
+6. Once you're done, click the Save button.
+
+---
+
+## Revoke Publishable API Key
+
+<Note type="warning">
+
+Revoking a publishable API key is irreversible.
+
+</Note>
+
+To revoke a publishable API key:
+
+1. Go to Settings → API key management.
+2. Find the publishable API key in the list and click on it.
+3. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right of the first section.
+4. Choose Revoke from the dropdown.
+5. Confirm revoking the publishable API key by clicking the Revoke button in the pop-up.
+
+---
+
+## Delete Publishable API Key
+
+<Note type="warning">
+
+Deleting a publishable API key is irreversible.
+
+</Note>
+
+To delete a publishable API key:
+
+1. Go to Settings → API key management.
+2. Find the publishable API key in the list and click on it.
+3. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right of the first section.
+4. Choose Delete from the dropdown.
+5. Confirm deleting the publishable API key by clicking the Delete button in the pop-up.

www/apps/user-guide/app/settings/developer/api-key-management/sales-channels/page.mdx

@@ -0,0 +1,34 @@
+---
+sidebar_position: 1
+sidebar_label: "Manage Sales Channels"
+---
+
+export const metadata = {
+  title: `Manage Sales Channels of a Publishable API Key`,
+}
+
+# {metadata.title}
+
+In this document, you'll learn how to manage the sales channels of a publishable API key.
+
+## Add Sales Channels
+
+To add sales channels to a publishable API key:
+
+1. Go to Settings → API key management.
+2. Find the publishable API key in the list and click on it.
+3. Under the Sales Channels section, click the Add button.
+4. In the list that opens, check the checkbox next the sales channels to add.
+5. Once you're done, click the Save button.
+
+---
+
+## Remove Sales Channels
+
+To remove sales channels from a publishable API key:
+
+1. Go to Settings → API key management.
+2. Find the publishable API key in the list and click on it.
+3. Under the Sales Channels section, check the checkbox next to the sales channels you want to remove.
+4. Once you're done, press <Kbd>R</Kbd>
+5. Confirm deleting the sales channel by clicking the Delete button in the pop-up.

www/apps/user-guide/app/settings/developer/executions/page.mdx

@@ -0,0 +1,57 @@
+---
+sidebar_position: 2
+sidebar_label: "Executions"
+---
+
+import { ArrowsPointingOut } from "@medusajs/icons"
+
+export const metadata = {
+  title: `View Executions`,
+}
+
+# {metadata.title}
+
+In this documentation, you'll learn how to view executions in your store and their details.
+
+## What is an Execution?
+
+An execution refers to a workflow that's been executed. You can view a workflow execution's progress, details, and raw JSON data all from the Medusa Admin.
+
+---
+
+## View Executions
+
+To view all workflow executions, go to Settings → Executions. You'll find a list of executions with general details.
+
+---
+
+## View Execution Details
+
+To view an execution's details:
+
+1. Go to Settings → Executions.
+2. Click on the execution to view it.
+
+On the execution's page, you'll find multiple sections with the execution's details.
+
+### Summary Section
+
+In the first section, you'll find a summary of the execution, including its status, workflow ID, transaction ID, and progress.
+
+### Timeline
+
+The timeline diagram shows you the execution step by step. You can zoom in and pan to view the entire diagram.
+
+If you click on a step, you'll be shown the details in the History section.
+
+### History
+
+The History section shows you the execution of the steps in a linear path.
+
+If you click on a step, you'll see its definition, output, and compensation input.
+
+For a failed step, you'll see the error that occurred.
+
+### JSON
+
+The JSON section allows you to see view the execution's details as a raw JSON by clicking the <InlineIcon Icon={ArrowsPointingOut} alt="expand" /> icon.

www/apps/user-guide/app/settings/developer/page.mdx

@@ -0,0 +1,19 @@
+---
+sidebar_position: 9
+sidebar_label: "Developer"
+---
+
+export const metadata = {
+  title: `Developer Settings`,
+}
+
+# {metadata.title}
+
+The Developer section in the settings allows you to manage developer-related settings, such as API key managements or executions.
+
+---
+
+## Learn More about Developer Settings
+
+- [API Key Management](./api-key-management/page.mdx)
+- [Executions](./executions/page.mdx)

www/apps/user-guide/app/settings/locations/page.mdx

@@ -0,0 +1,79 @@
+---
+sidebar_position: 7
+sidebar_label: "Locations"
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Locations`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to manage the locations using the Medusa Admin.
+
+## Overview
+
+A location represents a physical stocking location, such as a warehouse. It's associated with a sales channel.
+
+When fulfilling an order, you can select the location to fulfill the items from. Similarly, when requesting or handling a return, you can select the location to return the item to. This automatically increments or decrements the quantity as necessary.
+
+An [inventory item's](../../inventory/page.mdx) quantity is set per location.
+
+---
+
+## Create a Location
+
+{/* TODO check info for correctness */}
+
+To create a location:
+
+1. Go to Settings → Locations.
+2. Click the Add Location button.
+3. In the form that opens:
+    1. Enter the location's name and address details.
+    2. To associate the location with one or more sales channel:
+        1. Enable the Sales Channels field.
+        2. Check the sales channels that the location is associated with.
+    3. Under the Metadata section, you can add additional data as key-value pairs.
+4. Once you're done, click the "Add location" button.
+
+---
+
+## Edit a Location
+
+To edit a location:
+
+1. Go to Settings → Locations.
+2. Click on the location to edit.
+3. Choose Edit from the dropdown.
+4. In the drawer that opens, edit the location's details.
+5. Once you're done, click the Save button.
+
+---
+
+## Change Associated Sales Channel
+
+{/* TODO check info for correctness */}
+
+1. Go to Settings → Locations.
+2. Click on the location to edit.
+3. Under the Sales Channels section:
+    1. To add a sales channel:
+        1. Click the "Add sales channels" button at the top right.
+        2. Check the sales channels you want to associate with the location.
+        3. Once you're done, click the Save button.
+    2. To delete a sales channel:
+        1. Find in the list the sales channel to delete and click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at its right.
+        2. Choose Delete from the dropdown.
+        3. Confirm deleting the sales channel by clicking the Delete button.
+
+---
+
+## Delete a Location
+
+1. Go to Settings → Locations.
+2. Find the location to edit and click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at its right.
+3. Choose Delete from the dropdown.
+4. Confirm deleting the location by entering its name and clicking the Delete button in the pop-up.

www/apps/user-guide/app/settings/page.mdx

@@ -0,0 +1,15 @@
+---
+sidebar_autogenerate_exclude: true
+---
+
+import { CogSixTooth } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Settings`,
+}
+
+# {metadata.title}
+
+You can access your store's settings by clicking the <InlineIcon Icon={CogSixTooth} alt="settings" /> icon at the top right of the page.
+
+This shows a settings panel with a different sidebar to manage your profile, store details, regions, and more.

www/apps/user-guide/app/settings/profile/page.mdx

@@ -0,0 +1,32 @@
+---
+sidebar_position: 1
+sidebar_label: "Profile"
+---
+
+export const metadata = {
+  title: `Manage Profile`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to manage your account including editing your account details and changing the Medusa Admin's language.
+
+## Edit Profile
+
+To edit your profile details:
+
+1. Go to Settings → Profile.
+2. Click the Edit button.
+3. In the drawer that opens:
+    - You can change language of the Medusa Admin. This doesn't change the language in the whole store or for other admin users, only for your admin dashboard.
+    - Medusa collects insights to understand how you use it better and improve the product. To enable/disable collecting insights, toggle the "Usage insights" field.
+    - You can edit other profile information such as your first name.
+4. Once done, click on the Save button.
+
+<Note title="Tip">
+
+{/* TODO add link [here](../../contribution/admin-translations.md). */}
+
+Can't find your language? Learn how you can contribute by translating the admin to other languages here.
+
+</Note>

www/apps/user-guide/app/settings/regions/countries/page.mdx

@@ -0,0 +1,37 @@
+---
+sidebar_position: 2
+sidebar_label: "Manage Countries"
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Countries in a Region`,
+}
+
+# {metadata.title}
+
+In this document, you'll learn how to manage countries in a region.
+
+## Add Countries
+
+To add a country to a region:
+
+1. Go to Settings → Regions.
+2. Click on the region you want to edit.
+3. Under the Countries section, click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right.
+4. Choose "Add countries" from the dropdown.
+5. In the list that shows, check the checkboxes next to the countries you want to add.
+6. Once you're done, click the Save button.
+
+---
+
+## Remove Countries
+
+To remove countries from a region:
+
+1. Go to Settings → Regions.
+2. Click on the region you want to edit.
+3. Under the Countries section, check the checkbox next to the countries you want to remove.
+4. Once you're done, press <Kbd>R</Kbd>.
+5. Confirm removing the country by typing "Remove" in the field and clicking the Remove button in the pop-up.

www/apps/user-guide/app/settings/regions/manage/page.mdx

@@ -0,0 +1,83 @@
+---
+sidebar_position: 1
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Regions`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to view and manage regions in your Medusa Admin.
+
+## View Regions
+
+To view your regions, go to Settings → Regions. You'll find a list of available regions in your store.
+
+---
+
+## Create a Region
+
+To create a region:
+
+1. Go to Settings → Regions.
+2. Click the Create button.
+3. In the form that opens:
+    1. Enter the region's name in the Name field.
+    2. Choose the region's currency in the Currency field. If you can't find a currency, make sure to [add it to the store first](../../store/page.mdx#add-currencies).
+    3. Enter the tax rate and, optionally, the tax code of the region.
+    4. Enable the "Tax inclusive pricing" field to specify that all prices of that region include taxes.
+    5. To add countries to the region:
+        1. Click the "Add countries" button.
+        2. In the list shown, check the checkbox next to the countries to add.
+        3. Once you're done, click the Save button.
+    6. Under the Providers section, select the available payment and fulfillment providers in the region.
+4. Once you’re done, click on the Save button.
+
+---
+
+## Edit a Region
+
+To edit a region's details:
+
+1. Go to Settings → Regions.
+2. Click on the region you want to edit.
+3. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right of the first section.
+4. Choose Edit from the dropdown.
+5. In the drawer that opens, edit the region's details.
+6. Once done, click the Save button.
+
+---
+
+## Edit Region's Tax Settings
+
+When you create a region, taxes settings are created for that region as well.
+
+To view and edit a region's tax settings:
+
+1. Go to Settings → Regions.
+2. Click on the region you want to edit.
+3. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right of the first section.
+4. Choose "Tax settings" from the dropdown.
+
+This opens the taxes page of the region. Learn more about managing taxes in [this guide](../../taxes/manage/page.mdx).
+
+---
+
+## Delete a Region
+
+<Note type="warning">
+
+Deleting a region is irreversible.
+
+</Note>
+
+To delete a region:
+
+1. Go to Settings → Regions.
+2. Click on the region you want to delete.
+3. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right of the first section.
+4. Choose Delete from the dropdown.
+5. Confirm deleting the region by entering its name and clicking the Delete button in the pop-up.

www/apps/user-guide/app/settings/regions/page.mdx

@@ -0,0 +1,41 @@
+---
+sidebar_position: 4
+---
+
+export const metadata = {
+  title: `Regions`,
+}
+
+# {metadata.title}
+
+In this document, you’ll get an overview of regions and learn about their importance in your commerce store.
+
+## Overview
+
+Regions are essential to your commerce store. You use regions to specify available currencies, payment providers, fulfillment providers, tax rates, and more for different regions.
+
+Regions represent different countries that your commerce store serves customers in. A region can have multiple countries with the same settings, but a region can also be specific to a single country with its own settings.
+
+---
+
+## Currencies in Regions
+
+Each region uses one currency, and you can set prices across your store for each region.
+
+For example, when you create a product variant, you set the price of that variant for each currency and region in your store.
+
+---
+
+## How Customers Use Regions
+
+When a customer browses your storefront, they choose the region based on their location. Then, the prices, shipping providers, payment providers, and taxes available and applied are based on the chosen region.
+
+For example, if you have Stripe enabled as a payment provider in a region created for the United States, but have it disabled in a region created for European countries, only customers in the United States region can use Stripe for payment on checkout.
+
+---
+
+## Learn More About Regions
+
+- [Manage Regions](./manage/page.mdx)
+- [Manage Payment and Fulfillment Providers](./providers/page.mdx)
+- [Manage Shipping Options in a Region](./shipping-options/page.mdx)

www/apps/user-guide/app/settings/regions/providers/page.mdx

@@ -0,0 +1,29 @@
+---
+sidebar_position: 3
+sidebar_label: Manage Providers
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Payment and Fulfillment Providers in a Region`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to manage a region’s payment and fulfillment providers in your Medusa Admin.
+
+<Note>
+
+Before customers can use your payment or fulfillment provider, you must add that provider to one or more region.
+
+</Note>
+
+To add or remove a payment or fulfillment provider in a region:
+
+1. Go to Settings → Regions.
+2. Click on the region you want to edit.
+4. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right of the first section.
+4. Choose Edit from the dropdown.
+5. In the drawer that opens and under the Providers section, change the payment and fulfillment providers of the region.
+6. Once you're done, click the Save button.

www/apps/user-guide/app/settings/regions/shipping-options/page.mdx

@@ -0,0 +1,74 @@
+---
+sidebar_position: 4
+sidebar_label: Manage Shipping Options
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Shipping Options in a Region`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to manage a region’s shipping options in your Medusa Admin.
+
+## What is a Shipping Option?
+
+A shipping option has two types:
+
+- **Outbound**: these options are used in customers' orders. During checkout, a customer chooses one of these shipping options to receive their order. These shipping options are used when you create draft orders as well.
+- **Return**: these options are used when the customer returns an item, whether the return is requested by the customer or the admin user.
+
+---
+
+## Create a Shipping Option
+
+To create a shipping option in a region:
+
+1. Go to Settings → Regions.
+2. Under the Shipping Options section, click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right of the section.
+3. Choose Create from the dropdown.
+4. In the form that opens:
+    1. Under the Type section, choose the shipping option's type.
+    2. To only show and use the shipping option in the admin dashboard, enable the "Admin only" field.
+    3. To specify that the shipping option's price is tax-inclusive, enable the "Tax inclusive pricing" field.
+    4. Specify the shipping option's name in the Name field. This name is shown to customers if "Admin only" is disabled.
+    5. For the Price Type field, specify the shipping option's price type:
+        - **Flat rate**: The shipping option has a fixed price. In this case, you must enter the shipping option's price in the Price field.
+        - **Calculated**: The shipping option's price is calculated, meaning that the amount is shown while placing the order or creating the return.
+    6. For the Shipping Profile field, specify the profile of the items that this shipping option can be used with:
+        - For gift cards, choose Gift Card Profile.
+        - For all other products, choose Default Shipping Profile.
+    7. For the Fulfillment Provider field, choose the region's fulfillment provider used to handle the fulfillment and shipping when this shipping option is used. If you can't find a fulfillment provider, make sure to [add it to the region first](../providers/page.mdx).
+    8. Under the Requirements section, you can specify a minimum and maximum cart subtotal amount. When specified, the shipping option can only be used when this condition is met.
+5. Once you're done, click the Save button.
+
+---
+
+## Edit a Shipping Option
+
+To edit a shipping option in a region:
+
+1. Go to Settings → Regions.
+2. Under the Shipping Options section, find the shipping option to edit and click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> at its right.
+3. Choose Edit from the dropdown.
+4. In the drawer, edit any of the shipping option's details.
+5. Once you're done, click the Save button.
+
+---
+
+## Delete a Shipping Option
+
+<Note type="warning">
+
+Deleting a shipping option is irreversible.
+
+</Note>
+
+To delete a shipping option in a region:
+
+1. Go to Settings → Regions.
+2. Under the Shipping Options section, find the shipping option to delete and click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> at its right.
+3. Choose Delete from the dropdown.
+4. Confirm deleting the shipping option by clicking the Delete button in the pop-up.

www/apps/user-guide/app/settings/return-reasons/page.mdx

@@ -0,0 +1,63 @@
+---
+sidebar_position: 5
+sidebar_label: "Return Reasons"
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Return Reasons`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to add, edit, and remove return reasons.
+
+## What's a Return Reason?
+
+A return reason is used when requesting a return or creating an exchange or claim. It's used to specify why an item is being returned.
+
+So, before you can handle returns, exchanges, and claims, you must create at least one return reason.
+
+---
+
+## Create Return Reason
+
+To create a return reason:
+
+1. Go to Settings → Return Reasons.
+2. Click the Create button at the top right.
+3. In the new form that opens, enter the reason's details:
+    - The Label is used when showing the return reason to the customer or admin users.
+    - The Value is used as a unique identifier internally.
+    - You can optionally enter a description of the return reason in the Description field.
+4. Once done, click the Save button.
+
+---
+
+## Edit a Return Reason
+
+To edit a return reason:
+
+1. Go to Settings → Return Reasons.
+2. Find the return reason to edit and click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at its right.
+3. Choose Edit from the dropdown.
+4. In the drawer that opens, edit the return reason's details.
+5. Once you're done, click the Save button.
+
+---
+
+## Delete a Return Reason
+
+<Note>
+
+Deleting a return reason is irreversible.
+
+</Note>
+
+To delete a return reason:
+
+1. Go to Settings → Return Reasons.
+2. Find the return reason to delete and click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at its right.
+3. Choose Delete from the dropdown.
+4. Confirm deleting the return reason by clicking the Delete button in the pop-up.

www/apps/user-guide/app/settings/sales-channels/manage/page.mdx

@@ -0,0 +1,53 @@
+---
+sidebar_position: 1
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Sales Channels`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to manage sales channels in your Medusa Admin.
+
+## Create a Sales Channel
+
+To create a sales channel:
+
+1. Go to Settings → Sales Channels.
+2. Click the Create button.
+3. In the form that opens, enter the sales channel's details.
+4. Once you're done, click the Save button.
+
+---
+
+## Edit a Sales Channel
+
+To edit a sales channel:
+
+1. Go to Settings → Sales Channels.
+2. Find the sales channel in the list and click on it.
+3. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right of the first section.
+4. Choose Edit from the dropdown.
+5. In the drawer that opens, edit the sales channel's details.
+6. Once you're done, click the Save button.
+
+---
+
+## Delete a Sales Channel
+
+<Note type="warning">
+
+Deleting a sales channel is irreversible.
+
+</Note>
+
+To delete a sales channel:
+
+1. Go to Settings → Sales Channels.
+2. Find the sales channel in the list and click on it.
+3. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right of the first section.
+4. Choose Delete from the dropdown.
+5. Confirm deleting the sales channel by entering its name in the field and clicking the Delete button in the pop-up.

www/apps/user-guide/app/settings/sales-channels/page.mdx

@@ -0,0 +1,42 @@
+---
+sidebar_position: 8
+---
+
+export const metadata = {
+  title: `Sales Channels`,
+}
+
+# {metadata.title}
+
+In this document, you’ll get an overview of sales channels in Medusa.
+
+## What is a Sales Channel?
+
+A sales channel is a channel that you sell your products through. For example, you can have a sales channel for the web storefront, another for the mobile app, and another for selling across social media platforms.
+
+By default, there’s a default sales channel in a Medusa store. You can add multiple sales channels.
+
+---
+
+## How Sales Channels Work
+
+Sales channels are associated with data and settings in your commerce store:
+
+- You can choose which products are available in a sales channel.
+- When a customer places an order from a sales channel, the order is associated with it.
+- Locations used with inventory are also associated with sales channels.
+
+---
+
+## Sales Channels Settings Overview
+
+To view the available sales channels and settings, go to Settings → Sales channels.
+
+The sales channels settings page shows available sales channels and allows you to manage sales channels.
+
+---
+
+## Learn More About Sales Channels
+
+- [Manage Sales Channels](./manage/page.mdx)
+- [Manage Products in Sales Channels](./products/page.mdx)

www/apps/user-guide/app/settings/sales-channels/products/page.mdx

@@ -0,0 +1,41 @@
+---
+sidebar_position: 2
+sidebar_label: Manage Products
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Products in Sales Channels`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to manage products in Sales Channels.
+
+<Note>
+
+This guide covers managing products from the Sales Channels page. It’s also possible to manage the Sales Channels of products in the Products page.
+
+</Note>
+
+## Add Products to Sales Channels
+
+To add products to a sales channel:
+
+1. Go to Settings → Sales Channels
+2. Find the sales channel in the list and click on it.
+3. Under the Products section, click the Add button at the top right.
+4. In the list of products shown, check the checkboxes next to the products to add.
+5. Once you're done, click the Save button.
+
+---
+
+## Remove Product from Sales Channel
+
+To remove a product from a sales channel:
+
+1. Go to Settings → Sales Channels
+2. Find the sales channel in the list and click on it.
+3. Under the Products section, find the product to remove and click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon to its right.
+4. Choose Remove from the dropdown.

www/apps/user-guide/app/settings/store/page.mdx

@@ -0,0 +1,51 @@
+---
+sidebar_position: 2
+sidebar_label: "Store"
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Store`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to edit the store’s details and available currencies.
+
+## Edit Store Details
+
+To edit the store’s details:
+
+1. Go to Settings → Store.
+2. Click the Edit button in the Store Selection.
+3. In the drawer that opens, edit any of the store's details.
+4. Once you're done, click the Save button.
+
+---
+
+## Add Currencies
+
+To add currencies to your store:
+
+1. Go to Settings → Store.
+2. Click on the Add button in the Currencies section.
+3. In the form that opens, check the checkbox next to the currencies to add.
+4. Once you're done, click the Save button.
+
+---
+
+## Remove Currencies
+
+<Note>
+
+If you remove a currency, you can still add it again in the future.
+
+</Note>
+
+To remove a currency:
+
+1. Go to Settings → Store.
+2. Under the Currencies section, check the checkbox next to the currencies you want to remove.
+3. Once you're done, press <Kbd>R</Kbd> to remove the currencies.
+4. Confirm removing the currencies by clicking the Remove button in the pop-up.

www/apps/user-guide/app/settings/taxes/manage/page.mdx

@@ -0,0 +1,38 @@
+---
+sidebar_position: 1
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Taxes`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to view and manage taxes in your Medusa Admin.
+
+## View Taxes
+
+To view taxes, go to Settings → Taxes.
+
+In the Taxes page, you'll find a list of regions. If you click on a region, you'll find its tax settings and rates.
+
+---
+
+## Edit a Region’s Tax Settings
+
+To edit a region’s tax settings:
+
+1. Go to Settings → Taxes.
+2. Click on the region to edit its tax settings.
+3. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right of the first section.
+4. Choose Edit from the dropdown.
+5. In the drawer that opens, edit the tax settings:
+    - In the Tax Provider field, you can change the system tax provider to a custom one.
+    - In the "Default tax rate" field, you can change the default tax rate of the region.
+    - In the "Default tax code" field, you can change the default tax code of the region.
+    - By default, taxes are created automatically during checkout. However, in some cases you may choose to disable this behavior if you don't want many requests sent to a custom third-party service. In that case, you can disable the "Calculate taxes automatically" field, but beware that you or your developer has to implement the tax calculation functionality during checkout manually.
+    - By default, taxes aren't applied on gift cards during checkout. To enable applying them on gift cards, enable the "Apply taxes on gift cards" field.
+    - You can change whether a region's prices are tax-inclusive by toggling the "Tax inclusive pricing" field.
+6. Once you're done, click the Save button.

www/apps/user-guide/app/settings/taxes/page.mdx

@@ -0,0 +1,38 @@
+---
+sidebar_position: 6
+---
+
+export const metadata = {
+  title: `Taxes`,
+}
+
+# {metadata.title}
+
+In this document, you’ll get an overview of taxes in Medusa and learn about their importance.
+
+## Overview
+
+Taxes in Medusas are directly associated with [Regions](../regions/page.mdx). As regions and countries often have different tax rates and rules, Medusa supports specifying the tax rate for each region.
+
+Taxes are calculated for products and shipping methods on checkout. Medusa provides a default tax provider to calculate the taxes, and merchants and developers can also integrate custom tax providers for advanced taxes calculation.
+
+---
+
+## How are Taxes Created?
+
+When you create a region, its taxes settings are created as well.
+
+If you specify the tax rate during the region's creation, a default tax rate is created that's applied on all products and shipping options.
+
+---
+
+## Override Tax Rates
+
+You can create tax rates to override the default tax rate. Tax rates can be condition to products, product types, and shipping options.
+
+---
+
+## Learn More About Taxes
+
+- [Manage Taxes](./manage/page.mdx)
+- [Manage Tax Rates](./tax-rates/page.mdx)

www/apps/user-guide/app/settings/taxes/tax-rates/page.mdx

@@ -0,0 +1,105 @@
+---
+sidebar_position: 2
+---
+
+import { EllipsisHorizontal, XMark } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Tax Rates`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to manage tax rates in your Medusa Admin.
+
+## Create a Tax Rate
+
+To create a tax rate:
+
+1. Go to Settings → Taxes.
+2. Click on the region to create a tax rate in.
+3. Under the Tax Rates section, click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right.
+4. Choose Create from the dropdown.
+5. In the form that opens:
+    1. Enter the name, rate, and code of the tax rate in their respective fields.
+    2. If the tax rate overrides product taxes:
+        1. Enable the "Product overrides" field.
+        2. Click the "Add product overrides" button.
+        3. From the list of shown products, check the checkbox next to the product to add.
+        4. Once you're done, click the Save button at the bottom.
+    3. If the tax rate overrides product type taxes:
+        1. Enable the "Product type overrides" field.
+        2. Click the "Add product type overrides" button.
+        3. From the list of shown product types, check the checkbox next to the type to add.
+        4. Once you're done, click the Save button at the bottom.
+    4. If the tax rate overrides shipping option taxes:
+        1. Enable the "Shipping option overrides" field.
+        2. Click the "Add shipping option overrides" button.
+        3. From the list of shown shipping options, check the checkbox next to the type to add.
+        4. Once you're done, click the Save button at the bottom.
+6. Once you're done, click the Save button.
+
+---
+
+## Edit Tax Rates
+
+To edit a tax rate:
+
+1. Go to Settings → Taxes.
+2. Click on the region to edits its tax rate.
+3. Find the tax rate in the list under the Tax Rates section and click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at its right.
+4. Choose "Edit rate" from the dropdown.
+5. In the drawer that opens, edit the tax rate's details.
+6. Once done, click the Save button.
+
+---
+
+## Edit Tax Rate Overrides
+
+To edit the overrides of a tax rate:
+
+1. Go to Settings → Taxes.
+2. Click on the region to edits its tax rate.
+3. Find the tax rate in the list under the Tax Rates section and click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at its right.
+4. Choose "Edit overrides" from the dropdown.
+5. In the form that opens:
+    1. To change the product overrides
+        1. Enable the "Product overrides" field if it's not enabled.
+        2. To add products:
+            1. Click the "Add product overrides" button.
+            2. From the list of shown products, check the checkbox next to the product to add.
+            3. Once you're done, click the Save button at the bottom.
+        3. To remove a product, click the <InlineIcon Icon={XMark} alt="X" /> icon next to the product.
+    2. To change the product type overrides
+        1. Enable the "Product type overrides" field if it's not enabled.
+        2. To add products:
+            1. Click the "Add product type overrides" button.
+            2. From the list of shown product types, check the checkbox next to the type to add.
+            3. Once you're done, click the Save button at the bottom.
+        3. To remove a product type, click the <InlineIcon Icon={XMark} alt="X" /> icon next to the product.
+    3. To change the shipping option overrides
+        1. Enable the "Shipping option overrides" field if it's not enabled.
+        2. To add shipping options:
+            1. Click the "Add shipping option overrides" button.
+            2. From the list of shown shipping options, check the checkbox next to the shipping option to add.
+            3. Once you're done, click the Save button at the bottom.
+        3. To remove a shipping option, click the <InlineIcon Icon={XMark} alt="X" /> icon next to the shipping option.
+6. Once you're done, click the Save button.
+
+---
+
+## Delete a Tax Rate
+
+<Note type="warning">
+
+Deleting a tax rate is irreversible.
+
+</Note>
+
+To delete a tax rate:
+
+1. Go to Settings → Taxes.
+2. Click on the region to delete its tax rate.
+3. Find the tax rate in the list under the Tax Rates section and click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at its right.
+4. Choose Delete from the dropdown.
+5. Confirm deleting the tax rate by clicking the Delete button.

www/apps/user-guide/app/settings/users/invites/page.mdx

@@ -0,0 +1,84 @@
+---
+sidebar_position: 1
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Invites`,
+}
+
+# {metadata.title}
+
+In this document, you'll learn how to manage invites in your store.
+
+## Overview
+
+To add a new user to your team, you must invite them. The user gets a notification of the invite to sign up, but you can also send them the invite link to sign up.
+
+<Note>
+
+The form of notification sent (for example, an email) depends on what's configured in your store. If you're unsure about this, contact your technical team to configure it for you.
+
+</Note>
+
+## Invite a User
+
+To send an invite to a user:
+
+1. Go to Settings → Users.
+2. Click the Invite button.
+3. Enter the user’s email and choose their role.
+4. Once done, click on the "Send invite" button.
+
+<Note title="Info">
+
+A user's role doesn't actually change the user's privileges. All users have the same admin privileges.
+
+</Note>
+
+---
+
+## View Pending Invites
+
+To view pending invites:
+
+1. Go to Settings → Users.
+2. Click the Invite button.
+3. Below the form, you'll find a Pending Invites table with all the invites that haven't been accepted yet.
+
+---
+
+## Resend an Invite
+
+To resend an invite to a user:
+
+1. Go to Settings → Users.
+2. Click the Invite button.
+3. In the Pending Invites table, find the user to resend their invite and click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon.
+4. Choose "Resend invite" from the dropdown.
+
+---
+
+## Get Invite Link
+
+In addition to sending the user an invite, you can copy the invite link and send it manually to the user.
+
+To copy the invite link:
+
+1. Go to Settings → Users.
+2. Click the Invite button.
+3. In the Pending Invites table, find the user to resend their invite and click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon.
+3. Choose “Copy invite link” from the dropdown.
+
+---
+
+## Revoke Invite
+
+To revoke an invite:
+
+1. Go to Settings → Users.
+2. Click the Invite button.
+3. In the Pending Invites table, find the user to resend their invite and click on the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon.
+4. Choose Revoke from the dropdown.
+5. Confirm revoking the invite by clicking the Revoke button in the pop-up.

www/apps/user-guide/app/settings/users/page.mdx

@@ -0,0 +1,48 @@
+---
+sidebar_position: 3
+sidebar_label: Users
+---
+
+import { EllipsisHorizontal } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Manage Users`,
+}
+
+# {metadata.title}
+
+In this document, you’ll learn how to invite new users, edit other users’ information, and remove users from your store.
+
+## View Users
+
+View admin users by going to Settings → Users.
+
+---
+
+## Edit a User’s Details
+
+To edit a user’s details in your team:
+
+1. Go to Settings → Users.
+2. Find the user in the list and click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at its right.
+3. Choose Edit from the dropdown.
+4. In the drawer that opens, edit the user’s information.
+5. Once done, click the Save button.
+
+---
+
+## Delete a User
+
+<Note type="warning">
+
+Deleting a user is irreversible.
+
+</Note>
+
+To delete a user from your store:
+
+1. Go to Settings → Users.
+2. Find the user in the list and click on it.
+3. Click the <InlineIcon Icon={EllipsisHorizontal} alt="three-dots" /> icon at the top right of the first section.
+4. Choose Delete from the dropdown.
+4. Confirm deleting the user by clicking the Delete button in the pop-up.

www/apps/user-guide/app/tips/bulk-editor/page.mdx

@@ -0,0 +1,64 @@
+---
+sidebar_position: 1
+---
+
+import { getOsShortcut } from "docs-ui"
+
+export const metadata = {
+  title: `Bulk Editor`,
+}
+
+# {metadata.title}
+
+In this document, you'll learn about different tips and shortcuts to using the bulk editor.
+
+## Overview
+
+The bulk editor allows you to edit prices or values using a spreadsheet-interface. It simplifies the editing process when working with a large number of data, and provides you with an intuitive user experience.
+
+The bulk editor is used in different areas of the Medusa Admin.
+
+{/* TODO do we still need this next section? */}
+
+{/* ---
+
+## Toggle Columns View
+
+As the bulk editor may include a large number of columns, such as the different currencies supported in your store, you can toggle the columns' visibility to focus on a subset of columns.
+
+To do that:
+
+1. Click on the "View" button at the top left.
+2. Check or uncheck a column by clicking on it in the dropdown. */}
+
+---
+
+## Selecting Cells
+
+You can select multiple cells to apply an action on them. To do that:
+
+1. Click and hold the mouse on a cell
+2. Drag the mouse in the direction of the other cells you want to select.
+3. Once you're done selecting, release the hold.
+
+---
+
+## Editing Cells
+
+There are multiple ways you can edit cells in a bulk editor:
+
+1. To edit the value, click the cell, then enter your new value.
+3. To apply a value of a cell to other adjacent cells:
+    1. Click on a cell
+    2. Hold and Drag the blue dot at the corner of that cell to adjacent cells you want to apply the value to.
+    3. Once you're done, release the hold on the blue dot.
+
+---
+
+## Shortcuts
+
+You can use the following shortcuts while working with the bulk editor:
+
+- <Kbd>tab</Kbd>: Persist the current cell's value and move focus to the next cell.
+- <Kbd>backspace</Kbd>: Delete the value of the selected cell(s).
+- <Kbd>{getOsShortcut()}</Kbd> + <Kbd>Z</Kbd>: Undo a change you made in the currently selected cell(s).

www/apps/user-guide/app/tips/languages/page.mdx

@@ -0,0 +1,52 @@
+---
+sidebar_position: 2
+---
+
+export const metadata = {
+  title: `Admin Languages`,
+}
+
+# {metadata.title}
+
+{/* TODO check whether the languages here are still valid. */}
+
+Medusa Admin comes with multi-language support. This document covers the complete list of available languages, both official and by the community.
+
+<Note>
+
+Can't find your language? Learn how you can contribute by translating the admin to other languages [here](!resources!/contribution-guidelines/admin-translations).
+
+</Note>
+
+## Official Languages
+
+- English
+- French
+- Portuguese
+
+## Community Translations
+
+<Note>
+
+Languages listed in this section are contributed by the Medusa community. So, their accuracy is not guaranteed. If you find problems with the translations, please [open an issue in our GitHub repository](https://github.com/medusajs/medusa/issues).
+
+</Note>
+
+- Bosanski
+- Deutsch
+- Español
+- Hindi
+- Hrvatski
+- Italiano
+- 한국어
+- 日本語
+- Polski
+- Русский
+- Slovenščina
+- Tamil
+- Tiếng Việt
+- Українська
+- العربية
+- Čeština
+- 简体中文
+- Български

www/apps/user-guide/app/tips/lists/page.mdx

@@ -0,0 +1,72 @@
+---
+sidebar_position: 3
+---
+
+import { XMark } from "@medusajs/icons"
+
+export const metadata = {
+  title: `Lists`,
+}
+
+# {metadata.title}
+
+In this document, you’ll get an overview of lists in Medusa including filters, searching, and more!
+
+## Filter Items
+
+Use filters to retrieve items in a list matching specific criteria.
+
+{/* TODO check if the next section still applies */}
+
+{/* ### Quick Filters
+
+On a table with a list of items, you’ll find quick filters at the top of the list.
+
+You can click on one of these filters to quickly apply it to the list of items.
+
+![Quick filters for lists](https://res.cloudinary.com/dza7lstvk/image/upload/v1667998663/Medusa%20Docs/User%20Guide/eVwD0JP_ukor4r.png) */}
+
+To do that:
+
+1. Click on the "Add filter" button at the top of the list.
+2. From the dropdown, choose the criteria you want to filter.
+3. This shows a new set of values to filter the list by.
+4. After selecting the value, the list only includes the items matching your filters. You can also apply multiple filters.
+
+![Selected Filters](https://res.cloudinary.com/dza7lstvk/image/upload/v1710230676/User%20Guide/Screenshot_2024-03-12_at_10.04.20_AM_rz4xnn.png)
+
+The filters you create are saved and are applied everytime you view the same list.
+
+### Edit Saved Filters
+
+To edit a saved filter:
+
+1. Click on the filter.
+2. Choose the new value of the filter.
+
+### Delete Saved Filters
+
+To delete any saved filter you’ve created, click the <InlineIcon Icon={XMark} alt="X" /> icon next to the filter.
+
+### Clear Filters
+
+To clear all applied filters, click on the "Clear all" link at the end of the list of filters.
+
+---
+
+## Search Items
+
+To search for items in a list:
+
+1. Click the search bar at the top right of the list.
+2. Enter your search term. The list is updated in real-time.
+
+![Search items in a list](https://res.cloudinary.com/dza7lstvk/image/upload/v1710233000/User%20Guide/Screenshot_2024-03-12_at_10.43.09_AM_upv15y.png)
+
+---
+
+## Multiple Pages
+
+Lists in the Medusa Admin span across multiple pages if the number of items in that list are more than twenty. 
+
+Navigate between pages using the "Prev" and "Next" buttons at the bottom of the list.

www/apps/user-guide/components/EditButton/index.tsx

@@ -0,0 +1,19 @@
+"use client"
+
+import { EditButton as UiEditButton } from "docs-ui"
+import { usePathname } from "next/navigation"
+
+const EditButton = () => {
+  const pathname = usePathname()
+
+  return (
+    <UiEditButton
+      filePath={`/www/apps/user-guide/app${pathname.replace(
+        /\/$/,
+        ""
+      )}/page.mdx`}
+    />
+  )
+}
+
+export default EditButton

www/apps/user-guide/components/Feedback/index.tsx

@@ -0,0 +1,30 @@
+"use client"
+
+import {
+  Feedback as UiFeedback,
+  FeedbackProps as UiFeedbackProps,
+  formatReportLink,
+} from "docs-ui"
+import { usePathname } from "next/navigation"
+import { config } from "../../config"
+
+type FeedbackProps = Omit<UiFeedbackProps, "event" | "pathName">
+
+const Feedback = (props: FeedbackProps) => {
+  const pathname = usePathname()
+
+  return (
+    <UiFeedback
+      event="survey"
+      pathName={pathname}
+      reportLink={formatReportLink(
+        config.titleSuffix || "",
+        typeof document !== "undefined" ? document.title : ""
+      )}
+      question="Was this chapter helpful?"
+      {...props}
+    />
+  )
+}
+
+export default Feedback

www/apps/user-guide/components/MDXComponents/index.tsx

@@ -0,0 +1,16 @@
+import type { MDXComponents as MDXComponentsType } from "mdx/types"
+import {
+  Link,
+  MDXComponents as UiMdxComponents,
+  InlineThemeImage,
+  InlineIcon,
+} from "docs-ui"
+
+const MDXComponents: MDXComponentsType = {
+  ...UiMdxComponents,
+  a: Link,
+  InlineThemeImage,
+  InlineIcon,
+}
+
+export default MDXComponents

www/apps/user-guide/components/Navbar/index.tsx

@@ -0,0 +1,37 @@
+"use client"
+
+import { Navbar as UiNavbar, getNavbarItems } from "docs-ui"
+import { useSidebar } from "docs-ui"
+import { basePathUrl } from "../../utils/base-path-url"
+import { useMemo } from "react"
+import { config } from "../../config"
+
+const Navbar = () => {
+  const { setMobileSidebarOpen, mobileSidebarOpen } = useSidebar()
+
+  const navbarItems = useMemo(
+    () =>
+      getNavbarItems({
+        basePath: config.baseUrl,
+        activePath: process.env.NEXT_PUBLIC_BASE_PATH || "/user-guide",
+      }),
+    []
+  )
+
+  return (
+    <UiNavbar
+      logo={{
+        light: basePathUrl("/images/logo-icon.png"),
+        dark: basePathUrl("/images/logo-icon-dark.png"),
+      }}
+      items={navbarItems}
+      mobileMenuButton={{
+        setMobileSidebarOpen,
+        mobileSidebarOpen,
+      }}
+      isLoading={false}
+    />
+  )
+}
+
+export default Navbar

www/apps/user-guide/config/index.ts

@@ -0,0 +1,13 @@
+import { DocsConfig } from "types"
+import { mobileSidebarItems } from "docs-ui"
+import { generatedSidebar as sidebar } from "@/generated/sidebar.mjs"
+
+export const config: DocsConfig = {
+  titleSuffix: "Medusa Admin User Guide",
+  baseUrl: process.env.NEXT_PUBLIC_BASE_URL || "http://localhost:3000",
+  sidebar: {
+    top: sidebar,
+    bottom: [],
+    mobile: mobileSidebarItems,
+  },
+}

www/apps/user-guide/css/globals.css

@@ -0,0 +1,22 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer base {
+
+  html {
+    -webkit-font-smoothing: antialiased;
+  }
+
+  body {
+    @apply overflow-x-hidden;
+  }
+
+  *::selection {
+    @apply bg-medusa-bg-highlight;
+  }
+
+  body[data-modal="opened"] {
+    @apply !overflow-hidden;
+  }
+}

www/apps/user-guide/generated/sidebar.mjs

@@ -0,0 +1,452 @@
+export const generatedSidebar = [
+  {
+    "loaded": true,
+    "isPathHref": true,
+    "path": "/",
+    "title": "Introduction",
+    "children": []
+  },
+  {
+    "loaded": true,
+    "isPathHref": true,
+    "title": "Tips",
+    "hasTitleStyling": true,
+    "autogenerate_path": "/tips",
+    "children": [
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/tips/bulk-editor",
+        "title": "Bulk Editor",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/tips/languages",
+        "title": "Admin Languages",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/tips/lists",
+        "title": "Lists",
+        "children": []
+      }
+    ]
+  },
+  {
+    "loaded": true,
+    "isPathHref": true,
+    "path": "/orders",
+    "title": "Orders",
+    "hasTitleStyling": true,
+    "autogenerate_path": "/orders",
+    "children": [
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/orders/manage",
+        "title": "Manage Details",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/orders/payments",
+        "title": "Manage Payments",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/orders/fulfillments",
+        "title": "Manage Fulfillments",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/orders/edit",
+        "title": "Edit an Order’s Items",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/orders/drafts",
+        "title": "Manage Draft Orders",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/orders/returns",
+        "title": "Manage Returns",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/orders/exchange",
+        "title": "Manage Exchanges",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/orders/claims",
+        "title": "Manage Order's Claims",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/orders/export",
+        "title": "Export Orders",
+        "children": []
+      }
+    ]
+  },
+  {
+    "loaded": true,
+    "isPathHref": true,
+    "path": "/products",
+    "title": "Products",
+    "hasTitleStyling": true,
+    "autogenerate_path": "/products",
+    "children": [
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/products/manage",
+        "title": "Manage Products",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/products/collections",
+        "title": "Manage Product Collections",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/products/categories",
+        "title": "Manage Product Categories",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/products/gift-cards",
+        "title": "Gift Cards",
+        "children": [
+          {
+            "loaded": true,
+            "isPathHref": true,
+            "path": "/products/gift-cards/product-gift-card",
+            "title": "Manage a Product Gift Card",
+            "children": [],
+            "sidebar_position": 1
+          },
+          {
+            "loaded": true,
+            "isPathHref": true,
+            "path": "/products/gift-cards/customer-gift-card",
+            "title": "Manage a Customer Gift Card",
+            "children": [],
+            "sidebar_position": 2
+          }
+        ]
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/products/import",
+        "title": "Import Products",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/products/export",
+        "title": "Export Products",
+        "children": []
+      }
+    ]
+  },
+  {
+    "loaded": true,
+    "isPathHref": true,
+    "path": "/inventory",
+    "title": "Inventory",
+    "hasTitleStyling": true,
+    "autogenerate_path": "/inventory",
+    "children": [
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/inventory/inventory",
+        "title": "Manage Inventory",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/inventory/reservations",
+        "title": "Manage Reservations",
+        "children": []
+      }
+    ]
+  },
+  {
+    "loaded": true,
+    "isPathHref": true,
+    "path": "/customers",
+    "title": "Customers",
+    "hasTitleStyling": true,
+    "autogenerate_path": "/customers",
+    "children": [
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/customers/manage",
+        "title": "Manage Customers",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/customers/groups",
+        "title": "Manage Customer Groups",
+        "children": []
+      }
+    ]
+  },
+  {
+    "loaded": true,
+    "isPathHref": true,
+    "path": "/discounts",
+    "title": "Discounts",
+    "hasTitleStyling": true,
+    "autogenerate_path": "/discounts",
+    "children": [
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/discounts/create",
+        "title": "Create a Discount",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/discounts/manage",
+        "title": "Manage Discounts",
+        "children": []
+      }
+    ]
+  },
+  {
+    "loaded": true,
+    "isPathHref": true,
+    "path": "/pricing",
+    "title": "Pricing",
+    "hasTitleStyling": true,
+    "autogenerate_path": "/pricing",
+    "children": [
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/pricing/create",
+        "title": "Create a Price List",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/pricing/manage",
+        "title": "Manage Price Lists",
+        "children": []
+      }
+    ]
+  },
+  {
+    "loaded": true,
+    "isPathHref": true,
+    "path": "/settings",
+    "title": "Settings",
+    "hasTitleStyling": true,
+    "autogenerate_path": "/settings",
+    "children": [
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/settings/profile",
+        "title": "Profile",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/settings/store",
+        "title": "Store",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/settings/users",
+        "title": "Users",
+        "children": [
+          {
+            "loaded": true,
+            "isPathHref": true,
+            "path": "/settings/users/invites",
+            "title": "Manage Invites",
+            "children": [],
+            "sidebar_position": 1
+          }
+        ]
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/settings/regions",
+        "title": "Regions",
+        "children": [
+          {
+            "loaded": true,
+            "isPathHref": true,
+            "path": "/settings/regions/manage",
+            "title": "Manage Regions",
+            "children": [],
+            "sidebar_position": 1
+          },
+          {
+            "loaded": true,
+            "isPathHref": true,
+            "path": "/settings/regions/countries",
+            "title": "Manage Countries",
+            "children": [],
+            "sidebar_position": 2
+          },
+          {
+            "loaded": true,
+            "isPathHref": true,
+            "path": "/settings/regions/providers",
+            "title": "Manage Providers",
+            "children": [],
+            "sidebar_position": 3
+          },
+          {
+            "loaded": true,
+            "isPathHref": true,
+            "path": "/settings/regions/shipping-options",
+            "title": "Manage Shipping Options",
+            "children": [],
+            "sidebar_position": 4
+          }
+        ]
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/settings/return-reasons",
+        "title": "Return Reasons",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/settings/taxes",
+        "title": "Taxes",
+        "children": [
+          {
+            "loaded": true,
+            "isPathHref": true,
+            "path": "/settings/taxes/manage",
+            "title": "Manage Taxes",
+            "children": [],
+            "sidebar_position": 1
+          },
+          {
+            "loaded": true,
+            "isPathHref": true,
+            "path": "/settings/taxes/tax-rates",
+            "title": "Manage Tax Rates",
+            "children": [],
+            "sidebar_position": 2
+          }
+        ]
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/settings/locations",
+        "title": "Locations",
+        "children": []
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/settings/sales-channels",
+        "title": "Sales Channels",
+        "children": [
+          {
+            "loaded": true,
+            "isPathHref": true,
+            "path": "/settings/sales-channels/manage",
+            "title": "Manage Sales Channels",
+            "children": [],
+            "sidebar_position": 1
+          },
+          {
+            "loaded": true,
+            "isPathHref": true,
+            "path": "/settings/sales-channels/products",
+            "title": "Manage Products",
+            "children": [],
+            "sidebar_position": 2
+          }
+        ]
+      },
+      {
+        "loaded": true,
+        "isPathHref": true,
+        "path": "/settings/developer",
+        "title": "Developer",
+        "children": [
+          {
+            "loaded": true,
+            "isPathHref": true,
+            "path": "/settings/developer/api-key-management",
+            "title": "API Key Management",
+            "children": [
+              {
+                "loaded": true,
+                "isPathHref": true,
+                "path": "/settings/developer/api-key-management/sales-channels",
+                "title": "Manage Sales Channels",
+                "children": [],
+                "sidebar_position": 1
+              }
+            ],
+            "sidebar_position": 1
+          },
+          {
+            "loaded": true,
+            "isPathHref": true,
+            "path": "/settings/developer/executions",
+            "title": "Executions",
+            "children": [],
+            "sidebar_position": 2
+          }
+        ]
+      }
+    ]
+  }
+]

www/apps/user-guide/mdx-components.tsx

@@ -0,0 +1,17 @@
+import type { MDXComponents } from "mdx/types"
+import CustomMDXComponents from "./components/MDXComponents"
+
+// This file allows you to provide custom React components
+// to be used in MDX files. You can import and use any
+// React component you want, including components from
+// other libraries.
+
+// This file is required to use MDX in `app` directory.
+export function useMDXComponents(components: MDXComponents): MDXComponents {
+  return {
+    // Allows customizing built-in components, e.g. to add styling.
+    // h1: ({ children }) => <h1 style={{ fontSize: "100px" }}>{children}</h1>,
+    ...components,
+    ...CustomMDXComponents,
+  }
+}

www/apps/user-guide/next.config.mjs

@@ -0,0 +1,111 @@
+import mdx from "@next/mdx"
+import rehypeMdxCodeProps from "rehype-mdx-code-props"
+import rehypeSlug from "rehype-slug"
+import remarkDirective from "remark-directive"
+import remarkFrontmatter from "remark-frontmatter"
+import {
+  brokenLinkCheckerPlugin,
+  localLinksRehypePlugin,
+  cloudinaryImgRehypePlugin,
+  resolveAdmonitionsPlugin,
+  crossProjectLinksPlugin,
+} from "remark-rehype-plugins"
+
+const withMDX = mdx({
+  extension: /\.mdx?$/,
+  options: {
+    rehypePlugins: [
+      // TODO add V2 to path if necessary
+      [
+        crossProjectLinksPlugin,
+        {
+          baseUrl: process.env.NEXT_PUBLIC_BASE_URL,
+          projectUrls: {
+            docs: {
+              url:
+                process.env.VERCEL_ENV !== "production"
+                  ? process.env.NEXT_PUBLIC_DOCS_URL
+                  : undefined,
+            },
+            resources: {
+              url:
+                process.env.VERCEL_ENV !== "production"
+                  ? process.env.NEXT_PUBLIC_RESOURCES_URL
+                  : undefined,
+              path: "resources",
+            },
+            ui: {
+              url:
+                process.env.VERCEL_ENV !== "production"
+                  ? process.env.NEXT_PUBLIC_UI_URL
+                  : undefined,
+              path: "ui",
+            },
+            api: {
+              url:
+                process.env.VERCEL_ENV !== "production"
+                  ? process.env.NEXT_PUBLIC_API_URL
+                  : undefined,
+              path: "api",
+            },
+          },
+        },
+      ],
+      [brokenLinkCheckerPlugin],
+      [localLinksRehypePlugin],
+      [
+        rehypeMdxCodeProps,
+        {
+          tagName: "code",
+        },
+      ],
+      [rehypeSlug],
+      [
+        cloudinaryImgRehypePlugin,
+        {
+          cloudinaryConfig: {
+            cloudName: process.env.CLOUDINARY_CLOUD_NAME || "",
+            flags: ["fl_lossy", "f_auto"],
+            resize: {
+              action: "pad",
+              aspectRatio: "16:9",
+            },
+            roundCorners: 16,
+          },
+        },
+      ],
+    ],
+    remarkPlugins: [
+      [remarkFrontmatter],
+      [remarkDirective],
+      [resolveAdmonitionsPlugin],
+    ],
+    jsx: true,
+  },
+})
+
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  // Configure `pageExtensions` to include MDX files
+  pageExtensions: ["js", "jsx", "mdx", "ts", "tsx"],
+
+  transpilePackages: ["docs-ui"],
+  // TODO uncomment if we decide on baes path
+  // basePath: process.env.NEXT_PUBLIC_BASE_PATH || "/v2/user-guide",
+  basePath: process.env.NEXT_PUBLIC_BASE_PATH || "/user-guide",
+  async rewrites() {
+    return {
+      fallback: [
+        {
+          source: "/:path*",
+          destination: `${
+            process.env.NEXT_PUBLIC_DOCS_URL || "https://localhost:3001"
+          }/:path*`,
+          basePath: false,
+        },
+      ],
+    }
+  },
+}
+
+export default withMDX(nextConfig)

www/apps/user-guide/package.json

@@ -0,0 +1,52 @@
+{
+  "name": "user-guide",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "yarn prep && next dev",
+    "dev:monorepo": "yarn prep && yarn dev -p 3004",
+    "build": "yarn prep && next build",
+    "build:dev": "NODE_ENV=test yarn build",
+    "start": "next start",
+    "start:monorepo": "yarn start -p 3004",
+    "lint": "next lint --fix",
+    "lint:content": "eslint --no-eslintrc -c .content.eslintrc.js app/**/*.mdx --fix",
+    "prep": "node ./scripts/prepare.mjs"
+  },
+  "dependencies": {
+    "@mdx-js/loader": "^3.0.0",
+    "@mdx-js/react": "^3.0.0",
+    "@medusajs/icons": "^1.2.0",
+    "@next/mdx": "^14.2.3",
+    "clsx": "^2.1.0",
+    "docs-ui": "*",
+    "next": "14.2.3",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "rehype-mdx-code-props": "^2.0.0",
+    "rehype-slug": "^6.0.0",
+    "remark-directive": "^3.0.0",
+    "remark-frontmatter": "^5.0.0",
+    "remark-rehype-plugins": "*"
+  },
+  "devDependencies": {
+    "@types/mdx": "^2.0.10",
+    "@types/node": "^20",
+    "@types/react": "^18.2.0",
+    "@types/react-dom": "^18.2.0",
+    "autoprefixer": "^10.0.1",
+    "build-scripts": "*",
+    "eslint": "^8",
+    "eslint-config-docs": "*",
+    "eslint-config-next": "14.2.3",
+    "postcss": "^8",
+    "tailwind": "*",
+    "tailwindcss": "^3.3.0",
+    "tsconfig": "*",
+    "types": "*",
+    "typescript": "^5"
+  },
+  "engines": {
+    "node": ">=18.17.0"
+  }
+}

www/apps/user-guide/postcss.config.js

@@ -0,0 +1 @@
+module.exports = require("tailwind/postcss.config")

www/apps/user-guide/providers/index.tsx

@@ -0,0 +1,57 @@
+"use client"
+
+import {
+  AnalyticsProvider,
+  ColorModeProvider,
+  HooksLoader,
+  LearningPathProvider,
+  MobileProvider,
+  ModalProvider,
+  NotificationProvider,
+  PaginationProvider,
+  ScrollControllerProvider,
+  SiteConfigProvider,
+} from "docs-ui"
+import SidebarProvider from "./sidebar"
+import SearchProvider from "./search"
+import { config } from "../config"
+
+type ProvidersProps = {
+  children?: React.ReactNode
+}
+
+const Providers = ({ children }: ProvidersProps) => {
+  return (
+    <AnalyticsProvider writeKey={process.env.NEXT_PUBLIC_SEGMENT_API_KEY}>
+      <SiteConfigProvider config={config}>
+        <MobileProvider>
+          <ColorModeProvider>
+            <ModalProvider>
+              <LearningPathProvider>
+                <NotificationProvider>
+                  <ScrollControllerProvider scrollableSelector="#main">
+                    <SidebarProvider>
+                      <PaginationProvider>
+                        <SearchProvider>
+                          <HooksLoader
+                            options={{
+                              pageScrollManager: true,
+                            }}
+                          >
+                            {children}
+                          </HooksLoader>
+                        </SearchProvider>
+                      </PaginationProvider>
+                    </SidebarProvider>
+                  </ScrollControllerProvider>
+                </NotificationProvider>
+              </LearningPathProvider>
+            </ModalProvider>
+          </ColorModeProvider>
+        </MobileProvider>
+      </SiteConfigProvider>
+    </AnalyticsProvider>
+  )
+}
+
+export default Providers

www/apps/user-guide/providers/search.tsx

@@ -0,0 +1,75 @@
+"use client"
+
+import {
+  SearchProvider as UiSearchProvider,
+  AiAssistantCommandIcon,
+  AiAssistantProvider,
+  searchFilters,
+} from "docs-ui"
+import { config } from "../config"
+
+type SearchProviderProps = {
+  children: React.ReactNode
+}
+
+const SearchProvider = ({ children }: SearchProviderProps) => {
+  return (
+    <UiSearchProvider
+      algolia={{
+        appId: process.env.NEXT_PUBLIC_ALGOLIA_APP_ID || "temp",
+        apiKey: process.env.NEXT_PUBLIC_ALGOLIA_API_KEY || "temp",
+        mainIndexName:
+          process.env.NEXT_PUBLIC_DOCS_ALGOLIA_INDEX_NAME || "temp",
+        indices: [
+          process.env.NEXT_PUBLIC_API_ALGOLIA_INDEX_NAME || "temp",
+          process.env.NEXT_PUBLIC_DOCS_ALGOLIA_INDEX_NAME || "temp",
+        ],
+      }}
+      searchProps={{
+        isLoading: false,
+        suggestions: [
+          {
+            title: "Search Suggestions",
+            items: [
+              "Create a product",
+              "View list of orders",
+              "Manage regions",
+              "Add fulfillment provider to a region",
+              "Add payment provider to a region",
+              "Manage price lists",
+              "Manage team",
+            ],
+          },
+        ],
+        checkInternalPattern: new RegExp(`^${config.baseUrl}/user-guide`),
+        filterOptions: searchFilters,
+      }}
+      initialDefaultFilters={["user-guide"]}
+      commands={[
+        {
+          name: "ai-assistant",
+          icon: <AiAssistantCommandIcon />,
+          component: (
+            <AiAssistantProvider
+              apiUrl={process.env.NEXT_PUBLIC_AI_ASSISTANT_URL || "temp"}
+              websiteId={process.env.NEXT_PUBLIC_AI_WEBSITE_ID || "temp"}
+              recaptchaSiteKey={
+                process.env.NEXT_PUBLIC_AI_API_ASSISTANT_RECAPTCHA_SITE_KEY ||
+                "temp"
+              }
+            />
+          ),
+          title: "AI Assistant",
+          badge: {
+            variant: "purple",
+            children: "Beta",
+          },
+        },
+      ]}
+    >
+      {children}
+    </UiSearchProvider>
+  )
+}
+
+export default SearchProvider

www/apps/user-guide/providers/sidebar.tsx

@@ -0,0 +1,30 @@
+"use client"
+import {
+  SidebarProvider as UiSidebarProvider,
+  useScrollController,
+} from "docs-ui"
+import { config } from "@/config"
+
+type SidebarProviderProps = {
+  children?: React.ReactNode
+}
+
+const SidebarProvider = ({ children }: SidebarProviderProps) => {
+  const { scrollableElement } = useScrollController()
+
+  return (
+    <UiSidebarProvider
+      shouldHandlePathChange={true}
+      shouldHandleHashChange={false}
+      scrollableElement={scrollableElement}
+      initialItems={config.sidebar}
+      staticSidebarItems={true}
+      disableActiveTransition={true}
+      noTitleStyling={true}
+    >
+      {children}
+    </UiSidebarProvider>
+  )
+}
+
+export default SidebarProvider

www/apps/user-guide/public/images/magnifying-glass-dark.svg

@@ -0,0 +1,5 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="magnifying-glass">
+<path id="Vector" d="M17.4997 17.5001L13.1688 13.1693M13.1688 13.1693C14.341 11.9972 14.9995 10.4074 14.9995 8.74972C14.9995 7.09205 14.341 5.50228 13.1688 4.33014C11.9967 3.15799 10.4069 2.49949 8.74926 2.49949C7.09159 2.49949 5.50182 3.15799 4.32967 4.33014C3.15753 5.50228 2.49902 7.09205 2.49902 8.74972C2.49902 10.4074 3.15753 11.9972 4.32967 13.1693C5.50182 14.3414 7.09159 15 8.74926 15C10.4069 15 11.9967 14.3414 13.1688 13.1693V13.1693Z" stroke="#6E6E6E" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

www/apps/user-guide/public/images/magnifying-glass.svg

@@ -0,0 +1,5 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="magnifying-glass">
+<path id="Vector" d="M17.4997 17.5001L13.1688 13.1693M13.1688 13.1693C14.341 11.9972 14.9995 10.4074 14.9995 8.74972C14.9995 7.09205 14.341 5.50228 13.1688 4.33014C11.9967 3.15799 10.4069 2.49949 8.74926 2.49949C7.09159 2.49949 5.50182 3.15799 4.32967 4.33014C3.15753 5.50228 2.49902 7.09205 2.49902 8.74972C2.49902 10.4074 3.15753 11.9972 4.32967 13.1693C5.50182 14.3414 7.09159 15 8.74926 15C10.4069 15 11.9967 14.3414 13.1688 13.1693V13.1693Z" stroke="#9CA3AF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

www/apps/user-guide/public/images/search-hit-arrow-light.svg

@@ -0,0 +1,4 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7.99984 8.66669L4.6665 12L7.99984 15.3334" stroke="#889096" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M15.3332 4.66669V9.33335C15.3332 10.0406 15.0522 10.7189 14.5521 11.219C14.052 11.7191 13.3737 12 12.6665 12H4.6665" stroke="#889096" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

www/apps/user-guide/public/images/search-hit-arrow.svg

@@ -0,0 +1,4 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7.99984 8.66669L4.6665 12L7.99984 15.3334" stroke="#706F78" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M15.3332 4.66669V9.33335C15.3332 10.0406 15.0522 10.7189 14.5521 11.219C14.052 11.7191 13.3737 12 12.6665 12H4.6665" stroke="#706F78" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

www/apps/user-guide/public/images/search-hit-light.svg

@@ -0,0 +1,5 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="32" height="32" rx="4" fill="#F1F3F5"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M10.915 7.625C10.0886 7.625 9.41943 8.295 9.41943 9.12054V22.8795C9.41943 23.705 10.0894 24.375 10.915 24.375H21.0846C21.9101 24.375 22.5801 23.705 22.5801 22.8795V16.5982C22.5801 15.8049 22.265 15.0441 21.7041 14.4832C21.1431 13.9223 20.3824 13.6071 19.5891 13.6071H18.0935C17.6969 13.6071 17.3165 13.4496 17.036 13.1691C16.7556 12.8886 16.598 12.5082 16.598 12.1116V10.6161C16.598 9.82279 16.2829 9.062 15.7219 8.50106C15.161 7.94013 14.4002 7.625 13.6069 7.625H10.915ZM12.4105 18.3929C12.4105 18.2342 12.4735 18.082 12.5857 17.9699C12.6979 17.8577 12.8501 17.7946 13.0087 17.7946H18.9909C19.1495 17.7946 19.3017 17.8577 19.4139 17.9699C19.5261 18.082 19.5891 18.2342 19.5891 18.3929C19.5891 18.5515 19.5261 18.7037 19.4139 18.8159C19.3017 18.928 19.1495 18.9911 18.9909 18.9911H13.0087C12.8501 18.9911 12.6979 18.928 12.5857 18.8159C12.4735 18.7037 12.4105 18.5515 12.4105 18.3929ZM13.0087 20.1875C12.8501 20.1875 12.6979 20.2505 12.5857 20.3627C12.4735 20.4749 12.4105 20.6271 12.4105 20.7857C12.4105 20.9444 12.4735 21.0965 12.5857 21.2087C12.6979 21.3209 12.8501 21.3839 13.0087 21.3839H15.9998C16.1584 21.3839 16.3106 21.3209 16.4228 21.2087C16.535 21.0965 16.598 20.9444 16.598 20.7857C16.598 20.6271 16.535 20.4749 16.4228 20.3627C16.3106 20.2505 16.1584 20.1875 15.9998 20.1875H13.0087Z" fill="#687076"/>
+<path d="M16.7744 7.8772C17.4337 8.6373 17.796 9.61006 17.7946 10.6162V12.1118C17.7946 12.2769 17.9286 12.4109 18.0937 12.4109H19.5892C20.5954 12.4095 21.5681 12.7718 22.3282 13.431C21.9773 12.0964 21.2782 10.8789 20.3024 9.90306C19.3266 8.92724 18.1091 8.22812 16.7744 7.8772Z" fill="#687076"/>
+</svg>

www/apps/user-guide/public/images/search-hit.svg

@@ -0,0 +1,5 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="32" height="32" rx="4" fill="#2E2E32"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M10.915 7.625C10.0886 7.625 9.41943 8.295 9.41943 9.12054V22.8795C9.41943 23.705 10.0894 24.375 10.915 24.375H21.0846C21.9101 24.375 22.5801 23.705 22.5801 22.8795V16.5982C22.5801 15.8049 22.265 15.0441 21.7041 14.4832C21.1431 13.9223 20.3824 13.6071 19.5891 13.6071H18.0935C17.6969 13.6071 17.3165 13.4496 17.036 13.1691C16.7556 12.8886 16.598 12.5082 16.598 12.1116V10.6161C16.598 9.82279 16.2829 9.062 15.7219 8.50106C15.161 7.94013 14.4002 7.625 13.6069 7.625H10.915ZM12.4105 18.3929C12.4105 18.2342 12.4735 18.082 12.5857 17.9699C12.6979 17.8577 12.8501 17.7946 13.0087 17.7946H18.9909C19.1495 17.7946 19.3017 17.8577 19.4139 17.9699C19.5261 18.082 19.5891 18.2342 19.5891 18.3929C19.5891 18.5515 19.5261 18.7037 19.4139 18.8159C19.3017 18.928 19.1495 18.9911 18.9909 18.9911H13.0087C12.8501 18.9911 12.6979 18.928 12.5857 18.8159C12.4735 18.7037 12.4105 18.5515 12.4105 18.3929ZM13.0087 20.1875C12.8501 20.1875 12.6979 20.2505 12.5857 20.3627C12.4735 20.4749 12.4105 20.6271 12.4105 20.7857C12.4105 20.9444 12.4735 21.0965 12.5857 21.2087C12.6979 21.3209 12.8501 21.3839 13.0087 21.3839H15.9998C16.1584 21.3839 16.3106 21.3209 16.4228 21.2087C16.535 21.0965 16.598 20.9444 16.598 20.7857C16.598 20.6271 16.535 20.4749 16.4228 20.3627C16.3106 20.2505 16.1584 20.1875 15.9998 20.1875H13.0087Z" fill="#7E7D86"/>
+<path d="M16.7744 7.8772C17.4337 8.6373 17.796 9.61006 17.7946 10.6162V12.1118C17.7946 12.2769 17.9286 12.4109 18.0937 12.4109H19.5892C20.5954 12.4095 21.5681 12.7718 22.3282 13.431C21.9773 12.0964 21.2782 10.8789 20.3024 9.90306C19.3266 8.92724 18.1091 8.22812 16.7744 7.8772Z" fill="#7E7D86"/>
+</svg>

www/apps/user-guide/public/images/search-no-result-light.svg

@@ -0,0 +1,5 @@
+<svg width="21" height="20" viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M10.8169 6.06351C10.8167 5.44855 10.9606 4.84211 11.237 4.29277C11.5134 3.74343 11.9147 3.26648 12.4086 2.90013C12.9025 2.53379 13.4754 2.28824 14.0813 2.18315C14.6872 2.07807 15.3093 2.11638 15.8978 2.29501C15.9908 2.32318 16.0749 2.37498 16.1419 2.44534C16.209 2.5157 16.2566 2.60222 16.2803 2.69649C16.3039 2.79075 16.3027 2.88952 16.2768 2.98319C16.2509 3.07686 16.2012 3.16222 16.1325 3.23095L13.6427 5.72003C13.6899 6.07626 13.8497 6.42049 14.1234 6.69422C14.3971 6.96795 14.7414 7.12769 15.0983 7.17419L17.5867 4.6851C17.6554 4.6164 17.7408 4.56668 17.8344 4.54078C17.9281 4.51489 18.0269 4.5137 18.1211 4.53734C18.2154 4.56099 18.3019 4.60864 18.3723 4.67568C18.4426 4.74271 18.4944 4.82683 18.5226 4.91984C18.7095 5.53544 18.7427 6.18746 18.6193 6.81886C18.4959 7.45026 18.2197 8.0418 17.8147 8.54174C17.4098 9.04167 16.8886 9.43477 16.2966 9.68663C15.7046 9.93849 15.0599 10.0415 14.4189 9.9865C13.6554 9.92201 13.0165 10.0615 12.6872 10.462L7.32509 16.9753C7.10554 17.2406 6.833 17.4571 6.52493 17.611C6.21686 17.7649 5.88004 17.8528 5.53606 17.869C5.19207 17.8852 4.84848 17.8294 4.52731 17.7052C4.20613 17.5809 3.91443 17.391 3.6709 17.1475C3.42737 16.904 3.23736 16.6124 3.11305 16.2912C2.98874 15.9701 2.93287 15.6265 2.94901 15.2825C2.96514 14.9385 3.05294 14.6017 3.20676 14.2936C3.36059 13.9855 3.57707 13.7129 3.84232 13.4933L10.3549 8.13037C10.7546 7.8004 10.8949 7.16219 10.8304 6.39874C10.8212 6.28723 10.8167 6.17539 10.8169 6.06351ZM4.905 15.3442C4.905 15.195 4.96426 15.0519 5.06974 14.9464C5.17523 14.8409 5.31829 14.7817 5.46746 14.7817H5.47346C5.62264 14.7817 5.7657 14.8409 5.87119 14.9464C5.97667 15.0519 6.03593 15.195 6.03593 15.3442V15.3501C6.03593 15.4993 5.97667 15.6424 5.87119 15.7479C5.7657 15.8534 5.62264 15.9126 5.47346 15.9126H5.46746C5.31829 15.9126 5.17523 15.8534 5.06974 15.7479C4.96426 15.6424 4.905 15.4993 4.905 15.3501V15.3442Z" fill="#889096"/>
+<path d="M9.37377 7.48082L7.72313 5.83093V4.65651C7.72313 4.5594 7.69798 4.46395 7.65014 4.37945C7.60231 4.29495 7.53341 4.22427 7.45015 4.17429L4.63783 2.4869C4.53027 2.42242 4.40424 2.39574 4.27978 2.41109C4.15531 2.42645 4.03955 2.48296 3.95088 2.57164L3.38842 3.13411C3.29973 3.22278 3.24322 3.33854 3.22787 3.46301C3.21251 3.58747 3.23919 3.7135 3.30367 3.82106L4.99106 6.63338C5.04104 6.71663 5.11172 6.78553 5.19622 6.83337C5.28073 6.88121 5.37617 6.90635 5.47328 6.90636H6.6462L8.1926 8.45276L9.37377 7.48007V7.48082Z" fill="#889096"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11.2339 13.9971L14.3709 17.1334C14.606 17.3685 14.885 17.5549 15.1921 17.6821C15.4992 17.8093 15.8283 17.8748 16.1607 17.8748C16.4931 17.8748 16.8222 17.8093 17.1293 17.6821C17.4364 17.5549 17.7154 17.3685 17.9504 17.1334C18.1855 16.8984 18.3719 16.6194 18.4991 16.3123C18.6263 16.0052 18.6918 15.6761 18.6918 15.3437C18.6918 15.0113 18.6263 14.6821 18.4991 14.3751C18.3719 14.068 18.1855 13.7889 17.9504 13.5539L15.4711 11.0753C15.0911 11.1292 14.7062 11.14 14.3237 11.1076C14.0282 11.0821 13.8122 11.1031 13.6735 11.1391C13.6296 11.1484 13.5873 11.1643 13.5482 11.1863L11.2339 13.9971ZM13.7942 12.9772C13.8997 12.8719 14.0426 12.8127 14.1917 12.8127C14.3407 12.8127 14.4837 12.8719 14.5892 12.9772L15.9953 14.3841C16.0506 14.4356 16.0949 14.4977 16.1257 14.5667C16.1564 14.6357 16.1729 14.7102 16.1743 14.7857C16.1756 14.8612 16.1617 14.9362 16.1334 15.0063C16.1051 15.0763 16.063 15.1399 16.0096 15.1933C15.9562 15.2467 15.8926 15.2888 15.8225 15.3171C15.7525 15.3454 15.6775 15.3593 15.602 15.358C15.5264 15.3566 15.452 15.3401 15.383 15.3094C15.314 15.2786 15.2519 15.2343 15.2004 15.179L13.7942 13.7729C13.6889 13.6674 13.6297 13.5245 13.6297 13.3754C13.6297 13.2264 13.6889 13.0834 13.7942 12.9779V12.9772Z" fill="#889096"/>
+</svg>

www/apps/user-guide/public/images/search-no-result.svg

@@ -0,0 +1,5 @@
+<svg width="21" height="20" viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M10.8169 6.06351C10.8167 5.44855 10.9606 4.84211 11.237 4.29277C11.5134 3.74343 11.9147 3.26648 12.4086 2.90013C12.9025 2.53379 13.4754 2.28824 14.0813 2.18315C14.6872 2.07807 15.3093 2.11638 15.8978 2.29501C15.9908 2.32318 16.0749 2.37498 16.1419 2.44534C16.209 2.5157 16.2566 2.60222 16.2803 2.69649C16.3039 2.79075 16.3027 2.88952 16.2768 2.98319C16.2509 3.07686 16.2012 3.16222 16.1325 3.23095L13.6427 5.72003C13.6899 6.07626 13.8497 6.42049 14.1234 6.69422C14.3971 6.96795 14.7414 7.12769 15.0983 7.17419L17.5867 4.6851C17.6554 4.6164 17.7408 4.56668 17.8344 4.54078C17.9281 4.51489 18.0269 4.5137 18.1211 4.53734C18.2154 4.56099 18.3019 4.60864 18.3723 4.67568C18.4426 4.74271 18.4944 4.82683 18.5226 4.91984C18.7095 5.53544 18.7427 6.18746 18.6193 6.81886C18.4959 7.45026 18.2197 8.0418 17.8147 8.54174C17.4098 9.04167 16.8886 9.43477 16.2966 9.68663C15.7046 9.93849 15.0599 10.0415 14.4189 9.9865C13.6554 9.92201 13.0165 10.0615 12.6872 10.462L7.32509 16.9753C7.10554 17.2406 6.833 17.4571 6.52493 17.611C6.21686 17.7649 5.88004 17.8528 5.53606 17.869C5.19207 17.8852 4.84848 17.8294 4.52731 17.7052C4.20613 17.5809 3.91443 17.391 3.6709 17.1475C3.42737 16.904 3.23736 16.6124 3.11305 16.2912C2.98874 15.9701 2.93287 15.6265 2.94901 15.2825C2.96514 14.9385 3.05294 14.6017 3.20676 14.2936C3.36059 13.9855 3.57707 13.7129 3.84232 13.4933L10.3549 8.13037C10.7546 7.8004 10.8949 7.16219 10.8304 6.39874C10.8212 6.28723 10.8167 6.17539 10.8169 6.06351ZM4.905 15.3442C4.905 15.195 4.96426 15.0519 5.06974 14.9464C5.17523 14.8409 5.31829 14.7817 5.46746 14.7817H5.47346C5.62264 14.7817 5.7657 14.8409 5.87119 14.9464C5.97667 15.0519 6.03593 15.195 6.03593 15.3442V15.3501C6.03593 15.4993 5.97667 15.6424 5.87119 15.7479C5.7657 15.8534 5.62264 15.9126 5.47346 15.9126H5.46746C5.31829 15.9126 5.17523 15.8534 5.06974 15.7479C4.96426 15.6424 4.905 15.4993 4.905 15.3501V15.3442Z" fill="#706F78"/>
+<path d="M9.37377 7.48082L7.72313 5.83093V4.65651C7.72313 4.5594 7.69798 4.46395 7.65014 4.37945C7.60231 4.29495 7.53341 4.22427 7.45015 4.17429L4.63783 2.4869C4.53027 2.42242 4.40424 2.39574 4.27978 2.41109C4.15531 2.42645 4.03955 2.48296 3.95088 2.57164L3.38842 3.13411C3.29973 3.22278 3.24322 3.33854 3.22787 3.46301C3.21251 3.58747 3.23919 3.7135 3.30367 3.82106L4.99106 6.63338C5.04104 6.71663 5.11172 6.78553 5.19622 6.83337C5.28073 6.88121 5.37617 6.90635 5.47328 6.90636H6.6462L8.1926 8.45276L9.37377 7.48007V7.48082Z" fill="#706F78"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11.2339 13.9971L14.3709 17.1334C14.606 17.3685 14.885 17.5549 15.1921 17.6821C15.4992 17.8093 15.8283 17.8748 16.1607 17.8748C16.4931 17.8748 16.8222 17.8093 17.1293 17.6821C17.4364 17.5549 17.7154 17.3685 17.9504 17.1334C18.1855 16.8984 18.3719 16.6194 18.4991 16.3123C18.6263 16.0052 18.6918 15.6761 18.6918 15.3437C18.6918 15.0113 18.6263 14.6821 18.4991 14.3751C18.3719 14.068 18.1855 13.7889 17.9504 13.5539L15.4711 11.0753C15.0911 11.1292 14.7062 11.14 14.3237 11.1076C14.0282 11.0821 13.8122 11.1031 13.6735 11.1391C13.6296 11.1484 13.5873 11.1643 13.5482 11.1863L11.2339 13.9971ZM13.7942 12.9772C13.8997 12.8719 14.0426 12.8127 14.1917 12.8127C14.3407 12.8127 14.4837 12.8719 14.5892 12.9772L15.9953 14.3841C16.0506 14.4356 16.0949 14.4977 16.1257 14.5667C16.1564 14.6357 16.1729 14.7102 16.1743 14.7857C16.1756 14.8612 16.1617 14.9362 16.1334 15.0063C16.1051 15.0763 16.063 15.1399 16.0096 15.1933C15.9562 15.2467 15.8926 15.2888 15.8225 15.3171C15.7525 15.3454 15.6775 15.3593 15.602 15.358C15.5264 15.3566 15.452 15.3401 15.383 15.3094C15.314 15.2786 15.2519 15.2343 15.2004 15.179L13.7942 13.7729C13.6889 13.6674 13.6297 13.5245 13.6297 13.3754C13.6297 13.2264 13.6889 13.0834 13.7942 12.9779V12.9772Z" fill="#706F78"/>
+</svg>

www/apps/user-guide/public/next.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>

www/apps/user-guide/public/vercel.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 283 64"><path fill="black" d="M141 16c-11 0-19 7-19 18s9 18 20 18c7 0 13-3 16-7l-7-5c-2 3-6 4-9 4-5 0-9-3-10-7h28v-3c0-11-8-18-19-18zm-9 15c1-4 4-7 9-7s8 3 9 7h-18zm117-15c-11 0-19 7-19 18s9 18 20 18c6 0 12-3 16-7l-8-5c-2 3-5 4-8 4-5 0-9-3-11-7h28l1-3c0-11-8-18-19-18zm-10 15c2-4 5-7 10-7s8 3 9 7h-19zm-39 3c0 6 4 10 10 10 4 0 7-2 9-5l8 5c-3 5-9 8-17 8-11 0-19-7-19-18s8-18 19-18c8 0 14 3 17 8l-8 5c-2-3-5-5-9-5-6 0-10 4-10 10zm83-29v46h-9V5h9zM37 0l37 64H0L37 0zm92 5-27 48L74 5h10l18 30 17-30h10zm59 12v10l-3-1c-6 0-10 4-10 10v15h-9V17h9v9c0-5 6-9 13-9z"/></svg>

www/apps/user-guide/scripts/prepare.mjs

@@ -0,0 +1,8 @@
+import { generateSidebar } from "build-scripts"
+import { sidebar } from "../sidebar.mjs"
+
+async function main() {
+  generateSidebar(sidebar)
+}
+
+void main()

www/apps/user-guide/sidebar.mjs

@@ -0,0 +1,58 @@
+import { sidebarAttachHrefCommonOptions } from "build-scripts"
+
+// TODO check the order of items based on the Medusa Admin's sidebar
+
+/** @type {import('types').RawSidebarItemType[]} */
+export const sidebar = sidebarAttachHrefCommonOptions([
+  {
+    path: "/",
+    title: "Introduction",
+  },
+  {
+    title: "Tips",
+    hasTitleStyling: true,
+    autogenerate_path: "/tips",
+  },
+  {
+    path: "/orders",
+    title: "Orders",
+    hasTitleStyling: true,
+    autogenerate_path: "/orders",
+  },
+  {
+    path: "/products",
+    title: "Products",
+    hasTitleStyling: true,
+    autogenerate_path: "/products",
+  },
+  {
+    path: "/inventory",
+    title: "Inventory",
+    hasTitleStyling: true,
+    autogenerate_path: "/inventory",
+  },
+  {
+    path: "/customers",
+    title: "Customers",
+    hasTitleStyling: true,
+    autogenerate_path: "/customers",
+  },
+  {
+    path: "/discounts",
+    title: "Discounts",
+    hasTitleStyling: true,
+    autogenerate_path: "/discounts",
+  },
+  {
+    path: "/pricing",
+    title: "Pricing",
+    hasTitleStyling: true,
+    autogenerate_path: "/pricing",
+  },
+  {
+    path: "/settings",
+    title: "Settings",
+    hasTitleStyling: true,
+    autogenerate_path: "/settings",
+  },
+])

www/apps/user-guide/tailwind.config.js

@@ -0,0 +1,37 @@
+import coreConfig from "tailwind"
+
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+  ...coreConfig,
+  content: [
+    ...coreConfig.content,
+    "./pages/**/*.{js,ts,jsx,tsx,mdx}",
+    "./components/**/*.{js,ts,jsx,tsx,mdx}",
+    "./app/**/*.{js,ts,jsx,tsx,mdx}",
+    "./layouts/**/*.{js,ts,jsx,tsx,mdx}",
+    "./providers/**/*.{js,ts,jsx,tsx,mdx}",
+  ],
+  theme: {
+    ...coreConfig.theme,
+    extend: {
+      ...coreConfig.theme.extend,
+      container: {
+        center: true,
+        screens: {
+          "2xl": "1400px",
+        },
+      },
+    },
+    backgroundImage: {
+      ...coreConfig.theme.backgroundImage,
+      "search-hit": "url('/images/search-hit-light.svg')",
+      "search-hit-dark": "url('/images/search-hit.svg')",
+      "search-arrow": "url('/images/search-hit-arrow-light.svg')",
+      "search-arrow-dark": "url('/images/search-hit-arrow.svg')",
+      "search-no-result": "url('/images/search-no-result-light.svg')",
+      "search-no-result-dark": "url('/images/search-no-result.svg')",
+      "magnifying-glass": "url('/images/magnifying-glass.svg')",
+      "magnifying-glass-dark": "url('/images/magnifying-glass-dark.svg')",
+    },
+  },
+}

www/apps/user-guide/tsconfig.json

@@ -0,0 +1,19 @@
+{
+  "extends": "tsconfig/nextjs.json",
+  "compilerOptions": {
+    "paths": {
+      "@/*": [
+        "./*"
+      ]
+    },
+    "jsx": "preserve",
+  },
+  "include": [
+    "next-env.d.ts",
+    "**/*.tsx",
+    "**/*.ts",
+    "**/*.js",
+    ".next/types/**/*.ts",
+    "**/*.mjs"
+  ]
+}

www/apps/user-guide/utils/base-path-url.ts

@@ -0,0 +1,3 @@
+export function basePathUrl(path = "") {
+  return `${process.env.NEXT_PUBLIC_BASE_PATH}${path}`
+}

www/apps/user-guide/vercel.json

@@ -0,0 +1,7 @@
+{
+  "framework": "nextjs",
+  "installCommand": "yarn install",
+  "buildCommand": "turbo run build",
+  "outputDirectory": ".next",
+  "ignoreCommand": "bash ../../ignore-build-script.sh"
+}