build: update bin/env to make project installable

Author: Neunerlei

.storybook/main.ts

@@ -18,6 +18,10 @@ const config: StorybookConfig = {
   staticDirs: [{from: './assets', to: '/storybook-assets'}],
   core: {
     disableTelemetry: true
+  },
+  viteFinal(config) {
+    config.server.allowedHosts = true;
+    return config;
   }
 };
 export default config;

bin/_env/commands/coreCommands.ts

@@ -8,6 +8,18 @@ const commands: CommandEntrypoint = async (program, context) => {
         .action(() => {
             dumpConfigToFile(context.getPaths());
         });
+
+    program
+        .command('install')
+        .description('Installs the project on your device; sets up a unique url, ip address, hosts entry and ssl certificate')
+        .action(() => context.getInstaller().install());
+
+    // Create hook to ensure loopback IP is registered before docker:up
+    context.getEvents().on('docker:up:before', async () => {
+        if (context.getEnv().has('DOCKER_PROJECT_INSTALLED')) {
+            await context.getInstaller().ensureLoopbackIp();
+        }
+    });
 };
 
 export default commands;

bin/_env/commands/docker/DockerConfig.ts

@@ -5,12 +5,13 @@ export class DockerConfig {
     public readonly defaultServiceName: string = getConfigValue('defaultServiceName', 'app', 'SERVICE_NAME');
     public readonly defaultUid: string = getConfigValue('dockerUId', '1000', 'ENV_UID');
     public readonly defaultGid: string = getConfigValue('dockerGid', '1000', 'ENV_GID');
+    public readonly projectDomainSuffix: string = getConfigValue('projectDomainSuffix', '.dev.local');
     public readonly projectName: string = getEnvValue('PROJECT_NAME');
     public readonly projectProtocol: string = getEnvValue('DOCKER_PROJECT_PROTOCOL', 'http');
     public readonly projectDomain: string = getEnvValue('DOCKER_PROJECT_DOMAIN', 'localhost');
     public readonly projectIp: string = getEnvValue('DOCKER_PROJECT_IP', '127.0.0.1');
     public readonly projectPort: string = getEnvValue('DOCKER_PROJECT_PORT', '80');
-    public readonly shellsToUse: string[] = getEnvValue('SHELLS_TO_USE', 'bash,sh,zsh,dash,ksh').split(',').map((shell) => shell.trim());
+    public readonly shellsToUse: string[] = getConfigValue('shellList', 'bash,sh,zsh,dash,ksh', 'SHELLS_TO_USE').split(',').map((shell: string) => shell.trim());
 
     public get projectHost(): string {
         const expectedPort = this.projectProtocol === 'http' ? '80' : '443';

bin/_env/commands/docker/DockerContext.ts

@@ -317,6 +317,7 @@ export class DockerContext {
         }
         args.add('--remove-orphans');
 
+        await this._context.getEvents().trigger('docker:up:before', {args});
         await this.executeComposeCommand(['up', ...args]);
     }
 

bin/_env/commands/projectCommands.ts

@@ -0,0 +1,17 @@
+import type {CommandEntrypoint} from '/types.ts';
+
+const commands: CommandEntrypoint = async (program, context) => {
+    program
+        .command('build')
+        .description('Builds the library into the "dist" folder')
+        .action(async () => {
+            await context.docker.executeCommandInService('app', ['npm', 'run', 'build'], undefined, true);
+        });
+
+    // When installing, ensure that we are running the correct port on the host machine
+    context.getEvents().on('installer:envFile:filter', async ({envFile}) => {
+        envFile.set('DOCKER_PROJECT_PORT', '443');
+    });
+};
+
+export default commands;

bin/_env/core/Context.ts

@@ -2,26 +2,40 @@ import {type Command} from 'commander';
 import type {Paths} from './Paths.ts';
 import type {EnvPackageInfo} from './types.ts';
 import type {Config} from './Config.js';
+import type {Platform} from './Platform.ts';
+import type {EnvFile} from './EnvFile.ts';
+import {Installer} from './installer/Installer.ts';
+import type {EventBus} from './EventBus.ts';
 
 export class Context {
     private readonly _pkg: EnvPackageInfo;
+    private readonly _env: EnvFile;
     private readonly _paths: Paths;
     private readonly _program: Command;
     private readonly _flags: WritableFlags;
-    private _config: Config;
+    private readonly _config: Config;
+    private readonly _platform: Platform;
+    private readonly _events: EventBus;
+    private _installer?: Installer;
 
     public constructor(
         pkg: EnvPackageInfo,
+        env: EnvFile,
         paths: Paths,
         program: Command,
         flags: WritableFlags,
-        config: Config
+        config: Config,
+        platform: Platform,
+        events: EventBus
     ) {
         this._pkg = pkg;
+        this._env = env;
         this._paths = paths;
         this._program = program;
         this._flags = flags;
         this._config = config;
+        this._platform = platform;
+        this._events = events;
     }
 
     public get flags(): ReadOnlyFlags {
@@ -32,6 +46,10 @@ export class Context {
         return this._pkg;
     }
 
+    public getEnv(): EnvFile {
+        return this._env;
+    }
+
     public getPaths(): Paths {
         return this._paths;
     }
@@ -44,6 +62,21 @@ export class Context {
         return this._config;
     }
 
+    public getPlatform(): Platform {
+        return this._platform;
+    }
+
+    public getInstaller(): Installer {
+        if (!this._installer) {
+            this._installer = new Installer(this);
+        }
+        return this._installer;
+    }
+
+    public getEvents(): EventBus {
+        return this._events;
+    }
+
     public registerAddon(key: string, addon: object) {
         Object.defineProperty(this, key, {
             get: () => addon

bin/_env/core/EnvFile.ts

@@ -1,24 +1,38 @@
 import type {Paths} from './Paths.js';
 import * as fs from 'node:fs';
 import {confirm, input} from '@inquirer/prompts';
-import {parse as parseEnv} from 'dotenv';
 import * as path from 'node:path';
 
 let loadedEnvFile: EnvFile | undefined = undefined;
 
+interface EnvFileState {
+    filename: string;
+    values: Map<string, string>;
+    tpl: string;
+}
+
 export class EnvFile {
-    private readonly _values: Map<string, string>;
+    private readonly _state: EnvFileState;
 
-    public constructor(values: Map<string, string>) {
-        this._values = values;
+    public constructor(state: EnvFileState) {
+        this._state = state;
     }
 
     public get(key: string, fallback?: string): string | undefined {
-        return this._values.get(key) || fallback;
+        return this._state.values.get(key) || fallback;
     }
 
     public has(key: string): boolean {
-        return this._values.has(key);
+        return this._state.values.has(key);
+    }
+
+    public set(key: string, value: string): this {
+        this._state.values.set(key, value);
+        return this;
+    }
+
+    public write(): void {
+        writeStateToFile(this._state);
     }
 }
 
@@ -37,54 +51,113 @@ export async function makeEnvFile(paths: Paths): Promise<EnvFile> {
         fs.copyFileSync(paths.envFileTemplatePath, paths.envFilePath);
     }
 
-    return loadedEnvFile = await ensureEnvFileContainsProjectName(loadEnvFile(paths), paths);
+    const envFile = new EnvFile(loadEnvFileState(paths.envFilePath));
+
+    if (!envFile.has('PROJECT_NAME') || envFile.get('PROJECT_NAME') === '' || envFile.get('PROJECT_NAME') === 'replace-me') {
+        const projectName = await input({
+            message: 'You need to define a project name, which can be used for your docker containers and generated urls. Please enter a project name:',
+            validate: (input) => {
+                return input.length > 0 && input.match(/^[a-z0-9-]+$/) ? true : 'The project name must only contain lowercase letters, numbers and dashes';
+            },
+            default: extractProjectNameFromPath(paths),
+            required: true
+        });
+
+        envFile.set('PROJECT_NAME', projectName);
+        envFile.write();
+    }
+
+    return loadedEnvFile = envFile;
 }
 
 export function getEnvValue(key: string, fallback?: string): string {
     if (loadedEnvFile && loadedEnvFile.has(key)) {
         return loadedEnvFile.get(key)!;
+    } else if (process.env[key]) {
+        return process.env[key]!;
     } else if (fallback) {
         return fallback;
     } else {
+        console.log(loadedEnvFile, key);
         throw new Error(`Missing required env value: ${key}`);
     }
 }
 
-function loadEnvFileContent(paths: Paths): string {
-    if (!fs.existsSync(paths.envFilePath)) {
-        throw new Error(`Env file does not exist: ${paths.envFilePath}`);
-    }
-
-    return fs.readFileSync(paths.envFilePath).toString('utf-8');
+function loadEnvFileState(filename: string): EnvFileState {
+    return {
+        filename,
+        ...parseFile(fs.readFileSync(filename).toString('utf-8'))
+    };
 }
 
-function loadEnvFile(paths: Paths): EnvFile {
-    return new EnvFile(new Map(Object.entries(parseEnv(loadEnvFileContent(paths)))));
-}
+function parseFile(content: string): {
+    values: Map<string, string>;
+    tpl: string;
+} {
+    const lines = content.split(/\r?\n/);
+    const tpl: Array<string> = [];
+    const values = new Map();
+
+    // Iterate the lines
+    lines.forEach(line => {
+        let _line = line.trim();
+
+        // Skip comments and empty lines
+        if (_line.length === 0 || _line.charAt(0) === '#' || _line.indexOf('=') === -1) {
+            tpl.push(line);
+            return;
+        }
 
-async function ensureEnvFileContainsProjectName(envFile: EnvFile, paths: Paths) {
-    if (!envFile.has('PROJECT_NAME') || envFile.get('PROJECT_NAME') === '' || envFile.get('PROJECT_NAME') === 'replace-me') {
-        const projectName = await input({
-            message: 'You need to define a project name, which can be used for your docker containers and generated urls. Please enter a project name:',
-            validate: (input) => {
-                return input.length > 0 && input.match(/^[a-z0-9-]+$/) ? true : 'The project name must only contain lowercase letters, numbers and dashes';
-            },
-            default: extractProjectNameFromPath(paths),
-            required: true
-        });
+        // Extract key value and store the line in the template
+        tpl.push(_line.replace(/^([^=]*?)(?:\s+)?=(?:\s+)?(.*?)(\s#|$)/, (_, key, value, comment) => {
+            // Prepare value
+            value = value.trim();
+            if (value.length === 0) {
+                value = null;
+            }
+
+            // Handle comment only value
+            if (typeof value === 'string' && value.charAt(0) === '#') {
+                comment = ' ' + value;
+                value = null;
+            }
+
+            key = key.trim();
+            if (values.has(key)) {
+                throw new Error('Invalid .env file! There was a duplicate key: ' + key);
+            }
+            values.set(key.trim(), value);
+            return '{{pair}}' + ((comment + '').trim().length > 0 ? comment : '');
+        }));
+    });
+
+    return {
+        values: values,
+        tpl: tpl.join('\n')
+    };
+}
 
-        let envContent = loadEnvFileContent(paths);
-        if (envContent.includes('PROJECT_NAME=replace-me')) {
-            envContent = envContent.replace('PROJECT_NAME=replace-me', `PROJECT_NAME=${projectName}`);
-        } else {
-            envContent += (envContent.length > 0 ? `\n` : '') + `PROJECT_NAME=${projectName}`;
+function writeStateToFile(state: EnvFileState): void {
+    // Build the content based on the template and the current storage
+    const keys: Array<string> = Array.from(state.values.keys());
+    let contents = state.tpl.replace(/{{pair}}/g, () => {
+        const key = keys.shift();
+        const value = state.values.get(key + '');
+        return key + '=' + value;
+    });
+
+    if (keys.length > 0) {
+        for (const key of keys) {
+            const value = state.values.get(key);
+            contents += '\n' + key + '=' + value;
         }
-
-        fs.writeFileSync(paths.envFilePath, envContent);
-        return loadEnvFile(paths);
     }
 
-    return envFile;
+    // Remove all spacing at the top and bottom of the file
+    contents = contents.replace(/^\s+|\s+$/g, '');
+
+    // Write the file
+    fs.writeFileSync(state.filename, contents);
 }
 
 function extractProjectNameFromPath(paths: Paths): string {

bin/_env/core/EventBus.ts

@@ -0,0 +1,38 @@
+import type {ConcreteInstaller} from './installer/concrete/types.ts';
+import type {EnvFile} from './EnvFile.ts';
+
+interface EventTypes {
+    'docker:up:before': { args: Set<string> };
+    'installer:before': { installer: ConcreteInstaller };
+    'installer:dependencies:before': undefined;
+    'installer:loopbackIp:before': { ip: string };
+    'installer:domain:before': { domain: string, ip: string };
+    'installer:certificates:before': undefined;
+    'installer:envFile:filter': { envFile: EnvFile };
+    'installer:after': undefined;
+}
+
+export class EventBus {
+    private readonly _events: Map<keyof EventTypes, Set<(arg: EventTypes[keyof EventTypes]) => Promise<void>>> = new Map();
+
+    public async trigger<E extends keyof EventTypes>(event: E, arg: EventTypes[E] = undefined): Promise<EventTypes[E]> {
+        const callbacks = this._events.get(event);
+        if (callbacks) {
+            for (const callback of callbacks) {
+                await callback(arg);
+            }
+        }
+        return arg;
+    }
+
+    public on<E extends keyof EventTypes>(event: E, callback: (arg: EventTypes[E]) => Promise<void>): this {
+        if (!this._events.has(event)) {
+            this._events.set(event, new Set());
+        }
+        this._events.get(event)!.add(callback);
+        return this;
+    }
+}
+
+
+const b = new EventBus();