@youcan/app 1.1.0-beta.10 → 1.1.0-beta.12

package/dist/cli/commands/app/dev.js

@@ -2,13 +2,13 @@ import { Session, Tasks, Env, Http, Filesystem, Path } from '@youcan/cli-kit';
 import { AppCommand } from '../../../util/theme-command.js';
 import { load } from '../../../util/app-loader.js';
 import { APP_CONFIG_FILENAME } from '../../../constants.js';
-import { bootExtensionWorker } from '../../services/dev/workers/index.js';
+import { bootWebWorker, bootExtensionWorker } from '../../services/dev/workers/index.js';
 
 class Dev extends AppCommand {
     async run() {
         const app = await load();
         const session = await Session.authenticate(this);
-        await Tasks.run({ cmd: this }, [
+        const { workers } = await Tasks.run({ cmd: this, workers: [] }, [
             {
                 title: 'Syncing app configuration..',
                 async task() {
@@ -37,14 +37,16 @@ class Dev extends AppCommand {
                 },
             },
             {
-                title: 'Preparing dev workers..',
+                title: 'Preparing dev processes...',
                 async task(ctx) {
-                    const promises = app.extensions.map(async (ext) => await bootExtensionWorker(ctx.cmd, app, ext));
-                    const workers = await Promise.all(promises);
-                    await Promise.all(workers.map(async (worker) => await worker.run()));
+                    const promises = [];
+                    app.webs.forEach(web => promises.unshift(bootWebWorker(ctx.cmd, app, web)));
+                    app.extensions.forEach(ext => promises.unshift(bootExtensionWorker(ctx.cmd, app, ext)));
+                    ctx.workers = await Promise.all(promises);
                 },
             },
         ]);
+        await Promise.all(workers.map(async (worker) => await worker.run()));
     }
 }
 

package/dist/cli/services/dev/workers/abstract-worker.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="node" />
+import { Writable } from 'stream';
+import type { Color } from '@youcan/cli-kit';
+import type { Worker } from './index';
+export declare class WorkerLogger extends Writable {
+    private channel;
+    private type;
+    private color;
+    constructor(channel: 'stdout' | 'stderr', type: string, color: Color.Color);
+    write(chunk: unknown): boolean;
+    private center;
+}
+export default abstract class AbstractWorker implements Worker {
+    abstract boot(): Promise<void>;
+    abstract run(): Promise<void>;
+}

package/dist/cli/services/dev/workers/abstract-worker.js

@@ -0,0 +1,36 @@
+import { Writable } from 'node:stream';
+import { stdout, stderr } from 'node:process';
+import dayjs from 'dayjs';
+
+class WorkerLogger extends Writable {
+    channel;
+    type;
+    color;
+    constructor(channel, type, color) {
+        super();
+        this.channel = channel;
+        this.type = type;
+        this.color = color;
+    }
+    write(chunk) {
+        if (!(chunk instanceof Buffer) && typeof chunk !== 'string') {
+            return false;
+        }
+        const channel = this.channel === 'stdout' ? stdout : stderr;
+        const time = dayjs().format('HH:mm:SSS');
+        const lines = chunk.toString().split('\n').map(s => s.trim()).filter(s => s !== '');
+        for (let i = 0; i < lines.length; i++) {
+            i === 0
+                ? channel.write(this.color(`${time} [ ${this.center(this.type, 10)} ] ${lines[i]}\n`))
+                : channel.write(this.color(`                         ${lines[i]}\n`));
+        }
+        return true;
+    }
+    center(subject, length, char = ' ') {
+        return subject.padStart((subject.length + length) / 2, char).padEnd(length, char);
+    }
+}
+class AbstractWorker {
+}
+
+export { WorkerLogger, AbstractWorker as default };

package/dist/cli/services/dev/workers/index.d.ts

@@ -1,3 +1,12 @@
 import type { Cli } from '@youcan/cli-kit';
-import type { App, Extension } from '@/types';
-export declare function bootExtensionWorker(command: Cli.Command, app: App, extension: Extension): Promise<import("@/types").ExtensionWorker>;
+import WebWorker from './web-worker';
+import type { App, Extension, Web } from '@/types';
+export interface ExtensionWorkerCtor {
+    new (command: Cli.Command, app: App, extension: Extension): Worker;
+}
+export interface Worker {
+    run(): Promise<void>;
+    boot(): Promise<void>;
+}
+export declare function bootExtensionWorker(command: Cli.Command, app: App, extension: Extension): Promise<Worker>;
+export declare function bootWebWorker(command: Cli.Command, app: App, web: Web): Promise<WebWorker>;

package/dist/cli/services/dev/workers/index.js

@@ -1,4 +1,5 @@
 import ThemeExtensionWorker from './theme-extension-worker.js';
+import WebWorker from './web-worker.js';
 
 const EXTENSION_WORKERS = {
     theme: ThemeExtensionWorker,
@@ -8,6 +9,11 @@ async function bootExtensionWorker(command, app, extension) {
     const worker = new Ctor(command, app, extension);
     await worker.boot();
     return worker;
+}
+async function bootWebWorker(command, app, web) {
+    const worker = new WebWorker(command, app, web);
+    await worker.boot();
+    return worker;
 }
 
-export { bootExtensionWorker };
+export { bootExtensionWorker, bootWebWorker };

package/dist/cli/services/dev/workers/theme-extension-worker.d.ts

@@ -1,15 +1,14 @@
 import type { Cli } from '@youcan/cli-kit';
-import type { App, Extension, ExtensionWorker } from '@/types';
-export default class ThemeExtensionWorker implements ExtensionWorker {
+import AbstractWorker from './abstract-worker';
+import type { App, Extension } from '@/types';
+export default class ThemeExtensionWorker extends AbstractWorker {
     private command;
     private app;
     private extension;
+    private logger;
     FILE_TYPES: string[];
-    private EVENT_LOG_MAP;
-    private formatter;
     constructor(command: Cli.Command, app: App, extension: Extension);
     boot(): Promise<void>;
     run(): Promise<void>;
     private file;
-    private log;
 }

package/dist/cli/services/dev/workers/theme-extension-worker.js

@@ -1,31 +1,23 @@
 import { Color, Session, Http, Env, Path, Filesystem, Crypto, Form } from '@youcan/cli-kit';
+import AbstractWorker, { WorkerLogger } from './abstract-worker.js';
 
-class ThemeExtensionWorker {
+class ThemeExtensionWorker extends AbstractWorker {
     command;
     app;
     extension;
+    logger;
     FILE_TYPES = [
         'assets',
         'locales',
         'snippets',
         'blocks',
     ];
-    EVENT_LOG_MAP = {
-        error: () => Color.bold().red('[error]'),
-        add: () => Color.bold().green('[created]'),
-        change: () => Color.bold().blue('[updated]'),
-        unlink: () => Color.bold().yellow('[deleted]'),
-    };
-    formatter = Intl.NumberFormat('en', {
-        unitDisplay: 'narrow',
-        notation: 'compact',
-        style: 'unit',
-        unit: 'byte',
-    });
     constructor(command, app, extension) {
+        super();
         this.command = command;
         this.app = app;
         this.extension = extension;
+        this.logger = new WorkerLogger('stdout', 'extensions', Color.yellow);
     }
     async boot() {
         const session = await Session.authenticate(this.command);
@@ -36,29 +28,30 @@ class ThemeExtensionWorker {
             });
             this.extension.id = res.id;
             this.extension.metadata = res.metadata;
-            for (const type of Object.keys(this.extension.metadata)) {
-                const descriptors = this.extension.metadata[type];
-                const directory = Path.resolve(this.extension.root, type);
-                const present = await Filesystem.readdir(Path.resolve(directory));
-                present.filter(f => !descriptors.find(d => d.file_name === f))
-                    .forEach(async (file) => await this.file('put', type, file));
-                descriptors.forEach(async (descriptor) => {
-                    const path = Path.resolve(directory, descriptor.file_name);
-                    if (!(await Filesystem.exists(path))) {
-                        return await this.file('del', type, descriptor.file_name);
-                    }
-                    const buff = await Filesystem.readFile(path);
-                    if (Crypto.sha1(buff) !== descriptor.hash) {
-                        await this.file('put', type, descriptor.file_name);
-                    }
-                });
-            }
         }
         catch (err) {
             this.command.error(err);
         }
     }
     async run() {
+        this.logger.write(`pushed '${this.extension.config.name}' to a draft...`);
+        for (const type of Object.keys(this.extension.metadata)) {
+            const descriptors = this.extension.metadata[type];
+            const directory = Path.resolve(this.extension.root, type);
+            const present = await Filesystem.readdir(Path.resolve(directory));
+            present.filter(f => !descriptors.find(d => d.file_name === f))
+                .forEach(async (file) => await this.file('put', type, file));
+            descriptors.forEach(async (descriptor) => {
+                const path = Path.resolve(directory, descriptor.file_name);
+                if (!(await Filesystem.exists(path))) {
+                    return await this.file('del', type, descriptor.file_name);
+                }
+                const buff = await Filesystem.readFile(path);
+                if (Crypto.sha1(buff) !== descriptor.hash) {
+                    await this.file('put', type, descriptor.file_name);
+                }
+            });
+        }
         const paths = this.FILE_TYPES
             .map(p => Path.resolve(this.extension.root, p));
         const watcher = Filesystem.watch(paths, {
@@ -68,36 +61,33 @@ class ThemeExtensionWorker {
                 stabilityThreshold: 50,
             },
         });
-        watcher.on('all', async (event, path, stat) => {
+        watcher.on('all', async (event, path) => {
             try {
                 if (!['add', 'change', 'unlink'].includes(event)) {
                     return;
                 }
-                const start = new Date().getTime();
                 const [filetype, filename] = [
                     Path.basename(Path.dirname(path)),
                     Path.basename(path),
                 ];
-                let size = 0;
                 switch (event) {
                     case 'add':
                     case 'change':
-                        size = (await this.file('put', filetype, filename)).size;
+                        await this.file('put', filetype, filename);
                         break;
                     case 'unlink':
-                        size = (await this.file('del', filetype, filename)).size;
+                        await this.file('del', filetype, filename);
                         break;
                 }
-                this.log(event, Path.join(filetype, filename), this.formatter.format(stat.size), new Date().getTime() - start);
             }
             catch (err) {
-                this.log('error', path);
-                this.command.error(err);
+                this.command.output.warn(err);
             }
         });
     }
     async file(op, type, name) {
         const path = Path.resolve(this.extension.root, type, name);
+        this.logger.write(`- ${Path.join(type, name)}`);
         return await Http.post(`${Env.apiHostname()}/apps/draft/${this.app.config.id}/extensions/${this.extension.id}/file`, {
             body: Form.convert({
                 file_name: name,
@@ -107,11 +97,6 @@ class ThemeExtensionWorker {
             }),
         });
     }
-    log(event, path, size, time) {
-        const tag = this.EVENT_LOG_MAP[event]();
-        `${tag} ${Color.underline().white(path)}`;
-        this.command.log(`${tag} ${Color.underline().white(path)} - ${size} | ${time}ms \n`);
-    }
 }
 
 export { ThemeExtensionWorker as default };

package/dist/cli/services/dev/workers/web-worker.d.ts

@@ -0,0 +1,12 @@
+import { type Cli } from '@youcan/cli-kit';
+import AbstractWorker from './abstract-worker';
+import type { App, Web } from '@/types';
+export default class WebWorker extends AbstractWorker {
+    private command;
+    private app;
+    private web;
+    private logger;
+    constructor(command: Cli.Command, app: App, web: Web);
+    boot(): Promise<void>;
+    run(): Promise<void>;
+}

package/dist/cli/services/dev/workers/web-worker.js

@@ -0,0 +1,27 @@
+import { Color, System } from '@youcan/cli-kit';
+import AbstractWorker, { WorkerLogger } from './abstract-worker.js';
+
+class WebWorker extends AbstractWorker {
+    command;
+    app;
+    web;
+    logger;
+    constructor(command, app, web) {
+        super();
+        this.command = command;
+        this.app = app;
+        this.web = web;
+        this.logger = new WorkerLogger('stderr', this.web.config.name || 'web', Color.blue);
+    }
+    async boot() {
+    }
+    async run() {
+        const [cmd, ...args] = this.web.config.commands.dev.split(' ');
+        return System.exec(cmd, args, {
+            stdout: this.logger,
+            stderr: new WorkerLogger('stderr', this.web.config.name || 'web', Color.red),
+        });
+    }
+}
+
+export { WebWorker as default };

package/dist/constants.d.ts

@@ -1,3 +1,5 @@
 export declare const APP_CONFIG_FILENAME = "youcan.app.json";
+export declare const WEB_CONFIG_FILENAME = "youcan.web.json";
 export declare const EXTENSION_CONFIG_FILENAME = "youcan.extension.json";
+export declare const DEFAULT_WEBS_DIR = ".";
 export declare const DEFAULT_EXTENSIONS_DIR = "extensions/";

package/dist/constants.js

@@ -1,5 +1,7 @@
 const APP_CONFIG_FILENAME = 'youcan.app.json';
+const WEB_CONFIG_FILENAME = 'youcan.web.json';
 const EXTENSION_CONFIG_FILENAME = 'youcan.extension.json';
+const DEFAULT_WEBS_DIR = '.';
 const DEFAULT_EXTENSIONS_DIR = 'extensions/';
 
-export { APP_CONFIG_FILENAME, DEFAULT_EXTENSIONS_DIR, EXTENSION_CONFIG_FILENAME };
+export { APP_CONFIG_FILENAME, DEFAULT_EXTENSIONS_DIR, DEFAULT_WEBS_DIR, EXTENSION_CONFIG_FILENAME, WEB_CONFIG_FILENAME };

package/dist/types.d.ts

@@ -1,15 +1,7 @@
-import type { Cli } from '@youcan/cli-kit';
 export interface InitialAppConfig {
     [key: string]: unknown;
     name: string;
 }
-export interface ExtensionWorkerConstructor<T extends Extension = Extension> {
-    new (command: Cli.Command, app: App, extension: T): ExtensionWorker;
-}
-export interface ExtensionWorker {
-    run(): Promise<void>;
-    boot(): Promise<void>;
-}
 export type AppConfig = {
     id: string;
     app_url: string;
@@ -46,8 +38,21 @@ export interface Extension {
     root: string;
     config: ExtensionConfig;
 }
+export interface WebConfig {
+    name?: string;
+    commands: {
+        dev: string;
+        build?: string;
+    };
+}
+export interface Web {
+    root: string;
+    config: WebConfig;
+    framework?: string;
+}
 export interface App {
     root: string;
+    webs: Web[];
     config: AppConfig;
     extensions: Extension[];
 }

package/dist/util/app-loader.js

@@ -1,5 +1,5 @@
 import { Path, Filesystem } from '@youcan/cli-kit';
-import { APP_CONFIG_FILENAME, DEFAULT_EXTENSIONS_DIR, EXTENSION_CONFIG_FILENAME } from '../constants.js';
+import { APP_CONFIG_FILENAME, DEFAULT_EXTENSIONS_DIR, EXTENSION_CONFIG_FILENAME, DEFAULT_WEBS_DIR, WEB_CONFIG_FILENAME } from '../constants.js';
 
 async function load() {
     const path = Path.resolve(Path.cwd(), APP_CONFIG_FILENAME);
@@ -9,9 +9,15 @@ async function load() {
     const config = await Filesystem.readJsonFile(path);
     const app = {
         config,
+        webs: [],
         extensions: [],
         root: Path.cwd(),
     };
+    app.extensions = await loadExtensions(app);
+    app.webs = await loadWebs(app);
+    return app;
+}
+async function loadExtensions(app) {
     const pattern = Path.join(app.root, `${DEFAULT_EXTENSIONS_DIR}/*`, EXTENSION_CONFIG_FILENAME);
     const paths = await Filesystem.glob(pattern);
     const promises = paths.map(async (p) => {
@@ -20,8 +26,16 @@ async function load() {
             config: await Filesystem.readJsonFile(p),
         };
     });
-    app.extensions = await Promise.all(promises);
-    return app;
+    return await Promise.all(promises);
+}
+async function loadWebs(app) {
+    const pattern = Path.join(app.root, DEFAULT_WEBS_DIR, WEB_CONFIG_FILENAME);
+    const paths = await Filesystem.glob(pattern);
+    const promises = paths.map(async (p) => ({
+        root: Path.dirname(p),
+        config: await Filesystem.readJsonFile(p),
+    }));
+    return await Promise.all(promises);
 }
 
 export { load };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@youcan/app",
   "type": "module",
-  "version": "1.1.0-beta.10",
+  "version": "1.1.0-beta.12",
   "description": "OCLIF plugin for building apps",
   "author": "YouCan <contact@youcan.shop> (https://youcan.shop)",
   "license": "MIT",
@@ -16,7 +16,7 @@
   ],
   "dependencies": {
     "@oclif/core": "^2.15.0",
-    "@youcan/cli-kit": "1.1.0-beta.10"
+    "@youcan/cli-kit": "1.1.0-beta.12"
   },
   "devDependencies": {
     "@oclif/plugin-legacy": "^1.3.0",