feat: [APA-4638] Init payouts web sdk doc

.gitignore

@@ -24,4 +24,10 @@ yarn-error.log*
 .env.production.local
 
 dist
-.env
+.env
+
+# docs build file
+.history
+docs/.cache
+docs/public
+docs/source/sdk-reference

.gitlab-ci.yml

@@ -1,9 +1,16 @@
+include:
+  - project: 'acquiring/gatsby-theme-airwallex-docs'
+    ref: master
+    file: '/.gitlab-ci-doc.yml'
+
 default:
   image: node:16.14.0
 
 variables:
   KUBERNETES_CPU_REQUEST: 4
   KUBERNETES_CPU_LIMIT: 4
+  DOC_PATH_PREFIX: "payouts-web"
+  GCS_UPLOAD_TAG: "acquiring"
   KUBERNETES_MEMORY_REQUEST: 8Gi
   KUBERNETES_MEMORY_LIMIT: 8Gi
 
@@ -25,6 +32,10 @@ stages:
   - build-and-test
   - create-release
   - sync
+  - build-doc
+  - deploy-doc-staging-bucket
+  - approve
+  - deploy-doc-prod-bucket 
 
 build:
   extends:

docs/.npmrc

@@ -0,0 +1,7 @@
+always-auth=true
+package-lock=false
+registry=https://gitlab.awx.im/api/v4/projects/3003/packages/npm/
+@airwallex:registry=https://gitlab.awx.im/api/v4/projects/3003/packages/npm/
+
+package-lock=false
+//gitlab.awx.im/api/v4/projects/3003/packages/npm/:_authToken=${GITLAB_API_ACCESS_TOKEN}

docs/gatsby-config.js

@@ -0,0 +1,58 @@
+module.exports = {
+  pathPrefix: '/docs/sdk/payouts-web',
+  siteMetadata: {
+    title: 'Airwallex',
+    siteUrl: 'https://www.airwallex.com',
+    description: 'A guide to using airwallex payouts web sdk'
+  },
+  trailingSlash: 'never',
+  plugins: [
+    {
+      resolve: '@airwallex/gatsby-theme-docs',
+      options: {
+        siteName: 'payouts web sdk',
+        pageTitle: 'payouts web sdk',
+        menuTitle: 'payouts web sdk',
+        contentDir: 'source',
+        oneTrust: true,
+        baseUrl: 'https://www.airwallex.com',
+        root: __dirname,
+        subtitle: '',
+        navConfig: {
+          'Payout form': {
+            category: 'Core',
+            url: 'https://staging.airwallex.com/docs/sdk/payout-form',
+            description: 'Learn about something',
+            omitLandingPage: true
+          }
+        },
+        description: 'A guide to using airwallex payouts web sdk',
+        sidebarCategories: {
+          null: [ 'index' ],
+          'sdk reference': {
+            functions: {
+              null: [
+                'sdk-reference/functions/createElement',
+                'sdk-reference/functions/init'
+              ]
+            },
+            interfaces: {
+              null: [
+                'sdk-reference/interfaces/internal_.AirwallexElement',
+                'sdk-reference/interfaces/internal_.BaseOptions',
+                'sdk-reference/interfaces/internal_.HostedTransfer',
+                'sdk-reference/interfaces/internal_.Options'
+              ]
+            },
+            types: {
+              null: [
+                'sdk-reference/types/internal_.Env',
+                'sdk-reference/types/internal_.LangKey'
+              ]
+            }
+          }
+        }
+      }
+    }
+  ]
+}

docs/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "payouts-sdk-doc",
+  "version": "0.0.1",
+  "private": true,
+  "description": "payouts-sdk-doc",
+  "keywords": [
+    "gatsby"
+  ],
+  "scripts": {
+    "develop": "gatsby develop",
+    "start": "gatsby develop",
+    "build": "PREFIX_PATHS=true gatsby build",
+    "serve": "gatsby serve",
+    "clean": "gatsby clean",
+    "typedoc-prepare": "node ./scripts/prepare-md.js",
+    "menu-prepare": "node ./scripts/menu-generation.js",
+    "typecheck": "tsc --noEmit"
+  },
+  "dependencies": {
+    "gatsby": "^5.0.0",
+    "@airwallex/gatsby-theme-docs": "1.8.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "devDependencies": {
+    "@types/node": "^18.11.10",
+    "@types/react": "^18.0.26",
+    "@types/react-dom": "^18.0.9",
+    "typescript": "^4.9.3"
+  }
+}

docs/scripts/menu-generation.js

@@ -0,0 +1,54 @@
+const path = require('path');
+const fs = require('fs');
+const util = require('node:util');
+
+const folder = path.join(__dirname, '..', '/source');
+
+function generateMenuStructure(folderPath) {
+  const menuStructure = {};
+
+  function traverseDirectory(dirPath, currentMenu) {
+    const files = fs.readdirSync(dirPath);
+
+    files.forEach((file) => {
+      const filePath = path.join(dirPath, file);
+      const stats = fs.statSync(filePath);
+
+      if (stats.isDirectory()) {
+        const directoryName = file;
+        const newMenu = {};
+        currentMenu[directoryName] = newMenu;
+        traverseDirectory(filePath, newMenu);
+      } else if (stats.isFile()) {
+        // const fileName = path.parse(file).name;
+        const fileExtension = path.extname(file).toLowerCase();
+
+        if (fileExtension === '.md' || fileExtension === '.mdx') {
+          if (!currentMenu[null]) {
+            currentMenu[null] = [];
+          }
+          const filePathWithoutExtension = path.join(dirPath, path.parse(file).name);
+          const relativePath = path.relative(folderPath, filePathWithoutExtension);
+          currentMenu[null].push(relativePath);
+        }
+      }
+    });
+  }
+
+  traverseDirectory(folderPath, menuStructure);
+  return menuStructure;
+}
+const menuStructure = generateMenuStructure(folder);
+function generateMenu() {
+  const configObj = require('../gatsby-config.js');
+  configObj.plugins.map((plugin) => {
+    if (plugin.resolve === '@airwallex/gatsby-theme-docs') {
+      plugin.options.sidebarCategories = menuStructure;
+    }
+  });
+  fs.writeFileSync('./gatsby-config.js', 'module.exports = ');
+  // Writes the plain object to the file
+  fs.appendFileSync('./gatsby-config.js', util.inspect(configObj, { showHidden: false, depth: null }));
+}
+
+generateMenu();

docs/scripts/prepare-md.js

@@ -0,0 +1,111 @@
+/**
+step1:
+        - get all the files in the file_dir recursively
+        - loop the files and get the file name as file_name
+        - combine a string value and add the first line of the file, the rule is:
+`---
+title: ${file_name} //(split by _ or - and join by space, if camel case, convert to space
+
+
+step2: 
+        - remove the following string pattern '#### Defined in' and the following 2 lines,
+ */
+const path = require('path');
+const fs = require('fs');
+const gatsbyConfig = require('../gatsby-config');
+
+const caseConvert = false;
+const folder = path.join(__dirname, '..', '/source');
+const ingestDataPath = path.join(__dirname, '..', '/source/ingestData.json');
+function processFiles(fileDir) {
+  // Get all files in the directory
+  const files = getAllFiles(fileDir);
+  const ingestData = [];
+  if (fs.existsSync(ingestDataPath)) {
+    fs.unlink(ingestDataPath, (error) => {
+      if (error) {
+        console.error('Error deleting file:', error);
+      } else {
+        console.log('File deleted successfully.');
+      }
+    });
+  }
+
+  // Loop through the files
+  for (const file of files) {
+    // Read the file contents
+    let contents = fs.readFileSync(file, 'utf8');
+    if (!file.includes('.md')) {
+      continue;
+    }
+    // Get the file name and convert it to title case
+    const fileName = path.basename(file, '.md');
+    const title = caseConvert ? toTitleCase(fileName) : fileName;
+
+    // Add the title to the beginning of the file
+    if (!contents.startsWith('---') && title !== 'README') {
+      contents = `---\ntitle: ${title}\ndescription: ${title}\n---\n\n${contents}`;
+    } else if (!contents.startsWith('---') && title === 'README') {
+      contents = `---\ntitle: Technical overview\ndescription: Technical overview\n---\n\n${contents}`;
+    }
+    contents = contents.replace(/#### Defined in\n\n(.*)\.ts\:[0-9]+\n/g, '');
+
+    if (!file.includes('README.md')) {
+      const sections = contents.split(/\n(?=## |### )/);
+      sections.forEach((sectionContent) => {
+        const sectionTitle = sectionContent?.match(/^(#)*(\s)*(.+)/m)?.[3];
+        ingestData.push({
+          sdk_name: gatsbyConfig.plugins[0].options.pageTitle,
+          page_title: toTitleCase(fileName.replace(/.md(x)?/, '')),
+          page_description: contents?.match(/description:\s*(.*?)\n/)?.[1],
+          section_title: sectionTitle,
+          contents: sectionContent,
+          path: `${gatsbyConfig.pathPrefix}${file
+            .replace(/(.)*\/docs\/source/g, '')
+            .replace(/.md(x)?/, '')}${
+            sectionTitle ? `#${toLinkCase(sectionTitle)}` : ''
+          }`,
+        });
+      });
+    }
+
+    // Write the new contents to the file
+    fs.writeFileSync(file, contents, 'utf8');
+    // Generate the data ingestion file
+    fs.writeFileSync(ingestDataPath, JSON.stringify(ingestData));
+  }
+}
+
+function getAllFiles(dir) {
+  let files = [];
+  const items = fs.readdirSync(dir);
+  for (const item of items) {
+    const itemPath = path.join(dir, item);
+    if (fs.statSync(itemPath).isDirectory()) {
+      // Recursively get files from the subdirectory
+      files = files.concat(getAllFiles(itemPath));
+    } else {
+      // Add the file to the list
+      files.push(itemPath);
+    }
+  }
+  return files;
+}
+
+function toTitleCase(str) {
+  return str
+    .replace(/([a-z])([A-Z])/g, '$1 $2') // add space between camel case words
+    .replace(/[-_]/g, ' ') // replace hyphens and underscores with spaces
+    .replace(/\b\w/g, function (match) {
+      return match.toUpperCase();
+    }); // convert first letter of each word to uppercase
+}
+
+function toLinkCase(str) {
+  return str
+    .replace(/[^a-zA-Z0-9\s]/g, '') // remove special character
+    .replace(/(\s)+/g, '-') // replace hyphens and underscores with spaces
+    .toLowerCase();
+}
+
+processFiles(folder, caseConvert);

docs/source/dummy.mdx

@@ -0,0 +1,5 @@
+---
+title: Technical overview 
+description: Airwallex Payouts Web SDK includes the Embedded Payout component and the Embedded Beneficiary component
+---
+# Airwallex Payouts Web SDK