@webqit/webflo 0.8.51 → 0.8.52

package/docker/Dockerfile

@@ -1,6 +1,6 @@
 # Base installations
 FROM node:12-alpine
-RUN apk --no-cache add git
+RUN apk add git
 
 # We'll install npm packages at one-level higher than
 # actuall app root, so that we can bind-mount host system's app root
@@ -12,6 +12,7 @@ RUN npm install @webqit/playui-cli -g
 
 # Move one-level in, for the reasons above
 WORKDIR /home/www/app
+ENV NODE_OPTIONS=--openssl-legacy-provider
 
 # To auto-start app (flags optional), we would add...
 # CMD ["webflo", "start", "--env=dev", "--watch", "--http-only"]
@@ -22,4 +23,4 @@ WORKDIR /home/www/app
 # To publish to docker hub...
 # docker login -u webqit
 # docker tag webflo webqit/webflo
-# docker push webqit/webflo
+# docker push webqit/webflo

package/docker/README.md

@@ -1,7 +1,9 @@
 # Webflo Container
+
 This is simply a node.js container with the `@webqit/webflo` framework installed. Once started, any webflo app can be deployed into the container from any git repository.
 
 ## Usage
+
 This container image lives on Docker Hub and can be pulled to a local machine or a remote Virtual Machine (VM) on any cloud platform.
 
 + [To Use Locally](#to-use-locally)
@@ -9,6 +11,7 @@ This container image lives on Docker Hub and can be pulled to a local machine or
 * [To Deploy An App From Any Repo](#to-deploy-an-app-from-any-repo)
 
 ### To Use Locally
+
 Ensure you have docker installed on your computer and run the following command from any location on your terminal:
 
 ```shell
@@ -20,6 +23,7 @@ The above command pulls the `webqit/webflo` image to your local machine. (But th
 Next is to use the following commands to start the container and the Webflo runtime. In each case, the first part of the command starts the container, while the second part (from `webflo start`) starts the application.
 
 #### To Start
+
 Start the container using `docker run`; map a port (e.g `80`) of your host machine to `3000` of the container (unless changed webflo expects to run on port `3000`); optionally, give your container a name; reference `webqit/webflo` as the image to use; and lastly, start webflo using `webflo start`.
 
 ```shell
@@ -29,6 +33,7 @@ docker run -d -p 80:3000 --name my-app webqit/webflo webflo start
 Visit [localhost](http://localhost) to view your app. 
 
 #### To Start In Dev Mode
+
 Webflo's *dev* mode is the perfect mode for developing locally. All you do is append the `--env=dev --watch` flags to your webflo commands. [(Learn more)](#)
 
 ```shell
@@ -41,12 +46,12 @@ In *dev* mode, webflo automatically restarts as you make changes to your codebas
 docker run -d -v /Users/me/my-app:/home/www/app -p 80:3000 --name my-app webqit/webflo webflo start --env=dev --watch
 ```
 
-docker run -d -v /Users/ox-harris/Documents/CODE/webqit/webqit.io:/home/www/app -p 80:3000 --name my-app webqit/webflo webflo start --env=dev --watch
-
 ### To Use In the Cloud
+
 TODO
 
 ### To Deploy An App From Any Repo
+
 Whether running locally or in the cloud, webflo can easily take your application from any git repo. This follows webflo's normal `deploy` command.
 
 Simply point docker at your container (using `docker exec [container-name]`) and execute the `webflo deploy` command.
@@ -68,4 +73,5 @@ docker exec my-app webflo restart
 ```
 
 ## Extending this Build
+
 TODO

package/package.json

@@ -12,7 +12,7 @@
     "vanila-javascript"
   ],
   "homepage": "https://webqit.io/tooling/webflo",
-  "version": "0.8.51",
+  "version": "0.8.52",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -29,8 +29,8 @@
   },
   "bin": {
     "webflo": "src/index.js",
-    "webflo-certbot-http-auth-hook": "src/modules/certbot/http-auth-hook.js",
-    "webflo-certbot-http-cleanup-hook": "src/modules/certbot/http-cleanup-hook.js"
+    "webflo-certbot-http-auth-hook": "src/services/certbot/http-auth-hook.js",
+    "webflo-certbot-http-cleanup-hook": "src/services/certbot/http-cleanup-hook.js"
   },
   "dependencies": {
     "@octokit/auth-basic": "^1.4.6",

package/src/{cmd/client.js → build/client/index.js}

@@ -9,7 +9,7 @@ import Webpack from 'webpack';
 import { _beforeLast } from '@webqit/util/str/index.js';
 import { _isObject, _isArray, _isEmpty } from '@webqit/util/js/index.js';
 import * as DotJs from '@webqit/backpack/src/dotfiles/DotJs.js';
-import * as client from '../config/client.js'
+import * as client from '../../config/client.js'
 
 
 /**
@@ -27,7 +27,7 @@ export async function build(Ui, flags = {}, layout = {}) {
     const config = await client.read(flags, layout);
     // Consistent forward slashing
     const forwardSlash = str => str.replace(/\\/g, '/');
-    var modulesDir = forwardSlash(Url.fileURLToPath(Path.join(import.meta.url, '../../modules/client')));
+    var modulesDir = forwardSlash(Url.fileURLToPath(Path.join(import.meta.url, '../../../runtime/client')));
     
     var workerDirSplit = Path.resolve(layout.WORKER_DIR).replace(/\\/g, '/').split('/');
     var workerParams = config.worker || {};
@@ -85,17 +85,17 @@ export async function build(Ui, flags = {}, layout = {}) {
     Ui.title(`CLIENT BUILD`);
 
     const clientBuild = { imports: {}, code: [], };
-    clientBuild.imports[modulesDir + '/Client.js'] = 'Client';
+    clientBuild.imports[modulesDir + '/Runtime.js'] = 'Runtime';
 
     // ------------------
     // >> Routes mapping
     buildRoutes(clientBuild, Ui, Path.resolve(layout.CLIENT_DIR), 'Client-Side Routing:');
     clientBuild.code.push(``);
-    clientBuild.code.push(`// >> Client Params`);
+    clientBuild.code.push(`// >> Runtime Params`);
     buildParams(clientBuild, clientParams, 'params');
     clientBuild.code.push(``);
-    clientBuild.code.push(`// >> Client Instantiation`);
-    clientBuild.code.push(`Client.call(null, layout, params);`);
+    clientBuild.code.push(`// >> Runtime Instantiation`);
+    clientBuild.code.push(`Runtime.call(null, layout, params);`);
     // ------------------
     
     // ------------------
@@ -107,9 +107,9 @@ export async function build(Ui, flags = {}, layout = {}) {
     };
     waiting = Ui.waiting(`Writing the client entry file: ${clientBundlingConfig.intermediate}`);
     waiting.start();
-    DotJs.write(clientBuild, clientBundlingConfig.intermediate, 'Client Build File');
+    DotJs.write(clientBuild, clientBundlingConfig.intermediate, 'Runtime Build File');
     waiting.stop();
-    Ui.info(Ui.f`Client Build file: ${clientBundlingConfig.intermediate}`);
+    Ui.info(Ui.f`Runtime Build file: ${clientBundlingConfig.intermediate}`);
     // ------------------
 
     // -------------------
@@ -124,10 +124,23 @@ export async function build(Ui, flags = {}, layout = {}) {
         await createBundle(Ui, workerBundlingConfig, 'Bundling the Service Worker Build file');
     }
     if (clientParams.bundling !== false) {
-        await createBundle(Ui, clientBundlingConfig, 'Bundling the Client Build file');
+        clientBundlingConfig.experiments = clientBundlingConfig.experiments || {};
+        if (!('outputModule' in clientBundlingConfig.experiments)) {
+            clientBundlingConfig.experiments.outputModule = true;
+            clientBundlingConfig.externalsType = 'module';
+        }
+        if (clientBundlingConfig.experiments.outputModule !== false) {
+            clientBundlingConfig.output = clientBundlingConfig.output || {};
+            clientBundlingConfig.output.environment = clientBundlingConfig.output.environment || {};
+            if (!('module' in clientBundlingConfig.output)) {
+                clientBundlingConfig.output.module = true;
+                clientBundlingConfig.output.environment.module = true;
+            }
+        }
+        await createBundle(Ui, clientBundlingConfig, 'Bundling the Runtime Build file');
     }
     
-};
+}
 
 /**
  * Creates a bundle using webpack
@@ -245,4 +258,4 @@ const buildParams = (build, params, varName = null, indentation = 0) => {
         }
     });
     if (varName) build.code.push(`};`);
-}
+};

package/src/build/index.js

@@ -0,0 +1,5 @@
+
+/**
+ * exports
+ */
+export * as client from './client/index.js';

package/src/index.js

@@ -9,16 +9,18 @@ import parseArgs from '@webqit/backpack/src/cli/parseArgs.js';
 import Ui from '@webqit/backpack/src/cli/Ui.js';
 import * as DotJson from '@webqit/backpack/src/dotfiles/DotJson.js';
 import { Promptx } from '@webqit/backpack/src/cli/Promptx.js';
+import * as build from './build/index.js';
 import * as config from './config/index.js';
-import * as cmd from './cmd/index.js';
+import * as runtime from './runtime/index.js';
+import * as services from './services/index.js';
 
 // ------------------------------------------
 
 const commands = {
     config: 'Starts a configuration process.',
-    build: cmd.client.desc.build,
-    deploy: cmd.origins.desc.deploy,
-    ...cmd.server.desc,
+    build: build.client.desc.build,
+    deploy: services.origins.desc.deploy,
+    ...runtime.server.desc,
 };
 
 // ------------------------------------------
@@ -37,60 +39,60 @@ console.log('');
         // --------------------------
 
         case 'build':
-            cmd.client.build(Ui, flags, layout);
+            build.client.build(Ui, flags, layout);
         break;
 
         // --------------------------
 
-        case 'deploy':
-            var origin = Object.keys(keywords)[0],
-                options;
+        case 'config':
+            
+            var domain = Object.keys(keywords)[0];
             // ----------------
-            if (!origin && ellipsis) {
-                if (!(options = (await config.origins.read(flags, layout)).REPOS) || _isEmpty(options)) {
-                    Ui.log(Ui.f`Please configure an origin (${'webflo config ...'}) to use the ${'deploy'} command.`);
-                    return;
-                }
-                origin = await Promptx({
-                    name: 'origin',
+            if (!domain && ellipsis) {
+                domain = await Promptx({
+                    name: 'domain',
                     type: 'select',
-                    choices: options.map(r => ({value: r.TAG})),
-                    message: 'Please select a origin',
-                }).then(d => d.origin);
+                    choices: Object.keys(config).map(c => ({value: c})),
+                    message: 'Please select a configuration domain',
+                }).then(d => d.domain);
             }
-            if (!origin) {
-                Ui.log(Ui.f`Please add an origin name to the ${command} command. For options, use the ellipsis ${'...'}`);
+            if (!domain || !config[domain]) {
+                Ui.log(Ui.f`Please add a configuration domain to the ${command} command. For options, use the ellipsis ${'...'}`);
                 return;
             }
             // ----------------
-            cmd.origins.deploy(Ui, origin, flags, layout);
+            const data = await config[domain].read(flags, layout);
+            Promptx(await config[domain].questions(data, {}, layout)).then(async _data => {
+                await config[domain].write(_merge(data, _data), flags, layout);
+            });
+
         break;
 
         // --------------------------
 
         case 'start':
-           cmd.server.start(Ui, flags, layout);
+           runtime.server.start(Ui, flags, layout);
         break;
         
         case 'stop':
         case 'restart':
-            var runtime = Object.keys(keywords)[0];
+            var _runtime = Object.keys(keywords)[0];
             // ----------------
-            if (!runtime && ellipsis) {
-                runtime = await Promptx({
+            if (!_runtime && ellipsis) {
+                _runtime = await Promptx({
                     name: 'runtime',
                     type: 'select',
-                    choices: (await cmd.server.processes(Ui)).map(r => ({title: r.name, description: r.status, value: r.name})).concat({description: 'All of the above', value: 'all'}),
+                    choices: (await runtime.server.processes(Ui)).map(r => ({title: r.name, description: r.status, value: r.name})).concat({description: 'All of the above', value: 'all'}),
                     message: 'Please select a runtime name',
                 }).then(d => d.runtime);
             }
             // ----------------
-            await cmd.server[command](Ui, runtime || 'all', flags);
+            await runtime.server[command](Ui, _runtime || 'all', flags);
             process.exit();
         break;
 
         case 'processes':
-            const processes = await cmd.server.processes(Ui, flags);
+            const processes = await runtime.server.processes(Ui, flags);
             Ui.title(`SERVERS`);
             if (processes.length) {
                 processes.forEach(service => {
@@ -104,35 +106,35 @@ console.log('');
 
         // --------------------------
 
-        case 'config':
-            
-            var domain = Object.keys(keywords)[0];
+        case 'deploy':
+            var origin = Object.keys(keywords)[0],
+                options;
             // ----------------
-            if (!domain && ellipsis) {
-                domain = await Promptx({
-                    name: 'domain',
+            if (!origin && ellipsis) {
+                if (!(options = (await config.origins.read(flags, layout)).REPOS) || _isEmpty(options)) {
+                    Ui.log(Ui.f`Please configure an origin (${'webflo config ...'}) to use the ${'deploy'} command.`);
+                    return;
+                }
+                origin = await Promptx({
+                    name: 'origin',
                     type: 'select',
-                    choices: Object.keys(config).map(c => ({value: c})),
-                    message: 'Please select a configuration domain',
-                }).then(d => d.domain);
+                    choices: options.map(r => ({value: r.TAG})),
+                    message: 'Please select a origin',
+                }).then(d => d.origin);
             }
-            if (!domain || !config[domain]) {
-                Ui.log(Ui.f`Please add a configuration domain to the ${command} command. For options, use the ellipsis ${'...'}`);
+            if (!origin) {
+                Ui.log(Ui.f`Please add an origin name to the ${command} command. For options, use the ellipsis ${'...'}`);
                 return;
             }
             // ----------------
-            const data = await config[domain].read(flags, layout);
-            Promptx(await config[domain].questions(data, {}, layout)).then(async _data => {
-                await config[domain].write(_merge(data, _data), flags, layout);
-            });
-
+            services.origins.deploy(Ui, origin, flags, layout);
         break;
 
         // --------------------------
 
         case 'cert':
             var domains = Object.keys(keywords);
-           cmd.certbot.generate(Ui, domains, flags, layout);
+           services.certbot.generate(Ui, domains, flags, layout);
         break;
         
         case 'help':

package/src/{modules → runtime}/client/Http.js

@@ -172,7 +172,7 @@ export default class Http {
 					instance.history.pushState(instance.history.state, '', instance.location.href);
 				} catch(e) {}
 			}
-		}, {diff: true});
+		}, { diff: true });
 
 		// ----------------------------------
 		const createRequest = (url, referrer, e = {}) => {

package/src/{modules/client/Client.js → runtime/client/Runtime.js}

@@ -152,7 +152,7 @@ export default function(layout, params) {
 			// Render...
 			// --------
 
-			if (!document.activeElement && event && _isObject(event.detail) && (event.detail.src instanceof Element) && /* do only on url path change */ _before(event.value, '?') !== _before(event.oldValue, '?')) {
+			if (/*document.activeElement === document.body && */event && _isObject(event.detail) && (event.detail.src instanceof Element) && /* do only on url path change */ _before(event.value, '?') !== _before(event.oldValue, '?')) {
 				setTimeout(() => {
 					var urlTarget;
 					if (clientNavigationEvent.url.hash && (urlTarget = document.querySelector(clientNavigationEvent.url.hash))) {

package/src/runtime/index.js

@@ -0,0 +1,5 @@
+
+/**
+ * exports
+ */
+export * as server from './server/index.js';

package/src/{modules/server/Server.js → runtime/server/Runtime.js}

@@ -19,7 +19,7 @@ import _delay from '@webqit/util/js/delay.js';
 import { slice as _streamSlice } from 'stream-slice';
 import { v4 as uuidv4, v5 as uuidv5 } from 'uuid';
 import * as config from '../../config/index.js';
-import * as cmd from '../../cmd/index.js';
+import * as services from '../../services/index.js';
 import NavigationEvent from './NavigationEvent.js';
 import Router from './Router.js';
 
@@ -321,8 +321,8 @@ export async function run(instanceSetup, hostSetup, request, response, Ui, flags
             // --------
             // ROUTE FOR DEPLOY
             // --------
-            if (cmd.origins) {
-                await cmd.origins.hook(Ui, serverNavigationEvent, async (payload, defaultPeployFn) => {
+            if (services.origins) {
+                await services.origins.hook(Ui, serverNavigationEvent, async (payload, defaultPeployFn) => {
                     var exitCode = await router.route('deploy', serverNavigationEvent, payload, function(event, _payload) {
                         return defaultPeployFn(_payload);
                     });

package/src/{cmd/server.js → runtime/server/index.js}

@@ -7,8 +7,8 @@ import Path from 'path';
 import Pm2 from 'pm2';
 import _promise from '@webqit/util/js/promise.js';
 import * as DotJson from '@webqit/backpack/src/dotfiles/DotJson.js';
-import * as server from '../config/server.js'
-import Server from '../modules/server/Server.js';
+import * as server from '../../config/server.js'
+import Runtime from './Runtime.js';
 
 /**
  * @description
@@ -26,7 +26,7 @@ export const desc = {
 export async function start(Ui, flags = {}, layout = {}) {
     const config = await server.read(flags, layout);
     const currentDir = Path.dirname(Url.fileURLToPath(import.meta.url));
-    const script = Path.resolve(currentDir, '../modules/server/start.mjs');
+    const script = Path.resolve(currentDir, './index.mjs');
      // -------------------
     // Splash screen
     // -------------------
@@ -34,7 +34,7 @@ export async function start(Ui, flags = {}, layout = {}) {
         // -------------------
         // Splash screen
         // -------------------
-        const WEBFLO = DotJson.read(Path.join(currentDir, '../../package.json'));
+        const WEBFLO = DotJson.read(Path.join(currentDir, '../../../package.json'));
         Ui.banner(WEBFLO.title, WEBFLO.version);
         Ui.log('');
         Ui.log(Ui.f`${'-------------------------------'}`);
@@ -51,7 +51,7 @@ export async function start(Ui, flags = {}, layout = {}) {
         Ui.log(Ui.f`${'-------------------------------'}`);
         Ui.log('');
         if (processName) {
-            Ui.success(`Server running in ${Ui.style.keyword('production')}; ${(processAutoRestart ? 'will' : 'wo\'nt')} autorestart on crash!`);
+            Ui.success(`Runtime running in ${Ui.style.keyword('production')}; ${(processAutoRestart ? 'will' : 'wo\'nt')} autorestart on crash!`);
             Ui.info(Ui.f`Process name: ${processName}`);
             Ui.log('');
         }
@@ -109,7 +109,7 @@ export async function start(Ui, flags = {}, layout = {}) {
             });
         });    
     }
-    await Server.call(null, Ui, flags);
+    await Runtime.call(null, Ui, flags);
     showRunning();
 };
 
@@ -124,7 +124,7 @@ export function stop(Ui, name, flags = {}) {
             if (err) {
                 Ui.error(err);
             } else {
-                Ui.success(Ui.f`Server ${flags.kill ? 'killed' : 'stopped'}: ${name}`);
+                Ui.success(Ui.f`Runtime ${flags.kill ? 'killed' : 'stopped'}: ${name}`);
             }
             resolve();
         };
@@ -148,7 +148,7 @@ export function restart(Ui, name, flags = {}) {
             if (err) {
                 Ui.error(err);
             } else {
-                Ui.success(Ui.f`Server restarted: ${name}`);
+                Ui.success(Ui.f`Runtime restarted: ${name}`);
             }
             resolve();
         });

package/src/{modules/server/start.mjs → runtime/server/index.mjs}

@@ -4,7 +4,7 @@
  */
 import parseArgs from '@webqit/backpack/src/cli/parseArgs.js';
 import Ui from '@webqit/backpack/src/cli/Ui.js';
-import Server from './Server.js';
+import Runtime from './Runtime.js';
 
 const { flags } = parseArgs(process.argv);
-Server.call(null, Ui, flags);    
+Runtime.call(null, Ui, flags);    

package/src/{cmd/certbot.js → services/certbot/index.js}

@@ -3,10 +3,9 @@
  * imports
  */
 import Fs from 'fs';
-import Readline from 'readline';
 import { spawn } from 'child_process';
 import _arrFrom from '@webqit/util/arr/from.js';
-import * as _server from '../config/server.js';
+import * as _server from '../../config/server.js';
 
 /**
  * @description
@@ -72,4 +71,4 @@ export async function generate(Ui, allDomains, flags = {}, layout = {}) {
         }
         process.exit();
     });
-};
+}

package/src/services/index.js

@@ -0,0 +1,6 @@
+
+/**
+ * exports
+ */
+export * as certbot from './certbot/index.js';
+export * as origins from './origins/index.js';

package/src/{cmd/origins.js → services/origins/index.js}

@@ -10,7 +10,7 @@ import _beforeLast from '@webqit/util/str/beforeLast.js';
 import _isObject from '@webqit/util/js/isObject.js';
 import SimpleGit from 'simple-git';
 import Webhooks from '@octokit/webhooks';
-import * as origins from '../config/origins.js'
+import * as origins from '../../config/origins.js';
 
 /**
  * @description
@@ -133,7 +133,7 @@ export async function deploy(Ui, origin, flags = {}, layout = {}) {
             return pull();
         }
     });
-};
+}
 
 /**
  * @hook
@@ -183,4 +183,4 @@ export async function hook(Ui, event, deployCallback, flags = {}, layout = {}) {
             payload: submits.payload /* JSON object */,
         });
     }
-};
+}

package/src/cmd/index.js

@@ -1,8 +0,0 @@
-
-/**
- * exports
- */
-export * as certbot from './certbot.js';
-export * as client from './client.js';
-export * as origins from './origins.js';
-export * as server from './server.js';