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

docs: change notes across docs based on redesign (#8662)

Browse Source 
Change the prerequisites / soon / other notes based on latest redesign

Depends on #8661
This commit is contained in:
Shahed Nasser
2024-08-23 10:59:48 +03:00
committed by GitHub
parent 320b01f45d
commit b23f0f8188
41 changed files with 291 additions and 220 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
www/apps/book/app/advanced-development/data-models/page.mdx
View File

@@ -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.
<Note type="soon" title="Important">
Data models are in active development and may change.
</Note>

14
www/apps/book/app/advanced-development/data-models/relationships/page.mdx
View File

@@ -1,26 +1,22 @@
import { BetaBadge } from "docs-ui"
export const metadata = {
title: `${pageNumber} Data Model Relationships`,
}
# {metadata.title}
# {metadata.title} <BetaBadge text="Beta" tooltipText="Data model relationships are in active development and may change." />
In this chapter, you’ll learn how to define relationships between data models in your module.
<Note type="soon" title="Important">
Data model relationships are in active development and may change.
</Note>
<Note title="Use data model relationships when" type="success">
- 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.
</Note>
<Note title="Don't use data model relationships if" type="error">
- 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.
</Note>

14
www/apps/book/app/advanced-development/modules/module-links/page.mdx
View File

@@ -1,17 +1,13 @@
import { BetaBadge } from "docs-ui"
export const metadata = {
title: `${pageNumber} Module Link`,
}
# {metadata.title}
# {metadata.title} <BetaBadge text="Beta" tooltipText="Module links are in active development." />
In this chapter, you’ll learn what a module link is.
<Note type="soon" title="In Development">
Module links are in active development.
</Note>
## 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
<Note title="Use module links when" type="success">
- You want to create a relation between data models from different modules.
You want to create a relation between data models from different modules.
</Note>
<Note title="Don't use module links if" type="error">
- 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.
</Note>

10
www/apps/book/app/advanced-development/modules/remote-link/page.mdx
View File

@@ -1,17 +1,13 @@
import { BetaBadge } from "docs-ui"
export const metadata = {
title: `${pageNumber} Remote Link`,
}
# {metadata.title}
# {metadata.title} <BetaBadge text="Beta" tooltipText="Remote Links are in active development." />
In this chapter, you’ll learn what the remote link is and how to use it to manage links.
<Note type="soon" title="In Development">
Remote Links are in active development.
</Note>
## 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.

2
www/apps/book/app/advanced-development/modules/service-factory/page.mdx
View File

@@ -16,7 +16,7 @@ The service factory generates data management methods for your data models, so y
<Note title="Extend the service factory when" type="success">
- Your service provides data-management functionalities of your data models.
Your service provides data-management functionalities of your data models.
</Note>

4
www/apps/book/app/advanced-development/workflows/add-workflow-hook/page.mdx
View File

@@ -8,13 +8,13 @@ In this chapter, you'll learn how to expose a hook in your workflow.
<Note title="Expose workflow hooks when" type="success">
- 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.
</Note>
<Note title="Don't expose workflow hooks if" type="error">
- 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.
</Note>

2
www/apps/book/app/advanced-development/workflows/workflow-hooks/page.mdx
View File

@@ -14,7 +14,7 @@ Medusa exposes hooks in many of its workflows that are used in its API routes. Y
<Note title="Consume workflow hooks when" type="success">
- 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.
</Note>

2
www/apps/book/app/basics/api-routes/page.mdx
View File

@@ -58,6 +58,6 @@ curl http://localhost:9000/store/hello-world
<Note title="Use API routes when" type="success">
- 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.
</Note>

4
www/apps/book/app/basics/data-models/page.mdx
View File

@@ -92,12 +92,12 @@ If ran successfully, the `my_custom` table will be created in the database.
<Note title="Use data models when" type="success">
- You want to store data related to your customization in the database.
You want to store data related to your customization in the database.
</Note>
<Note title="Don't use data models if" type="error">
- 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.
</Note>

2
www/apps/book/app/basics/events-and-subscribers/page.mdx
View File

@@ -68,7 +68,7 @@ The first message indicates that the `product.created` event was emitted, and th
<Note title="Use subscribers when" type="success">
- 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.
</Note>

2
www/apps/book/app/basics/loaders/page.mdx
View File

@@ -71,6 +71,6 @@ Among the messages logged in the terminal, you’ll see the following message:
<Note title="Don't use loaders if" type="error">
- 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.
</Note>

25
www/apps/book/app/storefront-development/nextjs-starter/page.mdx
View File

@@ -1,25 +1,24 @@
import { Prerequisites, BetaBadge } from "docs-ui"
export const metadata = {
title: `${pageNumber} Next.js Starter`,
}
# {metadata.title}
# {metadata.title} <BetaBadge text="Beta" tooltipText="The Next.js Starter is currently in development to fully support Medusa v2." />
In this chapter, you’ll learn how to install and use the Next.js Starter storefront.
<Note type="soon">
The Next.js Starter is currently in development to fully support Medusa v2.
</Note>
## Install Next.js Starter
<Note type="check">
- [Node v18+](https://nodejs.org/en/)
- At least one region in the Medusa application.
</Note>
<Prerequisites items={[
{
text: "Node.js v20+",
link: "https://nodejs.org/en/download"
},
{
text: "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):

13
www/apps/resources/app/architectural-modules/cache/redis/page.mdx vendored
View File

@@ -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
<Note type="check">
- [Redis installed and Redis server running](https://redis.io/docs/getting-started/installation/).
</Note>
<Prerequisites items={[
{
text: "Redis installed and Redis server running",
link: "https://redis.io/docs/getting-started/installation/"
}
]} />
To install Redis Cache Module, run the following command in the directory of your Medusa application:

13
www/apps/resources/app/architectural-modules/event/redis/page.mdx
View File

@@ -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
<Note type="check">
- [Redis installed and Redis server running](https://redis.io/docs/getting-started/installation/).
</Note>
<Prerequisites items={[
{
text: "Redis installed and Redis server running",
link: "https://redis.io/docs/getting-started/installation/"
}
]} />
To install Redis Event Bus Module, run the following command in the directory of your Medusa application:

23
www/apps/resources/app/architectural-modules/notification/sendgrid/page.mdx
View File

@@ -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
<Note type="check">
- [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)
</Note>
<Prerequisites items={[
{
text: "SendGrid account",
link: "https://signup.sendgrid.com"
},
{
text: "Setup SendGrid single sender",
link: "https://docs.sendgrid.com/ui/sending-email/sender-verification"
},
{
text: "SendGrid API Key",
link: "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:

13
www/apps/resources/app/architectural-modules/workflow-engine/redis/page.mdx
View File

@@ -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
<Note type="check">
- [Redis installed and Redis server running](https://redis.io/docs/getting-started/installation/).
</Note>
<Prerequisites items={[
{
text: "Redis installed and Redis server running",
link: "https://redis.io/docs/getting-started/installation/"
}
]} />
To install Redis Workflow Engine Module, run the following command in the directory of your Medusa application:

23
www/apps/resources/app/commerce-modules/payment/payment-provider/stripe/page.mdx
View File

@@ -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
<Note type="check">
- [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.
</Note>
<Prerequisites items={[
{
text: "Stripe account",
link: "https://stripe.com/"
},
{
text: "Stripe Secret API Key",
link: "https://support.stripe.com/questions/locate-api-keys-in-the-dashboard"
},
{
text: "For deployed Medusa applications, a Stripe webhook secret. 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.",
link: "https://docs.stripe.com/webhooks#add-a-webhook-endpoint"
}
]} />
To install the Stripe Module Provider, run the following command in the directory of your Medusa application:

23
www/apps/resources/app/create-medusa-app/page.mdx
View File

@@ -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.
<Note type="check">
- [Node.js v20+](https://nodejs.org/en/download)
- [Git CLI tool](https://git-scm.com/downloads)
- [PostgreSQL](https://www.postgresql.org/download/)
</Note>
<Prerequisites items={[
{
text: "Node.js v20+",
link: "https://nodejs.org/en/download"
},
{
text: "Git CLI tool",
link: "https://git-scm.com/downloads"
},
{
text: "PostgreSQL",
link: "https://www.postgresql.org/download/"
}
]} />
## Usage

18
www/apps/resources/app/deployment/admin/vercel/page.mdx
View File

@@ -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
---
<Note type="check">
- [Medusa application](!docs!)’s codebase hosted on GitHub repository.
- [Deployed Medusa application](../../page.mdx#medusa-application).
</Note>
<Prerequisites items={[
{
text: "Medusa application’s codebase hosted on GitHub repository.",
link: "!docs!"
},
{
text: "Deployed Medusa application.",
link: "../../page.mdx#medusa-application"
},
]} />
## 1. Configure Admin in Medusa

13
www/apps/resources/app/deployment/medusa-application/railway/page.mdx
View File

@@ -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
---
<Note type="check">
- [Medusa application](!docs!) hosted in a GitHub repository.
</Note>
<Prerequisites items={[
{
text: "Medusa application’s codebase hosted on GitHub repository.",
link: "!docs!"
},
]} />
## 1. Configure Medusa Application

18
www/apps/resources/app/deployment/storefront/vercel/page.mdx
View File

@@ -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
---
<Note type="check">
- [Storefront codebase](../../../nextjs-starter/page.mdx) hosted in a GitHub repository.
- [Deployed Medusa application](../../page.mdx#medusa-application) with at least one region.
</Note>
<Prerequisites items={[
{
text: "Storefront codebase hosted in a GitHub repository.",
link: "../../../nextjs-starter/page.mdx"
},
{
text: "Deployed Medusa application with at least one region.",
link: "../../page.mdx#medusa-application"
},
]} />
## 1. Create Vercel Project

22
www/apps/resources/app/medusa-cli/page.mdx
View File

@@ -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.
<Note type="check">
- [Node.js v20+](https://nodejs.org/en/download)
- [Git CLI tool](https://git-scm.com/downloads)
</Note>
<Prerequisites items={[
{
text: "Node.js v20+",
link: "https://nodejs.org/en/download"
},
{
text: "Git CLI tool",
link: "https://git-scm.com/downloads"
},
{
text: "PostgreSQL",
link: "https://www.postgresql.org/download/"
}
]} />
## Usage

36
www/apps/resources/app/nextjs-starter/page.mdx
View File

@@ -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}
<Note type="soon">
Next.js starter is currently in development and doesn't fully support Medusa v2 yet.
</Note>
# {metadata.title} <BetaBadge text="Beta" tooltipText="Next.js starter is currently in development and doesn't fully support Medusa v2 yet." />
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.
<Note type="check">
- [Node.js v18+](https://nodejs.org/en/download)
- At least one region in the Medusa application.
</Note>
<Prerequisites items={[
{
text: "Node.js v20+",
link: "https://nodejs.org/en/download"
},
{
text: "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
<Note type="check">
- [Stripe module provider](../commerce-modules/payment/payment-provider/stripe/page.mdx) installed in the Medusa application.
</Note>
<Prerequisites items={[
{
text: "Stripe module provider installed in the Medusa application.",
link: "../commerce-modules/payment/payment-provider/stripe/page.mdx"
},
]} />
In your Next.js Starter project, set the following environment variables for the Stripe integration:

15
www/apps/resources/app/recipes/b2b/page.mdx
View File

@@ -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} <BetaBadge text="Soon" tooltipText="This recipe is a work in progress, as some features are not ready yet in Medusa V2." />
This recipe provides the general steps to implement a B2B store with Medusa.
<Note type="soon" title="In Development">
This recipe is a work in progress, as some features are not ready yet in Medusa V2.
</Note>
## 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.
<Note type="soon">
Module Relationships is coming soon.
</Note>
<CardList items={[
{
href: "!docs!/basics/modules-and-services",

10
www/apps/resources/app/recipes/commerce-automation/page.mdx
View File

@@ -1,20 +1,14 @@
import { AcademicCapSolid, BoltSolid } from "@medusajs/icons"
import { LearningPath } from "docs-ui"
import { LearningPath, BetaBadge } from "docs-ui"
export const metadata = {
title: `Commerce Automation Recipe`,
}
# {metadata.title}
# {metadata.title} <BetaBadge text="Soon" tooltipText="This recipe is a work in progress, as some features are not ready yet in Medusa V2." />
This recipe provides the general steps to implement a B2B store with Medusa.
<Note type="soon" title="In Development">
This recipe is a work in progress, as some features are not ready yet in Medusa V2.
</Note>
## 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.

12
www/apps/resources/app/recipes/digital-products/examples/standard/page.mdx
View File

@@ -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
---
<Note type="check">
- [A new Medusa application installed.](!docs!#get-started)
</Note>
<Prerequisites items={[
{
text: "A new Medusa application installed.",
link: "!docs!#get-started"
},
]} />
## Step 1: Create the Digital Product Module

12
www/apps/resources/app/recipes/marketplace/examples/vendors/page.mdx vendored
View File

@@ -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
---
<Note type="check">
- [A new Medusa application installed.](!docs!#get-started)
</Note>
<Prerequisites items={[
{
text: "A new Medusa application installed.",
link: "!docs!#get-started"
},
]} />
## Step 1: Create Marketplace Module

6
www/apps/resources/app/recipes/personalized-products/page.mdx
View File

@@ -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.
<Note type="soon">
The `order.placed` event is currently not emitted.
</Note>
<CardList items={[
{
href: "!docs!/basics/api-routes",

12
www/apps/resources/app/recipes/subscriptions/examples/standard/page.mdx
View File

@@ -1,4 +1,5 @@
import { Github, PlaySolid } from "@medusajs/icons"
import { Prerequisites } from "docs-ui"
export const metadata = {
title: `Subscriptions Recipe`,
@@ -41,11 +42,12 @@ By following this example, you’ll have a subscription commerce store with the
---
<Note type="check">
- [A new Medusa application installed.](!docs!#get-started)
</Note>
<Prerequisites items={[
{
text: "A new Medusa application installed.",
link: "!docs!#get-started"
},
]} />
## Step 1: Create Subscription Module

8
www/apps/resources/app/references/[...slug]/page.tsx
View File

@@ -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,

18
www/apps/resources/app/storefront-development/checkout/payment/stripe/page.mdx
View File

@@ -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
</Note>
<Note type="check">
- [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).
</Note>
<Prerequisites items={[
{
text: "Stripe Module Provider installed and configured in your Medusa application.",
link: "../../../../commerce-modules/payment/payment-provider/stripe/page.mdx"
},
{
text: "Stripe publishable API key.",
link: "https://support.stripe.com/questions/locate-api-keys-in-the-dashboard"
},
]} />
## 1. Install Stripe SDK

2
www/apps/resources/app/storefront-development/products/price/examples/sale-price/page.mdx
View File

@@ -50,7 +50,7 @@ Learn more about the `formatPrice` function in [this guide](../show-price/page.m
For example, in a React-based storefront:
<Note type="check">
<Note>
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).

2
www/apps/resources/app/storefront-development/products/price/examples/show-price/page.mdx
View File

@@ -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:
<Note type="check">
<Note>
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).

2
www/apps/resources/app/storefront-development/products/price/examples/tax-price/page.mdx
View File

@@ -82,7 +82,7 @@ Aside from the `calculated_amount_with_tax` property, a variant's `calculated_pr
For example, in a React-based storefront:
<Note type="check">
<Note>
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).

4
www/apps/resources/app/storefront-development/products/variants/page.mdx
View File

@@ -10,9 +10,7 @@ In this document, you'll learn how to select a product variant to be added to th
<Note>
{/* 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).
</Note>

15
www/apps/resources/next.config.mjs
View File

@@ -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,

7
www/packages/docs-ui/src/components/Feedback/index.tsx
View File

@@ -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"
)}
>
<ChatBubbleLeftRight className="text-medusa-fg-subtle" />

5
www/packages/docs-ui/src/components/Prerequisites/Item/index.tsx
View File

@@ -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 && "↗"}
</Link>
)
}

69
www/packages/remark-rehype-plugins/src/cross-project-links.ts
View File

@@ -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

1
www/packages/remark-rehype-plugins/src/index.ts
View File

@@ -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"

9
www/packages/remark-rehype-plugins/src/prerequisites-link-fixer.ts Normal file
View File

@@ -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)
}