@webqit/webflo 0.20.4 → 0.20.6

package/package.json

@@ -12,7 +12,7 @@
     "vanila-javascript"
   ],
   "homepage": "https://webqit.io/tooling/webflo",
-  "version": "0.20.4",
+  "version": "0.20.6",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -42,35 +42,29 @@
     "webflo-certbot-http-cleanup-hook": "src/services-pi/cert/http-cleanup-hook.js"
   },
   "dependencies": {
-    "@linked-db/linked-ql": "^0.30.13",
     "@octokit/webhooks": "^7.15.1",
     "@webqit/backpack": "^0.1.12",
-    "@webqit/oohtml-ssr": "^2.1.1",
-    "@webqit/quantum-js": "^4.6.3",
+    "@webqit/oohtml-ssr": "^2.2.1",
+    "@webqit/use-live": "^0.5.41",
     "@webqit/util": "^0.8.11",
     "dotenv": "^16.4.7",
-    "fs-extra": "^11.3.0",
-    "i": "^0.3.7",
-    "ioredis": "^5.5.0",
-    "jsdom": "^21.1.1",
-    "markdown-it-mathjax3": "^4.3.2",
+    "esbuild": "^0.14.38",
     "mime-types": "^2.1.33",
-    "npm": "^11.4.0",
-    "pg": "^8.13.3",
     "simple-git": "^2.20.1",
-    "urlpattern-polyfill": "^4.0.3",
-    "vitepress-plugin-mermaid": "^2.0.17",
-    "web-push": "^3.6.7"
+    "urlpattern-polyfill": "^4.0.3"
   },
   "devDependencies": {
     "chai": "^4.3.6",
     "chokidar": "^4.0.3",
     "coveralls": "^3.1.1",
-    "esbuild": "^0.14.38",
     "fast-glob": "^3.3.3",
+    "jsdom": "^27.0.1",
+    "markdown-it-mathjax3": "^4.3.2",
     "mocha": "^10.0.0",
     "mocha-lcov-reporter": "^1.3.0",
-    "vitepress": "^1.6.4"
+    "vitepress": "^1.6.4",
+    "vitepress-plugin-mermaid": "^2.0.17",
+    "web-push": "^3.6.7"
   },
   "author": "Oxford Harrison <oxharris.dev@gmail.com>",
   "maintainers": [

package/src/build-pi/esbuild-plugin-uselive-transform 2.js

@@ -0,0 +1,42 @@
+import Fs from 'fs/promises';
+import { parse, compile, matchPrologDirective, serialize } from '@webqit/use-live';
+
+export function UseLiveTransform() {
+    return {
+        name: 'uselive-transform',
+        setup(build) {
+            build.onLoad({ filter: /\.(js|mjs|ts|jsx|tsx)$/ }, async (args) => {
+                const code = await Fs.readFile(args.path, 'utf8');
+                
+                // Super dirty detection
+                if (matchPrologDirective(code)) {
+                    // Actual check...
+
+                    let ast;
+                    try { ast = parse(code, parserParams); } catch (e) { console.error(args.path, '\nUseLive transform error:', e); }
+                    
+                    if (ast?.isLiveProgram || ast?.hasLiveFunctions) {
+                        const result = await compile(parserParams.sourceType+'-file', ast, {
+                            liveMode: ast.isLiveProgram, // Regarding top-level
+                            fileName: args.path,
+                        });
+                        return { contents: serialize(result), loader: 'js' };
+                    }
+                }
+
+                return { contents: code, loader: 'default' };
+            });
+        }
+    };
+}
+
+export const parserParams = {
+    ecmaVersion: 'latest',
+    sourceType: 'module',
+    executionMode: 'RegularProgram', // 'LiveProgram'
+    allowReturnOutsideFunction: true,
+    allowAwaitOutsideFunction: true,
+    allowSuperOutsideMethod: false,
+    preserveParens: false,
+    locations: true,
+};

package/src/build-pi/esbuild-plugin-uselive-transform.js

@@ -0,0 +1,42 @@
+import Fs from 'fs/promises';
+import { parse, compile, matchPrologDirective, serialize } from '@webqit/use-live';
+
+export function UseLiveTransform() {
+    return {
+        name: 'uselive-transform',
+        setup(build) {
+            build.onLoad({ filter: /\.(js|mjs|ts|jsx|tsx)$/ }, async (args) => {
+                const code = await Fs.readFile(args.path, 'utf8');
+                
+                // Super dirty detection
+                if (matchPrologDirective(code)) {
+                    // Actual check...
+
+                    let ast;
+                    try { ast = parse(code, parserParams); } catch (e) { console.error(args.path, '\nUseLive transform error:', e); }
+                    
+                    if (ast?.isLiveProgram || ast?.hasLiveFunctions) {
+                        const result = await compile(parserParams.sourceType+'-file', ast, {
+                            liveMode: ast.isLiveProgram, // Regarding top-level
+                            fileName: args.path,
+                        });
+                        return { contents: serialize(result), loader: 'js' };
+                    }
+                }
+
+                return { contents: code, loader: 'default' };
+            });
+        }
+    };
+}
+
+export const parserParams = {
+    ecmaVersion: 'latest',
+    sourceType: 'module',
+    executionMode: 'RegularProgram', // 'LiveProgram'
+    allowReturnOutsideFunction: true,
+    allowAwaitOutsideFunction: true,
+    allowSuperOutsideMethod: false,
+    preserveParens: false,
+    locations: true,
+};

package/src/build-pi/index.js

@@ -10,7 +10,7 @@ import { jsFile } from '@webqit/backpack/src/dotfile/index.js';
 import { bootstrap as serverBootstrap } from '../runtime-pi/webflo-server/bootstrap.js';
 import { bootstrap as clientBootstrap } from '../runtime-pi/webflo-client/bootstrap.js';
 import { bootstrap as workerBootstrap } from '../runtime-pi/webflo-worker/bootstrap.js';
-import { LiveJSTransform } from './esbuild-plugin-livejs-transform.js';
+import { UseLiveTransform } from './esbuild-plugin-uselive-transform.js';
 import { CLIContext } from '../CLIContext.js';
 import '../runtime-pi/webflo-url/urlpattern.js';
 
@@ -145,14 +145,14 @@ async function bundleScript({ $context, $source, which, outfile, asModule = true
     const bundlingConfig = {
         entryPoints: [moduleFile],
         outfile,
-        bundle: which === 'server' ? false : true,
-        minify: true,
         format: asModule ? 'esm' : 'iife',
         platform: which === 'server' ? 'node' : 'browser', // optional but good for clarity
+        bundle: which === 'server' ? false : true,
+        minify: which === 'server' ? false : true,
         treeShaking: true,   // Important optimization
         banner: { js: '/** @webqit/webflo */', },
         footer: { js: '', },
-        plugins: [ LiveJSTransform() ],
+        plugins: [UseLiveTransform()],
         ...(restParams.buildParams || {})
     };
     if (!asModule) {
@@ -290,8 +290,10 @@ async function generateClientScript({ $context, bootstrap, ...restParams }) {
 
     const configExport = structuredClone({ ENV: bootstrap.config.ENV, CLIENT: bootstrap.config.CLIENT, WORKER: {} });
     if (bootstrap.config.CLIENT.capabilities?.service_worker === true) {
+        const outfile_workerBuild = Path.join(FLAGS.outdir || bootstrap.outdir, bootstrap.config.WORKER.filename);
+        const outfile_workerBuildPublic = Path.join(publicBaseUrl, Path.relative(bootstrap.config.LAYOUT.PUBLIC_DIR, outfile_workerBuild));
         configExport.WORKER = {
-            filename: Path.join(publicBaseUrl.replace(/^\//, ''), bootstrap.config.WORKER.filename),
+            filename: outfile_workerBuildPublic,
             scope: bootstrap.config.WORKER.scope
         };
     }

package/src/init-pi/index.js

@@ -40,7 +40,7 @@ export async function init(projectName = 'my-webflo-app', projectTitle = '', pro
         process.exit(1);
     }
 
-    LOGGER?.log(LOGGER.style.keyword(`> `) + `Initializing your webflo app: "${projectName}" using template "${template}"...\n`);
+    LOGGER?.log(LOGGER.style.keyword(`> `) + `Initializing your webflo app "${projectName}" using template "${template}"...\n`);
 
     // 1. Create project dir
     await Fs2.mkdir(targetDir, { recursive: true });

package/src/init-pi/templates/pwa/.gitignore

@@ -0,0 +1,6 @@
+node_modules
+.*
+!/.github
+!/.gitignore
+!/.webqit
+/.webqit/webflo/@runtime

package/src/init-pi/templates/pwa/.webqit/webflo/client.json

@@ -0,0 +1,15 @@
+{
+    "filename": "app.js",
+    "public_base_url": "/",
+    "copy_public_variables": true,
+    "spa_routing": true,
+    "capabilities": {
+        "service_worker": true,
+        "webpush": true,
+        "custom_install": true,
+        "exposed": [
+            "display-mode",
+            "notifications"
+        ]
+    }
+}

package/src/init-pi/templates/pwa/.webqit/webflo/layout.json

@@ -0,0 +1,7 @@
+{
+    "PUBLIC_DIR": "./public",
+    "VIEWS_DIR": "./app",
+    "SERVER_DIR": "./app",
+    "CLIENT_DIR": "./app",
+    "WORKER_DIR": "./app"
+}

package/src/init-pi/templates/pwa/public/manifest.json

@@ -10,12 +10,12 @@
   "scope": "/",
   "icons": [
     {
-      "src": "/assets/...",
+      "src": "/assets/logo.png",
       "sizes": "192x192",
       "type": "image/png"
     },
     {
-      "src": "/assets/...",
+      "src": "/assets/logo.png",
       "sizes": "512x512",
       "type": "image/png",
       "purpose": "maskable"

package/src/init-pi/templates/web/.gitignore

@@ -0,0 +1,6 @@
+node_modules
+.*
+!/.github
+!/.gitignore
+!/.webqit
+/.webqit/webflo/@runtime

package/src/init-pi/templates/web/.webqit/webflo/client.json

@@ -0,0 +1,12 @@
+{
+    "filename": "app.js",
+    "public_base_url": "/",
+    "copy_public_variables": true,
+    "spa_routing": true,
+    "capabilities": {
+        "service_worker": false,
+        "webpush": false,
+        "custom_install": false,
+        "exposed": []
+    }
+}

package/src/init-pi/templates/web/.webqit/webflo/layout.json

@@ -0,0 +1,7 @@
+{
+    "PUBLIC_DIR": "./public",
+    "VIEWS_DIR": "./app",
+    "SERVER_DIR": "./app",
+    "CLIENT_DIR": "./app",
+    "WORKER_DIR": "./app"
+}

package/src/runtime-pi/WebfloRuntime.js

@@ -1,5 +1,6 @@
 import { WebfloRouter } from './webflo-routing/WebfloRouter.js';
-import { LiveResponse, response as responseShim, headers as headersShim } from './webflo-fetch/index.js';
+import { response as responseShim, headers as headersShim } from './webflo-fetch/index.js';
+import { LiveResponse } from './webflo-fetch/LiveResponse.js';
 import { AppBootstrap } from './AppBootstrap.js';
 import { _wq } from '../util.js';
 
@@ -31,6 +32,14 @@ export class WebfloRuntime {
     }
 
     async initialize() {
+        if (this.bootstrap.init.SETUP) {
+            await this.bootstrap.init.SETUP(this);
+        }
+        await this.initCreateStorage();
+        return this.#instanceController;
+    }
+
+    async initCreateStorage() {
         if (!this.bootstrap.init.createStorage) {
             const inmemSessionRegistry = new Map;
             this.bootstrap.init.createStorage = (namespace) => {
@@ -55,8 +64,8 @@ export class WebfloRuntime {
         return this.#instanceController;
     }
 
-    async createStorage(namespace, ttl) {
-       return await this.bootstrap.init.createStorage(namespace, ttl);
+    createStorage(namespace, ttl) {
+        return this.bootstrap.init.createStorage(namespace, ttl);
     }
 
     createRequest(href, init = {}) {
@@ -90,7 +99,7 @@ export class WebfloRuntime {
         }
         // Dispatch event
         const router = new this.constructor.Router(this, httpEvent.url.pathname);
-        await router.route(['SETUP'], httpEvent);
+        await router.route(['SETUP'], httpEvent.extend(false));
         // Do proper routing for respone
         const response = await new Promise(async (resolve) => {
             let autoLiveResponse, response;
@@ -112,10 +121,11 @@ export class WebfloRuntime {
                 console.error(e);
                 response = new Response(null, { status: 500, statusText: e.message });
             }
-            if (!(response instanceof LiveResponse) && !(response instanceof Response)) {
-                response = LiveResponse.test(response) === 'Default'
-                    ? responseShim.from.value(response)
-                    : await LiveResponse.from(response, { responsesOK: true });
+            if (!/Response/.test(LiveResponse.test(response))) {
+                const isLifecyleComplete = httpEvent.lifeCycleComplete();
+                response = LiveResponse.test(response) !== 'Default' || !isLifecyleComplete
+                    ? await LiveResponse.from(response, { done: isLifecyleComplete })
+                    : responseShim.from.value(response);
             }
             // Any "carry" data?
             //await this.handleCarries(httpEvent, response);
@@ -126,15 +136,14 @@ export class WebfloRuntime {
                 resolve(response);
             }
         });
+
         // Commit data in the exact order. Reason: in how they depend on each other
         for (const storage of [httpEvent.user, httpEvent.session, httpEvent.cookies]) {
             await storage?.commit?.(response, FLAGS['dev']);
         }
-        if (response instanceof LiveResponse && response.whileLive()) {
+        // Wait for any whileLive promises to resolve
+        if (LiveResponse.test(response) === 'LiveResponse' && response.whileLive()) {
             httpEvent.waitUntil(response.whileLive(true));
-        } else {
-            httpEvent.waitUntil(Promise.resolve());
-            await null; // We need the above resolved before we move on
         }
 
         // Send the X-Background-Messaging-Port header
@@ -173,9 +182,9 @@ export class WebfloRuntime {
             });
         }
 
-        if (!this.isClientSide && response instanceof LiveResponse) {
+        if (!this.isClientSide && LiveResponse.test(response) === 'LiveResponse') {
             // Must convert to Response on the server-side before returning
-            return response.toResponse({ client: httpEvent.client });
+            return await response.toResponse({ client: httpEvent.client });
         }
 
         return response;

package/src/runtime-pi/apis.js

@@ -1,5 +1,5 @@
 import { LiveResponse } from './webflo-fetch/LiveResponse.js';
-import { Observer } from '@webqit/quantum-js';
+import { Observer } from '@webqit/use-live';
 import { shim } from './webflo-fetch/index.js';
 
 export {

package/src/runtime-pi/webflo-client/DeviceCapabilities.js

@@ -1,4 +1,4 @@
-import { Observer } from '@webqit/quantum-js';
+import { Observer } from '@webqit/use-live';
 
 export class DeviceCapabilities {
 

package/src/runtime-pi/webflo-client/WebfloClient.js

@@ -1,9 +1,10 @@
 import { _before, _toTitle } from '@webqit/util/str/index.js';
 import { _isObject } from '@webqit/util/js/index.js';
-import { Observer } from '@webqit/quantum-js';
+import { Observer } from '@webqit/use-live';
 import { WebfloRuntime } from '../WebfloRuntime.js';
 import { WQMessageChannel } from '../webflo-messaging/WQMessageChannel.js';
-import { LiveResponse, response as responseShim } from '../webflo-fetch/index.js';
+import { response as responseShim } from '../webflo-fetch/index.js';
+import { LiveResponse } from '../webflo-fetch/LiveResponse.js';
 import { WQStarPort } from '../webflo-messaging/WQStarPort.js';
 import { ClientSideCookies } from './ClientSideCookies.js';
 import { HttpSession } from '../webflo-routing/HttpSession.js';

package/src/runtime-pi/webflo-client/WebfloRootClient1.js

@@ -1,8 +1,9 @@
-import { Observer } from '@webqit/quantum-js';
+import { Observer } from '@webqit/use-live';
 import { WebfloClient } from './WebfloClient.js';
 import { ClientSideWorkport } from './ClientSideWorkport.js';
 import { DeviceCapabilities } from './DeviceCapabilities.js';
-import { LiveResponse, response as responseShim } from '../webflo-fetch/index.js';
+import { response as responseShim } from '../webflo-fetch/index.js';
+import { LiveResponse } from '../webflo-fetch/LiveResponse.js';
 import { WebfloHMR } from './webflo-devmode.js';
 
 export class WebfloRootClient1 extends WebfloClient {
@@ -92,8 +93,10 @@ export class WebfloRootClient1 extends WebfloClient {
 		cleanups.push(() => this.#capabilities.close());
 		if (this.config.CLIENT.capabilities?.service_worker) {
 			const { filename, ...restServiceWorkerParams } = this.config.WORKER;
-			this.#workport = await this.constructor.Workport.initialize(null, (this.config.CLIENT.public_base_url || '') + filename, restServiceWorkerParams);
-			cleanups.push(() => this.#workport.close());
+			this.constructor.Workport.initialize(null, filename, restServiceWorkerParams).then((workport) => {
+				this.#workport = workport;
+				cleanups.push(() => this.#workport.close());
+			});
 		}
 		return instanceController;
 	}
@@ -113,6 +116,7 @@ export class WebfloRootClient1 extends WebfloClient {
 			this.background.addPort(backgroundPort);
 		}
 		if (scopeObj.response.body || backgroundPort) {
+
 			const httpEvent = this.createHttpEvent({ request: this.createRequest(this.location.href) }, true);
 			await this.render(httpEvent, scopeObj.response);
 		} else {

package/src/runtime-pi/webflo-client/WebfloRootClient2.js

@@ -1,4 +1,4 @@
-import { Observer } from '@webqit/quantum-js';
+import { Observer } from '@webqit/use-live';
 import { WebfloRootClient1 } from './WebfloRootClient1.js';
 
 export class WebfloRootClient2 extends WebfloRootClient1 {

package/src/runtime-pi/webflo-client/WebfloSubClient.js

@@ -1,4 +1,4 @@
-import { Observer } from '@webqit/quantum-js';
+import { Observer } from '@webqit/use-live';
 import { WebfloClient } from './WebfloClient.js';
 import { defineElement } from './webflo-embedded.js';
 import { Url } from '../webflo-url/Url.js';

package/src/runtime-pi/webflo-client/bootstrap.js

@@ -21,6 +21,7 @@ export async function bootstrap(cx, offset = '') {
     };
     if (config.CLIENT.copy_public_variables) {
         const publicEnvPattern = /(?:^|_)PUBLIC(?:_|$)/;
+        config.ENV.data = config.ENV.data || {};
         for (const key in process.env) {
             if (publicEnvPattern.test(key)) {
                 config.ENV.data[key] = process.env[key];

package/src/runtime-pi/webflo-fetch/LiveResponse.js

@@ -1,4 +1,4 @@
-import { State, Observer } from '@webqit/quantum-js';
+import { Observer, LiveMode } from '@webqit/use-live';
 import { _isObject, _isTypeObject } from '@webqit/util/js/index.js';
 import { publishMutations, applyMutations } from '../webflo-messaging/wq-message-port.js';
 import { WQBroadcastChannel } from '../webflo-messaging/WQBroadcastChannel.js';
@@ -9,8 +9,11 @@ import { isTypeStream } from './util.js';
 
 export class LiveResponse extends EventTarget {
 
+    [Symbol.toStringTag] = 'LiveResponse';
+
     static test(data) {
-        if (data instanceof LiveResponse) {
+        if (data instanceof LiveResponse
+            || data?.[Symbol.toStringTag] === 'LiveResponse') {
             return 'LiveResponse';
         }
         if (data instanceof Response) {
@@ -19,24 +22,25 @@ export class LiveResponse extends EventTarget {
         if (isGenerator(data)) {
             return 'Generator';
         }
-        if (data instanceof State) {
-            return 'Quantum';
+        if (data instanceof LiveMode
+            || data?.[Symbol.toStringTag] === 'LiveMode') {
+            return 'LiveMode';
         }
         return 'Default';
     }
 
     static async from(data, ...args) {
-        if (data instanceof LiveResponse) {
+        if (this.test(data) === 'LiveResponse') {
             return data.clone(...args);
         }
-        if (data instanceof Response) {
+        if (this.test(data) === 'Response') {
             return await this.fromResponse(data, ...args);
         }
-        if (isGenerator(data)) {
+        if (this.test(data) === 'Generator') {
             return await this.fromGenerator(data, ...args);
         }
-        if (data instanceof State) {
-            return this.fromQuantum(data, ...args);
+        if (this.test(data) === 'LiveMode') {
+            return this.fromLiveMode(data, ...args);
         }
         return new this(data, ...args);
     }
@@ -45,7 +49,7 @@ export class LiveResponse extends EventTarget {
         if (!(response instanceof Response)) {
             throw new Error('Argument must be a Response instance.');
         }
-        
+
         const body = await responseShim.prototype.parse.value.call(response);
 
         // Instance
@@ -108,7 +112,7 @@ export class LiveResponse extends EventTarget {
         let $$await;
 
         const $options = { done: firstFrame.done, ...options };
-        if (value instanceof LiveResponse) {
+        if (this.test(value) === 'LiveResponse') {
             instance = new this;
             const responseMeta = _wq(value, 'meta');
             _wq(instance).set('meta', responseMeta);
@@ -133,15 +137,18 @@ export class LiveResponse extends EventTarget {
         return instance;
     }
 
-    static async fromQuantum(qState, options = {}) {
-        if (!(qState instanceof State)) {
-            throw new Error('Argument must be a Quantum State instance.');
+    static async fromLiveMode(liveMode, options = {}) {
+        if (!this.test(liveMode) === 'LiveMode') {
+            throw new Error('Argument must be a UseLive LiveMode instance.');
+        }
+        const instance = new this;
+        await instance.replaceWith(liveMode.value, { done: false, ...options });
+        if (instance.#generatorType === 'Default') {
+            instance.#generator = liveMode;
+            instance.#generatorType = 'LiveMode';
         }
-        const instance = new this(qState.value, { done: false, ...options });
-        instance.#generator = qState;
-        instance.#generatorType = 'Quantum';
         Observer.observe(
-            qState,
+            liveMode,
             'value',
             (e) => instance.#replaceWith(e.value),
             { signal: instance.#abortController.signal }
@@ -156,8 +163,7 @@ export class LiveResponse extends EventTarget {
     }
 
     static getBackground(respone) {
-        if (!(respone instanceof Response)
-            && !(respone instanceof LiveResponse)) return;
+        if (!/Response/.test(this.test(respone) )) return;
         const responseMeta = _wq(respone, 'meta');
         if (!responseMeta.has('background_port')) {
             const value = respone.headers.get('X-Background-Messaging-Port')?.trim();
@@ -322,8 +328,9 @@ export class LiveResponse extends EventTarget {
         const execReplaceWithResponse = async (response, options) => {
             this.#generator = response;
             this.#generatorType = response instanceof Response ? 'Response' : 'LiveResponse';
+            const body = response instanceof Response ? await responseShim.prototype.parse.value.call(response) : response.body;
             execReplaceWith({
-                body: response instanceof Response ? await responseShim.prototype.parse.value.call(response) : response.body,
+                body,
                 status: responseShim.prototype.status.get.call(response),
                 statusText: response.statusText,
                 headers: response.headers,
@@ -332,7 +339,7 @@ export class LiveResponse extends EventTarget {
                 redirected: response.redirected,
                 url: response.url,
             });
-            if (response instanceof LiveResponse) {
+            if (this.constructor.test(response) === 'LiveResponse') {
                 response.addEventListener('replace', () => execReplaceWith(response), { signal: this.#abortController.signal });
                 return await response.whileLive(true);
             }
@@ -360,7 +367,7 @@ export class LiveResponse extends EventTarget {
         };
 
         let donePromise;
-        if (body instanceof Response || body instanceof LiveResponse) {
+        if (/Response/.test(body)) {
             if (frameClosure) {
                 throw new Error('frameClosure unsupported for inputs of type response.');
             }
@@ -439,8 +446,8 @@ export class LiveResponse extends EventTarget {
         }));
     }
 
-    toQuantum({ signal: abortSignal } = {}) {
-        const state = new StateX;
+    toLiveMode({ signal: abortSignal } = {}) {
+        const state = new LiveModeX;
         const replaceHandler = () => Observer.defineProperty(state, 'value', { value: this.body, enumerable: true, configurable: true });
         this.addEventListener('replace', replaceHandler, { signal: abortSignal });
         replaceHandler();
@@ -462,7 +469,7 @@ export const isGenerator = (obj) => {
         typeof obj?.return === 'function';
 };
 
-class StateX extends State {
+class LiveModeX extends LiveMode {
     constructor() { }
-    dispose() { }
+    abort() { }
 }

package/src/runtime-pi/webflo-fetch/index.js

@@ -1,10 +1,11 @@
-export { LiveResponse } from './LiveResponse.js';
 import { _isObject, _isTypeObject, _isNumeric } from '@webqit/util/js/index.js';
 import { _from as _arrFrom } from '@webqit/util/arr/index.js';
 import { _before, _after } from '@webqit/util/str/index.js';
 import { DeepURLSearchParams } from '../webflo-url/util.js';
 import { dataType } from './util.js';
 import { _wq } from '../../util.js';
+import { Observer } from '@webqit/use-live';
+import { LiveResponse } from './LiveResponse.js';
 
 // ----- env & globalize
 
@@ -30,6 +31,8 @@ export function shim(prefix = 'wq') {
             patch(api.prototype, prototype);
         }
     }
+    globalThis.LiveResponse = LiveResponse;
+    globalThis.Observer = Observer;
 }
 
 // ----- request
@@ -150,7 +153,14 @@ export const response = {
         }
     },
     prototype: {
-        status: { get: function () { return _wq(this, 'meta').get('status') || responseOriginals.prototype.status.get.call(this); } },
+        status: {
+            get: function () {
+                return _wq(this, 'meta').get('status')
+                    || this instanceof Response
+                    ? responseOriginals.prototype.status.get.call(this)
+                    : this.status;
+            }
+        },
         carry: { get: function () { return _wq(this, 'meta').get('carry'); } },
         parse: { value: async function () { return await parseHttpMessage(this); } },
         clone: {
@@ -336,23 +346,23 @@ export function renderHttpMessageInit(httpMessageInit) {
         return { ..._headers, [name.toLowerCase()]: httpMessageInit.headers[name] };
     }, {});
     // Process body
-    let body = httpMessageInit.body, type = dataType(httpMessageInit.body);
+    let body = httpMessageInit.body,
+        type = dataType(httpMessageInit.body);
+
     if (['Blob', 'File'].includes(type)) {
         !headers['content-type'] && (headers['content-type'] = body.type);
         !headers['content-length'] && (headers['content-length'] = body.size);
     } else if (['Uint8Array', 'Uint16Array', 'Uint32Array', 'ArrayBuffer'].includes(type)) {
         !headers['content-length'] && (headers['content-length'] = body.byteLength);
     } else if (type === 'json' && _isTypeObject(body)/*JSON object*/) {
-        if (!headers['content-type']) {
-            const [_body, isJsonfiable] = createFormDataFromJson(body, true/*jsonfy*/, true/*getIsJsonfiable*/);
-            if (isJsonfiable) {
-                body = JSON.stringify(body, (k, v) => v instanceof Error ? { ...v, message: v.message } : v);
-                headers['content-type'] = 'application/json';
-                headers['content-length'] = (new Blob([body])).size;
-            } else {
-                body = _body;
-                type = 'FormData';
-            }
+        const [_body, isJsonfiable] = createFormDataFromJson(body, true/*jsonfy*/, true/*getIsJsonfiable*/);
+        if (isJsonfiable) {
+            body = JSON.stringify(body, (k, v) => v instanceof Error ? { ...v, message: v.message } : v);
+            headers['content-type'] = 'application/json';
+            headers['content-length'] = (new Blob([body])).size;
+        } else {
+            body = _body;
+            type = 'FormData';
         }
     } else if (type === 'json'/*JSON string*/ && !headers['content-length']) {
         (headers['content-length'] = (body + '').length);
@@ -429,7 +439,5 @@ export function renderCookieObjToString(cookieObj) {
 
 const importUrl = new URL(import.meta.url);
 if (importUrl.searchParams.has('shim')) {
-    globalThis.LiveResponse = LiveResponse;
     shim(importUrl.searchParams.get('shim')?.trim());
-    console.log('Webflo Fetch APIs shimmed.');
 }

package/src/runtime-pi/webflo-fetch/util.js

@@ -22,7 +22,7 @@ export function dataType(value) {
         'Uint8Array', 'Uint16Array', 'Uint32Array', 'ArrayBuffer', 'Blob', 'File', 'FormData', 'Stream', 'ReadableStream'
     ].reduce((_toStringTag, type) => _toStringTag || (toStringTag === type ? type : null), null);
     if (type) return type;
-    if ((_isObject(value) && _isPlainObject(value)) || (Array.isArray(value) && _isPlainArray(value)) || 'toString' in value) {
+    if ((_isObject(value)) || (Array.isArray(value) && _isPlainArray(value)) || 'toString' in value) {
         return 'json';
     }
 }

package/src/runtime-pi/webflo-messaging/WQSockPort.js

@@ -6,14 +6,12 @@ import { _wq } from '../../util.js';
 
 export class WQSockPort extends WQMessagePort {
 
-    static WebSocket = typeof WebSocket !== 'undefined' ? WebSocket : null;
-
     #socket;
     #cleanups = [];
 
     constructor(instanceOrConnectionID) {
         super();
-        this.#socket = typeof instanceOrConnectionID === 'string' ? new this.constructor.WebSocket(`/${instanceOrConnectionID}`) : instanceOrConnectionID;
+        this.#socket = typeof instanceOrConnectionID === 'string' ? new WebSocket(`/${instanceOrConnectionID}`) : instanceOrConnectionID;
         const meta = _wq(this, 'meta');
         Object.defineProperty(this, 'wqLifecycle', {
             value: {

package/src/runtime-pi/webflo-messaging/wq-message-port.js

@@ -2,7 +2,7 @@ import { _isObject, _isTypeObject } from '@webqit/util/js/index.js';
 import { WQMessagePort, WQMessagePortInstanceTag } from './WQMessagePort.js';
 import { isTypeStream } from '../webflo-fetch/util.js';
 import { WQMessageEvent } from './WQMessageEvent.js';
-import { Observer } from '@webqit/quantum-js';
+import { Observer } from '@webqit/use-live';
 import { _wq } from '../../util.js';
 
 /**
@@ -294,6 +294,7 @@ export function postRequest(data, callback, options = {}) {
     const { signal, once } = eventOptions2;
     const messageChannel = new MessageChannel;
     messageChannel.port1.start();
+    toWQPort(messageChannel.port1);
     messageChannel.port1.addEventListener('message', (e) => callback(e), { signal, once });
     return this.postMessage(data, { ...$options, transfer: [messageChannel.port2].concat(transfer) });
 }

package/src/runtime-pi/webflo-routing/HttpEvent.js

@@ -1,6 +1,6 @@
 import { _isObject } from '@webqit/util/js/index.js';
 import { _difference } from '@webqit/util/arr/index.js';
-import { LiveResponse } from '../webflo-fetch/index.js';
+import { LiveResponse } from '../webflo-fetch/LiveResponse.js';
 import { xURL } from '../webflo-url/xURL.js';
 import { _wq } from '../../util.js';
 
@@ -45,6 +45,8 @@ export class HttpEvent {
     get state() { return { ...(this.#init.state || {}) }; }
 
     #lifecyclePromises = new Set;
+    get lifecyclePromises() { return this.#lifecyclePromises; }
+
     #lifeCycleResolve;
     #lifeCycleReject;
     #lifeCycleResolutionPromise = new Promise((resolve, reject) => {
@@ -80,12 +82,12 @@ export class HttpEvent {
             && !this.#lifecyclePromises.size;
     }
 
-    waitUntil(promise) {
-        return this.#extendLifecycle(promise);
+    async waitUntil(promise) {
+        return await this.#extendLifecycle(promise);
     }
 
     waitUntilNavigate() {
-        return this.waitUntil(new Promise(() => { }));
+        this.waitUntil(new Promise(() => { }));
     }
 
     #internalLiveResponse = new LiveResponse(null, { done: false });
@@ -100,8 +102,8 @@ export class HttpEvent {
     }
 
     extend(init = {}) {
-        const instance = this.constructor.create(this/*Main difference from clone*/, { ...this.#init, ...init });
-        this.#extendLifecycle(instance.lifeCycleComplete(true));
+        const instance = this.constructor.create(this/*Main difference from clone*/, { ...this.#init, ...(init || {}) });
+        if (init !== false) this.#extendLifecycle(instance.lifeCycleComplete(true));
         return instance;
     }
 

package/src/runtime-pi/webflo-routing/WebfloRouter.js

@@ -1,8 +1,7 @@
-import { State } from '@webqit/quantum-js';
 import { _isFunction, _isArray, _isObject } from '@webqit/util/js/index.js';
 import { _from as _arrFrom } from '@webqit/util/arr/index.js';
+import { LiveResponse } from '../webflo-fetch/LiveResponse.js';
 import { path as Path } from '../webflo-url/util.js';
-import { isGenerator } from '../webflo-fetch/LiveResponse.js';
 
 export class WebfloRouter {
 
@@ -170,11 +169,11 @@ export class WebfloRouter {
                     const returnValue = await handler.call(thisContext, thisTick.event, $next/*next*/, $fetch/*fetch*/);
 
                     // Handle cleanup on abort
-                    if (returnValue instanceof State) {
+                    if (LiveResponse.test(returnValue) === 'LiveMode') {
                         thisTick.event.signal.addEventListener('abort', () => {
-                            returnValue.dispose();
+                            returnValue.abort();
                         });
-                    } else if (isGenerator(returnValue)) {
+                    } else if (LiveResponse.test(returnValue) === 'Generator') {
                         thisTick.event.signal.addEventListener('abort', () => {
                             if (typeof returnValue.return === 'function') {
                                 returnValue.return();
@@ -187,13 +186,19 @@ export class WebfloRouter {
                         resolved = 2;
                         resolve(returnValue);
                     } else if (typeof returnValue !== 'undefined') {
-                        await thisTick.event.internalLiveResponse.replaceWith(returnValue, { done: true });
+                        thisTick.event.internalLiveResponse.replaceWith(returnValue, { done: true });
                     }
                 });
             }
+            let returnValue;
             if (_default) {
-                return await _default.call(thisContext, thisTick.event, remoteFetch);
+                returnValue = await _default.call(thisContext, thisTick.event, remoteFetch);
             }
+            try {
+                // IMPORTANT: Explicitly terminate the event lifecycle if nothing extends it
+                await thisTick.event.waitUntil();
+            } catch(e) {}
+            return returnValue;
         };
 
         return next({

package/src/runtime-pi/webflo-server/WebfloServer.js

@@ -23,7 +23,7 @@ import { ServerSideSession } from './ServerSideSession.js';
 import { HttpEvent } from '../webflo-routing/HttpEvent.js';
 import { HttpUser } from '../webflo-routing/HttpUser.js';
 import { response as responseShim, headers as headersShim } from '../webflo-fetch/index.js';
-import { LiveJSTransform } from '../../build-pi/esbuild-plugin-livejs-transform.js';
+import { UseLiveTransform } from '../../build-pi/esbuild-plugin-uselive-transform.js';
 import { createWindow } from '@webqit/oohtml-ssr';
 import { _wq } from '../../util.js';
 import '../webflo-fetch/index.js';
@@ -57,7 +57,6 @@ export class WebfloServer extends WebfloRuntime {
     }
 
     async initialize() {
-        const instanceController = await super.initialize();
         const { appMeta: APP_META, flags: FLAGS, logger: LOGGER, } = this.cx;
 
         // ----------
@@ -65,9 +64,17 @@ export class WebfloServer extends WebfloRuntime {
         if (FLAGS['dev']) {
             await this.enterDevMode();
         } else {
-            await this.buildRoutes();
+            await this.buildRoutes({ server: true });
         }
 
+        // ----------
+        // Call default-init
+        const instanceController = await super.initialize();
+
+        // ----------
+        // Start serving
+        this.control();
+
         // ----------
         // Show proxies
         const { PROXY } = this.config;
@@ -90,10 +97,6 @@ export class WebfloServer extends WebfloRuntime {
             }
         }
 
-        // ----------
-        // Start serving
-        this.control();
-
         // ----------
         // Show server details
         if (this.#servers.size) {
@@ -108,22 +111,22 @@ export class WebfloServer extends WebfloRuntime {
         return instanceController;
     }
 
-    async buildRoutes({ client = false, worker = false, ...options } = {}) {
+    async buildRoutes({ client = false, worker = false, server = false, ...options } = {}) {
         const routeDirs = [...new Set([this.config.LAYOUT.CLIENT_DIR, this.config.LAYOUT.WORKER_DIR, this.config.LAYOUT.SERVER_DIR])];
-        const entryPoints = await $glob(routeDirs.map((d) => `${d}/**/handler{${client ? ',.client' : ''}${worker ? ',.worker' : ''},.server}.js`), { absolute: true })
+        const entryPoints = await $glob(routeDirs.map((d) => `${d}/**/handler{${client ? ',.client' : ''}${worker ? ',.worker' : ''}${server ? ',.server' : ''}}.js`), { absolute: true })
             .then((files) => files.map((file) => file.replace(/\\/g, '/')));
-        const entryNames = routeDirs.length === 1 ? `${Path.relative(process.cwd(), routeDirs[0])}/[dir]/[name]` : `[dir]/[name]`;
+        const initFiles = await $glob(`${process.cwd()}/init.server.js`);
         const bundlingConfig = {
-            entryPoints,
+            entryPoints: entryPoints.concat(initFiles),
             outdir: this.config.RUNTIME_DIR,
-            entryNames,
-            bundle: true,
+            outbase: process.cwd(),
             format: 'esm',
-            minify: false,
+            platform: server ? 'node' : 'browser',
+            bundle: server ? false : true,
+            minify: server ? false : true,
             sourcemap: false,
-            platform: 'browser', // optional but good for clarity
-            treeShaking: true,   // Important optimization
-            plugins: [ LiveJSTransform() ],
+            treeShaking: true,
+            plugins: [UseLiveTransform()],
             ...options,
         };
         return await EsBuild.build(bundlingConfig);
@@ -141,6 +144,7 @@ export class WebfloServer extends WebfloRuntime {
             buildSensitivity: parseInt(FLAGS['build-sensitivity'] || 0),
         });
         await this.#hmr.buildRoutes(true);
+        await this.#hmr.bundleAssetsIfPending(true);
         if (FLAGS['open']) {
             for (let [proto, def] of this.#servers) {
                 const url = `${proto}://${def.hostnames.find((h) => h !== '*') || 'localhost'}:${def.port}`;
@@ -149,6 +153,35 @@ export class WebfloServer extends WebfloRuntime {
         }
     }
 
+    async initCreateStorage() {
+        if (this.bootstrap.init.createStorage
+            || !this.bootstrap.init.redis) {
+            return super.initCreateStorage();
+        }
+        const redis = this.bootstrap.init.redis;
+        this.bootstrap.init.createStorage = (namespace, ttl = null) => ({
+            async has(key) { return await redis.hexists(namespace, key); },
+            async get(key) {
+                const value = await redis.hget(namespace, key);
+                return typeof value === 'undefined' ? value : JSON.parse(value);
+            },
+            async set(key, value) {
+                const returnValue = await redis.hset(namespace, key, JSON.stringify(value));
+                if (!this.ttlApplied && ttl) {
+                    await redis.expire(namespace, ttl);
+                    this.ttlApplied = true;
+                }
+                return returnValue;
+            },
+            async delete(key) { return await redis.hdel(namespace, key); },
+            async clear() { return await redis.del(namespace); },
+            async keys() { return await redis.hkeys(namespace); },
+            async values() { return (await redis.hvals(namespace) || []).map((value) => typeof value === 'undefined' ? value : JSON.parse(value)); },
+            async entries() { return Object.entries(await redis.hgetall(namespace) || {}).map(([key, value]) => [key, typeof value === 'undefined' ? value : JSON.parse(value)]); },
+            get size() { return redis.hlen(namespace); },
+        });
+    }
+
     control() {
         const { flags: FLAGS } = this.cx;
         const { SERVER, PROXY } = this.config;
@@ -528,6 +561,10 @@ export class WebfloServer extends WebfloRuntime {
         }
         scopeObj.ext = Path.parse(scopeObj.filename).ext;
         const finalizeResponse = (response) => {
+            // Qualify Service-Worker responses
+            if (httpEvent.request.headers.get('Service-Worker') === 'script') {
+                response.headers.set('Service-Worker-Allowed', this.config.WORKER.scope || '/');
+            }
             const responseMeta = _wq(response, 'meta');
             responseMeta.set('filename', scopeObj.filename);
             responseMeta.set('static', true);
@@ -597,10 +634,7 @@ export class WebfloServer extends WebfloRuntime {
         scopeObj.response.headers.set('X-Frame-Options', 'SAMEORIGIN');
         // 5. Partial content support
         scopeObj.response.headers.set('Accept-Ranges', 'bytes');
-        // 6. Qualify Service-Worker responses
-        if (httpEvent.request.headers.get('Service-Worker') === 'script') {
-            scopeObj.response.headers.set('Service-Worker-Allowed', this.config.WORKER.scope || '/');
-        }
+
         return finalizeResponse(scopeObj.response);
     }
 
@@ -675,7 +709,7 @@ export class WebfloServer extends WebfloRuntime {
         const asHTML = requestAccept?.match('text/html');
         const asIs = requestAccept?.match(response.headers.get('Content-Type'));
         const responseMeta = _wq(response, 'meta');
-        if (requestAccept && asHTML >= asIs && !responseMeta.get('static')) {
+        if (requestAccept && asHTML > asIs && !responseMeta.get('static')) {
             response = await this.render(httpEvent, response);
         } else if (requestAccept && response.headers.get('Content-Type') && !asIs) {
             return new Response(response.body, { status: 406, statusText: 'Not Acceptable', headers: response.headers });

package/src/runtime-pi/webflo-server/webflo-devmode.js

@@ -182,13 +182,17 @@ export class WebfloHMR {
                 const bundlingConfig = {
                     client: true,
                     worker: true,
+                    server: true,
                     metafile: true,      // This is key
                     logLevel: 'silent',  // Suppress output
                     incremental: true,
                 };
                 buildResult = await this.#app.buildRoutes(bundlingConfig);
             }
-        } catch (e) { return false; }
+        } catch (e) {
+            //console.error(e);
+            return false;
+        }
 
         // 1. Forward dependency graph (file -> [imported files])
         const forward = {};
@@ -228,25 +232,25 @@ export class WebfloHMR {
         return true;
     }
 
-    async bundleAssetsIfPending() {
+    async bundleAssetsIfPending(ohForce = false) {
         const entries = {};
 
-        if (this.#dirtiness.clientRoutesAffected.size || this.#dirtiness.serviceWorkerAffected) {
+        if (this.#dirtiness.clientRoutesAffected.size || this.#dirtiness.serviceWorkerAffected || ohForce) {
             entries.js = {};
-            entries.js.client = !!this.#dirtiness.clientRoutesAffected.size;
-            entries.js.worker = this.#dirtiness.serviceWorkerAffected;
+            entries.js.client = !!this.#dirtiness.clientRoutesAffected.size || ohForce;
+            entries.js.worker = this.#dirtiness.serviceWorkerAffected || ohForce;
             entries.js.server = false;
             // Clear state
             this.#dirtiness.clientRoutesAffected.clear();
             this.#dirtiness.serviceWorkerAffected = false;
         }
 
-        if (this.#dirtiness.HTMLAffected) {
+        if (this.#dirtiness.HTMLAffected || ohForce) {
             this.#dirtiness.HTMLAffected = false;
             entries.html = {};
         }
 
-        if (this.#dirtiness.CSSAffected) {
+        if (this.#dirtiness.CSSAffected || ohForce) {
             this.#dirtiness.CSSAffected = false;
             entries.css = {};
         }

package/src/runtime-pi/webflo-url/Url.js

@@ -1,7 +1,7 @@
 import { _with } from '@webqit/util/obj/index.js';
 import { _isArray, _isObject, _isTypeObject, _isString, _isEmpty } from '@webqit/util/js/index.js';
 import { DeepURLSearchParams } from './util.js';
-import { Observer } from '@webqit/quantum-js';
+import { Observer } from '@webqit/use-live';
 
 export class Url {
 

package/src/runtime-pi/webflo-url/xURL.js

@@ -1,5 +1,5 @@
 import { _isObject } from '@webqit/util/js/index.js';
-import { Observer } from '@webqit/quantum-js';
+import { Observer } from '@webqit/use-live';
 import { DeepURLSearchParams } from './util.js';
 
 export class xURL extends URL {

package/src/runtime-pi/webflo-worker/bootstrap.js

@@ -21,6 +21,7 @@ export async function bootstrap(cx, offset = '') {
     };
     if (config.CLIENT.copy_public_variables) {
         const publicEnvPattern = /(?:^|_)PUBLIC(?:_|$)/;
+        config.ENV.data = config.ENV.data || {};
         for (const key in process.env) {
             if (publicEnvPattern.test(key)) {
                 config.ENV.data[key] = process.env[key];

package/src/build-pi/esbuild-plugin-livejs-transform.js

@@ -1,35 +0,0 @@
-import Fs from 'fs/promises';
-//import { transformQuantum } from '@webqit/quantum-js';
-
-export function LiveJSTransform() {
-    return {
-        name: 'livejs-transform',
-        setup(build) {
-            build.onLoad({ filter: /\.(js|mjs|ts|jsx|tsx)$/ }, async (args) => {
-                let code = await Fs.readFile(args.path, 'utf8');
-
-                //console.log('LiveJS -- transform:', args);
-
-                // super dirty detection
-                if (!/\bquantum\s+function\b/.test(code) &&
-                    !/\basync\s+quantum\s+function\b/.test(code)) {
-                    return { contents: code, loader: 'default' };
-                }
-
-                
-                console.log('LiveJS transform:', args.path);
-
-                return { contents: code, loader: 'default' };
-                const result = await transformQuantum(code, {
-                    filename: args.path,
-                    sourceMaps: true
-                });
-
-                return {
-                    contents: result.code,
-                    loader: 'js' // or 'ts' if you want esbuild TS transform after
-                };
-            });
-        }
-    };
-}