From b23f0f81886cb3fefad8d93386f5a7bf3442ff1a Mon Sep 17 00:00:00 2001 From: Shahed Nasser Date: Fri, 23 Aug 2024 10:59:48 +0300 Subject: [PATCH] docs: change notes across docs based on redesign (#8662) Change the prerequisites / soon / other notes based on latest redesign Depends on #8661 --- .../advanced-development/data-models/page.mdx | 6 -- .../data-models/relationships/page.mdx | 14 ++-- .../modules/module-links/page.mdx | 14 ++-- .../modules/remote-link/page.mdx | 10 +-- .../modules/service-factory/page.mdx | 2 +- .../workflows/add-workflow-hook/page.mdx | 4 +- .../workflows/workflow-hooks/page.mdx | 2 +- www/apps/book/app/basics/api-routes/page.mdx | 2 +- www/apps/book/app/basics/data-models/page.mdx | 4 +- .../basics/events-and-subscribers/page.mdx | 2 +- www/apps/book/app/basics/loaders/page.mdx | 2 +- .../nextjs-starter/page.mdx | 25 ++++--- .../cache/redis/page.mdx | 13 ++-- .../event/redis/page.mdx | 13 ++-- .../notification/sendgrid/page.mdx | 23 ++++--- .../workflow-engine/redis/page.mdx | 13 ++-- .../payment/payment-provider/stripe/page.mdx | 23 ++++--- .../resources/app/create-medusa-app/page.mdx | 23 ++++--- .../app/deployment/admin/vercel/page.mdx | 18 +++-- .../medusa-application/railway/page.mdx | 13 ++-- .../app/deployment/storefront/vercel/page.mdx | 18 +++-- www/apps/resources/app/medusa-cli/page.mdx | 22 ++++-- .../resources/app/nextjs-starter/page.mdx | 36 +++++----- www/apps/resources/app/recipes/b2b/page.mdx | 15 +--- .../app/recipes/commerce-automation/page.mdx | 10 +-- .../examples/standard/page.mdx | 12 ++-- .../marketplace/examples/vendors/page.mdx | 12 ++-- .../recipes/personalized-products/page.mdx | 6 -- .../subscriptions/examples/standard/page.mdx | 12 ++-- .../app/references/[...slug]/page.tsx | 8 +++ .../checkout/payment/stripe/page.mdx | 18 +++-- .../price/examples/sale-price/page.mdx | 2 +- .../price/examples/show-price/page.mdx | 2 +- .../price/examples/tax-price/page.mdx | 2 +- .../products/variants/page.mdx | 4 +- www/apps/resources/next.config.mjs | 15 +++- .../docs-ui/src/components/Feedback/index.tsx | 7 +- .../components/Prerequisites/Item/index.tsx | 5 +- .../src/cross-project-links.ts | 69 ++++++++++++++----- .../remark-rehype-plugins/src/index.ts | 1 + .../src/prerequisites-link-fixer.ts | 9 +++ 41 files changed, 291 insertions(+), 220 deletions(-) create mode 100644 www/packages/remark-rehype-plugins/src/prerequisites-link-fixer.ts diff --git a/www/apps/book/app/advanced-development/data-models/page.mdx b/www/apps/book/app/advanced-development/data-models/page.mdx index dbd11042c370b..fa3b319c93c6f 100644 --- a/www/apps/book/app/advanced-development/data-models/page.mdx +++ b/www/apps/book/app/advanced-development/data-models/page.mdx @@ -5,9 +5,3 @@ export const metadata = { # {metadata.title} In the next chapters, you'll learn more about creating data models, including property types, relationships, and more. - - - -Data models are in active development and may change. - - \ No newline at end of file diff --git a/www/apps/book/app/advanced-development/data-models/relationships/page.mdx b/www/apps/book/app/advanced-development/data-models/relationships/page.mdx index 57e9103307879..688ea9b9dd6ad 100644 --- a/www/apps/book/app/advanced-development/data-models/relationships/page.mdx +++ b/www/apps/book/app/advanced-development/data-models/relationships/page.mdx @@ -1,26 +1,22 @@ +import { BetaBadge } from "docs-ui" + export const metadata = { title: `${pageNumber} Data Model Relationships`, } -# {metadata.title} +# {metadata.title} In this chapter, you’ll learn how to define relationships between data models in your module. - - -Data model relationships are in active development and may change. - - - -- You want to create a relation between data models in the same module. +You want to create a relation between data models in the same module. -- You want to create a relationship between data models in different modules. Use module links instead. +You want to create a relationship between data models in different modules. Use module links instead. diff --git a/www/apps/book/app/advanced-development/modules/module-links/page.mdx b/www/apps/book/app/advanced-development/modules/module-links/page.mdx index e4601f0a774a0..5bd4d2b2b09cd 100644 --- a/www/apps/book/app/advanced-development/modules/module-links/page.mdx +++ b/www/apps/book/app/advanced-development/modules/module-links/page.mdx @@ -1,17 +1,13 @@ +import { BetaBadge } from "docs-ui" + export const metadata = { title: `${pageNumber} Module Link`, } -# {metadata.title} +# {metadata.title} In this chapter, you’ll learn what a module link is. - - -Module links are in active development. - - - ## What is a Module Link? A module link forms an association between two data models of different modules, while maintaining module isolation. @@ -20,13 +16,13 @@ You can then retrieve data across the linked modules, and manage their linked re -- You want to create a relation between data models from different modules. +You want to create a relation between data models from different modules. -- You want to create a relationship between data models in the same module. Use data model relationships instead. +You want to create a relationship between data models in the same module. Use data model relationships instead. diff --git a/www/apps/book/app/advanced-development/modules/remote-link/page.mdx b/www/apps/book/app/advanced-development/modules/remote-link/page.mdx index fc9ab69c01f75..691262dfe7bef 100644 --- a/www/apps/book/app/advanced-development/modules/remote-link/page.mdx +++ b/www/apps/book/app/advanced-development/modules/remote-link/page.mdx @@ -1,17 +1,13 @@ +import { BetaBadge } from "docs-ui" + export const metadata = { title: `${pageNumber} Remote Link`, } -# {metadata.title} +# {metadata.title} In this chapter, you’ll learn what the remote link is and how to use it to manage links. - - -Remote Links are in active development. - - - ## What is the Remote Link? The remote link is a class with utility methods to manage links between data models. It’s registered in the Medusa container under the `remoteLink` registration name. diff --git a/www/apps/book/app/advanced-development/modules/service-factory/page.mdx b/www/apps/book/app/advanced-development/modules/service-factory/page.mdx index cf478f4a416f7..71623b16f304a 100644 --- a/www/apps/book/app/advanced-development/modules/service-factory/page.mdx +++ b/www/apps/book/app/advanced-development/modules/service-factory/page.mdx @@ -16,7 +16,7 @@ The service factory generates data management methods for your data models, so y -- Your service provides data-management functionalities of your data models. +Your service provides data-management functionalities of your data models. diff --git a/www/apps/book/app/advanced-development/workflows/add-workflow-hook/page.mdx b/www/apps/book/app/advanced-development/workflows/add-workflow-hook/page.mdx index b00396d61a427..f608435fef64d 100644 --- a/www/apps/book/app/advanced-development/workflows/add-workflow-hook/page.mdx +++ b/www/apps/book/app/advanced-development/workflows/add-workflow-hook/page.mdx @@ -8,13 +8,13 @@ In this chapter, you'll learn how to expose a hook in your workflow. -- Your workflow is reusable in other applications, and you allow performing an external action at some point in your workflow. +Your workflow is reusable in other applications, and you allow performing an external action at some point in your workflow. -- Your workflow isn't reusable by other applications. Use a step that performs what a hook handler would instead. +Your workflow isn't reusable by other applications. Use a step that performs what a hook handler would instead. diff --git a/www/apps/book/app/advanced-development/workflows/workflow-hooks/page.mdx b/www/apps/book/app/advanced-development/workflows/workflow-hooks/page.mdx index feb19d283ec4f..4911da8fac6db 100644 --- a/www/apps/book/app/advanced-development/workflows/workflow-hooks/page.mdx +++ b/www/apps/book/app/advanced-development/workflows/workflow-hooks/page.mdx @@ -14,7 +14,7 @@ Medusa exposes hooks in many of its workflows that are used in its API routes. Y -- You want to perform a custom action during a workflow's execution, such as when a product is created. +You want to perform a custom action during a workflow's execution, such as when a product is created. diff --git a/www/apps/book/app/basics/api-routes/page.mdx b/www/apps/book/app/basics/api-routes/page.mdx index 0bfc8fd3c4e00..e76af220799dd 100644 --- a/www/apps/book/app/basics/api-routes/page.mdx +++ b/www/apps/book/app/basics/api-routes/page.mdx @@ -58,6 +58,6 @@ curl http://localhost:9000/store/hello-world -- You're exposing custom functionality to be used by a storefront, admin dashboard, or any external application. +You're exposing custom functionality to be used by a storefront, admin dashboard, or any external application. diff --git a/www/apps/book/app/basics/data-models/page.mdx b/www/apps/book/app/basics/data-models/page.mdx index 103f1facd81c3..80f904b315564 100644 --- a/www/apps/book/app/basics/data-models/page.mdx +++ b/www/apps/book/app/basics/data-models/page.mdx @@ -92,12 +92,12 @@ If ran successfully, the `my_custom` table will be created in the database. -- You want to store data related to your customization in the database. +You want to store data related to your customization in the database. -- You want to store simple key-value pairs related to an existing data model. Instead, use the `metadata` field that most existing models have, which is an object of custom key-value pairs. +You want to store simple key-value pairs related to an existing data model. Instead, use the `metadata` field that most existing models have, which is an object of custom key-value pairs. diff --git a/www/apps/book/app/basics/events-and-subscribers/page.mdx b/www/apps/book/app/basics/events-and-subscribers/page.mdx index 6c38a7f3d3367..8f39fd2bb1d78 100644 --- a/www/apps/book/app/basics/events-and-subscribers/page.mdx +++ b/www/apps/book/app/basics/events-and-subscribers/page.mdx @@ -68,7 +68,7 @@ The first message indicates that the `product.created` event was emitted, and th -- You want to perform an action everytime a specific event is emitted in the Medusa application. +You want to perform an action everytime a specific event is emitted in the Medusa application. diff --git a/www/apps/book/app/basics/loaders/page.mdx b/www/apps/book/app/basics/loaders/page.mdx index d910b0df55c35..a35e16a110726 100644 --- a/www/apps/book/app/basics/loaders/page.mdx +++ b/www/apps/book/app/basics/loaders/page.mdx @@ -71,6 +71,6 @@ Among the messages logged in the terminal, you’ll see the following message: -- You want to perform an action continuously or at a set time pattern in the application. Use scheduled jobs instead, which is explained in an upcoming chapter. +You want to perform an action continuously or at a set time pattern in the application. Use scheduled jobs instead, which is explained in an upcoming chapter. diff --git a/www/apps/book/app/storefront-development/nextjs-starter/page.mdx b/www/apps/book/app/storefront-development/nextjs-starter/page.mdx index 0d3a1bc3f5bf5..6d29d074ddae5 100644 --- a/www/apps/book/app/storefront-development/nextjs-starter/page.mdx +++ b/www/apps/book/app/storefront-development/nextjs-starter/page.mdx @@ -1,25 +1,24 @@ +import { Prerequisites, BetaBadge } from "docs-ui" + export const metadata = { title: `${pageNumber} Next.js Starter`, } -# {metadata.title} +# {metadata.title} In this chapter, you’ll learn how to install and use the Next.js Starter storefront. - - -The Next.js Starter is currently in development to fully support Medusa v2. - - - ## Install Next.js Starter - - -- [Node v18+](https://nodejs.org/en/) -- At least one region in the Medusa application. - - + 1. Clone the `v2` branch of the [Next.js Starter](https://github.com/medusajs/nextjs-starter-medusa/tree/v2): diff --git a/www/apps/resources/app/architectural-modules/cache/redis/page.mdx b/www/apps/resources/app/architectural-modules/cache/redis/page.mdx index e37519ad6d672..c969b707e85ec 100644 --- a/www/apps/resources/app/architectural-modules/cache/redis/page.mdx +++ b/www/apps/resources/app/architectural-modules/cache/redis/page.mdx @@ -1,4 +1,4 @@ -import { Table } from "docs-ui" +import { Table, Prerequisites } from "docs-ui" export const metadata = { title: `Redis Cache Module`, @@ -12,11 +12,12 @@ The Redis Cache Module uses Redis to cache data in your store. In production, it ## Install the Redis Cache Module - - -- [Redis installed and Redis server running](https://redis.io/docs/getting-started/installation/). - - + To install Redis Cache Module, run the following command in the directory of your Medusa application: diff --git a/www/apps/resources/app/architectural-modules/event/redis/page.mdx b/www/apps/resources/app/architectural-modules/event/redis/page.mdx index bec23a513df81..5e2c5bfffb454 100644 --- a/www/apps/resources/app/architectural-modules/event/redis/page.mdx +++ b/www/apps/resources/app/architectural-modules/event/redis/page.mdx @@ -1,4 +1,4 @@ -import { Table } from "docs-ui" +import { Table, Prerequisites } from "docs-ui" export const metadata = { title: `Redis Event Bus Module`, @@ -16,11 +16,12 @@ In production, it's recommended to use this module. ## Install the Redis Events Bus Module - - -- [Redis installed and Redis server running](https://redis.io/docs/getting-started/installation/). - - + To install Redis Event Bus Module, run the following command in the directory of your Medusa application: diff --git a/www/apps/resources/app/architectural-modules/notification/sendgrid/page.mdx b/www/apps/resources/app/architectural-modules/notification/sendgrid/page.mdx index d092b2c8fb03d..48887e505eba3 100644 --- a/www/apps/resources/app/architectural-modules/notification/sendgrid/page.mdx +++ b/www/apps/resources/app/architectural-modules/notification/sendgrid/page.mdx @@ -1,4 +1,4 @@ -import { Table } from "docs-ui" +import { Table, Prerequisites } from "docs-ui" export const metadata = { title: `SendGrid Notification Module Provider`, @@ -12,13 +12,20 @@ The SendGrid Notification Module Provider integrates [SendGrid](https://sendgrid ## Install the SendGrid Notification Module - - -- [SendGrid account](https://signup.sendgrid.com) -- [Setup SendGrid single sender](https://docs.sendgrid.com/ui/sending-email/sender-verification) -- [SendGrid API Key](https://docs.sendgrid.com/ui/account-and-settings/api-keys) - - + To install the SendGrid Notification Module Provider, run the following command in the directory of your Medusa application: diff --git a/www/apps/resources/app/architectural-modules/workflow-engine/redis/page.mdx b/www/apps/resources/app/architectural-modules/workflow-engine/redis/page.mdx index e651fa937422f..a31de0bb0e4a3 100644 --- a/www/apps/resources/app/architectural-modules/workflow-engine/redis/page.mdx +++ b/www/apps/resources/app/architectural-modules/workflow-engine/redis/page.mdx @@ -1,4 +1,4 @@ -import { Table } from "docs-ui" +import { Table, Prerequisites } from "docs-ui" export const metadata = { title: `Redis Workflow Engine Module`, @@ -12,11 +12,12 @@ The Redis Workflow Engine Module uses Redis to track workflow executions and han ## Install the Redis Workflow Engine Module - - -- [Redis installed and Redis server running](https://redis.io/docs/getting-started/installation/). - - + To install Redis Workflow Engine Module, run the following command in the directory of your Medusa application: diff --git a/www/apps/resources/app/commerce-modules/payment/payment-provider/stripe/page.mdx b/www/apps/resources/app/commerce-modules/payment/payment-provider/stripe/page.mdx index 88469cf73b831..060a321fe5f41 100644 --- a/www/apps/resources/app/commerce-modules/payment/payment-provider/stripe/page.mdx +++ b/www/apps/resources/app/commerce-modules/payment/payment-provider/stripe/page.mdx @@ -2,7 +2,7 @@ sidebar_label: "Stripe" --- -import { Table } from "docs-ui" +import { Table, Prerequisites } from "docs-ui" export const metadata = { title: `Stripe Module Provider`, @@ -22,13 +22,20 @@ These features are also available in a safe test environment, allowing for a con ## Install the Stripe Module Provider - - -- [Stripe account](https://stripe.com/). -- [Stripe Secret API Key](https://support.stripe.com/questions/locate-api-keys-in-the-dashboard) -- For deployed Medusa applications, a [Stripe webhook secret](https://docs.stripe.com/webhooks#add-a-webhook-endpoint). When creating the Webhook, set the endpoint URL to `{medusa_url}/hooks/payment/stripe`, where `{medusa_url}` with the URL to your deployed Medusa application. - - + To install the Stripe Module Provider, run the following command in the directory of your Medusa application: diff --git a/www/apps/resources/app/create-medusa-app/page.mdx b/www/apps/resources/app/create-medusa-app/page.mdx index 4f404998a5c63..f1c220ef90b79 100644 --- a/www/apps/resources/app/create-medusa-app/page.mdx +++ b/www/apps/resources/app/create-medusa-app/page.mdx @@ -1,4 +1,4 @@ -import { Table, DetailsList } from "docs-ui" +import { Table, DetailsList, Prerequisites } from "docs-ui" import PortForwardingTroubleshooting from "../troubleshooting/_sections/create-medusa-app-errors/forwarding.mdx" import DBUrlTroubleshooting from "../troubleshooting/_sections/create-medusa-app-errors/db-url-error.mdx" import EaddrinuseTroubleshooting from "../troubleshooting/_sections/other/eaddrinuse.mdx" @@ -17,13 +17,20 @@ export const metadata = { The `create-medusa-app` CLI tool simplifies the process of creating a new Medusa project and provides an onboarding experience. - - -- [Node.js v20+](https://nodejs.org/en/download) -- [Git CLI tool](https://git-scm.com/downloads) -- [PostgreSQL](https://www.postgresql.org/download/) - - + ## Usage diff --git a/www/apps/resources/app/deployment/admin/vercel/page.mdx b/www/apps/resources/app/deployment/admin/vercel/page.mdx index 125025f48f5d2..d78c64c239a96 100644 --- a/www/apps/resources/app/deployment/admin/vercel/page.mdx +++ b/www/apps/resources/app/deployment/admin/vercel/page.mdx @@ -2,6 +2,8 @@ sidebar_label: "Vercel" --- +import { Prerequisites } from "docs-ui" + export const metadata = { title: `Deploy Medusa Admin to Vercel`, } @@ -18,12 +20,16 @@ As Medusa v2 is still in active development, it's highly recommended not to depl --- - - -- [Medusa application](!docs!)’s codebase hosted on GitHub repository. -- [Deployed Medusa application](../../page.mdx#medusa-application). - - + ## 1. Configure Admin in Medusa diff --git a/www/apps/resources/app/deployment/medusa-application/railway/page.mdx b/www/apps/resources/app/deployment/medusa-application/railway/page.mdx index 4b7e200d3f5ce..0e1c548d0bb45 100644 --- a/www/apps/resources/app/deployment/medusa-application/railway/page.mdx +++ b/www/apps/resources/app/deployment/medusa-application/railway/page.mdx @@ -2,7 +2,7 @@ sidebar_label: "Railway" --- -import { DetailsList } from "docs-ui" +import { Prerequisites, DetailsList } from "docs-ui" import OutdatedPreviewContent from "../../../troubleshooting/_sections/common-installation-errors/outdated-preview.mdx" export const metadata = { @@ -35,11 +35,12 @@ The same Medusa project is used to deploy the server and worker modes. Learn mor --- - - -- [Medusa application](!docs!) hosted in a GitHub repository. - - + ## 1. Configure Medusa Application diff --git a/www/apps/resources/app/deployment/storefront/vercel/page.mdx b/www/apps/resources/app/deployment/storefront/vercel/page.mdx index 46428020bea60..adf119ac3d4b3 100644 --- a/www/apps/resources/app/deployment/storefront/vercel/page.mdx +++ b/www/apps/resources/app/deployment/storefront/vercel/page.mdx @@ -2,6 +2,8 @@ sidebar_label: "Vercel" --- +import { Prerequisites } from "docs-ui" + export const metadata = { title: `Deploy Medusa Admin to Vercel`, } @@ -18,12 +20,16 @@ As Medusa v2 is still in active development, it's highly recommended not to depl --- - - -- [Storefront codebase](../../../nextjs-starter/page.mdx) hosted in a GitHub repository. -- [Deployed Medusa application](../../page.mdx#medusa-application) with at least one region. - - + ## 1. Create Vercel Project diff --git a/www/apps/resources/app/medusa-cli/page.mdx b/www/apps/resources/app/medusa-cli/page.mdx index 5211224930e08..2660007317d20 100644 --- a/www/apps/resources/app/medusa-cli/page.mdx +++ b/www/apps/resources/app/medusa-cli/page.mdx @@ -1,4 +1,4 @@ -import { Table } from "docs-ui" +import { Table, Prerequisites } from "docs-ui" export const metadata = { title: `Medusa CLI Tool`, @@ -8,12 +8,20 @@ export const metadata = { The Medusa CLI tool provides commands that facilitate your development. - - -- [Node.js v20+](https://nodejs.org/en/download) -- [Git CLI tool](https://git-scm.com/downloads) - - + ## Usage diff --git a/www/apps/resources/app/nextjs-starter/page.mdx b/www/apps/resources/app/nextjs-starter/page.mdx index 53b33d34f310d..553d4abfe741f 100644 --- a/www/apps/resources/app/nextjs-starter/page.mdx +++ b/www/apps/resources/app/nextjs-starter/page.mdx @@ -1,4 +1,4 @@ -import { DetailsList } from "docs-ui" +import { DetailsList, BetaBadge, Prerequisites } from "docs-ui" import CmaOptionTroubleshooting from "../troubleshooting/_sections/nextjs/cma-option.mdx" import CorsErrorTroubleshooting from "../troubleshooting/_sections/other/cors-errors.mdx" import ModuleXErrorTroubleshooting from "../troubleshooting/_sections/common-installation-errors/module-x-error.mdx" @@ -7,22 +7,19 @@ export const metadata = { title: `Next.js Starter`, } -# {metadata.title} - - - -Next.js starter is currently in development and doesn't fully support Medusa v2 yet. - - +# {metadata.title} The Next.js Starter storefront provides rich commerce features and a sleek design. Developers and businesses can use it as-is or as a starting point to build a storefront for their Medusa application. - - -- [Node.js v18+](https://nodejs.org/en/download) -- At least one region in the Medusa application. - - + ## Installation @@ -95,11 +92,12 @@ The Next.js Starter storefront is compatible with Medusa's Stripe and PayPal plu ### Stripe Integration - - -- [Stripe module provider](../commerce-modules/payment/payment-provider/stripe/page.mdx) installed in the Medusa application. - - + In your Next.js Starter project, set the following environment variables for the Stripe integration: diff --git a/www/apps/resources/app/recipes/b2b/page.mdx b/www/apps/resources/app/recipes/b2b/page.mdx index 3620d70bca9d8..af14f265b8db9 100644 --- a/www/apps/resources/app/recipes/b2b/page.mdx +++ b/www/apps/resources/app/recipes/b2b/page.mdx @@ -1,19 +1,14 @@ import { AcademicCapSolid, UsersSolid } from "@medusajs/icons" +import { BetaBadge } from "docs-ui" export const metadata = { title: `B2B Recipe`, } -# {metadata.title} +# {metadata.title} This recipe provides the general steps to implement a B2B store with Medusa. - - -This recipe is a work in progress, as some features are not ready yet in Medusa V2. - - - ## Overview In a B2B store, you provide different types of customers with relevant pricing, products, shopping experience, and more. @@ -176,12 +171,6 @@ This is useful in B2B sales, as you often negotiate special prices with each cus You can create a B2B module that adds necessary data models to represent a B2B company. Then, you link that company to a customer group. Any customer belonging to that group also belongs to the company, meaning they're a B2B customer. - - -Module Relationships is coming soon. - - - This recipe provides the general steps to implement a B2B store with Medusa. - - -This recipe is a work in progress, as some features are not ready yet in Medusa V2. - - - ## Overview Commerce automation is essential for businesses to save costs, provide a better user experience, and avoid manual, repetitive tasks that lead to human errors. Businesses utilize automation in different domains, including marketing, customer support, and order management. diff --git a/www/apps/resources/app/recipes/digital-products/examples/standard/page.mdx b/www/apps/resources/app/recipes/digital-products/examples/standard/page.mdx index 2bf98c28dc8b3..c3368c69e994f 100644 --- a/www/apps/resources/app/recipes/digital-products/examples/standard/page.mdx +++ b/www/apps/resources/app/recipes/digital-products/examples/standard/page.mdx @@ -1,4 +1,5 @@ import { Github, PlaySolid } from "@medusajs/icons" +import { Prerequisites } from "docs-ui" export const metadata = { title: `Digital Products Recipe Example`, @@ -41,11 +42,12 @@ By following this example, you’ll have a commerce application with the followi --- - - -- [A new Medusa application installed.](!docs!#get-started) - - + ## Step 1: Create the Digital Product Module diff --git a/www/apps/resources/app/recipes/marketplace/examples/vendors/page.mdx b/www/apps/resources/app/recipes/marketplace/examples/vendors/page.mdx index 4689a94b77919..04d0255c0b6a5 100644 --- a/www/apps/resources/app/recipes/marketplace/examples/vendors/page.mdx +++ b/www/apps/resources/app/recipes/marketplace/examples/vendors/page.mdx @@ -1,4 +1,5 @@ import { Github, PlaySolid } from "@medusajs/icons" +import { Prerequisites } from "docs-ui" export const metadata = { title: `Marketplace Recipe: Vendors Example`, @@ -40,11 +41,12 @@ By following this example, you’ll have a marketplace with the following featur --- - - -- [A new Medusa application installed.](!docs!#get-started) - - + ## Step 1: Create Marketplace Module diff --git a/www/apps/resources/app/recipes/personalized-products/page.mdx b/www/apps/resources/app/recipes/personalized-products/page.mdx index 95be8d2b645a6..990e62e2dfb58 100644 --- a/www/apps/resources/app/recipes/personalized-products/page.mdx +++ b/www/apps/resources/app/recipes/personalized-products/page.mdx @@ -95,12 +95,6 @@ If you store the personalized data using a custom module: - Call that API Route from the storefront after adding the item to the cart. - Listen to the `order.placed` event to attach the personalized data to the Order Module's `LineItem` data model. - - -The `order.placed` event is currently not emitted. - - - - -- [A new Medusa application installed.](!docs!#get-started) - - + ## Step 1: Create Subscription Module diff --git a/www/apps/resources/app/references/[...slug]/page.tsx b/www/apps/resources/app/references/[...slug]/page.tsx index d5be782a904bb..92040d5a4ed6a 100644 --- a/www/apps/resources/app/references/[...slug]/page.tsx +++ b/www/apps/resources/app/references/[...slug]/page.tsx @@ -6,6 +6,7 @@ import { typeListLinkFixerPlugin, localLinksRehypePlugin, workflowDiagramLinkFixerPlugin, + prerequisitesLinkFixerPlugin, } from "remark-rehype-plugins" import MDXComponents from "@/components/MDXComponents" import mdxOptions from "../../../mdx-options.mjs" @@ -62,6 +63,13 @@ export default async function ReferencesPage({ params }: PageProps) { checkLinksType: "value", }, ], + [ + prerequisitesLinkFixerPlugin, + { + ...pluginOptions, + checkLinksType: "value", + }, + ], [localLinksRehypePlugin, pluginOptions], ], remarkPlugins: mdxOptions.options.remarkPlugins, diff --git a/www/apps/resources/app/storefront-development/checkout/payment/stripe/page.mdx b/www/apps/resources/app/storefront-development/checkout/payment/stripe/page.mdx index 5dcb14e0000d8..aeaaac27f8798 100644 --- a/www/apps/resources/app/storefront-development/checkout/payment/stripe/page.mdx +++ b/www/apps/resources/app/storefront-development/checkout/payment/stripe/page.mdx @@ -1,4 +1,4 @@ -import { CodeTabs, CodeTab } from "docs-ui" +import { CodeTabs, CodeTab, Prerequisites } from "docs-ui" export const metadata = { title: `Payment with Stripe in React Storefront`, @@ -14,12 +14,16 @@ For other types of storefronts, the steps are similar. However, refer to [Stripe - - -- [Stripe Module Provider](../../../../commerce-modules/payment/payment-provider/stripe/page.mdx) installed and configured in your Medusa application. -- [Stripe publishable API key](https://support.stripe.com/questions/locate-api-keys-in-the-dashboard). - - + ## 1. Install Stripe SDK diff --git a/www/apps/resources/app/storefront-development/products/price/examples/sale-price/page.mdx b/www/apps/resources/app/storefront-development/products/price/examples/sale-price/page.mdx index e75f19bfb57bc..3e62a147c2e33 100644 --- a/www/apps/resources/app/storefront-development/products/price/examples/sale-price/page.mdx +++ b/www/apps/resources/app/storefront-development/products/price/examples/sale-price/page.mdx @@ -50,7 +50,7 @@ Learn more about the `formatPrice` function in [this guide](../show-price/page.m For example, in a React-based storefront: - + The example only passes the `region_id` query parameter for pricing. Learn how to store and retrieve the customer's region in the [Regions guides](../../../../regions/context/page.mdx). diff --git a/www/apps/resources/app/storefront-development/products/price/examples/show-price/page.mdx b/www/apps/resources/app/storefront-development/products/price/examples/show-price/page.mdx index c38606c715cd1..5f502628a6d1f 100644 --- a/www/apps/resources/app/storefront-development/products/price/examples/show-price/page.mdx +++ b/www/apps/resources/app/storefront-development/products/price/examples/show-price/page.mdx @@ -45,7 +45,7 @@ const formatPrice = (amount: number): string => { The following React-based storefront example retrieves the product's price based on the selected variant: - + The example only passes the `region_id` query parameter for pricing. Learn how to store and retrieve the customer's region in the [Regions guides](../../../../regions/context/page.mdx). diff --git a/www/apps/resources/app/storefront-development/products/price/examples/tax-price/page.mdx b/www/apps/resources/app/storefront-development/products/price/examples/tax-price/page.mdx index ab226e4933a81..6d8c946f47890 100644 --- a/www/apps/resources/app/storefront-development/products/price/examples/tax-price/page.mdx +++ b/www/apps/resources/app/storefront-development/products/price/examples/tax-price/page.mdx @@ -82,7 +82,7 @@ Aside from the `calculated_amount_with_tax` property, a variant's `calculated_pr For example, in a React-based storefront: - + The example passes the `region_id` query parameter for pricing. Learn how to store and retrieve the customer's region in the [Regions guides](../../../../regions/context/page.mdx). diff --git a/www/apps/resources/app/storefront-development/products/variants/page.mdx b/www/apps/resources/app/storefront-development/products/variants/page.mdx index 7829caf95400a..7f33c0665426a 100644 --- a/www/apps/resources/app/storefront-development/products/variants/page.mdx +++ b/www/apps/resources/app/storefront-development/products/variants/page.mdx @@ -10,9 +10,7 @@ In this document, you'll learn how to select a product variant to be added to th -{/* TODO add the link once available. */} - -The add-to-cart functionality is explained in the Cart's guides. +The add-to-cart functionality is explained in the [Cart's guides](../../cart/page.mdx). diff --git a/www/apps/resources/next.config.mjs b/www/apps/resources/next.config.mjs index f31b291a9c711..a20f00859d7f0 100644 --- a/www/apps/resources/next.config.mjs +++ b/www/apps/resources/next.config.mjs @@ -2,10 +2,10 @@ import mdx from "@next/mdx" import { brokenLinkCheckerPlugin, localLinksRehypePlugin, + prerequisitesLinkFixerPlugin, typeListLinkFixerPlugin, workflowDiagramLinkFixerPlugin, } from "remark-rehype-plugins" -import { slugChanges } from "./generated/slug-changes.mjs" import mdxPluginOptions from "./mdx-options.mjs" const withMDX = mdx({ @@ -16,7 +16,18 @@ const withMDX = mdx({ [brokenLinkCheckerPlugin], [localLinksRehypePlugin], [typeListLinkFixerPlugin], - [workflowDiagramLinkFixerPlugin], + [ + workflowDiagramLinkFixerPlugin, + { + checkLinksType: "value", + }, + ], + [ + prerequisitesLinkFixerPlugin, + { + checkLinksType: "value", + }, + ], ], remarkPlugins: mdxPluginOptions.options.remarkPlugins, jsx: true, diff --git a/www/packages/docs-ui/src/components/Feedback/index.tsx b/www/packages/docs-ui/src/components/Feedback/index.tsx index d518c3cee0aec..a025adaa032bd 100644 --- a/www/packages/docs-ui/src/components/Feedback/index.tsx +++ b/www/packages/docs-ui/src/components/Feedback/index.tsx @@ -162,7 +162,7 @@ export const Feedback = ({ onClick={handleFeedback} className={clsx( "positive gap-[6px] !justify-start md:!justify-center", - "!px-docs_0.5 !py-docs_0.25" + "!px-docs_0.5 !py-docs_0.25 text-left md:text-center" )} variant="transparent-clear" > @@ -175,7 +175,7 @@ export const Feedback = ({ onClick={handleFeedback} className={clsx( "gap-[6px] !justify-start md:!justify-center", - "!px-docs_0.5 !py-docs_0.25" + "!px-docs_0.5 !py-docs_0.25 text-left md:text-center" )} variant="transparent-clear" > @@ -190,7 +190,8 @@ export const Feedback = ({ className={clsx( "gap-[6px] relative", "!px-docs_0.5 !py-docs_0.25", - "!justify-start md:!justify-center" + "!justify-start md:!justify-center", + "text-left md:text-center" )} > diff --git a/www/packages/docs-ui/src/components/Prerequisites/Item/index.tsx b/www/packages/docs-ui/src/components/Prerequisites/Item/index.tsx index 4b04eba612d92..e60d4fc8e6631 100644 --- a/www/packages/docs-ui/src/components/Prerequisites/Item/index.tsx +++ b/www/packages/docs-ui/src/components/Prerequisites/Item/index.tsx @@ -24,7 +24,7 @@ export const PrerequisiteItem = ({ "bg-medusa-tag-neutral-bg text-medusa-fg-subtle", "px-docs_0.75 py-docs_0.5 w-fit", "flex justify-center items-center", - "hover:bg-medusa-tag-neutral-bg-hover", + link && "hover:bg-medusa-tag-neutral-bg-hover", "rounded-tr-docs_xl rounded-br-docs_xl", position === "alone" && "rounded-docs_xl", position === "top" && "rounded-tl-docs_xl rounded-bl-docs_DEFAULT", @@ -34,7 +34,8 @@ export const PrerequisiteItem = ({ !link && "cursor-text" )} > - {text}↗ + {text} + {link && "↗"} ) } diff --git a/www/packages/remark-rehype-plugins/src/cross-project-links.ts b/www/packages/remark-rehype-plugins/src/cross-project-links.ts index 8811c0b774ad4..b67912f5d0201 100644 --- a/www/packages/remark-rehype-plugins/src/cross-project-links.ts +++ b/www/packages/remark-rehype-plugins/src/cross-project-links.ts @@ -61,6 +61,27 @@ function componentFixer( return } + const fixProperty = (item: ExpressionJsVar) => { + if (!isExpressionJsVarObj(item)) { + return + } + + Object.entries(item).forEach(([key, value]) => { + if ( + (key !== "href" && key !== "link") || + !isExpressionJsVarLiteral(value) + ) { + return + } + + value.original.value = matchAndFixLinks( + value.original.value as string, + options + ) + value.original.raw = JSON.stringify(value.original.value) + }) + } + switch (node.name) { case "CardList": const itemsAttribute = getAttribute(node, "items") @@ -79,24 +100,6 @@ function componentFixer( return } - const fixProperty = (item: ExpressionJsVar) => { - if (!isExpressionJsVarObj(item)) { - return - } - - Object.entries(item).forEach(([key, value]) => { - if (key !== "href" || !isExpressionJsVarLiteral(value)) { - return - } - - value.original.value = matchAndFixLinks( - value.original.value as string, - options - ) - value.original.raw = JSON.stringify(value.original.value) - }) - } - if (Array.isArray(jsVar)) { jsVar.forEach(fixProperty) } else { @@ -112,6 +115,31 @@ function componentFixer( hrefAttribute.value = matchAndFixLinks(hrefAttribute.value, options) + return + case "Prerequisites": + const prerequisitesItemsAttribute = getAttribute(node, "items") + + if ( + !prerequisitesItemsAttribute?.value || + typeof prerequisitesItemsAttribute.value === "string" || + !prerequisitesItemsAttribute.value.data?.estree + ) { + return + } + + const prerequisitesJsVar = estreeToJs( + prerequisitesItemsAttribute.value.data.estree + ) + + if (!prerequisitesJsVar) { + return + } + + if (Array.isArray(prerequisitesJsVar)) { + prerequisitesJsVar.forEach(fixProperty) + } else { + fixProperty(prerequisitesJsVar) + } return } } @@ -126,7 +154,10 @@ export function crossProjectLinksPlugin( tree as UnistTree, ["element", "mdxJsxFlowElement"], (node: UnistNode) => { - const isComponent = node.name === "Card" || node.name === "CardList" + const isComponent = + node.name === "Card" || + node.name === "CardList" || + node.name === "Prerequisites" const isLink = node.tagName === "a" && node.properties?.href if (!isComponent && !isLink) { return diff --git a/www/packages/remark-rehype-plugins/src/index.ts b/www/packages/remark-rehype-plugins/src/index.ts index 8922ce71bc42d..049992a9f58a5 100644 --- a/www/packages/remark-rehype-plugins/src/index.ts +++ b/www/packages/remark-rehype-plugins/src/index.ts @@ -3,6 +3,7 @@ export * from "./cloudinary-img.js" export * from "./cross-project-links.js" export * from "./local-links.js" export * from "./page-number.js" +export * from "./prerequisites-link-fixer.js" export * from "./resolve-admonitions.js" export * from "./type-list-link-fixer.js" export * from "./workflow-diagram-link-fixer.js" diff --git a/www/packages/remark-rehype-plugins/src/prerequisites-link-fixer.ts b/www/packages/remark-rehype-plugins/src/prerequisites-link-fixer.ts new file mode 100644 index 0000000000000..a9a220e564d6d --- /dev/null +++ b/www/packages/remark-rehype-plugins/src/prerequisites-link-fixer.ts @@ -0,0 +1,9 @@ +import { Transformer } from "unified" +import { ComponentLinkFixerOptions } from "./types/index.js" +import { componentLinkFixer } from "./utils/component-link-fixer.js" + +export function prerequisitesLinkFixerPlugin( + options?: ComponentLinkFixerOptions +): Transformer { + return componentLinkFixer("Prerequisites", "items", options) +}