@squiz/dxp-cli-next 5.17.1-develop.1 → 5.18.0-develop.2

package/lib/cmp/deploy.js

@@ -50,9 +50,6 @@ const deployCommand = new commander_1.Command()
     .argument('<source>', 'folder containing a manifest.json file')
     .addOption(new commander_1.Option('-cu, --component-service-url <string>', 'Override the component service url from login').env('COMPONENT_SERVICE_URL'))
     .addOption(new commander_1.Option('-t, --tenant <string>', 'Tenant ID to deploy to. If not provided will use configured tenant from login'))
-    .addOption(new commander_1.Option('--type <type>', 'Type of component to deploy')
-    .choices(['edge', 'sandbox'])
-    .default('sandbox'))
     .action((source, options) => __awaiter(void 0, void 0, void 0, function* () {
     var _a, _b;
     if (process.env.COMPONENT_SERVICE_URL !== undefined) {
@@ -67,19 +64,19 @@ const deployCommand = new commander_1.Command()
         console.warn(cli_color_1.default.yellow('WARN: Component service URL no longer requires /v1/ suffix'));
     }
     try {
+        const def = yield definitions_1.ComponentDefinition.load(source);
+        if (!def) {
+            throw new Error('Invalid definition');
+        }
         const componentServiceUrl = ((_b = options.componentServiceUrl) === null || _b === void 0 ? void 0 : _b.replace(/v1\/?$/, '')) ||
             (yield buildComponentServiceUrl(options.tenant));
-        if (options.type === 'sandbox') {
+        if (def.type === 'server') {
             return yield (0, component_cli_lib_1.uploadComponentFolder)(apiService.client, componentServiceUrl, source);
         }
-        if (options.type === 'edge') {
+        if (def.type === 'edge') {
             if (process.env.FEATURE_EDGE_COMPONENTS !== 'true') {
                 throw new Error('Component type "edge" is still in development. Run with environment variable "FEATURE_EDGE_COMPONENTS=true" to enable');
             }
-            const def = yield definitions_1.ComponentDefinition.load(source);
-            if (!def) {
-                throw new Error('Invalid definition');
-            }
             const dxpCacheDirPath = path.resolve(source, '.dxp');
             yield fs.mkdir(dxpCacheDirPath, { recursive: true });
             const outputDir = yield fs.mkdtemp(path.resolve(dxpCacheDirPath, 'cmp-'));

package/lib/cmp/dev-mode-ui.d.ts

@@ -0,0 +1,4 @@
+import { Command } from 'commander';
+export declare const buildDevModeUICommand: () => Command;
+declare const devModeUICommand: Command;
+export default devModeUICommand;

package/lib/cmp/dev-mode-ui.js

@@ -0,0 +1,51 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.buildDevModeUICommand = void 0;
+const local_component_dev_ui_1 = require("@squiz/local-component-dev-ui");
+const commander_1 = require("commander");
+const MIN_PORT = 1024;
+const MAX_PORT = 65535;
+const buildDevModeUICommand = () => new commander_1.Command()
+    .name('dev-ui')
+    .description('A local component UI for developing new components')
+    .addHelpText('after', `
+
+  The logs are currently \`bunyan\` formatted and should be piped into the bunyan cli:
+      $ dxp-next cmp dev-ui <source> | npx bunyan
+  `)
+    .argument('<source>', 'folder containing the template files in development')
+    .addOption(new commander_1.Option('-p, --port <number>', 'Define port the webserver runs on')
+    .default(3000)
+    .argParser(v => {
+    const parsedPort = Number(v);
+    if (isNaN(parsedPort) ||
+        MIN_PORT > parsedPort ||
+        parsedPort > MAX_PORT) {
+        throw new commander_1.InvalidArgumentError(`Port must be a number between ${MIN_PORT}-${MAX_PORT}`);
+    }
+    return parsedPort;
+}))
+    .addOption(new commander_1.Option('-l, --logging-format <string>', 'Format of log output')
+    .choices(['human', 'json'])
+    .default('human'))
+    .action((source, options) => __awaiter(void 0, void 0, void 0, function* () {
+    const input = {
+        port: options.port,
+        loggingFormat: options.loggingFormat,
+        noBrowser: true,
+    };
+    // Starts the dev-mode server with the development UI
+    yield (0, local_component_dev_ui_1.startLocalDevelopmentUIServer)(source, input);
+}));
+exports.buildDevModeUICommand = buildDevModeUICommand;
+const devModeUICommand = (0, exports.buildDevModeUICommand)();
+exports.default = devModeUICommand;

package/lib/cmp/index.js

@@ -6,11 +6,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const commander_1 = require("commander");
 const deploy_1 = __importDefault(require("./deploy"));
 const dev_mode_1 = __importDefault(require("./dev-mode"));
+const dev_mode_ui_1 = __importDefault(require("./dev-mode-ui"));
 const init_1 = __importDefault(require("./init"));
 const cmpCommand = new commander_1.Command('cmp');
 cmpCommand
     .description('Component Service Commands')
     .addCommand(deploy_1.default)
     .addCommand(dev_mode_1.default)
+    .addCommand(dev_mode_ui_1.default)
     .addCommand(init_1.default);
 exports.default = cmpCommand;

package/lib/cmp/utils/definitions.d.ts

@@ -9,5 +9,6 @@ export declare class ComponentDefinition {
         entry: string;
     };
     get manifestPath(): string;
+    get type(): "edge" | "server";
     copyManifest(copyDir: string): Promise<void>;
 }

package/lib/cmp/utils/definitions.js

@@ -62,6 +62,9 @@ class ComponentDefinition {
     get manifestPath() {
         return path.resolve(this.baseDir, 'manifest.json');
     }
+    get type() {
+        return this.definition.type;
+    }
     copyManifest(copyDir) {
         return __awaiter(this, void 0, void 0, function* () {
             yield fs.copyFile(this.manifestPath, path.resolve(copyDir, 'manifest.json'));
@@ -85,5 +88,5 @@ const BasicDefinition = zod_1.z.object({
         entry: zod_1.z.string(),
     }))
         .refine(fns => new Set(fns.map(f => f.name)).size === fns.length),
-    type: zod_1.z.enum(['edge', 'sandbox']).optional().default('sandbox'),
+    type: zod_1.z.enum(['edge', 'server']).optional().default('server'),
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@squiz/dxp-cli-next",
-  "version": "5.17.1-develop.1",
+  "version": "5.18.0-develop.2",
   "repository": {
     "url": "https://gitlab.squiz.net/dxp/dxp-cli-next"
   },
@@ -42,6 +42,8 @@
     "@apidevtools/swagger-parser": "10.1.0",
     "@squiz/component-cli-lib": "1.67.0",
     "@squiz/dxp-porter-shared": "0.4.0",
+    "@squiz/local-component-dev-ui": "^0.2.2",
+    "@squiz/render-runtime-lib": "^1.69.0",
     "axios": "1.1.3",
     "cli-color": "2.0.3",
     "commander": "9.4.0",