shoplazza-cli 0.0.9 → 0.1.8

package/README.md

@@ -10,17 +10,13 @@
 
 Shoplazza CLI is a cross-platform command line tool that you can use to build Shoplazza themes.
 
-## Node Version
-
-use 14.18.2
-
 ## Features
 
 Shoplazza CLI accelerates your theme development process with the following features:
 
 - Safely preview, test, and share changes to themes using unpublish themes
 - Hot reload CSS and section changes, or automatically refresh a page on file change, when previewing a theme.
-- Initialize a new theme using LifeStyle as a starting point.
+- Initialize a new theme using Nova 2023 as a starting point.
 - Use workflow tools like Git to work with a team of theme developers.
 - Upload themes to your store.
 - Watch for local changes and upload them automatically to Shoplazza.
@@ -36,7 +32,7 @@ $ npm install shoplazza-cli -g
 
 Before you start using Shoplazza CLI to develop themes, make sure that you do the following tasks:
 
-- Install [Node.js](https://nodejs.org/en/) (14.14.0 or higher).
+- Install [Node.js](https://nodejs.org/en/) (20.18.0).
 - Install [Git](https://git-scm.com/downloads).
 - Make sure that you have a account with the Manage themes permission for the store that you want to work on, or you're the owner of the store.
 - Note the URL of the store that you want to work on.

package/bin/shoplazza

@@ -8,6 +8,8 @@ const pkg = require('../package.json');
 const report = require('../lib/report');
 require('../lib/tracing');
 
+const { makeCheckoutCommand } = require('../lib/checkout');
+
 const { generateExtension, deployExtension, publishExtension, buildExtension, retry } = require('../lib/app');
 
 Sentry.init({
@@ -29,6 +31,7 @@ updateNotifier({ pkg }).notify({
 program.usage('[command] [options]');
 
 program.command('version').description('Welcome to the Shoplazza CLI').action(require('../lib/commands/version'));
+program.description('Welcome to the Shoplazza CLI').option('-v --version').action(require('../lib/commands/version'));
 
 program
   .command('login')
@@ -122,6 +125,9 @@ app
   .option('-a, --app', 'Retry get and choose your app list.')
   .action(retry);
 
+// checkout cli
+makeCheckoutCommand(program);
+
 program.parse(process.argv);
 !program.args.length && program.help();
 

package/examples/checkout-extension/README.md

@@ -0,0 +1,19 @@
+# Chick Extension
+
+## Getting started
+
+
+## init git
+
+```
+cd `projectDir`
+git init
+```
+
+
+
+
+
+
+
+

package/examples/checkout-extension/extension.config.js

@@ -0,0 +1,4 @@
+module.exports = {
+  token: 'aadasd',
+  store: 'https://perry.stg.myshoplaza.com'
+};

package/examples/checkout-extension/extensions/add-shipping-desc/extension.json

@@ -0,0 +1,10 @@
+{
+  "version": "1.0",
+  "deleteTarget": [],
+  "placeholder": {},
+  "templateName": "checkout",
+  "themeName": "",
+  "extensionId": "",
+  "extensionName": "add-shipping-desc",
+  "extensionDescription": ""
+}

package/examples/checkout-extension/extensions/add-shipping-desc/src/index.js

@@ -0,0 +1,7 @@
+import { extend } from "@shoplazza/extension-ui";
+
+extend({
+  extensionPoint: "Checkout::ShippingLinesTitle::RenderAfter",
+  component: `<p class="mb-4">所有物流方式均受到保护。</p>`,
+});
+

package/examples/checkout-extension/extensions/ext-1/extension.json

@@ -0,0 +1,10 @@
+{
+  "version": "1.0",
+  "deleteTarget": [],
+  "placeholder": {},
+  "templateName": "checkout",
+  "themeName": "",
+  "extensionId": "",
+  "extensionName": "ext-1",
+  "extensionDescription": ""
+}

package/examples/checkout-extension/extensions/ext-1/src/content.html

@@ -0,0 +1,3 @@
+<div>
+  <h2>hello world</h2>
+</div>

package/examples/checkout-extension/extensions/ext-1/src/index.html

@@ -0,0 +1,5 @@
+<div>
+  import './style.html'
+  import './content.html'
+  import './script.html'
+</div>

package/examples/checkout-extension/extensions/ext-1/src/index.js

@@ -0,0 +1,11 @@
+import { extend } from '@shoplazza/extension-ui';
+import index from './index.html';
+
+function App() {
+  return index;
+}
+
+extend({
+  extensionPoint: 'Checkout::Navigate::RenderBefore',
+  component: App()
+});

package/examples/checkout-extension/extensions/ext-1/src/script.html

@@ -0,0 +1,3 @@
+<ljs-script layout="logic" type="application/javascript">
+ <!-- js代码 -->
+</ljs-script>

package/examples/checkout-extension/extensions/ext-1/src/style.html

@@ -0,0 +1,3 @@
+<style>
+
+</style>

package/examples/checkout-extension/extensions/rewrite-navigate/extension.json

@@ -0,0 +1,10 @@
+{
+  "version": "1.0",
+  "deleteTarget": ["navigate"],
+  "placeholder": {},
+  "templateName": "checkout",
+  "themeName": "",
+  "extensionId": "",
+  "extensionName": "rewrite-navigate",
+  "extensionDescription": ""
+}

package/examples/checkout-extension/extensions/rewrite-navigate/src/content.html

@@ -0,0 +1,38 @@
+<spz-render layout="container" manual id="navigate-render">
+  <template>
+    <div class="my-navigate-container">
+      <div
+        onclick="javascript:CheckoutAPI.step.stepNavToInformation()"
+        class="item ${data.currentStep === 'contact_information' ? 'active':''}"
+      >
+        第一页
+      </div>
+      <span>></span>
+      <div
+        onclick="javascript:CheckoutAPI.step.stepNavToShipping()"
+        class="item ${data.currentStep === 'shipping_method' ? 'active':''}"
+      >
+        <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
+          <path
+            d="M4.1248 14.1998C5.33983 14.1998 6.3248 13.2148 6.3248 11.9998C6.3248 10.7848 5.33983 9.7998 4.1248 9.7998C2.90978 9.7998 1.9248 10.7848 1.9248 11.9998C1.9248 13.2148 2.90978 14.1998 4.1248 14.1998ZM12.0998 14.1998C13.3148 14.1998 14.2998 13.2148 14.2998 11.9998C14.2998 10.7848 13.3148 9.7998 12.0998 9.7998C10.8848 9.7998 9.8998 10.7848 9.8998 11.9998C9.8998 13.2148 10.8848 14.1998 12.0998 14.1998Z"
+            fill="currentColor"
+          ></path>
+          <path
+            fill-rule="evenodd"
+            clip-rule="evenodd"
+            d="M0 11.2001V2.4001C0 1.95827 0.358172 1.6001 0.8 1.6001H7.00488C7.4467 1.6001 7.80488 1.95827 7.80488 2.4001V3.5751H7.8125V12.0001H7.18335C7.1861 11.9475 7.1875 11.8944 7.1875 11.8411C7.1875 10.1842 5.84435 8.84106 4.1875 8.84106C2.53065 8.84106 1.1875 10.1842 1.1875 11.8411C1.1875 11.8944 1.1889 11.9475 1.19165 12.0001H0.8C0.358172 12.0001 0 11.6419 0 11.2001ZM8.52496 12.0001H9.09168C9.08888 11.9475 9.08752 11.8944 9.08752 11.8411C9.08752 10.1842 10.4306 8.84106 12.0875 8.84106C13.7443 8.84106 15.0875 10.1842 15.0875 11.8411C15.0875 11.8944 15.0861 11.9475 15.0834 12.0001H15.2C15.6418 12.0001 16 11.6419 16 11.2001V8.11786C16 7.95962 15.953 7.80486 15.865 7.67326L13.3628 3.93047C13.2143 3.70841 12.9649 3.5751 12.6978 3.5751H8.52496V12.0001Z"
+            fill="currentColor"
+          ></path>
+        </svg>
+        第二页
+      </div>
+      <span>></span>
+      <div
+        onclick="javascript:CheckoutAPI.step.stepNavToPayment()"
+        class="item ${data.currentStep === 'payment_method' ? 'active':''}"
+      >
+        第三页
+      </div>
+    </div>
+  </template>
+</spz-render>

package/examples/checkout-extension/extensions/rewrite-navigate/src/index.html

@@ -0,0 +1,5 @@
+<div>
+  import './style.html'
+  import './content.html'
+  import './script.html'
+</div>

package/examples/checkout-extension/extensions/rewrite-navigate/src/index.js

@@ -0,0 +1,12 @@
+import { extend } from '@shoplazza/extension-ui';
+import index from './index.html';
+
+function App() {
+  return index;
+}
+
+extend({
+  extensionPoint: 'Checkout::Navigate::RenderBefore',
+  component: App()
+});
+

package/examples/checkout-extension/extensions/rewrite-navigate/src/script.html

@@ -0,0 +1,26 @@
+
+
+<spz-script layout="logic" type="application/javascript">
+  (() => {
+    const render = () => {
+      const ele = document.getElementById('navigate-render');
+      console.log("ele:", ele);
+      if (ele) {
+        SPZ.whenApiDefined(ele).then((apis) => {
+          console.debug('apis:', apis);
+          apis.render(
+            {
+              currentStep: CheckoutAPI.step.getStep()
+            },
+            true
+          );
+        });
+      }
+    };
+
+    CheckoutAPI.step.onStepChange(() => {
+      render();
+    });
+    render();
+  })();
+</spz-script>

package/examples/checkout-extension/extensions/rewrite-navigate/src/style.html

@@ -0,0 +1,23 @@
+<style>
+  .my-navigate-container {
+    display: flex;
+    margin-top: 20px;
+  }
+  .item:first-child {
+    margin-left: 0;
+  }
+  .item {
+    display: flex;
+    align-items: center;
+    margin: 0 10px;
+    cursor: pointer;
+  }
+  .item svg {
+    margin-right: 5px;
+  }
+
+  .item.active {
+    color: red;
+  }
+
+</style>

package/examples/checkout-extension/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "checkout-extension",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "dependencies": {
+    "fs-extra": "11.1.1",
+    "@shoplazza/extension-ui": "2.0.8"
+  },
+  "devDependencies": {},
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC"
+}

package/lib/app/commands/deploy.js

@@ -129,7 +129,6 @@ const deployOss = async () => {
         spinner.succeed();
         return md5;
       }
-
       spinner.fail();
       console.log(chalk.red(e.message || e));
     }

package/lib/app/constants.js

@@ -1,7 +1,24 @@
-const constans = {
-  PARNTER_URL: 'https://partners.shoplazza.com',
-  LOGIN_BASE_URL: 'https://sso.shoplazza.com',
-  CLIENT_ID: '807525c9-dd77-4f4e-a738-d1e9d02c593d'
-};
+const mode = 'prod';
+let constans;
+
+if (mode === 'dev') {
+  constans = {
+    PARNTER_URL: 'https://partners.dev.shoplazza.com',
+    LOGIN_BASE_URL: 'https://sso.dev.shoplazza.com',
+    CLIENT_ID: 'b630b285-e098-4c51-a7a4-d0240c9fc209'
+  };
+} else if (mode === 'stg') {
+  constans = {
+    PARNTER_URL: 'https://partners.stg.shoplazza.com',
+    LOGIN_BASE_URL: 'https://sso.stg.shoplazza.com',
+    CLIENT_ID: 'b630b285-e098-4c51-a7a4-d0240c9fc209'
+  };
+} else if (mode === 'prod') {
+  constans = {
+    PARNTER_URL: 'https://partners.shoplazza.com',
+    LOGIN_BASE_URL: 'https://sso.shoplazza.com',
+    CLIENT_ID: '807525c9-dd77-4f4e-a738-d1e9d02c593d'
+  };
+}
 
 module.exports = constans;

package/lib/app/login.js

@@ -6,7 +6,6 @@ const { fork } = require('child_process');
 const path = require('path');
 
 const { set, PARTNER_KEYS, get, empty } = require('./db/partner');
-const { getClientId } = require('../utils');
 const { PARNTER_URL, LOGIN_BASE_URL, CLIENT_ID } = require('./constants');
 const { REDIRECT_URI } = require('../config');
 const log = require('../log');

package/lib/auth/index.js

@@ -24,6 +24,7 @@ exports.postAccessToken = async (code, store) => {
       }
     );
     empty();
+
     set({
       access_token: data.access_token,
       session_id: data.session_id
@@ -66,6 +67,7 @@ exports.postExchangeToken = async (storeDomain, options = {}) => {
           }
         }
       );
+
       set({
         store_domain: storeDomain.replace(/^https?:\/\//, ''),
         exchange_token: data.access_token
@@ -90,3 +92,43 @@ exports.postExchangeToken = async (storeDomain, options = {}) => {
     }
   });
 };
+
+exports.postStoreToken = async (storeDomain, options = {}) => {
+  return new Promise(async (resolve, reject) => {
+    try {
+      const { data } = await axios.post(
+        `${getAccountUrl(storeDomain)}/api/accounts/store/session`,
+        {
+          user_id: get('user_id'),
+          domain: storeDomain
+        },
+        {
+          headers: {
+            Cookie: `awesomev2=${get('session_id')}`
+          }
+        }
+      );
+
+      set({
+        store_session: data.encode_session_id
+      });
+      resolve();
+    } catch (err) {
+      reject(err);
+      Sentry.captureException(err);
+      empty();
+      if (!options.ignoreLogError) {
+        if (err?.response?.status === 401) {
+          log.error(chalk.red(`\n✗ You are not authorized to edit themes on ${storeDomain}.`));
+          log.info(
+            chalk.green(
+              'Check if your user is activated, has permission to edit themes at the store, and try to re-login.'
+            )
+          );
+        } else {
+          log.error(chalk.red(`\n✗ ${storeDomain} is not a valid store.`));
+        }
+      }
+    }
+  });
+};

package/lib/checkout/api.js

@@ -0,0 +1,156 @@
+const Axios = require('axios');
+const path = require('path');
+const fs = require('fs');
+const FormData = require('form-data');
+const loading = require('loading-cli');
+const { openAipVersion } = require('./config');
+const { isDebug } = require('./console');
+const { getProjectConfig } = require('./util');
+const chalk = require('chalk');
+
+const FILE_SIGN_URL = '/checkout_extensions/file/sign';
+const CREATE_URL = '/checkout_extensions/create';
+const COMMIT_URL = '/checkout_extensions/commit';
+const LIST_URL = '/checkout_extensions/list';
+const VERSION_LIST_URL = '/checkout_extensions/version/list';
+const DEPLOY_URL = '/checkout_extensions/deploy';
+const UNDEPLOY_URL = '/checkout_extensions/undeploy';
+const PREVIEW_URL = '/checkout_extensions/preview';
+
+let configJson = undefined;
+
+const request = new Axios.create();
+
+request.interceptors.request.use((config) => {
+  if (config.data instanceof FormData) {
+    Object.assign(config.headers, config.data.getHeaders());
+  }
+  if (!configJson) {
+    configJson = getProjectConfig();
+  }
+  config.headers['Access-Token'] = configJson.token;
+  if (!config.url.startsWith('http')) {
+    config.url = path.join(configJson.store, openAipVersion, config.url);
+  }
+
+  if (isDebug()) {
+    console.log(`\n==> ${config.method}: ${config.url}`);
+  }
+  return config;
+});
+
+request.interceptors.response.use(
+  (response) => {
+    if (isDebug()) {
+      console.log(`\n<== ${response.status}: ${response.config.url}`);
+    }
+    return response;
+  },
+  (error) => {
+    if (isDebug()) {
+      console.log(`\n<== error ${error.response.status}: ${error.response.config.url}`);
+    }
+    if (!error.response) {
+      throw chalk.red('Network error, please check your connection.');
+    }
+    if (error.response?.status == 403) {
+      return Promise.reject(new Error('Token permission failure'));
+    }
+    return Promise.reject(error);
+  }
+);
+
+async function upload(path, name) {
+  const form = new FormData();
+  await request(`${FILE_SIGN_URL}?key=${name}`)
+    .then((data) => {
+      return data.data;
+    })
+    .then((data) => {
+      const url = data.write_host;
+      form.append('policy', data.policy);
+      form.append('OSSAccessKeyId', data.access_id);
+      form.append('success_action_status', 200);
+      form.append('signature', data.sign);
+      form.append('x-oss-forbid-overwrite', 'true');
+      form.append('key', name);
+      form.append('file', fs.createReadStream(path));
+      return request.post(`https:${url}`, form, { headers: form.getHeaders() });
+    });
+  loading('succeed upload').succeed();
+}
+
+async function uploadDir(dirPath, files) {
+  await Promise.all(
+    files.map((file) => {
+      return upload(`${dirPath}/${file}`, `chick-extension/${file}`);
+    })
+  );
+}
+
+module.exports = {
+  upload,
+  uploadDir,
+  getExtensionList: async (params) => {
+    const load = loading('Fetch extension list').start();
+    try {
+      const res = await request(`${LIST_URL}`, {
+        params
+      });
+      load.succeed('Successfully fetched the extension list.');
+      return res;
+    } catch (error) {
+      load.fail('Failed to fetch the extension list.');
+      throw error;
+    }
+  },
+  getVersionList: async (params) => {
+    const load = loading('Fetch version list').start();
+    try {
+      const res = await request(`${VERSION_LIST_URL}`, {
+        params
+      });
+      load.succeed('Successfully fetched the version list.');
+      return res;
+    } catch (error) {
+      load.fail('Failed to fetch the version list.');
+      throw error;
+    }
+  },
+  pushExtension: async (data, isFirstPush = false) => {
+    data = {
+      extension: {
+        ...data
+      }
+    };
+    const res = await request({ url: isFirstPush ? CREATE_URL : COMMIT_URL, method: 'POST', data });
+    if (res.data?.status === 3 && res.data?.message === 'INVALID_VERSION') {
+      throw 'During repeated pushes, the version number must be greater than the previous version number.';
+    }
+    return res;
+  },
+  deployExtension: async (data) => {
+    data = {
+      extension: {
+        ...data
+      }
+    };
+    return request({ url: DEPLOY_URL, method: 'POST', data });
+  },
+  undeployExtension: async (data) => {
+    data = {
+      extension: {
+        ...data
+      }
+    };
+    return request({ url: UNDEPLOY_URL, method: 'POST', data });
+  },
+  previewExtension: async (data) => {
+    data = {
+      extension: {
+        ...data
+      }
+    };
+    return request({ url: PREVIEW_URL, method: 'POST', data });
+  }
+};

package/lib/checkout/build/plugin/vite-plugin-add-extension-id.js

@@ -0,0 +1,25 @@
+const parseExtension = (str, name) => {
+  const data = str.split(/(?:import\s*(?:.*?)\s*from\s*(?:.*?)\s*;)/g);
+  const main = data[data.length - 1];
+  const id = JSON.stringify(name);
+  const importString = str.match(/(?:import\s*(?:.*?)\s*from\s*(?:.*?)\s*;)/g)?.join(' ') || '';
+  return `${importString}(function(){const __EXTENSION_ID__=${id};${main}})()`;
+};
+module.exports = {
+  vitePluginAddExtensionId: function () {
+    return {
+      name: 'vitePluginAddExtensionId',
+      enforce: 'pre',
+      apply: 'build',
+      transform: (code, _id) => {
+        if (/.*\/extensions\/.*\/src\/index\.js/.test(_id)) {
+          return parseExtension(code, _id.match(/extensions\/(\S*)\/src\/index\./)[1]);
+        }
+        return code;
+      },
+      buildEnd: () => {
+        console.log('end');
+      }
+    };
+  }
+};