Merge pull request #2704 from build-5/how-tos

Add How-tos
buildcore-io · Dec 20, 2023 · 5a04f4d · 5a04f4d
2 parents 132ff8b + fd721ed
commit 5a04f4d
Show file tree

Hide file tree

Showing 18 changed files with 243 additions and 39 deletions.
diff --git a/docs/docs/getting_started.md → docs/docs/getting_started.mdx b/docs/docs/getting_started.md → docs/docs/getting_started.mdx
@@ -10,7 +10,18 @@ keywords:
 import Tabs from '@theme/Tabs';
 import TabItem from '@theme/TabItem';
 
-Build.5 API provides various ways to interact with our platform. Of course, you can read IOTA/Shimmer directly or use our friendly APIs to simplify access.
+Build.5 API provides various ways to interact with our platform. Of course, you can read IOTA/Shimmer directly or use our friendly APIs or the Build.5 SDK directly to simplify access.
+
+## SDK
+
+The recommend way to interact with Build.5 is to use our library. Just add it to your project and get startet:
+
+```bash npm2yarn
+npm i @build-5/sdk
+npm i @build-5/interfaces
+```
+
+## API
 
 There are REST APIs to simplify read and write operations. See following:
 - [GET](search-get) - Use this APIs to get any data from Build.5

diff --git a/docs/docs/products/dao_management/member/how-to/create-member.md b/docs/docs/products/dao_management/member/how-to/create-member.md
@@ -0,0 +1,8 @@
+---
+title: Create Member
+---
+
+To create a member, you need to call `createMember`.
+
+```tsx file=../../../../../../packages/sdk/examples/member/create.ts#L6-L12
+```
diff --git a/docs/docs/products/dao_management/member/how-to/update-member.md b/docs/docs/products/dao_management/member/how-to/update-member.md
@@ -0,0 +1,13 @@
+---
+title: Update Member
+---
+
+To update a member, we first get the member with their ID, which, in this case, is the member's address.
+
+```tsx file=../../../../../../packages/sdk/examples/member/update.ts#L8-L12
+```
+
+With the member, we can create a signature and update, for example, the name by calling `update` on `dataset(Dataset.MEMBER)` and passing the new name in the body.
+
+```tsx file=../../../../../../packages/sdk/examples/member/update.ts#L16-L29
+```
diff --git a/docs/docs/products/dao_management/member/overview.md b/docs/docs/products/dao_management/member/overview.md
@@ -0,0 +1,6 @@
+---
+title: Member Management
+---
+
+Spaces can have multiple members. Members can be added and removed from a space. Members can be assigned different roles.
+The following How-To's will help you manage your members.
diff --git a/docs/docs/products/dao_management/overview.md b/docs/docs/products/dao_management/overview.md
@@ -2,9 +2,7 @@
 title: Overview
 ---
 
-import NotStarted from '../../_admonitions/_not-started-yet.md';
-
-<NotStarted/>
+Build.5 provides a set of tools to manage DAOs. Part of that is creating spaces, members, changing roles, etc.
 
 __Features__: 
 - Space Management

diff --git a/docs/docs/products/dao_management/space/how-to/create-space.md b/docs/docs/products/dao_management/space/how-to/create-space.md
@@ -0,0 +1,8 @@
+---
+title: Create Space
+---
+
+To create a space, you must call `create` on `dataset(Dataset.SPACE)`. In the body, you can specify the name of the space.
+
+```tsx file=../../../../../../packages/sdk/examples/create_space.ts#L11-L26
+```
diff --git a/docs/docs/products/dao_management/space/overview.md b/docs/docs/products/dao_management/space/overview.md
@@ -0,0 +1,5 @@
+---
+title: Space Management
+---
+
+Spaces are a way to organize members, tokens, and more around a specific topic/project. Spaces can create their tokens, NFT collections, staking events, and many other things. Spaces can have different types of members, each with additional permissions.
diff --git a/docs/docs/products/member/overview.md b/docs/docs/products/member/overview.md
diff --git a/docs/docs/products/nft/how-to/create-nft-collection.md b/docs/docs/products/nft/how-to/create-nft-collection.md
@@ -0,0 +1,18 @@
+---
+title: Create NFT Collection
+---
+
+To create a NFT collection, you must call `create` on `dataset(Dataset.NFT_COLLECTION)`. In the body, you can specify the collection's name, the symbol, the base URI, and more.
+
+```tsx file=../../../../../packages/sdk/examples/create_nft_collection.ts#L19-L44
+```
+
+After that, you should create a list of objects that describe the single NFTs, their name, description and image, price, and so on.
+
+```tsx file=../../../../../packages/sdk/examples/create_nft_collection.ts#L49-L65
+```
+
+As a last step, you can mint the batch of NFTs by calling `createBatch` on `dataset(Dataset.NFT)` and passing the list of NFTs in the body.
+
+```tsx file=../../../../../packages/sdk/examples/create_nft_collection.ts#L67-L78
+```
diff --git a/docs/docs/products/nft/overview.md b/docs/docs/products/nft/overview.md
@@ -2,10 +2,6 @@
 title: Overview
 ---
 
-import NotStarted from '../../_admonitions/_not-started-yet.md';
-
-<NotStarted/>
-
 NFT & NFT collections based on [IRC27](https://github.com/iotaledger/tips/blob/main/tips/TIP-0027/tip-0027.md).
 
 __Features__:

diff --git a/docs/docs/products/project/how-to/create-project.mdx b/docs/docs/products/project/how-to/create-project.mdx
@@ -0,0 +1,18 @@
+---
+title: Create Project
+description: How to create a project
+keywords:
+  - project
+  - client
+---
+
+Before creating NFT collections, tokens, and more, the first thing to do should be to create a project with the `createProject` function.
+
+:::info
+
+In the following examples, we will connect to the soonaverse project (its API keys are part of the SDK for ease of use). You can also create your own project to give you your API key.
+
+:::
+
+```tsx file=../../../../../packages/sdk/examples/create_project.ts#L11-L24
+```
diff --git a/docs/docs/products/project/overview.md b/docs/docs/products/project/overview.md
@@ -2,9 +2,7 @@
 title: Overview
 ---
 
-import NotStarted from '../../_admonitions/_not-started-yet.md';
-
-<NotStarted/>
+Projects are your starting point for the Build.5 platform. You need a project to create spaces, modify your billing information and more.
 
 __Features__: 
 - Create Project

diff --git a/docs/docs/products/stamp/how-to/create-stamp.md b/docs/docs/products/stamp/how-to/create-stamp.md
@@ -0,0 +1,8 @@
+---
+title: Create a Stamp
+---
+
+To create a stamp, you must call `create` on `dataset(Dataset.STAMP)`. In the body, you can specify the file you want to stamp.
+
+```tsx file=../../../../../packages/sdk/examples/create_stamp.ts#L13-L27
+```
diff --git a/docs/docs/products/stamp/overview.md b/docs/docs/products/stamp/overview.md
@@ -2,9 +2,7 @@
 title: Stamp API
 ---
 
-import NotStarted from '../../_admonitions/_not-started-yet.md';
-
-<NotStarted/>
+The Stamp API allows you to easily upload a file to IPFS and stamp it on the IOTA tangle by creating an NFT.
 
 __Features__: 
 - File Stamp
diff --git a/docs/docusaurus.config.js b/docs/docusaurus.config.js
@@ -91,7 +91,13 @@ const config = {
       'classic',
       /** @type {import('@docusaurus/preset-classic').Options} */
       ({
-        docs: { sidebarPath: require.resolve('./sidebars.js') },
+        docs: { 
+          sidebarPath: require.resolve('./sidebars.js'),
+          remarkPlugins: [
+            [require('@docusaurus/remark-plugin-npm2yarn'), {sync: true}],
+            require('remark-code-import'),
+          ],
+        },
         blog: false,
         pages: {
           path: 'src/pages',
@@ -102,6 +108,7 @@ const config = {
       }),
     ],
   ],
+  themes: ['@saucelabs/theme-github-codeblock'],
 
   themeConfig:
     /** @type {import('@docusaurus/preset-classic').ThemeConfig} */
@@ -173,6 +180,7 @@ const config = {
       prism: {
         theme: lightCodeTheme,
         darkTheme: darkCodeTheme,
+        dditionalLanguages: ['ts'],
       },
     }),
 };

diff --git a/docs/package.json b/docs/package.json
@@ -20,12 +20,16 @@
     "@docusaurus/plugin-content-docs": "^2.4.1",
     "@docusaurus/plugin-content-pages": "^2.4.1",
     "@docusaurus/preset-classic": "2.4.1",
+    "@docusaurus/remark-plugin-npm2yarn": "^2.4.1",
     "@mdx-js/react": "^1.6.22",
+    "@saucelabs/theme-github-codeblock": "^0.2.3",
     "clsx": "^1.2.1",
     "prism-react-renderer": "^1.3.5",
+    "raw-loader": "^4.0.2",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "react-router-dom": "5.3.4"
+    "react-router-dom": "5.3.4",
+    "remark-code-import": "0.4.0"
   },
   "devDependencies": {
     "@docusaurus/module-type-aliases": "2.4.1",

diff --git a/docs/sidebars.js b/docs/sidebars.js
@@ -30,26 +30,74 @@ const sidebars = {
       collapsed: false,
       items: [
         {
-          'DAO Management API': ['products/dao_management/overview'],
+          'Project API': [
+            'products/project/overview',
+            {
+              'How To': [
+                'products/project/how-to/create-project',
+              ],
+            }
+          ],
+        },
+        {
+          'DAO Management API': [
+            'products/dao_management/overview',
+            {
+              type: 'category',
+              label: 'Space',
+              link: {type: 'doc', id: 'products/dao_management/space/overview'},
+              items: [
+                {
+                  'How To': [
+                    'products/dao_management/space/how-to/create-space',
+                  ],
+                }
+              ],
+            },
+            {
+              type: 'category',
+              label: 'Member',
+              link: {type: 'doc', id: 'products/dao_management/member/overview'},
+              items: [
+                {
+                  'How To': [
+                    'products/dao_management/member/how-to/create-member',
+                    'products/dao_management/member/how-to/update-member',
+                  ],
+                }
+              ],
+            },
+          ],
+        },
+        {
+          'NFT API': [
+            'products/nft/overview',
+            {
+              'How To': [
+                'products/nft/how-to/create-nft-collection',
+              ],
+            }
+          ],
+        },
+        {
+          'Stamp API': [
+            'products/stamp/overview',
+            {
+              'How To': [
+                'products/stamp/how-to/create-stamp',
+              ],
+            }
+          ],
         },
         {
           'Digital Twin NFT': ['products/digital_twin_nft/overview'],
         },
-        {
-          'NFT API': ['products/nft/overview'],
-        },
         {
           'NFT Trading API': ['products/nft_trading/overview'],
         },
         {
           'NFT Staking API': ['products/nft_staking/overview'],
         },
-        {
-          'Member API': ['products/member/overview'],
-        },
-        {
-          'Project API': ['products/project/overview'],
-        },
         {
           'Proposal API': ['products/proposal/overview'],
         },