docs: create docs workspace (#5174)

* docs: migrate ui docs to docs universe

* created yarn workspace

* added eslint and tsconfig configurations

* fix eslint configurations

* fixed eslint configurations

* shared tailwind configurations

* added shared ui package

* added more shared components

* migrating more components

* made details components shared

* move InlineCode component

* moved InputText

* moved Loading component

* Moved Modal component

* moved Select components

* Moved Tooltip component

* moved Search components

* moved ColorMode provider

* Moved Notification components and providers

* used icons package

* use UI colors in api-reference

* moved Navbar component

* used Navbar and Search in UI docs

* added Feedback to UI docs

* general enhancements

* fix color mode

* added copy colors file from ui-preset

* added features and enhancements to UI docs

* move Sidebar component and provider

* general fixes and preparations for deployment

* update docusaurus version

* adjusted versions

* fix output directory

* remove rootDirectory property

* fix yarn.lock

* moved code component

* added vale for all docs MD and MDX

* fix tests

* fix vale error

* fix deployment errors

* change ignore commands

* add output directory

* fix docs test

* general fixes

* content fixes

* fix announcement script

* added changeset

* fix vale checks

* added nofilter option

* fix vale error
This commit is contained in:
Shahed Nasser
2023-09-21 20:57:15 +03:00
committed by GitHub
parent 19c5d5ba36
commit fa7c94b4cc
3209 changed files with 32188 additions and 31018 deletions
@@ -0,0 +1,9 @@
{
"position": 7,
"collapsed": false,
"link": null,
"label": "Gift Cards",
"customProps": {
"sidebar_is_group_headline": true
}
}
@@ -0,0 +1,93 @@
---
sidebar_position: 3
description: 'This user guide explains how to manage custom gift cards on the Medusa admin. Learn how to create and edit custom gift cards.'
addHowToData: true
---
import UiIcon from '@site/src/components/UiIcon';
# Manage Custom Gift Cards
In this document, youll learn how to manage custom gift cards, including how to create and update them.
## Create Custom Gift Card
To create a custom gift card:
1. Go to Gift Cards from the sidebar.
2. Click on the Custom Gift Card button at the top right of the History section.
3. In the pop-up that opens:
1. Select in the Region field the region this gift card works in. You can only pick one region. Based on the region you pick, the currency of the gift card will automatically change.
2. Enter in the Amount field the amount of the gift card.
3. If the gift card has an expiry date, you can toggle the "Gift Card has an expiry date?" on. This will show an expiry date and time fields that you can use to set the expiry date and time.
4. Enter in the Email field the email of the customer that will receive this gift card.
5. You can optionally enter in the Personal Message field any message you want the customer to receive with this gift card.
4. Once done, click on "Create and send" button.
The gift card will be created with a random code. The customer will then receive an email with details about their gift card.
:::note
If the customer doesnt receive an email, please get in touch with your technical team to ensure an email service is set up correctly.
:::
---
## View a Custom Gift Cards Details
To view a custom gift cards details:
1. Go to Gift Cards from the sidebar.
2. In the History section, find the custom gift card and click on it.
This opens the gift cards details page.
---
## Edit a Custom Gift Card
### Edit Region and Expiry Date
:::info
Changing the region of a custom gift card will change the currency of the gift card to the new regions currency.
:::
To change the region of a custom gift card:
1. Go to the custom gift cards details page.
2. Click on the <UiIcon lightIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999308/Medusa%20Docs/UI%20Icons/1ordBC6_ssysel.png" darkIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999326/Medusa%20Docs/UI%20Icons/dSwWYBH_stzgoi.png" alt="three dots" /> icon at the top right of the first section.
3. Click on "Edit details" from the dropdown.
4. In the pop-up that opens:
1. Select in the Region field the region you want this gift card to work in.
2. You can optionally edit its expiry date by toggling the "Gift Card has an expiry date?" field on and specify the expiry date and time.
5. Once done, click on the "Save and close" button.
### Update Balance of Custom Gift Card
To update the balance of a custom gift card:
1. Go to the custom gift cards details page.
2. Click on the <UiIcon lightIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999308/Medusa%20Docs/UI%20Icons/1ordBC6_ssysel.png" darkIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999326/Medusa%20Docs/UI%20Icons/dSwWYBH_stzgoi.png" alt="three dots" /> icon at the top right of the first section.
3. Click on “Update balance” from the dropdown.
4. In the pop-up that opens, enter in the Amount field the new balance.
5. Once done, click on the "Save and close" button.
### Change Custom Gift Card Status
You can disable or activate a custom gift card.
:::note
If you disable a gift card, customers cant use it during checkout.
:::
To change a custom gift cards status:
1. Go to the custom gift cards details page.
2. In the first section, you'll find the status of the custom gift card with a <UiIcon lightIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999685/Medusa%20Docs/UI%20Icons/yrTcDO4_tulwph.png" darkIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999685/Medusa%20Docs/UI%20Icons/yrTcDO4_tulwph.png" alt="green" /> icon if its active or a <UiIcon lightIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999700/Medusa%20Docs/UI%20Icons/0lUln3B_arpgmo.png" darkIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999700/Medusa%20Docs/UI%20Icons/0lUln3B_arpgmo.png" alt="grey" /> icon if its disabled.
3. Click on the status, and a dropdown will show to toggle the status. For example, if the status of the gift card is Active, the dropdown will show a Disable status.
4. Choose the status in the dropdown, and the status of the gift card will change.
@@ -0,0 +1,27 @@
---
sidebar_position: 1
description: 'Medusa admin allows merchants to manage gift cards. Merchants can manage main and custom gift cards.'
---
# Gift Cards Overview
In this document, youll learn about how Gift Cards in Medusa work.
## Overview
In Medusa, theres one main gift card. A gift card can have multiple denominations. For example, a Gift Card can have the amounts of $20 and $50, and customers can buy one of these denominations.
---
## Custom Gift Cards
You can also create custom gift cards in Medusa. These cards can be created and sent directly to a customers email.
To view the list of available custom gift cards, from the sidebar go to Gift Cards. You can find all custom gift cards in the History section.
---
## Learn More About Gift Cards
- [Manage Gift Cards](./manage.mdx)
- [Manage Custom Gift Cards](./custom.mdx)
@@ -0,0 +1,223 @@
---
sidebar_position: 2
description: 'This user guide explains how to manage the main gift card on the Medusa admin. Learn how to create, edit, and delete a gift card.'
addHowToData: true
---
import UiIcon from '@site/src/components/UiIcon';
# Manage a Gift Card
In this document, youll learn about managing gift cards, including how to create, edit, and delete them.
## Create Gift Card
:::info
You can only create one gift card per store.
:::
Click on Gift Cards in the sidebar menu. If you dont have any gift cards you should see a prompt to create your first gift card.
To create a Gift Card:
1. Click on Create Gift Card.
2. In the new pop-up that opens:
- Enter a name for the gift card
- You can optionally enter a description and a thumbnail.
- Click on Add Denomination. You must at least add one denomination
- For each denomination, choose the currency and amount.
- If you want to delete a denomination, you can click the <UiIcon lightIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999273/Medusa%20Docs/UI%20Icons/7hztVhj_mj6mxu.png" darkIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999290/Medusa%20Docs/UI%20Icons/1yp4PNt_vzwnhf.png" alt="trash" /> icon.
3. Once youre done, click the "Create & Publish" button.
:::tip
If you want to add more than one currency value for a denomination, you can do that when you [edit a denomination](#edit-a-denomination).
:::
---
## Edit Gift Card
To edit a Gift Card:
1. Go to the Gift Cards page from the sidebar menu.
2. Next to the main gift card, click on the <UiIcon lightIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999308/Medusa%20Docs/UI%20Icons/1ordBC6_ssysel.png" darkIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999326/Medusa%20Docs/UI%20Icons/dSwWYBH_stzgoi.png" alt="three dots" /> icon.
3. Choose Edit from the dropdown.
This opens a page with the Gift Card's details.
### Edit Gift Card Information
To edit the gift card's information:
1. Click on the <UiIcon lightIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999308/Medusa%20Docs/UI%20Icons/1ordBC6_ssysel.png" darkIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999326/Medusa%20Docs/UI%20Icons/dSwWYBH_stzgoi.png" alt="three dots" /> icon at the top right of the first section.
2. Click on "Edit General Information" from the dropdown.
3. In the pop-up that opens, you can edit the gift card's general information such as name or handle. You can also organize the gift card into a product type or product collection, or add product tags. In addition, you can specify if the gift card is Discountable.
4. Once you're done, click on the Save button.
:::info
The handle is the URL used on the storefront to view the Gift Card.
:::
### Add a Denomination
To add a denomination:
1. In the Denominations section, click on the <UiIcon lightIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999308/Medusa%20Docs/UI%20Icons/1ordBC6_ssysel.png" darkIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999326/Medusa%20Docs/UI%20Icons/dSwWYBH_stzgoi.png" alt="three dots" /> icon at the top right.
2. Click on "Add Denomination" from the dropdown.
3. In the pop-up that opens:
- Under default currency, enter the denomination's amount for the default store's currency.
- The "Use value for all currencies?" field allows you to specify whether the amount entered for the default currency should be applied to all currencies. Toggling this one on will hide the "Other currencies" section.
- Under the "Other currencies" section, which is only available if "Use value for all currencies?" is disabled, you can enter the amount for each currency in your store.
- Under the Metadata section, you can attach custom data to the denomination in key-value pairs. This is mainly useful for technical teams and developers.
4. Once youre done, click the "Save and close" button.
### Edit a Denomination
To edit a denomination:
1. In the Denominations section, find the denomination you want to edit.
2. Click on the <UiIcon lightIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999308/Medusa%20Docs/UI%20Icons/1ordBC6_ssysel.png" darkIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999326/Medusa%20Docs/UI%20Icons/dSwWYBH_stzgoi.png" alt="three dots" /> icon at the right side of the denomination's row.
3. Click on Edit from the dropdown.
4. This opens a pop-up to edit the denomination. This form is similar to the [Add Denomination](#add-a-denomination) form. You can edit the amount for the default currency. You can also specify or edit the amount for other currencies if the "Use value for all currencies?" field is disabled, and you can add Metadata fields.
5. Once youre done, click on the "Save and close" button.
### Delete a Denomination
:::warning
If you delete a denomination, customers wont be able to find it in the storefront, purchase it, or use it.
:::
To delete a denomination:
1. In the Denominations section, find the denomination you want to delete.
2. Click on the <UiIcon lightIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999308/Medusa%20Docs/UI%20Icons/1ordBC6_ssysel.png" darkIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999326/Medusa%20Docs/UI%20Icons/dSwWYBH_stzgoi.png" alt="three dots" /> icon at the right side of the denomination's row.
3. Click on Delete from the dropdown.
4. Confirm deleting the denomination by clicking the “Yes, confirm button in the pop-up.
### Change Thumbnail Image
To change the thumbnail image:
1. Go to the Thumbnail section.
2. If you have an existing thumbnail image, you can click the Edit button to change it. Otherwise, you can click the Upload button to add a thumbnail image.
3. In the pop-up that opens, either click on the dotted box to upload an image or drag your image from your computer.
4. Once you're done, click the "Save and close" button.
:::note
If you face any errors or difficulties while uploading an image, please contact your technical support team as this could be an issue in the storage integration used.
:::
### Delete Thumbnail Image
To delete the thumbnail image:
1. Go to the Thumbnail section.
2. Click on the <UiIcon lightIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999273/Medusa%20Docs/UI%20Icons/7hztVhj_mj6mxu.png" darkIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999290/Medusa%20Docs/UI%20Icons/1yp4PNt_vzwnhf.png" alt="trash" /> icon.
3. Click on the button again to confirm the deletion.
### Add Images
:::info
You can add up to ten images for a Gift Card.
:::
To add images to the Gift Card:
1. Go to the Media section.
2. Click on the Edit Media button.
3. In the pop-up that opens, either click on the dotted box to upload an image or drag your image from your computer.
3. Once you're done, click the "Save and close" button.
:::note
If you face any errors or difficulties while uploading an image, please contact your technical support team as this could be an issue in the storage integration used.
:::
### Delete Gift Card Image
:::caution
If you delete an image, you wont be able to restore it.
:::
To delete a gift card image:
1. Go to the Images section.
2. Click on the Edit Media button.
3. In the pop-up, find the image you want to delete from the existing images.
4. Click on the <UiIcon lightIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999308/Medusa%20Docs/UI%20Icons/1ordBC6_ssysel.png" darkIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999326/Medusa%20Docs/UI%20Icons/dSwWYBH_stzgoi.png" alt="three dots" /> icon at the right side of the image.
5. Choose Delete from the dropdown.
3. Once you're done, click the "Save and close" button.
---
## Unpublish Gift Card
:::caution
Unpublishing a gift card prevents customers from seeing the gift card in the storefront, purchasing it, or using it.
:::
### On Gift Cards Page
1. Click on the <UiIcon lightIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999308/Medusa%20Docs/UI%20Icons/1ordBC6_ssysel.png" darkIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999326/Medusa%20Docs/UI%20Icons/dSwWYBH_stzgoi.png" alt="three dots" /> icon at the top right of the main gift card.
2. Choose Unpublish from the dropdown.
### On Edit Gift Card Page
1. In the first section, you'll find the status of the gift card with a <UiIcon lightIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999685/Medusa%20Docs/UI%20Icons/yrTcDO4_tulwph.png" darkIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999685/Medusa%20Docs/UI%20Icons/yrTcDO4_tulwph.png" alt="green" /> icon if its published or a <UiIcon lightIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999700/Medusa%20Docs/UI%20Icons/0lUln3B_arpgmo.png" darkIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999700/Medusa%20Docs/UI%20Icons/0lUln3B_arpgmo.png" alt="grey" /> icon if its a draft.
2. Click on the status, and a dropdown will show to toggle the status. For example, if the status of the gift card is Published, the dropdown will show a Draft status.
3. Choose the status in the dropdown, and the status of the gift card will change.
---
## Publish Gift Card
:::note
Publishing a gift card allows customers to see the gift card on the storefront, purchase it, and use it.
:::
### On Gift Cards Page
1. Click on the <UiIcon lightIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999308/Medusa%20Docs/UI%20Icons/1ordBC6_ssysel.png" darkIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999326/Medusa%20Docs/UI%20Icons/dSwWYBH_stzgoi.png" alt="three dots" /> icon at the top right of the main gift card.
2. Choose Publish.
### On Edit Gift Card Page
1. In the first section, you'll find the status of the gift card with a <UiIcon lightIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999685/Medusa%20Docs/UI%20Icons/yrTcDO4_tulwph.png" darkIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999685/Medusa%20Docs/UI%20Icons/yrTcDO4_tulwph.png" alt="green" /> icon if its published or a <UiIcon lightIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999700/Medusa%20Docs/UI%20Icons/0lUln3B_arpgmo.png" darkIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999700/Medusa%20Docs/UI%20Icons/0lUln3B_arpgmo.png" alt="grey" /> icon if its a draft.
2. Click on the status, and a dropdown will show to toggle the status. For example, if the status of the gift card is Published, the dropdown will show a Draft status.
3. Choose the status in the dropdown, and the status of the gift card will change.
---
## Delete Gift Card
:::warning
If you delete a gift card, you cant restore it or its settings. Customers also cant use the gift card if they had previously purchased it.
:::
To delete a gift card:
1. Go to the Gift Cards page from the sidebar menu.
2. Click on the <UiIcon lightIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999308/Medusa%20Docs/UI%20Icons/1ordBC6_ssysel.png" darkIcon="https://res.cloudinary.com/dza7lstvk/image/upload/v1667999326/Medusa%20Docs/UI%20Icons/dSwWYBH_stzgoi.png" alt="three dots" /> icon next to the main gift card.
3. Choose Delete from the dropdown.
4. Confirm deleting the gift card by clicking the “Yes, delete” button in the pop-up.