@superblocksteam/cli 0.0.11 → 0.0.13

package/README.md

@@ -12,7 +12,7 @@ $ npm install -g @superblocksteam/cli
 $ superblocks COMMAND
 running command...
 $ superblocks (--version)
-@superblocksteam/cli/0.0.11 linux-x64 node-v18.16.1
+@superblocksteam/cli/0.0.13 linux-x64 node-v18.17.0
 $ superblocks --help [COMMAND]
 USAGE
   $ superblocks COMMAND
@@ -110,14 +110,14 @@ Interactively configure the current directory as a Superblocks project or initia
 
 ```
 USAGE
-  $ superblocks init [RESOURCEURL] [-m live|latest|deployed]
+  $ superblocks init [RESOURCEURL] [-m latest-edits|most-recent-commit|deployed]
 
 ARGUMENTS
   RESOURCEURL  Superblocks resource URL (i.e. https://app.superblocks.com/applications/<application_id>/pages/<page_id>)
 
 FLAGS
   -m, --mode=<option>  Pull mode
-                       <options: live|latest|deployed>
+                       <options: latest-edits|most-recent-commit|deployed>
 
 DESCRIPTION
   Interactively configure the current directory as a Superblocks project or initialize new services in an already
@@ -151,14 +151,14 @@ Download objects from Superblocks and save them locally
 
 ```
 USAGE
-  $ superblocks pull [ONLY] [-m live|latest|deployed]
+  $ superblocks pull [ONLY] [-m latest-edits|most-recent-commit|deployed]
 
 ARGUMENTS
   ONLY  Superblocks resource location to pull (i.e. apps/my-app or backends/my-workflow)
 
 FLAGS
-  -m, --mode=<option>  Pull mode
-                       <options: live|latest|deployed>
+  -m, --mode=<option>  [default: latest-edits] Pull mode
+                       <options: latest-edits|most-recent-commit|deployed>
 
 DESCRIPTION
   Download objects from Superblocks and save them locally

package/assets/custom-components/package.json

@@ -6,15 +6,14 @@
     "lint": "npx eslint .",
     "lint:fix": "npx eslint . --fix"
   },
-  "dependencies": {},
-  "peerDependencies": {
-    "react": "^17",
-    "react-dom": "^17"
+  "dependencies": {
+    "react": "^18",
+    "react-dom": "^18"
   },
   "devDependencies": {
-    "@superblocksteam/cli": "0.0.11",
-    "@types/react": "^17",
-    "@types/react-dom": "^17",
+    "@superblocksteam/cli": "0.0.13",
+    "@types/react": "^18",
+    "@types/react-dom": "^18",
     "@typescript-eslint/eslint-plugin": "^5.62.0",
     "eslint": "^8.45.0",
     "eslint-config-prettier": "^8.8.0",

package/assets/custom-components/tsconfig.json

@@ -7,7 +7,7 @@
     "target": "es2019",
     "lib": ["dom", "es2015", "es2019"],
     "esModuleInterop": true,
-    "jsx": "react-jsxdev",
+    "jsx": "react-jsx",
   },
   "include": ["components/**/*"],
 }

package/dist/commands/components/create.js

@@ -9,12 +9,12 @@ const node_util_1 = tslib_1.__importDefault(require("node:util"));
 const core_1 = require("@oclif/core");
 const util_1 = require("@superblocksteam/util");
 const colorette_1 = require("colorette");
+const enquirer_1 = require("enquirer");
 const fs = tslib_1.__importStar(require("fs-extra"));
-const listr2_1 = require("listr2");
+const lodash_1 = require("lodash");
 const authenticated_command_1 = require("../../common/authenticated-command");
 const create_component_defaults_1 = require("../../common/defaults/create-component-defaults");
 const identifiers_1 = require("../../util/identifiers");
-const prompt_1 = require("../../util/prompt");
 const types_1 = require("../../util/types");
 // eslint-disable-next-line unicorn/prefer-module
 const rootDirectory = node_path_1.default.resolve(__dirname, "../../../");
@@ -28,65 +28,125 @@ const tsStringify = (obj) => {
 };
 class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCommand {
     async run() {
-        var _a;
-        const displayName = await core_1.ux.prompt("What is the display name of the component you want to create? (e.g. Date Picker)");
-        const name = await (0, prompt_1.validatedPrompt)("What is the machine readable name of the component you want to create?", { default: (0, identifiers_1.suggestIdentifier)(displayName, true) || "DatePicker" }, (response) => (0, identifiers_1.isValidIdentifier)(response) || "Invalid identifier");
+        const displayName = (await (0, enquirer_1.prompt)({
+            type: "input",
+            name: "displayName",
+            message: "What is the display name of the component you want to create? (e.g. Date Picker)",
+            validate: (response) => !(0, lodash_1.isEmpty)(response.trim()),
+        })).displayName;
+        const name = (await (0, enquirer_1.prompt)({
+            type: "input",
+            name: "name",
+            message: "What is the machine readable name of the component you want to create?",
+            validate: (response) => (0, identifiers_1.isValidIdentifier)(response) || "Invalid identifier",
+            initial: (0, identifiers_1.suggestIdentifier)(displayName, true) || "DatePicker",
+        })).name;
         this.log();
-        const hasStatefulProps = await core_1.ux.confirm("Does this component have stateful props? (e.g. a date picker component that has a selected date prop) [y/n]");
+        this.log(`${(0, colorette_1.cyanBright)("ℹ")}  A ${(0, colorette_1.bold)("stateful property")} determines what shows up in the properties panel of a custom component`);
+        this.log();
+        const hasStatefulProps = (await (0, enquirer_1.prompt)({
+            type: "confirm",
+            name: "hasStatefulProps",
+            message: `Does this component have ${(0, colorette_1.bold)("stateful properties")}?`,
+            initial: false,
+        })).hasStatefulProps;
         const statefulProps = [];
         if (hasStatefulProps) {
             for (;;) {
-                const statefulPropName = await core_1.ux.prompt("What is the label of the stateful prop? (e.g. Selected Date)");
-                const statefulPropPath = await (0, prompt_1.validatedPrompt)("What is the machine readable name of the stateful prop?", { default: (0, identifiers_1.suggestIdentifier)(statefulPropName) || "selectedDate" }, (response) => {
-                    if (!(0, identifiers_1.isValidIdentifier)(response))
-                        return "Invalid identifier";
-                    if (statefulProps.some((v) => v.path === response))
-                        return "Duplicate property name";
-                    return true;
-                });
-                const task = new listr2_1.Listr({
-                    task: async (ctx, task) => {
-                        ctx.inputType = await task.prompt({
-                            type: "Select",
-                            message: `What input type should ${statefulPropName} be?`,
-                            choices: Object.values(types_1.inputTypeDefinions).map((v) => v.prompt),
-                            initial: 0,
-                        });
+                const statefulPropName = (await (0, enquirer_1.prompt)({
+                    type: "input",
+                    name: "statefulPropName",
+                    message: "What is the label of the stateful prop? (e.g. Selected Date)",
+                    validate: (response) => !(0, lodash_1.isEmpty)(response.trim()),
+                })).statefulPropName.trim();
+                const statefulPropPath = (await (0, enquirer_1.prompt)({
+                    type: "input",
+                    name: "path",
+                    initial: (0, identifiers_1.suggestIdentifier)(statefulPropName) || "selectedDate",
+                    message: "What is the machine readable name of the stateful prop?",
+                    validate: (response) => {
+                        if (!(0, identifiers_1.isValidIdentifier)(response))
+                            return "Invalid identifier";
+                        if (statefulProps.some((v) => v.path === response))
+                            return "Duplicate property name";
+                        return true;
                     },
-                });
-                const runContext = await task.run();
-                const statefulPropType = (_a = Object.entries(types_1.inputTypeDefinions).find(([, v]) => v.prompt === runContext.inputType)) === null || _a === void 0 ? void 0 : _a[0];
-                const placeholderText = await core_1.ux.prompt(`What placeholder text should ${statefulPropName} have, if any?`, { required: false });
+                })).path;
+                const statefulPropType = (await (0, enquirer_1.prompt)({
+                    type: "select",
+                    name: "type",
+                    message: `What input type should ${statefulPropName} be?`,
+                    choices: Object.entries(types_1.inputTypeDefinions).map(([k, v]) => ({
+                        name: k,
+                        message: v.prompt,
+                        value: k,
+                    })),
+                    initial: 0,
+                })).type;
+                const placeholderText = (await (0, enquirer_1.prompt)({
+                    type: "input",
+                    name: "value",
+                    message: `What placeholder text should ${statefulPropName} have, if any?`,
+                    required: false,
+                })).value;
                 statefulProps.push({
                     label: statefulPropName,
                     path: statefulPropPath,
                     inputType: statefulPropType,
                     placeholder: placeholderText || undefined,
                 });
-                const addAnotherStatefulProp = await core_1.ux.confirm("Do you want to add another stateful prop? [y/n]");
+                const addAnotherStatefulProp = (await (0, enquirer_1.prompt)({
+                    type: "confirm",
+                    name: "value",
+                    message: "Do you want to add another stateful prop?",
+                    initial: false,
+                })).value;
                 if (!addAnotherStatefulProp) {
                     break;
                 }
             }
         }
         this.log();
-        const hasEventHandlers = await core_1.ux.confirm("Does this component have event handlers? (e.g. a date picker component that has a On Change event handler) [y/n]");
+        this.log(`${(0, colorette_1.cyanBright)("ℹ")} ${(0, colorette_1.bold)("Event handlers")} represent the events your custom component can fire`);
+        this.log();
+        const hasEventHandlers = (await (0, enquirer_1.prompt)({
+            type: "confirm",
+            name: "value",
+            message: `Does this component have ${(0, colorette_1.bold)("event handlers")}? (e.g. a date picker component that has a On Change event handler)`,
+            initial: false,
+        })).value;
         const eventHandlers = [];
         if (hasEventHandlers) {
             for (;;) {
-                const eventHandlerName = await core_1.ux.prompt("What is the label of the event handler? (e.g. On Change)");
-                const eventHandlerPath = await (0, prompt_1.validatedPrompt)("What is the machine readable name of the event handler?", { default: (0, identifiers_1.suggestIdentifier)(eventHandlerName) || "onChange" }, (response) => {
-                    if (!(0, identifiers_1.isValidIdentifier)(response))
-                        return "Invalid identifier";
-                    if (eventHandlers.some((v) => v.path === response))
-                        return "Duplicate property name";
-                    return true;
-                });
+                const eventHandlerName = (await (0, enquirer_1.prompt)({
+                    name: "value",
+                    type: "input",
+                    message: "What is the label of the event handler? (e.g. On Change)",
+                    validate: (response) => !(0, lodash_1.isEmpty)(response.trim()),
+                })).value.trim();
+                const eventHandlerPath = (await (0, enquirer_1.prompt)({
+                    name: "value",
+                    message: "What is the machine readable name of the event handler?",
+                    type: "input",
+                    initial: (0, identifiers_1.suggestIdentifier)(eventHandlerName) || "onChange",
+                    validate: (response) => {
+                        if (!(0, identifiers_1.isValidIdentifier)(response))
+                            return "Invalid identifier";
+                        if (eventHandlers.some((v) => v.path === response))
+                            return "Duplicate property name";
+                        return true;
+                    },
+                })).value;
                 eventHandlers.push({
                     label: eventHandlerName,
                     path: eventHandlerPath,
                 });
-                const addAnotherEventHandler = await core_1.ux.confirm("Do you want to add another event handler? [y/n]");
+                const addAnotherEventHandler = (await (0, enquirer_1.prompt)({
+                    name: "value",
+                    type: "confirm",
+                    message: "Do you want to add another event handler?",
+                    initial: false,
+                })).value;
                 if (!addAnotherEventHandler) {
                     break;
                 }

package/dist/commands/components/upload.js

@@ -4,12 +4,12 @@ const tslib_1 = require("tslib");
 const node_http_1 = tslib_1.__importDefault(require("node:http"));
 const path_1 = tslib_1.__importDefault(require("path"));
 const core_1 = require("@oclif/core");
+const react_shim_1 = require("@superblocksteam/react-shim");
 const util_1 = require("@superblocksteam/util");
 const plugin_react_1 = tslib_1.__importDefault(require("@vitejs/plugin-react"));
 const fs = tslib_1.__importStar(require("fs-extra"));
 const serve_handler_1 = tslib_1.__importDefault(require("serve-handler"));
 const vite_1 = require("vite");
-const vite_plugin_externals_1 = require("vite-plugin-externals");
 const authenticated_command_1 = require("../../common/authenticated-command");
 class Upload extends authenticated_command_1.AuthenticatedApplicationCommand {
     async run() {
@@ -63,13 +63,7 @@ class Upload extends authenticated_command_1.AuthenticatedApplicationCommand {
                     write: true,
                 },
                 customLogger: viteLogger,
-                plugins: [
-                    (0, plugin_react_1.default)(),
-                    (0, vite_plugin_externals_1.viteExternalsPlugin)({
-                        react: "React",
-                        "react-dom": "ReactDOM",
-                    }),
-                ],
+                plugins: [(0, plugin_react_1.default)(), (0, react_shim_1.injectReactVersionsPlugin)()],
             });
         })();
         core_1.ux.action.stop();

package/dist/commands/components/watch.js

@@ -3,12 +3,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.healthEndpointMiddleware = void 0;
 const tslib_1 = require("tslib");
 const core_1 = require("@oclif/core");
+const react_shim_1 = require("@superblocksteam/react-shim");
 const util_1 = require("@superblocksteam/util");
 const vite_custom_component_reload_plugin_1 = require("@superblocksteam/vite-custom-component-reload-plugin");
 const plugin_react_1 = tslib_1.__importDefault(require("@vitejs/plugin-react"));
 const colorette_1 = require("colorette");
 const vite_1 = require("vite");
-const vite_plugin_externals_1 = require("vite-plugin-externals");
 const authenticated_command_1 = require("../../common/authenticated-command");
 function healthEndpointMiddleware() {
     return {
@@ -80,11 +80,8 @@ class Watch extends authenticated_command_1.AuthenticatedApplicationCommand {
                 plugins: [
                     healthEndpointMiddleware(),
                     (0, plugin_react_1.default)(),
-                    (0, vite_plugin_externals_1.viteExternalsPlugin)({
-                        react: "React",
-                        "react-dom": "ReactDOM",
-                    }),
                     (0, vite_custom_component_reload_plugin_1.appendHotReloadEventPlugin)(),
+                    (0, react_shim_1.injectReactVersionsPlugin)(),
                 ],
             });
             await server.listen();

package/dist/commands/init.js

@@ -26,7 +26,7 @@ class Initialize extends authenticated_command_1.AuthenticatedCommand {
                 task: async (ctx) => {
                     ctx.fetchedResources = {};
                     ctx.writtenResources = {};
-                    ctx.now = Date.now();
+                    ctx.now = new Date().toISOString();
                     try {
                         ctx.existingSuperblocksConfig = (await (0, util_1.getSuperblocksMonorepoConfigJson)())[0];
                     }
@@ -73,7 +73,7 @@ class Initialize extends authenticated_command_1.AuthenticatedCommand {
                 title: "Writing resources to a disk...",
                 task: async (ctx, task) => {
                     const subtasks = [];
-                    const now = Date.now();
+                    const now = new Date().toISOString();
                     for (const resourceId of ctx.resourceIdsToInitialize) {
                         const resource = ctx.fetchedResources[resourceId];
                         switch (resource.resourceType) {
@@ -179,6 +179,9 @@ class Initialize extends authenticated_command_1.AuthenticatedCommand {
                 }
                 counter++;
             }
+            if ((0, lodash_1.isEmpty)(choices)) {
+                this.error(`No resources found in your account. Please make sure you have access to at least one application, workflow or scheduled job.`);
+            }
             const resourceIdsToInitialize = await task.prompt([
                 {
                     type: "AutoComplete",
@@ -228,7 +231,13 @@ Initialize.examples = [
     "<%= config.bin %> <%= command.id %>",
     "<%= config.bin %> <%= command.id %> https://app.superblocks.com/applications/11111111-1111-1111-1111-111111111111/pages/22222222-2222-2222-2222-222222222222",
 ];
-Initialize.flags = version_control_1.commonFlags;
+Initialize.flags = {
+    mode: core_1.Flags.string({
+        char: "m",
+        description: "Pull mode",
+        options: Object.keys(version_control_1.modeFlagValuesMap),
+    }),
+};
 Initialize.args = {
     resourceUrl: core_1.Args.string({
         description: "Superblocks resource URL (i.e. https://app.superblocks.com/applications/<application_id>/pages/<page_id>)",

package/dist/commands/login.js

@@ -30,7 +30,7 @@ class Login extends core_1.Command {
                 if (superblocksBaseUrl === customChoice) {
                     superblocksBaseUrl = await core_1.ux.prompt("Enter the Superblocks base URL (then press Enter)", { type: "normal" });
                 }
-                const tokenPageUrl = new URL("personal-settings#profile", superblocksBaseUrl).href;
+                const tokenPageUrl = new URL("personal-settings#apiKey", superblocksBaseUrl).href;
                 token = await core_1.ux.prompt(`Enter your Superblocks access token (then press Enter) which can be found at ${tokenPageUrl}`, { type: "mask" });
             }
         }

package/dist/commands/pull.d.ts

@@ -3,7 +3,7 @@ export default class Pull extends AuthenticatedCommand {
     static description: string;
     static examples: string[];
     static flags: {
-        mode: import("@oclif/core/lib/interfaces").OptionFlag<string | undefined, import("@oclif/core/lib/interfaces/parser").CustomOptions>;
+        mode: import("@oclif/core/lib/interfaces").OptionFlag<string, import("@oclif/core/lib/interfaces/parser").CustomOptions>;
     };
     static args: {
         only: import("@oclif/core/lib/interfaces/parser").Arg<string | undefined, Record<string, unknown>>;

package/dist/commands/pull.js

@@ -20,7 +20,7 @@ class Pull extends authenticated_command_1.AuthenticatedCommand {
                 title: "Checking for existing Superblocks project...",
                 task: async (ctx) => {
                     ctx.writtenResources = {};
-                    ctx.now = Date.now();
+                    ctx.now = new Date().toISOString();
                     try {
                         [
                             ctx.existingSuperblocksRootConfig,
@@ -42,7 +42,7 @@ class Pull extends authenticated_command_1.AuthenticatedCommand {
                     const viewMode = await (0, version_control_1.getMode)(task, mode);
                     const resourceIdsToPull = await this.getResourceIdsToPull(ctx, task, only);
                     const subtasks = [];
-                    const now = Date.now();
+                    const now = new Date().toISOString();
                     const superblocksRootPath = node_path_1.default.resolve(node_path_1.default.dirname(ctx.superblocksRootConfigPath), "..");
                     for (const resourceId of resourceIdsToPull) {
                         const resource = (_a = ctx.existingSuperblocksRootConfig) === null || _a === void 0 ? void 0 : _a.resources[resourceId];
@@ -135,18 +135,20 @@ class Pull extends authenticated_command_1.AuthenticatedCommand {
             }
             counter++;
         }
-        const resourceIdsToPull = await task.prompt([
-            {
-                type: "MultiSelect",
-                name: "resourceIdsToPull",
-                message: `Select resources to pull (${version_control_1.MULTI_SELECT_PROMPT_HELP})`,
-                choices: choices,
-                initial: initialSelections,
-                validate: version_control_1.atLeastOneSelection,
-                prefix: "▸",
-                indicator: "◉",
-            },
-        ]);
+        const resourceIdsToPull = choices.length === 1
+            ? [choices[0].name]
+            : await task.prompt([
+                {
+                    type: "MultiSelect",
+                    name: "resourceIdsToPull",
+                    message: `Select resources to pull (${version_control_1.MULTI_SELECT_PROMPT_HELP})`,
+                    choices: choices,
+                    initial: initialSelections,
+                    validate: version_control_1.atLeastOneSelection,
+                    prefix: "▸",
+                    indicator: "◉",
+                },
+            ]);
         return resourceIdsToPull;
     }
 }
@@ -157,7 +159,14 @@ Pull.examples = [
     "<%= config.bin %> <%= command.id %>  backends/my-workflow",
     "<%= config.bin %> <%= command.id %>  backends/my-scheduled-job",
 ];
-Pull.flags = version_control_1.commonFlags;
+Pull.flags = {
+    mode: core_1.Flags.string({
+        char: "m",
+        description: "Pull mode",
+        options: Object.keys(version_control_1.modeFlagValuesMap),
+        default: version_control_1.LATEST_EDITS_MODE,
+    }),
+};
 Pull.args = {
     only: core_1.Args.string({
         description: "Superblocks resource location to pull (i.e. apps/my-app or backends/my-workflow)",

package/dist/common/defaults/create-component-defaults.js

@@ -54,7 +54,20 @@ export default function Component({
     ? ",\n" + eventHandlers.map((v) => indent(v, 2)).join(",\n")
     : ""}
 }: Props) {
-  return <div>Hello World!</div>;
+  return (
+    <div
+      style={{
+        height: "100%",
+        width: "100%",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        backgroundColor: "#a7aebe",
+      }}
+    >
+      <h1 style={{ color: "white" }}>{"<Insert Component Here>"}</h1>
+    </div>
+  );
 }
 `;
 exports.getDefaultComponentTsx = getDefaultComponentTsx;

package/dist/common/version-control.d.ts

@@ -6,16 +6,15 @@ export type SuperblocksMetadata = {
     lastUpdated: number;
     created: number;
 };
-export declare const LIVE_MODE = "live";
-export declare const modeFlagValues: string[];
+export declare const LATEST_EDITS_MODE = "latest-edits";
+export declare const MOST_RECENT_COMMIT_MODE = "most-recent-commit";
+export declare const DEPLOYED_MODE = "deployed";
+export declare const modeFlagValuesMap: Record<string, string>;
 export declare function modeFlagToViewMode(modeFlag: ModeFlag): ViewMode;
-export type ModeFlag = (typeof modeFlagValues)[number];
-export declare const commonFlags: {
-    mode: import("@oclif/core/lib/interfaces").OptionFlag<string | undefined, import("@oclif/core/lib/interfaces/parser").CustomOptions>;
-};
+export type ModeFlag = (keyof typeof modeFlagValuesMap)[number];
 export declare const SELECT_PROMPT_HELP = "Use \u2191/\u2193 arrow keys, Enter to confirm";
 export declare const MULTI_SELECT_PROMPT_HELP = "Use \u2191/\u2193 arrow keys, Space to select, Enter to confirm";
 export declare const atLeastOneSelection: (value: string[]) => string | true;
-export declare function writeResourceToDisk(resourceType: string, resourceId: string, resource: any, now: number, rootPath: string, existingRelativeLocation?: string): Promise<VersionedResourceConfig>;
+export declare function writeResourceToDisk(resourceType: string, resourceId: string, resource: any, now: string, rootPath: string, existingRelativeLocation?: string): Promise<VersionedResourceConfig>;
 export declare function getMode(task: any, mode: ModeFlag): Promise<ViewMode>;
 export declare function sortByKey(obj: unknown): unknown;

package/dist/common/version-control.js

@@ -1,9 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.sortByKey = exports.getMode = exports.writeResourceToDisk = exports.atLeastOneSelection = exports.MULTI_SELECT_PROMPT_HELP = exports.SELECT_PROMPT_HELP = exports.commonFlags = exports.modeFlagToViewMode = exports.modeFlagValues = exports.LIVE_MODE = void 0;
+exports.sortByKey = exports.getMode = exports.writeResourceToDisk = exports.atLeastOneSelection = exports.MULTI_SELECT_PROMPT_HELP = exports.SELECT_PROMPT_HELP = exports.modeFlagToViewMode = exports.modeFlagValuesMap = exports.DEPLOYED_MODE = exports.MOST_RECENT_COMMIT_MODE = exports.LATEST_EDITS_MODE = void 0;
 const tslib_1 = require("tslib");
 const node_path_1 = tslib_1.__importDefault(require("node:path"));
-const core_1 = require("@oclif/core");
 const util_1 = require("@superblocksteam/util");
 const colorette_1 = require("colorette");
 const fs = tslib_1.__importStar(require("fs-extra"));
@@ -11,28 +10,27 @@ const lodash_1 = require("lodash");
 const lodash_2 = tslib_1.__importDefault(require("lodash"));
 const slugify_1 = tslib_1.__importDefault(require("slugify"));
 const yaml_1 = require("yaml");
-exports.LIVE_MODE = "live";
-exports.modeFlagValues = [exports.LIVE_MODE, "latest", "deployed"];
+exports.LATEST_EDITS_MODE = "latest-edits";
+exports.MOST_RECENT_COMMIT_MODE = "most-recent-commit";
+exports.DEPLOYED_MODE = "deployed";
+exports.modeFlagValuesMap = {
+    [exports.LATEST_EDITS_MODE]: "Latest edits",
+    [exports.MOST_RECENT_COMMIT_MODE]: "Most recent commit",
+    [exports.DEPLOYED_MODE]: "Deployed",
+};
 function modeFlagToViewMode(modeFlag) {
     switch (modeFlag) {
-        case exports.LIVE_MODE:
+        case exports.LATEST_EDITS_MODE:
             return "export-live";
-        case "latest":
+        case exports.MOST_RECENT_COMMIT_MODE:
             return "export-latest";
-        case "deployed":
+        case exports.DEPLOYED_MODE:
             return "export-deployed";
         default:
             throw new Error(`Unsupported mode flag: ${modeFlag}`);
     }
 }
 exports.modeFlagToViewMode = modeFlagToViewMode;
-exports.commonFlags = {
-    mode: core_1.Flags.string({
-        char: "m",
-        description: "Pull mode",
-        options: exports.modeFlagValues,
-    }),
-};
 exports.SELECT_PROMPT_HELP = "Use ↑/↓ arrow keys, Enter to confirm";
 exports.MULTI_SELECT_PROMPT_HELP = "Use ↑/↓ arrow keys, Space to select, Enter to confirm";
 const atLeastOneSelection = (value) => {
@@ -49,7 +47,7 @@ function slugifyName(originalName) {
     });
 }
 async function writeResourceToDisk(resourceType, resourceId, resource, now, rootPath, existingRelativeLocation) {
-    var _a;
+    var _a, _b, _c;
     switch (resourceType) {
         case "APPLICATION": {
             const parentDirName = "apps";
@@ -80,14 +78,17 @@ async function writeResourceToDisk(resourceType, resourceId, resource, now, root
             };
             if (resource.apis) {
                 for (const api of resource.apis) {
+                    const apiName = slugifyName((_b = api.apiPb.metadata.name) !== null && _b !== void 0 ? _b : api.actions.name);
+                    // server is still sending actions for a backwards compatibility
+                    delete api.actions;
                     const apiContent = (0, yaml_1.stringify)(api, {
                         sortMapEntries: true,
                     });
                     const handleApi = async () => {
-                        await fs.outputFile(`${apisDirName}/${slugifyName(api.actions.name)}.yaml`, apiContent);
+                        await fs.outputFile(`${apisDirName}/${apiName}.yaml`, apiContent);
                     };
                     apiPromises.push(handleApi());
-                    applicationConfig.apis[api.id] = api.actions.name;
+                    applicationConfig.apis[api.id] = apiName;
                 }
                 await Promise.all(apiPromises);
             }
@@ -101,7 +102,10 @@ async function writeResourceToDisk(resourceType, resourceId, resource, now, root
         }
         case "BACKEND": {
             const parentDirName = "backends";
-            const newRelativeLocation = `${parentDirName}/${slugifyName(resource.actions.name)}`;
+            const apiName = slugifyName((_c = resource.apiPb.metadata.name) !== null && _c !== void 0 ? _c : resource.actions.name);
+            // server is still sending actions for a backwards compatibility
+            delete resource.actions;
+            const newRelativeLocation = `${parentDirName}/${apiName}`;
             const relativeLocation = existingRelativeLocation !== null && existingRelativeLocation !== void 0 ? existingRelativeLocation : newRelativeLocation;
             const backendDirName = node_path_1.default.resolve(rootPath, relativeLocation);
             if (!(await fs.pathExists(backendDirName))) {
@@ -137,10 +141,10 @@ async function getMode(task, mode) {
         {
             type: "Select",
             name: "mode",
-            message: `Select fetch mode (${exports.SELECT_PROMPT_HELP})`,
-            choices: exports.modeFlagValues.map((mode) => ({
+            message: `Select which version of a resource you would like to fetch (${exports.SELECT_PROMPT_HELP})`,
+            choices: Object.keys(exports.modeFlagValuesMap).map((mode) => ({
                 name: mode,
-                message: mode,
+                message: exports.modeFlagValuesMap[mode],
             })),
             initial: 0,
             multiple: false,

package/oclif.manifest.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.0.11",
+  "version": "0.0.13",
   "commands": {
     "init": {
       "id": "init",
@@ -21,8 +21,8 @@
           "description": "Pull mode",
           "multiple": false,
           "options": [
-            "live",
-            "latest",
+            "latest-edits",
+            "most-recent-commit",
             "deployed"
           ]
         }
@@ -83,10 +83,11 @@
           "description": "Pull mode",
           "multiple": false,
           "options": [
-            "live",
-            "latest",
+            "latest-edits",
+            "most-recent-commit",
             "deployed"
-          ]
+          ],
+          "default": "latest-edits"
         }
       },
       "args": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@superblocksteam/cli",
-  "version": "0.0.11",
+  "version": "0.0.13",
   "description": "Official Superblocks CLI",
   "bin": {
     "superblocks": "bin/run"
@@ -19,6 +19,7 @@
     "@oclif/plugin-help": "^5",
     "@oclif/plugin-plugins": "^2.4.4",
     "@superblocksteam/sdk": "*",
+    "@superblocksteam/react-shim": "*",
     "@superblocksteam/util": "*",
     "@superblocksteam/vite-custom-component-reload-plugin": "*",
     "@vitejs/plugin-react": "^4.0.0",
@@ -30,7 +31,6 @@
     "serve-handler": "^6.1.5",
     "slugify": "^1.6.6",
     "vite": "^4.3.9",
-    "vite-plugin-externals": "^0.6.2",
     "vite-plugin-inspect": "^0.7.28",
     "yaml": "2.3.1"
   },
@@ -56,7 +56,7 @@
     "shx": "^0.3.3",
     "ts-node": "^10.9.1",
     "tslib": "^2.5.0",
-    "typescript": "^5.1.3"
+    "typescript": "^5.1.6"
   },
   "scripts": {
     "build": "tsc --build",

package/dist/util/prompt.d.ts

@@ -1,7 +0,0 @@
-import { IPromptOptions } from "@oclif/core/lib/cli-ux";
-type ValidatorFn = (input: string) => string | boolean;
-/**
- * A wrapper around `oclif`'s `ux.prompt` function that allows for validation of user responses.
- */
-export declare function validatedPrompt(name: string, options: IPromptOptions | undefined, validator: ValidatorFn | RegExp): Promise<string>;
-export {};

package/dist/util/prompt.js

@@ -1,33 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.validatedPrompt = void 0;
-const core_1 = require("@oclif/core");
-/**
- * A wrapper around `oclif`'s `ux.prompt` function that allows for validation of user responses.
- */
-async function validatedPrompt(name, options, validator) {
-    let validatorFn;
-    if (validator === undefined) {
-        validatorFn = () => true;
-    }
-    else if (validator instanceof RegExp) {
-        validatorFn = (response) => validator.test(response);
-    }
-    else {
-        validatorFn = validator;
-    }
-    for (;;) {
-        const response = await core_1.ux.prompt(name, options);
-        const validationResult = validatorFn(response);
-        if (typeof validationResult === "string") {
-            core_1.ux.log(`Error: ${validationResult}`);
-        }
-        else if (validationResult === false) {
-            core_1.ux.log("Error: Invalid response");
-        }
-        else {
-            return response;
-        }
-    }
-}
-exports.validatedPrompt = validatedPrompt;