docs: update docusaurus to v3 (#5625)

* update dependencies

* update onboarding mdx

* fixes for mdx issues

* fixes for mdx compatibility

* resolve mdx errors

* fixes in reference

* fix check errors

* revert change in vale action

* fix node version in action

* fix summary in markdown
This commit is contained in:
Shahed Nasser authored and GitHub committed 2023-11-13 20:11:50 +02:00
1 parent cedab58339
commit c6dff873de
2265 files changed
+46163 -47195

No files matched your search

@@ -61,72 +61,72 @@ Customers should be able to view gift cards before they make the purchase. Gift
You can retrieve the gift card product using the [List Products API Route](https://docs.medusajs.com/api/store#products_getproducts), but passing it the `is_giftcard` query parameter:
<Tabs groupId="request-type" isCodeTabs={true}>
<TabItem value="client" label="Medusa JS Client" default>
<TabItem value="client" label="Medusa JS Client" default>
```ts
medusa.products.list({
is_giftcard: true,
})
.then(({ products, limit, offset, count }) => {
if (products.length) {
// gift card products exist
} else {
// no gift card products are created
}
})
```
```ts
medusa.products.list({
is_giftcard: true,
})
.then(({ products, limit, offset, count }) => {
if (products.length) {
// gift card products exist
} else {
// no gift card products are created
}
})
```
</TabItem>
<TabItem value="medusa-react" label="Medusa React">
</TabItem>
<TabItem value="medusa-react" label="Medusa React">
```tsx
import { Product } from "@medusajs/medusa"
import { useProducts } from "medusa-react"
```tsx
import { Product } from "@medusajs/medusa"
import { useProducts } from "medusa-react"
const GiftCards = () => {
const { products, isLoading } = useProducts({
is_giftcard: true,
})
const GiftCards = () => {
const { products, isLoading } = useProducts({
is_giftcard: true,
})
return (
<div>
{isLoading && <span>Loading...</span>}
{products && products.length > 0 && (
<ul>
{products.map((product: Product) => (
<li key={product.id}>{product.title}</li>
))}
</ul>
)}
{products && !products.length && (
<span>No Gift Cards</span>
)}
</div>
)
}
return (
<div>
{isLoading && <span>Loading...</span>}
{products && products.length > 0 && (
<ul>
{products.map((product: Product) => (
<li key={product.id}>{product.title}</li>
))}
</ul>
)}
{products && !products.length && (
<span>No Gift Cards</span>
)}
</div>
)
}
export default GiftCards
```
export default GiftCards
```
</TabItem>
<TabItem value="fetch" label="Fetch API">
</TabItem>
<TabItem value="fetch" label="Fetch API">
```ts
fetch(`<BACKEND_URL>/store/products?is_giftcard=true`, {
credentials: "include",
})
.then((response) => response.json())
.then(({ products, limit, offset, count }) => {
if (products.length) {
// gift card products exist
} else {
// no gift card products are created
}
})
```
```ts
fetch(`<BACKEND_URL>/store/products?is_giftcard=true`, {
credentials: "include",
})
.then((response) => response.json())
.then(({ products, limit, offset, count }) => {
if (products.length) {
// gift card products exist
} else {
// no gift card products are created
}
})
```
</TabItem>
</TabItem>
</Tabs>
The request does not require any parameters. You can pass query parameters to filter the returned products.
@@ -150,56 +150,56 @@ After the customer purchases the gift card, they’ll receive a code to redeem t
You can retrieve the details of a gift card by sending a request to the [Get Gift Card by Code API Route](https://docs.medusajs.com/api/store#gift-cards_getgiftcardscode):
<Tabs groupId="request-type" isCodeTabs={true}>
<TabItem value="client" label="Medusa JS Client" default>
<TabItem value="client" label="Medusa JS Client" default>
```ts
medusa.giftCards.retrieve(code)
.then(({ gift_card }) => {
console.log(gift_card.id)
})
.catch((e) => {
// gift card doesn't exist or is disabled
})
```
```ts
medusa.giftCards.retrieve(code)
.then(({ gift_card }) => {
console.log(gift_card.id)
})
.catch((e) => {
// gift card doesn't exist or is disabled
})
```
</TabItem>
<TabItem value="medusa-react" label="Medusa React">
</TabItem>
<TabItem value="medusa-react" label="Medusa React">
```tsx
import { useGiftCard } from "medusa-react"
```tsx
import { useGiftCard } from "medusa-react"
const GiftCard = () => {
const { gift_card, isLoading, isError } = useGiftCard("code")
const GiftCard = () => {
const { gift_card, isLoading, isError } = useGiftCard("code")
return (
<div>
{isLoading && <span>Loading...</span>}
{gift_card && <span>{gift_card.value}</span>}
{isError && <span>Gift Card does not exist</span>}
</div>
)
}
return (
<div>
{isLoading && <span>Loading...</span>}
{gift_card && <span>{gift_card.value}</span>}
{isError && <span>Gift Card does not exist</span>}
</div>
)
}
export default GiftCard
```
export default GiftCard
```
</TabItem>
<TabItem value="fetch" label="Fetch API">
</TabItem>
<TabItem value="fetch" label="Fetch API">
```ts
fetch(`<BACKEND_URL>/store/gift-cards/${code}`, {
credentials: "include",
})
.then((response) => response.json())
.then(({ gift_card }) => {
console.log(gift_card.id)
})
.catch((e) => {
// gift card doesn't exist or is disabled
})
```
```ts
fetch(`<BACKEND_URL>/store/gift-cards/${code}`, {
credentials: "include",
})
.then((response) => response.json())
.then(({ gift_card }) => {
console.log(gift_card.id)
})
.catch((e) => {
// gift card doesn't exist or is disabled
})
```
</TabItem>
</TabItem>
</Tabs>
This request requires the code of the gift card passed as a path parameter.
@@ -225,79 +225,79 @@ A customer can redeem more than one gift card during checkout. The cart’s tota
You can redeem a gift card during checkout by sending a request to the [Update Cart API Route](https://docs.medusajs.com/api/store#carts_postcartscart):
<Tabs groupId="request-type" isCodeTabs={true}>
<TabItem value="client" label="Medusa JS Client" default>
<TabItem value="client" label="Medusa JS Client" default>
```ts
medusa.carts.update(cartId, {
gift_cards: [
{
code,
},
],
})
.then(({ cart }) => {
console.log(cart.gift_cards.length)
})
.catch((e) => {
// gift card doesn't exist or is disabled
})
```
</TabItem>
<TabItem value="medusa-react" label="Medusa React">
```tsx
import { useCart } from "medusa-react"
const Cart = () => {
// ...
const { updateCart } = useCart()
const setGiftCard = (code: string) => {
updateCart.mutate({
```ts
medusa.carts.update(cartId, {
gift_cards: [
{
code,
},
],
})
}
.then(({ cart }) => {
console.log(cart.gift_cards.length)
})
.catch((e) => {
// gift card doesn't exist or is disabled
})
```
// ...
}
</TabItem>
<TabItem value="medusa-react" label="Medusa React">
export default Cart
```
```tsx
import { useCart } from "medusa-react"
</TabItem>
<TabItem value="fetch" label="Fetch API">
const Cart = () => {
// ...
```ts
fetch(`<BACKEND_URL>/store/cart/${cartId}`, {
method: "POST",
credentials: "include",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
gift_cards: [
{
code,
const { updateCart } = useCart()
const setGiftCard = (code: string) => {
updateCart.mutate({
gift_cards: [
{
code,
},
],
})
}
// ...
}
export default Cart
```
</TabItem>
<TabItem value="fetch" label="Fetch API">
```ts
fetch(`<BACKEND_URL>/store/cart/${cartId}`, {
method: "POST",
credentials: "include",
headers: {
"Content-Type": "application/json",
},
],
}),
})
.then((response) => response.json())
.then(({ cart }) => {
console.log(cart.gift_cards.length)
})
.catch((e) => {
// gift card doesn't exist or is disabled
})
```
body: JSON.stringify({
gift_cards: [
{
code,
},
],
}),
})
.then((response) => response.json())
.then(({ cart }) => {
console.log(cart.gift_cards.length)
})
.catch((e) => {
// gift card doesn't exist or is disabled
})
```
</TabItem>
</TabItem>
</Tabs>
This request requires the ID of the cart as a path parameter. It allows passing any cart property you want to update in its body parameters.