@superblocksteam/cli 0.0.22 → 1.0.0

package/README.md

@@ -12,7 +12,7 @@ $ npm install -g @superblocksteam/cli
 $ superblocks COMMAND
 running command...
 $ superblocks (--version)
-@superblocksteam/cli/0.0.22 linux-x64 node-v18.17.0
+@superblocksteam/cli/1.0.0 linux-x64 node-v18.17.1
 $ superblocks --help [COMMAND]
 USAGE
   $ superblocks COMMAND
@@ -31,6 +31,7 @@ USAGE
 * [`superblocks login`](#superblocks-login)
 * [`superblocks migrate`](#superblocks-migrate)
 * [`superblocks pull [ONLY]`](#superblocks-pull-only)
+* [`superblocks rm [RESOURCELOCATION]`](#superblocks-rm-resourcelocation)
 
 ## `superblocks components create`
 
@@ -38,7 +39,10 @@ Creates a new Superblocks component in the current application folder
 
 ```
 USAGE
-  $ superblocks components create
+  $ superblocks components create [--example]
+
+FLAGS
+  --example  Create example component
 
 DESCRIPTION
   Creates a new Superblocks component in the current application folder
@@ -210,4 +214,25 @@ EXAMPLES
 
   $ superblocks pull  backends/my-scheduled-job
 ```
+
+## `superblocks rm [RESOURCELOCATION]`
+
+Remove a Superblocks resource from the local Superblocks project and delete the resource folder directory locally (if it exists)
+
+```
+USAGE
+  $ superblocks rm [RESOURCELOCATION]
+
+ARGUMENTS
+  RESOURCELOCATION  Superblocks resource location (i.e. apps/my-spectacular-app)
+
+DESCRIPTION
+  Remove a Superblocks resource from the local Superblocks project and delete the resource folder directory locally (if
+  it exists)
+
+EXAMPLES
+  $ superblocks rm
+
+  $ superblocks rm apps/my-spectacular-app
+```
 <!-- commandsstop -->

package/assets/custom-components/example/component.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback, useState } from "react";
+import { useCallback, useState } from "react";
 import { useSuperblocksContext } from "@superblocksteam/custom-components";
 import { type Props, type EventTriggers } from "./types";
 import { Task, ErrorComponent, validateTasks } from "./validation";

package/assets/custom-components/setup/package.json

@@ -7,7 +7,7 @@
     "lint:fix": "npx eslint . --fix"
   },
   "dependencies": {
-    "@superblocksteam/custom-components": "0.0.22",
+    "@superblocksteam/custom-components": "1.0.0",
     "react": "^18",
     "react-dom": "^18"
   },
@@ -19,6 +19,7 @@
     "eslint-config-prettier": "^8.8.0",
     "eslint-plugin-prettier": "^5.0.0",
     "eslint-plugin-react": "^7.32.2",
+    "eslint-plugin-react-hooks": "^4.6.0",
     "prettier": "3.0.0",
     "sass": "^1.64.2",
     "typescript": "^5.1.6"

package/dist/commands/components/create.d.ts

@@ -2,6 +2,9 @@ import { AuthenticatedApplicationCommand } from "../../common/authenticated-comm
 export default class CreateComponent extends AuthenticatedApplicationCommand {
     static description: string;
     private dataTypeToDefaultControlType;
+    static flags: {
+        example: import("@oclif/core/lib/interfaces").BooleanFlag<boolean>;
+    };
     private initializeComponentByWizard;
     private initializeComponentByExample;
     run(): Promise<void>;

package/dist/commands/components/create.js

@@ -111,6 +111,7 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
                         label: propertyLabel,
                         controlType: this.dataTypeToDefaultControlType(propertyType),
                     };
+                    this.log(`You can configure the remaining display attributes (placeholder, etc) in the config.ts file directly.`);
                 }
                 properties.push({
                     path: propertyPath,
@@ -120,7 +121,6 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
                     isExternallyReadable: true,
                     isExternallySettable: true,
                 });
-                this.log(`You can configure the remaining display attributes (placeholder, etc) in the config.ts file directly.`);
                 this.log();
                 const addAnotherProperty = (await (0, enquirer_1.prompt)({
                     type: "confirm",
@@ -208,6 +208,9 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
         };
     }
     async initializeComponentByExample() {
+        if (await fs.exists("components/ToDoList")) {
+            this.error("Example component ToDoList already exists", { exit: 1 });
+        }
         const response = {
             displayName: "To-Do List (Example)",
             name: "ToDoList",
@@ -247,6 +250,11 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
                 .join(""),
         });
         await fs.copy(DEFAULT_PACKAGE_JSON_TEMPLATE_PATH, ".");
+        // There is a very old npm bug where it won't publish .gitignore files
+        // https://github.com/npm/npm/issues/3763
+        await fs.move("./gitignore_will_rename", "./.gitignore", {
+            overwrite: true,
+        });
         await fs.ensureDir("components/" + response.name);
         await fs.copy(DEFAULT_EXAMPLE_COMPONENT_TEMPLATE_PATH, `./components/${response.name}/`);
         await fs.writeFile(`components/${response.name}/config.ts`, configTs);
@@ -254,26 +262,27 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
     }
     async run() {
         this.log();
+        const { flags: parsedFlags } = await this.parse(CreateComponent);
         const isFirstTimeCreate = !(await fs.exists("package.json"));
-        let response;
         if (isFirstTimeCreate) {
             this.log(`${(0, colorette_1.cyanBright)("ℹ")} Welcome to Custom Components! In order to help you get started, we’ve built an example To-Do List Component. You can use this component as a template as you build your own Custom Component. To work with this component, we recommend following along with our quickstart guide: ${(0, colorette_1.magenta)("https://docs.superblocks.com/applications/custom-components/quickstart")}`);
             this.log();
+        }
+        let initExampleComponent = parsedFlags.example;
+        if (!parsedFlags.example && isFirstTimeCreate) {
+            // if the example component flag is not set and this is the first time the user is creating a component, prompt the user
             this.log(`If you choose to generate the example component, you will not have to provide any additional inputs. You can re-run superblocks components create once you are ready to create your own component from scratch. `);
             this.log();
-            const initExampleComponent = (await (0, enquirer_1.prompt)({
+            initExampleComponent = (await (0, enquirer_1.prompt)({
                 name: "value",
                 type: "confirm",
                 message: "Would you like to generate an example custom component?",
                 initial: false,
             })).value;
-            response = initExampleComponent
-                ? await this.initializeComponentByExample()
-                : await this.initializeComponentByWizard(isFirstTimeCreate);
-        }
-        else {
-            response = await this.initializeComponentByWizard(isFirstTimeCreate);
         }
+        const response = initExampleComponent
+            ? await this.initializeComponentByExample()
+            : await this.initializeComponentByWizard(isFirstTimeCreate);
         this.log((0, colorette_1.green)("Successfully created component! Added the following files:"));
         this.log();
         const tree = core_1.ux.tree();
@@ -307,4 +316,9 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
     }
 }
 CreateComponent.description = "Creates a new Superblocks component in the current application folder";
+CreateComponent.flags = {
+    example: core_1.Flags.boolean({
+        description: "Create example component",
+    }),
+};
 exports.default = CreateComponent;

package/dist/commands/components/upload.js

@@ -52,7 +52,20 @@ class Upload extends authenticated_command_1.AuthenticatedApplicationCommand {
                     write: true,
                 },
                 customLogger: viteLogger,
-                plugins: [(0, plugin_react_1.default)(), (0, react_shim_1.injectReactVersionsPlugin)(), (0, css_plugin_1.productionCssPlugin)()],
+                plugins: [
+                    (0, plugin_react_1.default)(),
+                    (0, react_shim_1.injectReactVersionsPlugin)(),
+                    (0, css_plugin_1.productionCssPlugin)(),
+                    {
+                        name: "remove-node-module-maps",
+                        apply: "build",
+                        transform(code, id) {
+                            if (id.includes("node_modules")) {
+                                return { code, map: { mappings: "" } }; // removes these sourcemaps
+                            }
+                        },
+                    },
+                ],
             });
         })();
         core_1.ux.action.stop();
@@ -68,6 +81,7 @@ class Upload extends authenticated_command_1.AuthenticatedApplicationCommand {
             const fileRelativePaths = [];
             const excluded = [
                 ".superblocks",
+                ".git",
                 "node_modules",
                 "apis",
                 "page.yaml",
@@ -80,8 +94,7 @@ class Upload extends authenticated_command_1.AuthenticatedApplicationCommand {
         }
         catch (e) {
             core_1.ux.action.stop();
-            this.log(e.message);
-            this.error("Failed to upload components", { exit: 1 });
+            this.error(`Failed to upload components - ${e.message}`, { exit: 1 });
         }
         this.log("You can now disable local dev mode and test your production assets");
     }

package/dist/commands/components/watch.js

@@ -60,6 +60,9 @@ class Watch extends authenticated_command_1.AuthenticatedApplicationCommand {
                 server: {
                     port,
                 },
+                resolve: {
+                    preserveSymlinks: true,
+                },
                 customLogger: viteLogger,
                 plugins: [
                     healthEndpointMiddleware(),

package/dist/commands/init.js

@@ -26,9 +26,8 @@ class Initialize extends authenticated_command_1.AuthenticatedCommand {
                 task: async (ctx) => {
                     ctx.fetchedResources = {};
                     ctx.writtenResources = {};
-                    ctx.now = new Date().toISOString();
                     try {
-                        ctx.existingSuperblocksConfig = (await (0, util_1.getSuperblocksMonorepoConfigJson)())[0];
+                        ctx.existingSuperblocksConfig = (await (0, util_1.getSuperblocksMonorepoConfigJson)(true))[0];
                     }
                     catch {
                         // no existing superblocks config
@@ -36,7 +35,7 @@ class Initialize extends authenticated_command_1.AuthenticatedCommand {
                 },
             },
             {
-                title: "Fetching applications, workflows and scheduled jobs...",
+                title: "Fetching applications...",
                 task: (ctx, task) => task.newListr([
                     {
                         title: "Fetching applications...",
@@ -46,7 +45,6 @@ class Initialize extends authenticated_command_1.AuthenticatedCommand {
                             const applications = await this.getSdk().fetchApplications();
                             for (const app of applications) {
                                 if (app.isEditable) {
-                                    0;
                                     ctx.fetchedResources[app.id] = {
                                         resourceType: "APPLICATION",
                                         name: app.name,
@@ -65,10 +63,13 @@ class Initialize extends authenticated_command_1.AuthenticatedCommand {
                                 const headers = {
                                     [util_1.COMPONENT_EVENT_HEADER]: util_1.ComponentEvent.INIT,
                                 };
-                                const application = await this.getSdk().fetchApplication({
+                                const application = await this.getSdk().fetchApplicationWithComponents({
                                     applicationId: resourceId,
                                     headers,
                                 });
+                                if (!application) {
+                                    throw new util_1.NotFoundError(`Application ${resourceId} was not found`);
+                                }
                                 ctx.fetchedResources[application.application.id] = {
                                     resourceType,
                                     name: application.application.name,
@@ -99,7 +100,6 @@ class Initialize extends authenticated_command_1.AuthenticatedCommand {
                 title: "Writing resources to a disk...",
                 task: async (ctx, task) => {
                     const subtasks = [];
-                    const now = new Date().toISOString();
                     for (const resourceId of ctx.resourceIdsToInitialize) {
                         const resource = ctx.fetchedResources[resourceId];
                         if (!resource) {
@@ -113,14 +113,14 @@ class Initialize extends authenticated_command_1.AuthenticatedCommand {
                                         const headers = {
                                             [util_1.COMPONENT_EVENT_HEADER]: util_1.ComponentEvent.INIT,
                                         };
-                                        const application = await this.getSdk().fetchApplication({
+                                        const application = await this.getSdk().fetchApplicationWithComponents({
                                             applicationId: resourceId,
                                             viewMode: ctx.viewMode,
                                             headers,
                                         });
                                         task.title += `: fetched`;
                                         ctx.writtenResources[resourceId] =
-                                            await (0, version_control_1.writeResourceToDisk)("APPLICATION", resourceId, application, now, process.cwd());
+                                            await (0, version_control_1.writeResourceToDisk)("APPLICATION", resourceId, application, process.cwd());
                                         task.title += `: done`;
                                     },
                                 });
@@ -133,7 +133,7 @@ class Initialize extends authenticated_command_1.AuthenticatedCommand {
                                         const backend = await this.getSdk().fetchApi(resourceId, ctx.viewMode);
                                         task.title += `: fetched`;
                                         ctx.writtenResources[resourceId] =
-                                            await (0, version_control_1.writeResourceToDisk)("BACKEND", resourceId, backend, now, process.cwd());
+                                            await (0, version_control_1.writeResourceToDisk)("BACKEND", resourceId, backend, process.cwd());
                                         task.title += `: done`;
                                     },
                                 });

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 = new Date().toISOString();
+                    ctx.removedResourceIds = [];
                     try {
                         [
                             ctx.existingSuperblocksRootConfig,
@@ -35,6 +35,78 @@ class Pull extends authenticated_command_1.AuthenticatedCommand {
                     }
                 },
             },
+            {
+                title: "Checking for deleted Superblocks resources...",
+                task: async (ctx, task) => {
+                    var _a, _b, _c;
+                    try {
+                        for (const [resourceId, resource] of Object.entries((_b = (_a = ctx.existingSuperblocksRootConfig) === null || _a === void 0 ? void 0 : _a.resources) !== null && _b !== void 0 ? _b : {})) {
+                            switch (resource === null || resource === void 0 ? void 0 : resource.resourceType) {
+                                case "APPLICATION": {
+                                    try {
+                                        await this.getSdk().fetchApplication({
+                                            applicationId: resourceId,
+                                        });
+                                    }
+                                    catch (error) {
+                                        if (error instanceof util_1.NotFoundError) {
+                                            ctx.removedResourceIds.push(resourceId);
+                                        }
+                                        else {
+                                            throw error;
+                                        }
+                                    }
+                                    break;
+                                }
+                                case "BACKEND": {
+                                    try {
+                                        await this.getSdk().fetchApi(resourceId);
+                                    }
+                                    catch (error) {
+                                        if (error instanceof util_1.NotFoundError) {
+                                            ctx.removedResourceIds.push(resourceId);
+                                        }
+                                        else {
+                                            throw error;
+                                        }
+                                    }
+                                    break;
+                                }
+                                default: {
+                                    this.warn(`Unsupported resource type, resource: ${JSON.stringify(resource)}`);
+                                }
+                            }
+                        }
+                        if (ctx.removedResourceIds.length === 0) {
+                            return;
+                        }
+                        const listOfDeletedResources = ctx.removedResourceIds
+                            .map((id) => `- ${ctx.existingSuperblocksRootConfig.resources[id].location}`)
+                            .join("\n");
+                        const removeResourcesFromDisk = await task.prompt([
+                            {
+                                name: "removeResourcesFromDisk",
+                                type: "confirm",
+                                message: `Warning: The following resources could not be found in Superblocks.
+${listOfDeletedResources}
+
+Automatically removing resources from your local Superblocks project.
+
+Would you like to also delete these resources from your filesystem?`,
+                            },
+                        ]);
+                        if (removeResourcesFromDisk) {
+                            for (const resourceId of ctx.removedResourceIds) {
+                                const resource = (_c = ctx.existingSuperblocksRootConfig) === null || _c === void 0 ? void 0 : _c.resources[resourceId];
+                                await (0, version_control_1.removeResourceFromDisk)(resource.location);
+                            }
+                        }
+                    }
+                    catch (e) {
+                        this.warn(`Could not check for deleted Superblocks resources. Continuing...: ${e.message}`);
+                    }
+                },
+            },
             {
                 title: "Pulling resources...",
                 task: async (ctx, task) => {
@@ -42,7 +114,6 @@ 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 = 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];
@@ -54,14 +125,14 @@ class Pull extends authenticated_command_1.AuthenticatedCommand {
                                         const headers = {
                                             [util_1.COMPONENT_EVENT_HEADER]: util_1.ComponentEvent.PULL,
                                         };
-                                        const application = await this.getSdk().fetchApplication({
+                                        const application = await this.getSdk().fetchApplicationWithComponents({
                                             applicationId: resourceId,
                                             viewMode,
                                             headers,
                                         });
                                         task.title += `: fetched`;
                                         ctx.writtenResources[resourceId] =
-                                            await (0, version_control_1.writeResourceToDisk)("APPLICATION", resourceId, application, now, superblocksRootPath, resource.location);
+                                            await (0, version_control_1.writeResourceToDisk)("APPLICATION", resourceId, application, superblocksRootPath, resource.location);
                                         task.title += `: done`;
                                     },
                                 });
@@ -74,7 +145,7 @@ class Pull extends authenticated_command_1.AuthenticatedCommand {
                                         const backend = await this.getSdk().fetchApi(resourceId, viewMode);
                                         task.title += `: fetched`;
                                         ctx.writtenResources[resourceId] =
-                                            await (0, version_control_1.writeResourceToDisk)("BACKEND", resourceId, backend, now, superblocksRootPath, resource.location);
+                                            await (0, version_control_1.writeResourceToDisk)("BACKEND", resourceId, backend, superblocksRootPath, resource.location);
                                         task.title += `: done`;
                                     },
                                 });
@@ -95,8 +166,8 @@ class Pull extends authenticated_command_1.AuthenticatedCommand {
                 title: "Updating Superblocks project file...",
                 task: async (ctx) => {
                     const [superblocksRootConfig, rootConfigPath] = await (0, util_1.getSuperblocksMonorepoConfigJson)(true);
-                    for (const [resourceId, resource] of Object.entries(ctx.writtenResources)) {
-                        superblocksRootConfig.resources[resourceId] = resource;
+                    for (const removedResourceId of ctx.removedResourceIds) {
+                        delete superblocksRootConfig.resources[removedResourceId];
                     }
                     // update superblocks.json file
                     await fs.writeFile(rootConfigPath, JSON.stringify((0, version_control_1.sortByKey)(superblocksRootConfig), null, 2));
@@ -125,6 +196,9 @@ class Pull extends authenticated_command_1.AuthenticatedCommand {
         const initialSelections = [];
         let counter = 0;
         for (const [resourceId, resource] of Object.entries((_f = (_e = ctx.existingSuperblocksRootConfig) === null || _e === void 0 ? void 0 : _e.resources) !== null && _f !== void 0 ? _f : {})) {
+            if (ctx.removedResourceIds.includes(resourceId)) {
+                continue;
+            }
             choices.push({
                 name: resourceId,
                 message: resource.location,

package/dist/commands/rm.d.ts

@@ -0,0 +1,12 @@
+import { AuthenticatedCommand } from "../common/authenticated-command";
+export default class Remove extends AuthenticatedCommand {
+    static description: string;
+    static examples: string[];
+    static args: {
+        resourceLocation: import("@oclif/core/lib/interfaces/parser").Arg<string | undefined, Record<string, unknown>>;
+    };
+    run(): Promise<void>;
+    private createTasks;
+    private getResourcesToRemove;
+    private findDuplicates;
+}

package/dist/commands/rm.js

@@ -0,0 +1,185 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const core_1 = require("@oclif/core");
+const util_1 = require("@superblocksteam/util");
+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 version_control_1 = require("../common/version-control");
+class Remove extends authenticated_command_1.AuthenticatedCommand {
+    async run() {
+        const { args } = await this.parse(Remove);
+        const tasks = this.createTasks(args);
+        try {
+            await tasks.run();
+        }
+        catch (error) {
+            this.error(error.message);
+        }
+    }
+    createTasks(args) {
+        const tasks = new listr2_1.Listr([
+            {
+                title: "Checking for existing Superblocks project...",
+                task: async (ctx) => {
+                    ctx.fetchedResources = {};
+                    ctx.removedResourceIds = [];
+                    try {
+                        ctx.existingSuperblocksConfig = (await (0, util_1.getSuperblocksMonorepoConfigJson)(true))[0];
+                    }
+                    catch {
+                        // no existing superblocks config
+                        this.error(`No Superblocks project found in the current folder hierarchy.`);
+                    }
+                },
+            },
+            {
+                title: "Fetching applications...",
+                task: (ctx, task) => task.newListr([
+                    {
+                        title: "Fetching applications...",
+                        enabled: () => !args.resourceLocation,
+                        task: async (ctx, task) => {
+                            // applications choices
+                            const applications = await this.getSdk().fetchApplications();
+                            for (const app of applications) {
+                                ctx.fetchedResources[app.id] = {
+                                    resourceType: "APPLICATION",
+                                    name: app.name,
+                                };
+                            }
+                            task.title += `: completed`;
+                        },
+                    },
+                ]),
+            },
+            {
+                title: "Selecting resources to remove...",
+                task: async (ctx, task) => {
+                    const resourceIdsToRemove = await this.getResourcesToRemove(ctx, task, args);
+                    ctx.resourceIdsToRemove = resourceIdsToRemove;
+                },
+            },
+            {
+                title: "Removing resources...",
+                task: async (ctx, task) => {
+                    var _a;
+                    const subtasks = [];
+                    for (const resourceId of ctx.resourceIdsToRemove) {
+                        const resourceLocation = (_a = ctx.existingSuperblocksConfig) === null || _a === void 0 ? void 0 : _a.resources[resourceId].location;
+                        if (!resourceLocation) {
+                            this.error(`Resource location not found for resource with id ${resourceId}`);
+                        }
+                        subtasks.push({
+                            title: `Removing ${resourceId} from ${resourceLocation}...`,
+                            task: async (_ctx, task) => {
+                                await (0, version_control_1.removeResourceFromDisk)(resourceLocation);
+                                ctx.removedResourceIds.push(resourceId);
+                                task.title += `: done`;
+                            },
+                        });
+                    }
+                    return task.newListr(subtasks, {
+                        concurrent: true,
+                    });
+                },
+            },
+            {
+                title: "Updating Superblocks project file...",
+                task: async (ctx) => {
+                    const [superblocksRootConfig, rootConfigPath] = await (0, util_1.getSuperblocksMonorepoConfigJson)(true);
+                    for (const removedResourceId of ctx.removedResourceIds) {
+                        delete superblocksRootConfig.resources[removedResourceId];
+                    }
+                    // update superblocks.json file
+                    await fs.writeFile(rootConfigPath, JSON.stringify((0, version_control_1.sortByKey)(superblocksRootConfig), null, 2));
+                },
+            },
+        ], {
+            concurrent: false,
+        });
+        return tasks;
+    }
+    async getResourcesToRemove(ctx, task, args) {
+        var _a;
+        if (args.resourceLocation) {
+            const [resourceId] = getResourceIdFromLocation(ctx, args.resourceLocation);
+            return [resourceId];
+        }
+        else {
+            const choices = [];
+            for (const [resourceId, resource] of Object.entries(ctx.fetchedResources)) {
+                if ((_a = ctx.existingSuperblocksConfig) === null || _a === void 0 ? void 0 : _a.resources[resourceId]) {
+                    choices.push({
+                        name: resourceId,
+                        message: `${resource.name} (${resource.resourceType})`,
+                    });
+                }
+            }
+            if ((0, lodash_1.isEmpty)(choices)) {
+                this.error(`No resources found in your project. Please make sure you have at least one application, workflow or scheduled job in your project.`);
+            }
+            const resourceIdsToRemove = await task.prompt([
+                {
+                    type: "AutoComplete",
+                    name: "resourceIdsToRemove",
+                    message: `Select resources to remove (${version_control_1.MULTI_SELECT_PROMPT_HELP})`,
+                    choices: choices,
+                    multiple: true,
+                    validate: version_control_1.atLeastOneSelection,
+                    prefix: "▸",
+                    indicator: "◉",
+                },
+            ]);
+            const duplicates = await this.findDuplicates(resourceIdsToRemove, ctx.fetchedResources);
+            if (!(0, lodash_1.isEmpty)(duplicates)) {
+                this.error(`Duplicate resources selected: ${duplicates
+                    .map((duplicate) => `${duplicate.name} (${duplicate.resourceType}) id: ${duplicate.id}`)
+                    .join(", ")}. Please make sure to select unique resources or rename them so that they have unique names.`);
+            }
+            return resourceIdsToRemove;
+        }
+    }
+    async findDuplicates(selectedResourcesIds, resources) {
+        const selectedResources = selectedResourcesIds
+            .map((id) => {
+            return { ...resources[id], id };
+        })
+            .filter((resource) => resource !== undefined);
+        const countResourceNamesByType = {};
+        for (const resource of selectedResources) {
+            if (!countResourceNamesByType[resource.resourceType]) {
+                countResourceNamesByType[resource.resourceType] = {};
+            }
+            if (countResourceNamesByType[resource.resourceType][resource.name]) {
+                countResourceNamesByType[resource.resourceType][resource.name] += 1;
+            }
+            else {
+                countResourceNamesByType[resource.resourceType][resource.name] = 1;
+            }
+        }
+        return selectedResources.filter((resource) => countResourceNamesByType[resource.resourceType][resource.name] > 1);
+    }
+}
+Remove.description = "Remove a Superblocks resource from the local Superblocks project and delete the resource folder directory locally (if it exists)";
+Remove.examples = [
+    "<%= config.bin %> <%= command.id %>",
+    "<%= config.bin %> <%= command.id %> apps/my-spectacular-app",
+];
+Remove.args = {
+    resourceLocation: core_1.Args.string({
+        description: "Superblocks resource location (i.e. apps/my-spectacular-app)",
+    }),
+};
+exports.default = Remove;
+function getResourceIdFromLocation(ctx, resourceLocation) {
+    var _a, _b;
+    for (const [resourceId, resource] of Object.entries((_b = (_a = ctx.existingSuperblocksConfig) === null || _a === void 0 ? void 0 : _a.resources) !== null && _b !== void 0 ? _b : {})) {
+        if (resource.location === resourceLocation) {
+            return [resourceId, resource.resourceType];
+        }
+    }
+    throw new Error(`No resource found with the given location: ${resourceLocation}`);
+}

package/dist/common/authenticated-command.js

@@ -9,7 +9,6 @@ const util_1 = require("@superblocksteam/util");
 const colorette_1 = require("colorette");
 const fs_extra_1 = tslib_1.__importDefault(require("fs-extra"));
 const semver_1 = tslib_1.__importDefault(require("semver"));
-const yaml_1 = require("yaml");
 const migrationWarningsForApplications_1 = require("../util/migrationWarningsForApplications");
 const migrationsForDotfiles_1 = require("../util/migrationsForDotfiles");
 const version_control_1 = require("./version-control");
@@ -115,7 +114,7 @@ class AuthenticatedApplicationCommand extends AuthenticatedCommand {
         return new URL(`/applications/${this.applicationConfig.id}/pages/${this.applicationConfig.defaultPageId}/edit`, baseUrl).toString();
     }
     async init() {
-        var _a;
+        var _a, _b;
         await super.init();
         try {
             this.applicationConfig = await (0, util_1.getSuperblocksApplicationConfigJson)();
@@ -125,18 +124,22 @@ class AuthenticatedApplicationCommand extends AuthenticatedCommand {
                 exit: 1,
             });
         }
+        core_1.ux.action.start("Checking application...");
         try {
-            const appYaml = await fs_extra_1.default.readFile("application.yaml", "utf-8");
-            const appJson = await (0, yaml_1.parse)(appYaml);
-            if ((_a = appJson === null || appJson === void 0 ? void 0 : appJson.settings) === null || _a === void 0 ? void 0 : _a.cliVersion) {
-                const warningMessage = (0, migrationWarningsForApplications_1.getWarningsForApplicationMigration)(appJson.settings.cliVersion, this.config.version);
+            const application = await this.getSdk().fetchApplication({
+                applicationId: this.applicationConfig.id,
+            });
+            core_1.ux.action.stop();
+            if ((_b = (_a = application === null || application === void 0 ? void 0 : application.application) === null || _a === void 0 ? void 0 : _a.settings) === null || _b === void 0 ? void 0 : _b.cliVersion) {
+                const warningMessage = (0, migrationWarningsForApplications_1.getWarningsForApplicationMigration)(application.application.settings.cliVersion, this.config.version);
                 if (warningMessage) {
                     this.log(warningMessage);
                 }
             }
         }
         catch (e) {
-            this.warn(`Could not read page.yaml to determine version compatibility: ${e.message}`);
+            core_1.ux.action.stop();
+            this.warn(`Could not read the application from Superblocks: ${e.message}`);
         }
     }
     async registerComponents(injectedHeaders) {
@@ -150,7 +153,10 @@ class AuthenticatedApplicationCommand extends AuthenticatedCommand {
 
 ${(0, colorette_1.cyan)("superblocks migrate")}`);
             }
-            if (!semver_1.default.satisfies(this.config.version, versionStr)) {
+            if (versionStr.startsWith("file:")) {
+                this.warn(`You are using a local version of the @superblocksteam/custom-components library. It is not possible to check its version compatibility with the CLI.`);
+            }
+            else if (!semver_1.default.satisfies(this.config.version, versionStr)) {
                 throw new Error(`You must upgrade the @superblocksteam/custom-components library. You are using ${versionStr} but the CLI is ${this.config.version}. Run:
 
 ${(0, colorette_1.cyan)("superblocks migrate")}`);

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

@@ -18,16 +18,22 @@ export default {
   componentPath: "components/${name}/component.tsx",
   properties: [${indent(propertiesRendered, 4).trim()}],
   events: [${indent(eventHandlersRendered, 4).trim()}],
+  gridDimensions: {
+    initialColumns: 50,
+    initialRows: 30,
+  },
 } satisfies ComponentConfig;
 `;
 exports.getDefaultConfigTs = getDefaultConfigTs;
-const getDefaultComponentTsx = (properties, eventHandlers) => `import React from "react";
-import { useSuperblocksContext } from "@superblocksteam/custom-components";
+const getDefaultComponentTsx = (properties, eventHandlers) => `import { useSuperblocksContext, useSuperblocksIsLoading } from "@superblocksteam/custom-components";
 import { type Props, type EventTriggers } from "./types";
 
 export default function Component({${properties.length === 0
     ? ""
     : "\n" + properties.map((v) => indent(v.path, 2) + ",\n").join("")}}: Props) {
+  // If any of your component's properties are connected to APIs, you might want to show a loading indicator while the data is
+  // loading. The \`useSuperblocksIsLoading\` hook returns a boolean that indicates whether this is the case.
+  const isLoading = useSuperblocksIsLoading();
   const {
     updateProperties,
     events: {${"\n" + eventHandlers.map((v) => indent(v, 6) + ",\n").join("")}    },
@@ -44,7 +50,7 @@ export default function Component({${properties.length === 0
         backgroundColor: "#a7aebe",
       }}
     >
-      <h1 style={{ color: "white" }}>{"<Insert Component Here>"}</h1>
+      <h1 style={{ color: "white" }}>{isLoading ? <div>Loading...</div> : "<Insert Component Here>"}</h1>
     </div>
   );
 }

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

@@ -9,6 +9,7 @@ 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 = "Type to filter, 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: string, rootPath: string, existingRelativeLocation?: string): Promise<VersionedResourceConfig>;
+export declare function writeResourceToDisk(resourceType: string, resourceId: string, resource: any, rootPath: string, existingRelativeLocation?: string): Promise<VersionedResourceConfig>;
+export declare function removeResourceFromDisk(resourceLocation: string): Promise<void>;
 export declare function getMode(task: any, mode: ModeFlag): Promise<ViewMode>;
 export declare function sortByKey(obj: unknown): unknown;

package/dist/common/version-control.js

@@ -1,6 +1,6 @@
 "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.modeFlagToViewMode = exports.modeFlagValuesMap = exports.DEPLOYED_MODE = exports.MOST_RECENT_COMMIT_MODE = exports.LATEST_EDITS_MODE = void 0;
+exports.sortByKey = exports.getMode = exports.removeResourceFromDisk = 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 https = tslib_1.__importStar(require("https"));
 const node_path_1 = tslib_1.__importDefault(require("node:path"));
@@ -87,7 +87,7 @@ async function downloadFile(rootDirectory, filepath, url) {
     }
     return Promise.resolve("");
 }
-async function writeResourceToDisk(resourceType, resourceId, resource, now, rootPath, existingRelativeLocation) {
+async function writeResourceToDisk(resourceType, resourceId, resource, rootPath, existingRelativeLocation) {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j;
     switch (resourceType) {
         case "APPLICATION": {
@@ -181,6 +181,10 @@ async function writeResourceToDisk(resourceType, resourceId, resource, now, root
     }
 }
 exports.writeResourceToDisk = writeResourceToDisk;
+async function removeResourceFromDisk(resourceLocation) {
+    await fs.remove(resourceLocation);
+}
+exports.removeResourceFromDisk = removeResourceFromDisk;
 async function getMode(task, mode) {
     if (mode) {
         return modeFlagToViewMode(mode);

package/dist/util/migrationWarningsForApplications.js

@@ -26,6 +26,20 @@ To manually migrate:
 
 1. Rename "eventHandlers" to "events".
 2. Update your properties to use the new format: ${(0, colorette_1.magenta)("https://docs.superblocks.com/applications/custom-components/development-lifecycle#configts")}
+`,
+    },
+    {
+        version: "0.0.23",
+        message: `${(0, colorette_1.red)("Warning")}: Type definitions for custom components have changed to include null values,
+which were missing from previous types. The previous types were not accurate.
+Superblocks represents missing/undefined properties as null.
+
+To manually update, you should follow Typescript errors in your IDE and update your code
+to handle null values.
+
+${(0, colorette_1.bold)("Your existing components are safe.")}
+
+See changelog: ${(0, colorette_1.magenta)("https://github.com/superblocksteam/superblocks-cli/blob/main/CHANGELOG.md")}
 `,
     },
 ];

package/oclif.manifest.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.0.22",
+  "version": "1.0.0",
   "commands": {
     "init": {
       "id": "init",
@@ -105,6 +105,26 @@
         }
       }
     },
+    "rm": {
+      "id": "rm",
+      "description": "Remove a Superblocks resource from the local Superblocks project and delete the resource folder directory locally (if it exists)",
+      "strict": true,
+      "pluginName": "@superblocksteam/cli",
+      "pluginAlias": "@superblocksteam/cli",
+      "pluginType": "core",
+      "aliases": [],
+      "examples": [
+        "<%= config.bin %> <%= command.id %>",
+        "<%= config.bin %> <%= command.id %> apps/my-spectacular-app"
+      ],
+      "flags": {},
+      "args": {
+        "resourceLocation": {
+          "name": "resourceLocation",
+          "description": "Superblocks resource location (i.e. apps/my-spectacular-app)"
+        }
+      }
+    },
     "components:create": {
       "id": "components:create",
       "description": "Creates a new Superblocks component in the current application folder",
@@ -113,7 +133,14 @@
       "pluginAlias": "@superblocksteam/cli",
       "pluginType": "core",
       "aliases": [],
-      "flags": {},
+      "flags": {
+        "example": {
+          "name": "example",
+          "type": "boolean",
+          "description": "Create example component",
+          "allowNo": false
+        }
+      },
       "args": {}
     },
     "components:register": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@superblocksteam/cli",
-  "version": "0.0.22",
+  "version": "1.0.0",
   "description": "Official Superblocks CLI",
   "bin": {
     "superblocks": "bin/run"
@@ -18,12 +18,12 @@
     "@oclif/core": "^2.11.7",
     "@oclif/plugin-help": "^5.2.16",
     "@oclif/plugin-plugins": "^3.1.10",
-    "@superblocksteam/css-plugin": "*",
-    "@superblocksteam/react-shim": "*",
-    "@superblocksteam/sdk": "*",
-    "@superblocksteam/util": "*",
-    "@superblocksteam/vite-custom-component-reload-plugin": "*",
-    "@vitejs/plugin-react": "^4.0.0",
+    "@superblocksteam/css-plugin": "1.0.0",
+    "@superblocksteam/react-shim": "1.0.0",
+    "@superblocksteam/sdk": "1.0.0",
+    "@superblocksteam/util": "1.0.0",
+    "@superblocksteam/vite-custom-component-reload-plugin": "1.0.0",
+    "@vitejs/plugin-react": "^4.0.4",
     "colorette": "^2.0.19",
     "enquirer": "^2.3.6",
     "fs-extra": "^11.1.1",
@@ -68,10 +68,12 @@
     "posttest": "npm run lint",
     "prepack": "npm run build && oclif manifest && oclif readme",
     "test": "mocha --forbid-only \"test/**/*.test.ts\"",
+    "typecheck": "tsc --noEmit",
     "update-readme": "oclif readme"
   },
   "engines": {
-    "node": ">=14.0.0"
+    "node": ">=16.0.0",
+    "npm": ">=8.0.0"
   },
   "keywords": [
     "oclif"