@mindexec/cli 0.2.53 → 0.2.54

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mindexec/cli",
-  "version": "0.2.53",
+  "version": "0.2.54",
   "description": "MindExec local runtime and bridge CLI",
   "main": "server.js",
   "type": "module",

package/scripts/remote-fleet-render-smoke.mjs

@@ -649,6 +649,7 @@ try {
     const { manager, document } = await loadCss3DManager();
     assert.equal(typeof manager?.renderRemoteFleetMonitorForTest, 'function');
     assert.equal(typeof manager?.renderRemoteFleetDeviceForTest, 'function');
+    assert.equal(typeof manager?.applyRemoteFleetFramePatchesForTest, 'function');
     assert.equal(typeof manager?.setModuleForTest, 'function');
 
     const dotNetCalls = [];
@@ -724,6 +725,24 @@ try {
     assert.ok(initialDetailPanel?.textContent.includes('Load'));
     assert.ok(cards[0]?.querySelector('[data-remote-fleet-device-preview="tile"]'));
     assert.equal(/\b(Seen|Uptime|Mem|Load)\b/.test(cards[0]?.textContent || ''), false);
+    const patchTarget = devices.find(device => device.ThumbnailEnabled === true && device.LiveStreamActive !== true);
+    assert.ok(patchTarget);
+    const patchCard = Array.from(cards).find(card => card.dataset.deviceId === patchTarget.DeviceId);
+    const patchPreview = patchCard?.querySelector('[data-remote-fleet-device-preview="tile"]');
+    assert.ok(patchPreview);
+    const patchUrl = `/api/remote/devices/${encodeURIComponent(patchTarget.DeviceId)}/thumbnail?token=render-smoke-frame&seq=9999`;
+    const patchCount = manager.applyRemoteFleetFramePatchesForTest(bodyView, [{
+        deviceId: patchTarget.DeviceId,
+        kind: 'thumbnail',
+        frameSeq: 9999,
+        frameUrl: patchUrl,
+        receivedAt: new Date().toISOString()
+    }]);
+    assert.equal(patchCount, 1);
+    assert.equal(patchPreview.dataset.remoteFleetFrameSeq, '9999');
+    assert.equal(patchPreview.dataset.remoteFleetFrameUrl, patchUrl);
+    assert.equal(patchPreview.dataset.remoteFleetPendingFrameUrl || '', '');
+    assert.equal(patchPreview.querySelector('img[data-remote-fleet-frame-image="true"]')?.dataset.remoteFleetFrameUrl, patchUrl);
     const alternateDevice = devices.find(device => device.DeviceId !== focusedDevice.DeviceId);
     assert.ok(alternateDevice);
     const alternateCard = Array.from(cards).find(card => card.dataset.deviceId === alternateDevice.DeviceId);

package/wwwroot/_content/MindExecution.Shared/js/mind-map-css3d-manager.js

@@ -13093,15 +13093,37 @@
         image.loading = frame.kind === 'thumbnail' ? 'lazy' : 'eager';
         image.decoding = 'async';
         image.style.cssText = 'width:100%;height:100%;object-fit:cover;display:block;';
-        const placeholder = preview?.querySelector?.('[data-remote-fleet-screen-placeholder="true"]');
-        if (placeholder) {
-            placeholder.remove();
+        if (typeof preview?.insertBefore === 'function') {
+            preview.insertBefore(image, preview.firstChild || null);
+        } else {
+            preview?.appendChild?.(image);
         }
-        preview?.insertBefore?.(image, preview.firstChild || null);
         return image;
     }
 
-    function applyRemoteFleetFramePatchToPreview(preview, frame) {
+    function getRemoteFleetFrameIdentity(frame) {
+        return [
+            String(frame?.deviceId || '').trim(),
+            String(frame?.kind || '').trim().toLowerCase(),
+            String(frame?.streamId || '').trim(),
+            String(Number(frame?.frameSeq || 0) || 0),
+            String(frame?.frameUrl || '').trim()
+        ].join('|');
+    }
+
+    function cloneRemoteFleetFramePatch(frame) {
+        return {
+            deviceId: String(frame?.deviceId || '').trim(),
+            kind: String(frame?.kind || 'thumbnail').trim().toLowerCase(),
+            frameSeq: Number.isFinite(Number(frame?.frameSeq)) ? Math.floor(Number(frame.frameSeq)) : 0,
+            frameUrl: String(frame?.frameUrl || '').trim(),
+            receivedAt: String(frame?.receivedAt || '').trim(),
+            capturedAt: String(frame?.capturedAt || '').trim(),
+            streamId: String(frame?.streamId || '').trim()
+        };
+    }
+
+    function isRemoteFleetFrameNewerForPreview(preview, frame, comparePending = false) {
         if (!preview || !frame || !isRemoteFleetFrameSource(frame.frameUrl)) {
             return false;
         }
@@ -13118,11 +13140,73 @@
             return false;
         }
 
-        const image = ensureRemoteFleetFrameImage(preview, frame);
-        if (!image) {
+        if (comparePending) {
+            const pendingUrl = String(preview.dataset.remoteFleetPendingFrameUrl || '');
+            const pendingKind = String(preview.dataset.remoteFleetPendingFrameKind || '').toLowerCase();
+            const pendingSeq = Number(preview.dataset.remoteFleetPendingFrameSeq || '0');
+            if (pendingUrl) {
+                const samePending = pendingKind === frame.kind
+                    && pendingSeq === nextSeq
+                    && pendingUrl === frame.frameUrl;
+                if (samePending) {
+                    return false;
+                }
+
+                if (pendingKind === 'live' && frame.kind !== 'live') {
+                    return false;
+                }
+
+                if (pendingKind === frame.kind
+                    && Number.isFinite(pendingSeq)
+                    && pendingSeq > 0
+                    && Number.isFinite(nextSeq)
+                    && nextSeq > 0
+                    && nextSeq < pendingSeq) {
+                    return false;
+                }
+            }
+        }
+
+        return true;
+    }
+
+    function ensureRemoteFleetFrameBadge(preview, frame) {
+        let badge = preview?.querySelector?.('[data-remote-fleet-frame-badge="true"]');
+        if (badge) {
+            return badge;
+        }
+
+        badge = document.createElement('span');
+        badge.dataset.remoteFleetFrameBadge = 'true';
+        const previewMode = String(preview?.dataset?.remoteFleetDevicePreview || '');
+        const isDetail = previewMode === 'detail';
+        badge.style.cssText = `
+            position: absolute;
+            right: ${isDetail ? '9px' : '6px'};
+            bottom: ${isDetail ? '9px' : '6px'};
+            max-width: calc(100% - ${isDetail ? '18px' : '12px'});
+            padding: ${isDetail ? '4px 7px' : '3px 6px'};
+            border-radius: 999px;
+            background: ${frame?.kind === 'live' ? 'rgba(220, 38, 38, 0.84)' : 'rgba(15, 23, 42, 0.72)'};
+            color: #e2e8f0;
+            font-size: ${isDetail ? '9px' : '8px'};
+            font-weight: 950;
+            line-height: 1;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            letter-spacing: 0;
+        `;
+        preview?.appendChild?.(badge);
+        return badge;
+    }
+
+    function commitRemoteFleetFrameToPreview(preview, image, frame) {
+        if (!preview || !image || !isRemoteFleetFrameNewerForPreview(preview, frame, false)) {
             return false;
         }
 
+        const nextSeq = Number(frame.frameSeq || 0);
         image.dataset.remoteFleetFrameKind = frame.kind;
         image.dataset.remoteFleetFrameSeq = String(nextSeq || 0);
         image.dataset.remoteFleetFrameUrl = frame.frameUrl;
@@ -13136,7 +13220,12 @@
         preview.dataset.remoteFleetFrameUrl = frame.frameUrl;
         preview.dataset.remoteFleetFrameAt = frame.receivedAt || frame.capturedAt || '';
 
-        const badge = preview.querySelector('[data-remote-fleet-frame-badge="true"]');
+        const placeholder = preview.querySelector('[data-remote-fleet-screen-placeholder="true"]');
+        if (placeholder) {
+            placeholder.remove();
+        }
+
+        const badge = ensureRemoteFleetFrameBadge(preview, frame);
         if (badge) {
             const at = frame.receivedAt || frame.capturedAt || '';
             badge.textContent = frame.kind === 'live'
@@ -13151,6 +13240,96 @@
         return true;
     }
 
+    function clearRemoteFleetPendingFrameDataset(preview, frame) {
+        if (!preview) {
+            return;
+        }
+
+        if (!frame
+            || getRemoteFleetFrameIdentity(preview._remoteFleetPendingFrame) === getRemoteFleetFrameIdentity(frame)) {
+            delete preview.dataset.remoteFleetPendingFrameKind;
+            delete preview.dataset.remoteFleetPendingFrameSeq;
+            delete preview.dataset.remoteFleetPendingFrameUrl;
+            preview._remoteFleetPendingFrame = null;
+        }
+    }
+
+    function processRemoteFleetFrameQueue(preview, image) {
+        if (!preview || !image || preview._remoteFleetFrameLoaderActive === true) {
+            return;
+        }
+
+        const frame = preview._remoteFleetPendingFrame;
+        if (!frame || !isRemoteFleetFrameSource(frame.frameUrl)) {
+            clearRemoteFleetPendingFrameDataset(preview, frame);
+            return;
+        }
+
+        preview._remoteFleetFrameLoaderActive = true;
+        const frameIdentity = getRemoteFleetFrameIdentity(frame);
+        const finish = loaded => {
+            const currentPending = preview._remoteFleetPendingFrame;
+            const stillLatest = getRemoteFleetFrameIdentity(currentPending) === frameIdentity;
+            let committed = false;
+            if (loaded && stillLatest) {
+                committed = commitRemoteFleetFrameToPreview(preview, image, frame);
+                window.RuntimeTrace?.emit?.('remote.frame.uiPatched', {
+                    count: committed ? 1 : 0,
+                    kind: frame.kind,
+                    seq: frame.frameSeq
+                });
+            }
+
+            if (stillLatest) {
+                clearRemoteFleetPendingFrameDataset(preview, frame);
+            }
+
+            preview._remoteFleetFrameLoaderActive = false;
+            if (preview._remoteFleetPendingFrame) {
+                processRemoteFleetFrameQueue(preview, image);
+            }
+        };
+
+        if (typeof Image !== 'function') {
+            finish(true);
+            return;
+        }
+
+        const loader = new Image();
+        loader.decoding = 'async';
+        loader.onload = () => {
+            const decoded = typeof loader.decode === 'function'
+                ? loader.decode().catch(() => undefined)
+                : Promise.resolve();
+            decoded.then(() => finish(true));
+        };
+        loader.onerror = () => finish(false);
+        loader.src = frame.frameUrl;
+    }
+
+    function queueRemoteFleetFrameImageSwap(preview, frame) {
+        if (!preview || !frame || !isRemoteFleetFrameNewerForPreview(preview, frame, true)) {
+            return false;
+        }
+
+        const image = ensureRemoteFleetFrameImage(preview, frame);
+        if (!image) {
+            return false;
+        }
+
+        const nextFrame = cloneRemoteFleetFramePatch(frame);
+        preview._remoteFleetPendingFrame = nextFrame;
+        preview.dataset.remoteFleetPendingFrameKind = nextFrame.kind;
+        preview.dataset.remoteFleetPendingFrameSeq = String(nextFrame.frameSeq || 0);
+        preview.dataset.remoteFleetPendingFrameUrl = nextFrame.frameUrl;
+        processRemoteFleetFrameQueue(preview, image);
+        return true;
+    }
+
+    function applyRemoteFleetFramePatchToPreview(preview, frame) {
+        return queueRemoteFleetFrameImageSwap(preview, frame);
+    }
+
     function applyRemoteFleetFramePatches(bodyView, patches) {
         if (!bodyView || !Array.isArray(patches) || patches.length === 0) {
             return 0;
@@ -13178,7 +13357,7 @@
         });
 
         if (applied > 0) {
-            window.RuntimeTrace?.emit?.('remote.frame.uiPatched', {
+            window.RuntimeTrace?.emit?.('remote.frame.uiQueued', {
                 count: applied
             });
         }
@@ -19565,6 +19744,7 @@
         setModuleForTest: setModuleForTest,
         renderRemoteFleetMonitorForTest: renderRemoteFleetMonitor,
         renderRemoteFleetDeviceForTest: renderRemoteFleetDevice,
+        applyRemoteFleetFramePatchesForTest: applyRemoteFleetFramePatches,
         renderBusinessAutomationEdges: renderBusinessAutomationEdges,
         scheduleBusinessAutomationEdgeRender: scheduleBusinessAutomationEdgeRender,
         syncBusinessAutomationSelectionContext: syncBusinessAutomationSelectionContext,

package/wwwroot/index.html

@@ -7,8 +7,8 @@
     <title>MindExec | Run your ideas as AI task graphs</title>
     <meta name="description" content="MindExec is an AI execution canvas for solo builders, researchers, developers, and creators. Start with free browser tools, then move serious work into saved MindCanvas projects." />
     <base href="/" />
-    <link rel="stylesheet" href="_content/MindExecution.Shared/css/app.css?v=20260614-remote-frame-meta-v513" />
-    <link rel="stylesheet" href="_content/MindExecution.Shared/css/mind-map-overrides.css?v=20260614-remote-frame-meta-v513" />
+    <link rel="stylesheet" href="_content/MindExecution.Shared/css/app.css?v=20260614-remote-frame-queue-v514" />
+    <link rel="stylesheet" href="_content/MindExecution.Shared/css/mind-map-overrides.css?v=20260614-remote-frame-queue-v514" />
     <!-- ?쇄뼹??Font Awesome (local) ?쇄뼹??-->
     <link rel="stylesheet" href="_content/MindExecution.Shared/lib/font-awesome/css/all.min.css" />
     <!-- ?꿎뼯??-->
@@ -558,7 +558,7 @@
             }
 
             const base = '_content/MindExecution.Shared/js/';
-        const scriptVersion = '20260614-remote-frame-meta-v513';
+        const scriptVersion = '20260614-remote-frame-queue-v514';
             const scriptUrl = (script) => `${base}${script}?v=${scriptVersion}`;
             console.log(`[Script Loader] Shared JS version: ${scriptVersion}`);
             const criticalScripts = [

package/wwwroot/service-worker-assets.js

@@ -1,5 +1,5 @@
 self.assetsManifest = {
-    "version":  "3rReX/U0",
+    "version":  "AbrqsGjG",
     "assets":  [
                    {
                        "hash":  "sha256-+CSYMcqLNTsq3VnH11jgYyOCCdxvHzL74CBmo4sCmMU=",
@@ -86,7 +86,7 @@
                        "url":  "_content/MindExecution.Shared/js/mind-map-core.js.backup"
                    },
                    {
-                       "hash":  "sha256-U5R3dUgCFR7qo8wM4p3MlIDxa9ZCd686fnrWvQFfSfs=",
+                       "hash":  "sha256-Ha83zpDlwJT6nxD2wgO3rL3uPBHZvZFxzpnKKHMZhd0=",
                        "url":  "_content/MindExecution.Shared/js/mind-map-css3d-manager.js"
                    },
                    {
@@ -834,7 +834,7 @@
                        "url":  "image-manifest.json"
                    },
                    {
-                       "hash":  "sha256-KqDHFUlmca/5qM/MGimpiIQKNxh1Udxo7/O1bDIsk+s=",
+                       "hash":  "sha256-CSvUcpq/bag2h6q/jhgdebJ5n7IE9rrAbielPCFI5jk=",
                        "url":  "index.html"
                    },
                    {

package/wwwroot/service-worker.js

@@ -1,4 +1,4 @@
-/* Manifest version: 3rReX/U0 */
+/* Manifest version: AbrqsGjG */
 // Hosted deployments should prefer the network over stale offline caches.
 // This service worker immediately clears old Blazor offline caches and unregisters itself.