@superblocksteam/cli 1.10.0 → 1.12.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE.txt +87 -0
- package/README.md +6 -6
- package/assets/custom-components/setup/tsconfig.json +0 -1
- package/bin/dev +5 -7
- package/bin/run +1 -3
- package/dist/appendHotReloadEventPlugin.mjs +43 -0
- package/dist/commands/commits.d.mts +18 -0
- package/dist/commands/{commits.js → commits.mjs} +59 -67
- package/dist/commands/components/{create.d.ts → create.d.mts} +2 -2
- package/dist/commands/components/{create.js → create.mjs} +84 -93
- package/dist/commands/components/{register.d.ts → register.d.mts} +1 -1
- package/dist/commands/components/register.mjs +12 -0
- package/dist/commands/components/{upload.d.ts → upload.d.mts} +2 -2
- package/dist/commands/components/{upload.js → upload.mjs} +39 -43
- package/dist/commands/components/{watch.d.ts → watch.d.mts} +1 -1
- package/dist/commands/components/{watch.js → watch.mjs} +29 -36
- package/dist/commands/config/{set.d.ts → set.d.mts} +2 -2
- package/dist/commands/config/{set.js → set.mjs} +28 -32
- package/dist/commands/{init.d.ts → init.d.mts} +4 -4
- package/dist/commands/{init.js → init.mjs} +58 -64
- package/dist/commands/{login.d.ts → login.d.mts} +1 -1
- package/dist/commands/login.mjs +55 -0
- package/dist/commands/{migrate.d.ts → migrate.d.mts} +1 -1
- package/dist/commands/{migrate.js → migrate.mjs} +34 -42
- package/dist/commands/pull.d.mts +17 -0
- package/dist/commands/{pull.js → pull.mjs} +72 -80
- package/dist/commands/push.d.mts +15 -0
- package/dist/commands/{push.js → push.mjs} +81 -90
- package/dist/commands/{rm.d.ts → rm.d.mts} +2 -2
- package/dist/commands/{rm.js → rm.mjs} +34 -40
- package/dist/common/{authenticated-command.js → authenticated-command.mjs} +65 -75
- package/dist/common/defaults/{create-component-defaults.js → create-component-defaults.mjs} +2 -7
- package/dist/common/{version-control.d.ts → version-control.d.mts} +1 -1
- package/dist/common/{version-control.js → version-control.mjs} +170 -202
- package/dist/index.js +1 -5
- package/dist/{productionCssPlugin.js → productionCssPlugin.mjs} +4 -10
- package/dist/{reactShimPlugin.js → reactShimPlugin.mjs} +17 -24
- package/dist/util/migrationWarningsForApplications.mjs +47 -0
- package/dist/util/{migrationsForDotfiles.js → migrationsForDotfiles.mjs} +10 -17
- package/oclif.manifest.json +274 -161
- package/package.json +43 -41
- package/dist/appendHotReloadEventPlugin.js +0 -48
- package/dist/commands/commits.d.ts +0 -18
- package/dist/commands/components/register.js +0 -15
- package/dist/commands/login.js +0 -61
- package/dist/commands/pull.d.ts +0 -17
- package/dist/commands/push.d.ts +0 -15
- package/dist/util/migrationWarningsForApplications.js +0 -52
- /package/dist/{appendHotReloadEventPlugin.d.ts → appendHotReloadEventPlugin.d.mts} +0 -0
- /package/dist/common/{authenticated-command.d.ts → authenticated-command.d.mts} +0 -0
- /package/dist/common/defaults/{create-component-defaults.d.ts → create-component-defaults.d.mts} +0 -0
- /package/dist/{productionCssPlugin.d.ts → productionCssPlugin.d.mts} +0 -0
- /package/dist/{reactShimPlugin.d.ts → reactShimPlugin.d.mts} +0 -0
- /package/dist/util/{migrationWarningsForApplications.d.ts → migrationWarningsForApplications.d.mts} +0 -0
- /package/dist/util/{migrationsForDotfiles.d.ts → migrationsForDotfiles.d.mts} +0 -0
|
@@ -1,23 +1,19 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
const
|
|
14
|
-
const
|
|
15
|
-
const
|
|
16
|
-
const
|
|
17
|
-
// eslint-disable-next-line unicorn/prefer-module
|
|
18
|
-
const rootDirectory = node_path_1.default.resolve(__dirname, "../../../");
|
|
19
|
-
const DEFAULT_PACKAGE_JSON_TEMPLATE_PATH = node_path_1.default.resolve(rootDirectory, "assets/custom-components/setup");
|
|
20
|
-
const DEFAULT_EXAMPLE_COMPONENT_TEMPLATE_PATH = node_path_1.default.resolve(rootDirectory, "assets/custom-components/example");
|
|
1
|
+
import { exec } from "node:child_process";
|
|
2
|
+
import { randomUUID } from "node:crypto";
|
|
3
|
+
import path from "node:path";
|
|
4
|
+
import util from "node:util";
|
|
5
|
+
import { Flags, ux } from "@oclif/core";
|
|
6
|
+
import { dataTypeDefinions, ComponentEvent, COMPONENT_EVENT_HEADER, isValidIdentifier, isReservedPropertyName, suggestIdentifier, } from "@superblocksteam/util";
|
|
7
|
+
import { bold, cyanBright, green, magenta, red } from "colorette";
|
|
8
|
+
import enquirer from "enquirer";
|
|
9
|
+
import fs from "fs-extra";
|
|
10
|
+
import { isEmpty } from "lodash-es";
|
|
11
|
+
import { AuthenticatedApplicationCommand } from "../../common/authenticated-command.mjs";
|
|
12
|
+
import { getDefaultComponentTsx, getDefaultConfigTs, } from "../../common/defaults/create-component-defaults.mjs";
|
|
13
|
+
const { prompt } = enquirer;
|
|
14
|
+
const rootDirectory = path.resolve(new URL(import.meta.url).pathname, "../../../../");
|
|
15
|
+
const DEFAULT_PACKAGE_JSON_TEMPLATE_PATH = path.resolve(rootDirectory, "assets/custom-components/setup");
|
|
16
|
+
const DEFAULT_EXAMPLE_COMPONENT_TEMPLATE_PATH = path.resolve(rootDirectory, "assets/custom-components/example");
|
|
21
17
|
const tsStringify = (obj) => {
|
|
22
18
|
const entries = Object.entries(obj);
|
|
23
19
|
const stringifiedEntries = entries.map(([key, value]) => {
|
|
@@ -25,74 +21,77 @@ const tsStringify = (obj) => {
|
|
|
25
21
|
});
|
|
26
22
|
return `{\n${stringifiedEntries.join(",\n")}\n},\n`;
|
|
27
23
|
};
|
|
28
|
-
class CreateComponent extends
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
24
|
+
export default class CreateComponent extends AuthenticatedApplicationCommand {
|
|
25
|
+
static description = "Creates a new Superblocks component in the current application folder";
|
|
26
|
+
dataTypeToDefaultControlType = (propertyType) => {
|
|
27
|
+
switch (propertyType) {
|
|
28
|
+
case "any":
|
|
29
|
+
return "js-expr";
|
|
30
|
+
case "boolean":
|
|
31
|
+
return "switch";
|
|
32
|
+
default:
|
|
33
|
+
return "text";
|
|
34
|
+
}
|
|
35
|
+
};
|
|
36
|
+
static flags = {
|
|
37
|
+
example: Flags.boolean({
|
|
38
|
+
description: "Create example component",
|
|
39
|
+
}),
|
|
40
|
+
};
|
|
42
41
|
async initializeComponentByWizard(isFirstTimeCreate) {
|
|
43
|
-
this.log(`${
|
|
42
|
+
this.log(`${cyanBright("ℹ")} Follow this wizard to configure your Custom Component. You can always edit the generated config.ts file directly to modify your properties or events.`);
|
|
44
43
|
this.log();
|
|
45
|
-
const displayName = (await
|
|
44
|
+
const displayName = (await prompt({
|
|
46
45
|
type: "input",
|
|
47
46
|
name: "displayName",
|
|
48
47
|
message: "What is the display name of the component you want to create? (e.g. To-Do List)",
|
|
49
|
-
validate: (response) => !
|
|
48
|
+
validate: (response) => !isEmpty(response.trim()),
|
|
50
49
|
})).displayName;
|
|
51
|
-
const name = (await
|
|
50
|
+
const name = (await prompt({
|
|
52
51
|
type: "input",
|
|
53
52
|
name: "name",
|
|
54
53
|
message: "What is the machine readable name of the component you want to create?",
|
|
55
|
-
validate: (response) =>
|
|
56
|
-
initial:
|
|
54
|
+
validate: (response) => isValidIdentifier(response) || "Invalid identifier",
|
|
55
|
+
initial: suggestIdentifier(displayName, true) || "ToDoList",
|
|
57
56
|
})).name;
|
|
58
57
|
this.log();
|
|
59
|
-
this.log(`${
|
|
58
|
+
this.log(`${cyanBright("ℹ")} Properties represent the state of the component. You will define how each property is made available to the rest of your App and whether each property is displayed in the Properties Panel. Read more about properties here: ${magenta("https://docs.superblocks.com/applications/custom-components/#properties--events")}`);
|
|
60
59
|
this.log();
|
|
61
|
-
const hasProperties = (await
|
|
60
|
+
const hasProperties = (await prompt({
|
|
62
61
|
type: "confirm",
|
|
63
62
|
name: "hasProperties",
|
|
64
|
-
message: `Does this component have ${
|
|
63
|
+
message: `Does this component have ${bold("properties")}?`,
|
|
65
64
|
initial: false,
|
|
66
65
|
})).hasProperties;
|
|
67
66
|
const properties = [];
|
|
68
67
|
if (hasProperties) {
|
|
69
68
|
for (;;) {
|
|
70
|
-
const propertyPath = (await
|
|
69
|
+
const propertyPath = (await prompt({
|
|
71
70
|
type: "input",
|
|
72
71
|
name: "path",
|
|
73
72
|
message: "What is the path of the property? This will be used to access the property in your code (e.g. currentTasks)",
|
|
74
73
|
validate: (response) => {
|
|
75
|
-
if (!
|
|
74
|
+
if (!isValidIdentifier(response))
|
|
76
75
|
return "Invalid identifier";
|
|
77
|
-
if (
|
|
76
|
+
if (isReservedPropertyName(response))
|
|
78
77
|
return "Reserved property path (see https://docs.superblocks.com/applications/custom-components/faq#what-is-a-reserved-property)";
|
|
79
78
|
if (properties.some((v) => v.path === response))
|
|
80
79
|
return "Duplicate property path";
|
|
81
80
|
return true;
|
|
82
81
|
},
|
|
83
82
|
})).path;
|
|
84
|
-
const propertyType = (await
|
|
83
|
+
const propertyType = (await prompt({
|
|
85
84
|
type: "select",
|
|
86
85
|
name: "type",
|
|
87
86
|
message: `What is the type of ${propertyPath}?`,
|
|
88
|
-
choices: Object.entries(
|
|
87
|
+
choices: Object.entries(dataTypeDefinions).map(([k, v]) => ({
|
|
89
88
|
name: k,
|
|
90
89
|
message: v.prompt,
|
|
91
90
|
value: k,
|
|
92
91
|
})),
|
|
93
92
|
initial: 0,
|
|
94
93
|
})).type;
|
|
95
|
-
const showInPropsPanel = (await
|
|
94
|
+
const showInPropsPanel = (await prompt({
|
|
96
95
|
name: "value",
|
|
97
96
|
type: "confirm",
|
|
98
97
|
message: "Should this property be shown in the properties panel?",
|
|
@@ -101,12 +100,12 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
|
|
|
101
100
|
let propertiesPanelDisplay = undefined;
|
|
102
101
|
if (showInPropsPanel) {
|
|
103
102
|
this.log();
|
|
104
|
-
this.log(
|
|
105
|
-
const propertyLabel = (await
|
|
103
|
+
this.log(bold("Properties Panel Display Configuration"));
|
|
104
|
+
const propertyLabel = (await prompt({
|
|
106
105
|
type: "input",
|
|
107
106
|
name: "label",
|
|
108
107
|
message: "What is the label of the property? (e.g. Tasks)",
|
|
109
|
-
validate: (response) => !
|
|
108
|
+
validate: (response) => !isEmpty(response.trim()),
|
|
110
109
|
})).label.trim();
|
|
111
110
|
propertiesPanelDisplay = {
|
|
112
111
|
label: propertyLabel,
|
|
@@ -123,7 +122,7 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
|
|
|
123
122
|
isExternallySettable: true,
|
|
124
123
|
});
|
|
125
124
|
this.log();
|
|
126
|
-
const addAnotherProperty = (await
|
|
125
|
+
const addAnotherProperty = (await prompt({
|
|
127
126
|
type: "confirm",
|
|
128
127
|
name: "value",
|
|
129
128
|
message: "Do you want to add another property?",
|
|
@@ -135,32 +134,32 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
|
|
|
135
134
|
}
|
|
136
135
|
}
|
|
137
136
|
this.log();
|
|
138
|
-
this.log(`${
|
|
137
|
+
this.log(`${cyanBright("ℹ")} ${bold("Events")} represent the types of events that the component can trigger in Superblocks. Learn more about events: ${magenta("https://docs.superblocks.com/applications/custom-components/#properties--events")}`);
|
|
139
138
|
this.log();
|
|
140
|
-
const hasEventHandlers = (await
|
|
139
|
+
const hasEventHandlers = (await prompt({
|
|
141
140
|
type: "confirm",
|
|
142
141
|
name: "value",
|
|
143
|
-
message: `Does this component have ${
|
|
142
|
+
message: `Does this component have ${bold("events")}? (e.g. a date picker component that triggers an On Change event)`,
|
|
144
143
|
initial: false,
|
|
145
144
|
})).value;
|
|
146
145
|
const events = [];
|
|
147
146
|
if (hasEventHandlers) {
|
|
148
147
|
for (;;) {
|
|
149
|
-
const eventHandlerName = (await
|
|
148
|
+
const eventHandlerName = (await prompt({
|
|
150
149
|
name: "value",
|
|
151
150
|
type: "input",
|
|
152
151
|
message: "What is the label of the event? (e.g. On Change)",
|
|
153
|
-
validate: (response) => !
|
|
152
|
+
validate: (response) => !isEmpty(response.trim()),
|
|
154
153
|
})).value.trim();
|
|
155
|
-
const eventHandlerPath = (await
|
|
154
|
+
const eventHandlerPath = (await prompt({
|
|
156
155
|
name: "value",
|
|
157
156
|
message: "What is the path of the event? This will be used to trigger the event in your code (e.g. onChange)",
|
|
158
157
|
type: "input",
|
|
159
|
-
initial:
|
|
158
|
+
initial: suggestIdentifier(eventHandlerName) || "onChange",
|
|
160
159
|
validate: (response) => {
|
|
161
|
-
if (!
|
|
160
|
+
if (!isValidIdentifier(response))
|
|
162
161
|
return "Invalid identifier";
|
|
163
|
-
if (
|
|
162
|
+
if (isReservedPropertyName(response))
|
|
164
163
|
return "Reserved property path (see https://docs.superblocks.com/applications/custom-components/faq#what-is-a-reserved-property)";
|
|
165
164
|
if (events.some((v) => v.path === response))
|
|
166
165
|
return "Duplicate property path";
|
|
@@ -171,7 +170,7 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
|
|
|
171
170
|
label: eventHandlerName,
|
|
172
171
|
path: eventHandlerPath,
|
|
173
172
|
});
|
|
174
|
-
const addAnotherEventHandler = (await
|
|
173
|
+
const addAnotherEventHandler = (await prompt({
|
|
175
174
|
name: "value",
|
|
176
175
|
type: "confirm",
|
|
177
176
|
message: "Do you want to add another event?",
|
|
@@ -182,8 +181,8 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
|
|
|
182
181
|
}
|
|
183
182
|
}
|
|
184
183
|
}
|
|
185
|
-
const configTs =
|
|
186
|
-
id:
|
|
184
|
+
const configTs = getDefaultConfigTs({
|
|
185
|
+
id: randomUUID(),
|
|
187
186
|
name,
|
|
188
187
|
displayName,
|
|
189
188
|
propertiesRendered: properties
|
|
@@ -193,7 +192,7 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
|
|
|
193
192
|
.map((eventHandler) => tsStringify(eventHandler))
|
|
194
193
|
.join(""),
|
|
195
194
|
});
|
|
196
|
-
const componentTsx =
|
|
195
|
+
const componentTsx = getDefaultComponentTsx(properties, events.map((prop) => prop.path));
|
|
197
196
|
if (isFirstTimeCreate) {
|
|
198
197
|
await fs.copy(DEFAULT_PACKAGE_JSON_TEMPLATE_PATH, ".");
|
|
199
198
|
// There is a very old npm bug where it won't publish .gitignore files
|
|
@@ -241,8 +240,8 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
|
|
|
241
240
|
},
|
|
242
241
|
],
|
|
243
242
|
};
|
|
244
|
-
const configTs =
|
|
245
|
-
id:
|
|
243
|
+
const configTs = getDefaultConfigTs({
|
|
244
|
+
id: randomUUID(),
|
|
246
245
|
name: response.name,
|
|
247
246
|
displayName: response.displayName,
|
|
248
247
|
propertiesRendered: response.properties
|
|
@@ -268,7 +267,7 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
|
|
|
268
267
|
const { flags: parsedFlags } = await this.parse(CreateComponent);
|
|
269
268
|
const isFirstTimeCreate = !(await fs.exists("package.json"));
|
|
270
269
|
if (isFirstTimeCreate) {
|
|
271
|
-
this.log(`${
|
|
270
|
+
this.log(`${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: ${magenta("https://docs.superblocks.com/applications/custom-components/quickstart")}`);
|
|
272
271
|
this.log();
|
|
273
272
|
}
|
|
274
273
|
let initExampleComponent = parsedFlags.example;
|
|
@@ -276,7 +275,7 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
|
|
|
276
275
|
// if the example component flag is not set and this is the first time the user is creating a component, prompt the user
|
|
277
276
|
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. `);
|
|
278
277
|
this.log();
|
|
279
|
-
initExampleComponent = (await
|
|
278
|
+
initExampleComponent = (await prompt({
|
|
280
279
|
name: "value",
|
|
281
280
|
type: "confirm",
|
|
282
281
|
message: "Would you like to generate an example custom component?",
|
|
@@ -286,42 +285,34 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
|
|
|
286
285
|
const response = initExampleComponent
|
|
287
286
|
? await this.initializeComponentByExample()
|
|
288
287
|
: await this.initializeComponentByWizard(isFirstTimeCreate);
|
|
289
|
-
this.log(
|
|
288
|
+
this.log(green("Successfully created component! Added the following files:"));
|
|
290
289
|
this.log();
|
|
291
|
-
const tree =
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
tree.display();
|
|
290
|
+
const tree = `├─ components
|
|
291
|
+
│ └─ ${response.name}
|
|
292
|
+
│ ├─ config.ts # update this file to manage your component's properties and events
|
|
293
|
+
│ ├─ types.ts # this file contains your react component type definitions and is automatically updated while you run 'superblocks components watch'
|
|
294
|
+
│ └─ component.tsx # your component's react code`;
|
|
295
|
+
this.log(tree);
|
|
298
296
|
this.log();
|
|
299
|
-
this.log(`${
|
|
297
|
+
this.log(`${green("Remember to run $ ")}${magenta("superblocks components watch")}${green(" to watch for changes to your component files")}`);
|
|
300
298
|
this.log();
|
|
301
299
|
this.log(`Edit your component's react code here:
|
|
302
|
-
${
|
|
300
|
+
${green(`components/${response.name}/component.tsx`)}`);
|
|
303
301
|
this.log();
|
|
304
302
|
if (isFirstTimeCreate) {
|
|
305
|
-
|
|
303
|
+
ux.action.start("Installing dependencies...");
|
|
306
304
|
try {
|
|
307
|
-
await
|
|
305
|
+
await util.promisify(exec)("npm i");
|
|
308
306
|
}
|
|
309
307
|
catch {
|
|
310
|
-
|
|
311
|
-
this.error(
|
|
308
|
+
ux.action.stop();
|
|
309
|
+
this.error(red("Failed to install dependencies. Please run 'npm install' manually."));
|
|
312
310
|
}
|
|
313
|
-
|
|
311
|
+
ux.action.stop();
|
|
314
312
|
}
|
|
315
313
|
const headers = {
|
|
316
|
-
[
|
|
314
|
+
[COMPONENT_EVENT_HEADER]: ComponentEvent.CREATE,
|
|
317
315
|
};
|
|
318
316
|
this.registerComponents(headers);
|
|
319
317
|
}
|
|
320
318
|
}
|
|
321
|
-
CreateComponent.description = "Creates a new Superblocks component in the current application folder";
|
|
322
|
-
CreateComponent.flags = {
|
|
323
|
-
example: core_1.Flags.boolean({
|
|
324
|
-
description: "Create example component",
|
|
325
|
-
}),
|
|
326
|
-
};
|
|
327
|
-
exports.default = CreateComponent;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { AuthenticatedApplicationCommand } from "../../common/authenticated-command";
|
|
1
|
+
import { AuthenticatedApplicationCommand } from "../../common/authenticated-command.mjs";
|
|
2
2
|
export default class Register extends AuthenticatedApplicationCommand {
|
|
3
3
|
static description: string;
|
|
4
4
|
static examples: string[];
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { COMPONENT_EVENT_HEADER, ComponentEvent } from "@superblocksteam/util";
|
|
2
|
+
import { AuthenticatedApplicationCommand } from "../../common/authenticated-command.mjs";
|
|
3
|
+
export default class Register extends AuthenticatedApplicationCommand {
|
|
4
|
+
static description = "Registers all local component config files";
|
|
5
|
+
static examples = ["superblocks components register"];
|
|
6
|
+
async run() {
|
|
7
|
+
const headers = {
|
|
8
|
+
[COMPONENT_EVENT_HEADER]: ComponentEvent.REGISTER,
|
|
9
|
+
};
|
|
10
|
+
await this.registerComponents(headers);
|
|
11
|
+
}
|
|
12
|
+
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { AuthenticatedApplicationCommand } from "../../common/authenticated-command";
|
|
1
|
+
import { AuthenticatedApplicationCommand } from "../../common/authenticated-command.mjs";
|
|
2
2
|
export default class Upload extends AuthenticatedApplicationCommand {
|
|
3
3
|
static description: string;
|
|
4
4
|
static examples: string[];
|
|
5
5
|
static flags: {
|
|
6
|
-
branch: import("@oclif/core/
|
|
6
|
+
branch: import("@oclif/core/interfaces").OptionFlag<string | undefined, import("@oclif/core/interfaces").CustomOptions>;
|
|
7
7
|
};
|
|
8
8
|
run(): Promise<void>;
|
|
9
9
|
}
|
|
@@ -1,30 +1,38 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
1
|
+
import path from "path";
|
|
2
|
+
import { Flags, ux } from "@oclif/core";
|
|
3
|
+
import { COMPONENT_EVENT_HEADER, CUSTOM_COMPONENTS_PATH, ComponentEvent, } from "@superblocksteam/util";
|
|
4
|
+
import react from "@vitejs/plugin-react";
|
|
5
|
+
import { bold, green } from "colorette";
|
|
6
|
+
import fs from "fs-extra";
|
|
7
|
+
import { createLogger, build } from "vite";
|
|
8
|
+
import { AuthenticatedApplicationCommand } from "../../common/authenticated-command.mjs";
|
|
9
|
+
import { productionCssPlugin } from "../../productionCssPlugin.mjs";
|
|
10
|
+
import { injectReactVersionsPlugin } from "../../reactShimPlugin.mjs";
|
|
11
|
+
export default class Upload extends AuthenticatedApplicationCommand {
|
|
12
|
+
static description = "Upload creates a production-ready bundle and saves the files for use outside of Local Development mode.";
|
|
13
|
+
static examples = [
|
|
14
|
+
"<%= config.bin %> components upload",
|
|
15
|
+
"<%= config.bin %> components upload -b feature-branch",
|
|
16
|
+
];
|
|
17
|
+
static flags = {
|
|
18
|
+
branch: Flags.string({
|
|
19
|
+
char: "b",
|
|
20
|
+
description: "Superblocks branch to push to, the current (local) git branch will be used by default",
|
|
21
|
+
}),
|
|
22
|
+
};
|
|
15
23
|
async run() {
|
|
16
24
|
const { flags } = await this.parse(Upload);
|
|
17
|
-
|
|
18
|
-
const exists = await fs.pathExists(
|
|
25
|
+
ux.action.start("Scanning for Superblocks components...");
|
|
26
|
+
const exists = await fs.pathExists(CUSTOM_COMPONENTS_PATH);
|
|
19
27
|
if (!exists) {
|
|
20
|
-
|
|
28
|
+
ux.action.stop();
|
|
21
29
|
this.error("No components folder found in current directory, please run 'superblocks components create' first", {
|
|
22
30
|
exit: 1,
|
|
23
31
|
});
|
|
24
32
|
}
|
|
25
|
-
const { branchName } = await this.validateApplicationGitSetup(
|
|
33
|
+
const { branchName } = await this.validateApplicationGitSetup(ComponentEvent.UPLOAD, flags.branch);
|
|
26
34
|
const headers = {
|
|
27
|
-
[
|
|
35
|
+
[COMPONENT_EVENT_HEADER]: ComponentEvent.REGISTER,
|
|
28
36
|
};
|
|
29
37
|
const configs = await this.registerComponents(headers);
|
|
30
38
|
if (!configs)
|
|
@@ -34,13 +42,13 @@ class Upload extends authenticated_command_1.AuthenticatedApplicationCommand {
|
|
|
34
42
|
config.name,
|
|
35
43
|
config.componentPath,
|
|
36
44
|
]));
|
|
37
|
-
const viteLogger =
|
|
45
|
+
const viteLogger = createLogger();
|
|
38
46
|
viteLogger.info = (message) => {
|
|
39
47
|
this.log(message);
|
|
40
48
|
};
|
|
41
|
-
|
|
49
|
+
ux.action.start("Building components...");
|
|
42
50
|
await (async () => {
|
|
43
|
-
await
|
|
51
|
+
await build({
|
|
44
52
|
configFile: false,
|
|
45
53
|
build: {
|
|
46
54
|
rollupOptions: {
|
|
@@ -56,9 +64,9 @@ class Upload extends authenticated_command_1.AuthenticatedApplicationCommand {
|
|
|
56
64
|
},
|
|
57
65
|
customLogger: viteLogger,
|
|
58
66
|
plugins: [
|
|
59
|
-
(
|
|
60
|
-
|
|
61
|
-
|
|
67
|
+
react(),
|
|
68
|
+
injectReactVersionsPlugin(),
|
|
69
|
+
productionCssPlugin(),
|
|
62
70
|
{
|
|
63
71
|
name: "remove-node-module-maps",
|
|
64
72
|
apply: "build",
|
|
@@ -71,7 +79,7 @@ class Upload extends authenticated_command_1.AuthenticatedApplicationCommand {
|
|
|
71
79
|
],
|
|
72
80
|
});
|
|
73
81
|
})();
|
|
74
|
-
|
|
82
|
+
ux.action.stop();
|
|
75
83
|
/*
|
|
76
84
|
1. Build
|
|
77
85
|
2. Get S3 prefix
|
|
@@ -80,7 +88,7 @@ class Upload extends authenticated_command_1.AuthenticatedApplicationCommand {
|
|
|
80
88
|
5. Auto-commit DSL
|
|
81
89
|
*/
|
|
82
90
|
try {
|
|
83
|
-
|
|
91
|
+
ux.action.start("Uploading components...");
|
|
84
92
|
const fileRelativePaths = [];
|
|
85
93
|
const excluded = [
|
|
86
94
|
".superblocks",
|
|
@@ -93,34 +101,22 @@ class Upload extends authenticated_command_1.AuthenticatedApplicationCommand {
|
|
|
93
101
|
await walkThroughDirectory(".", fileRelativePaths, excluded);
|
|
94
102
|
this.log(fileRelativePaths.join("\n"));
|
|
95
103
|
await this.getSdk().uploadComponents(this.applicationConfig.id, configs, fileRelativePaths, branchName);
|
|
96
|
-
|
|
104
|
+
ux.action.stop();
|
|
97
105
|
}
|
|
98
106
|
catch (e) {
|
|
99
|
-
|
|
107
|
+
ux.action.stop();
|
|
100
108
|
this.error(`Failed to upload components - ${e.message}`, { exit: 1 });
|
|
101
109
|
}
|
|
102
110
|
this.log("You can now disable local dev mode and test your production assets");
|
|
103
|
-
this.log(
|
|
111
|
+
this.log(bold(green("Once you are done developing please remember to commit your changes in the Superblocks UI.")));
|
|
104
112
|
}
|
|
105
113
|
}
|
|
106
|
-
Upload.description = "Upload creates a production-ready bundle and saves the files for use outside of Local Development mode.";
|
|
107
|
-
Upload.examples = [
|
|
108
|
-
"<%= config.bin %> components upload",
|
|
109
|
-
"<%= config.bin %> components upload -b feature-branch",
|
|
110
|
-
];
|
|
111
|
-
Upload.flags = {
|
|
112
|
-
branch: core_1.Flags.string({
|
|
113
|
-
char: "b",
|
|
114
|
-
description: "Superblocks branch to push to, the current (local) git branch will be used by default",
|
|
115
|
-
}),
|
|
116
|
-
};
|
|
117
|
-
exports.default = Upload;
|
|
118
114
|
async function walkThroughDirectory(directory, mutableFiles, excluded) {
|
|
119
115
|
const files = await fs.readdir(directory);
|
|
120
116
|
for (const file of files) {
|
|
121
117
|
if (excluded.includes(file))
|
|
122
118
|
continue;
|
|
123
|
-
const absolute =
|
|
119
|
+
const absolute = path.join(directory, file);
|
|
124
120
|
if ((await fs.stat(absolute)).isDirectory()) {
|
|
125
121
|
await walkThroughDirectory(absolute, mutableFiles, excluded);
|
|
126
122
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Plugin } from "vite";
|
|
2
|
-
import { AuthenticatedApplicationCommand } from "../../common/authenticated-command";
|
|
2
|
+
import { AuthenticatedApplicationCommand } from "../../common/authenticated-command.mjs";
|
|
3
3
|
export declare function healthEndpointMiddleware(getBranch: () => Promise<string | null>): Plugin;
|
|
4
4
|
export default class Watch extends AuthenticatedApplicationCommand {
|
|
5
5
|
static description: string;
|