neoagent 2.4.0 → 2.4.1-beta.10

package/extensions/chrome-browser/background.mjs

@@ -1,7 +1,7 @@
 import { createBrowserProtocol } from './protocol.mjs';
 import { DEFAULT_SERVER_URL } from './config.mjs';
 
-const STORAGE_KEYS = ['serverUrl', 'configuredServerUrl', 'token', 'pairingId', 'pairingSecret', 'approvalUrl', 'status'];
+const STORAGE_KEYS = ['serverUrl', 'configuredServerUrl', 'token', 'pairingId', 'pairingSecret', 'approvalUrl', 'status', 'extensionName'];
 const protocol = createBrowserProtocol(chrome);
 let socket = null;
 let reconnectTimer = null;
@@ -188,10 +188,12 @@ async function handleSocketMessage(raw) {
 async function startPairing(serverUrl) {
   const normalized = await resolveServerUrl(serverUrl);
   if (!normalized) throw new Error('NeoAgent server URL required.');
+  const { extensionName } = await getStorage(['extensionName']);
+  const nameToUse = String(extensionName || 'Chrome Extension').trim() || 'Chrome Extension';
   const response = await fetchWithTimeout(`${normalized}/api/browser-extension/pairing/request`, {
     method: 'POST',
     headers: { 'content-type': 'application/json' },
-    body: JSON.stringify({ extensionName: 'NeoAgent Browser' }),
+    body: JSON.stringify({ extensionName: nameToUse }),
   });
   const payload = await response.json().catch(() => ({}));
   if (!response.ok) throw new Error(payload.error || `Pairing failed: ${response.status}`);
@@ -212,14 +214,15 @@ async function startPairing(serverUrl) {
 }
 
 async function claimPairing() {
-  const { serverUrl, pairingId, pairingSecret } = await getStorage(['serverUrl', 'pairingId', 'pairingSecret']);
+  const { serverUrl, pairingId, pairingSecret, extensionName } = await getStorage(['serverUrl', 'pairingId', 'pairingSecret', 'extensionName']);
   if (!serverUrl || !pairingId || !pairingSecret) {
     throw new Error('No pending pairing request.');
   }
+  const nameToUse = String(extensionName || 'Chrome Extension').trim() || 'Chrome Extension';
   const response = await fetchWithTimeout(`${serverUrl}/api/browser-extension/pairing/${encodeURIComponent(pairingId)}/claim`, {
     method: 'POST',
     headers: { 'content-type': 'application/json' },
-    body: JSON.stringify({ pairingSecret, extensionName: 'NeoAgent Browser' }),
+    body: JSON.stringify({ pairingSecret, extensionName: nameToUse }),
   });
   const payload = await response.json().catch(() => ({}));
   if (!response.ok) throw new Error(payload.error || `Claim failed: ${response.status}`);
@@ -250,12 +253,18 @@ async function checkForUpdates(preferredServerUrl) {
   const response = await fetchWithTimeout(`${serverUrl}/api/browser-extension/latest`);
   const latest = await response.json().catch(() => ({}));
   if (!response.ok) throw new Error(latest.error || `Update check failed: ${response.status}`);
-  const currentVersion = chrome.runtime.getManifest().version;
+  const manifest = chrome.runtime.getManifest();
+  const currentVersion = manifest.version;
+  const currentVersionName = manifest.version_name || currentVersion;
+  const latestVersion = latest.version || currentVersion;
+  const latestVersionName = latest.versionName || latestVersion;
   return {
     currentVersion,
-    latestVersion: latest.version || currentVersion,
+    currentVersionName,
+    latestVersion,
+    latestVersionName,
     downloadUrl: latest.downloadUrl || `${serverUrl}/api/browser-extension/download`,
-    updateAvailable: compareVersions(latest.version, currentVersion) > 0,
+    updateAvailable: compareVersions(latestVersion, currentVersion) > 0,
   };
 }
 
@@ -279,6 +288,9 @@ chrome.runtime.onMessage.addListener((message, _sender, sendResponse) => {
         return disconnect();
       case 'checkForUpdates':
         return checkForUpdates(message.serverUrl);
+      case 'saveExtensionName':
+        await setStorage({ extensionName: message.extensionName });
+        return { success: true };
       case 'openDownload':
         return openDownload(message.serverUrl);
       case 'getState':

package/extensions/chrome-browser/icons/logo.svg

@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
+  <defs>
+    <linearGradient id="bg" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#8f6d3e"/>
+      <stop offset="100%" stop-color="#2f7d6e"/>
+    </linearGradient>
+  </defs>
+  <rect x="5.76" y="5.76" width="20.48" height="20.48" rx="6.96" fill="url(#bg)" stroke="#ffffff" stroke-opacity="0.16" stroke-width="1"/>
+  <polygon points="16,9.76 9.35,13.12 16,16.48 22.65,13.12" fill="white"/>
+  <polyline points="9.35,16.48 16,19.68 22.65,16.48" fill="none" stroke="white" stroke-width="1.44" stroke-linecap="round" stroke-linejoin="round"/>
+  <polyline points="9.35,19.68 16,22.72 22.65,19.68" fill="none" stroke="white" stroke-width="1.44" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/extensions/chrome-browser/manifest.json

@@ -1,14 +1,25 @@
 {
   "manifest_version": 3,
   "name": "NeoAgent Browser",
-  "version": "1.0.0",
+  "version": "2.4.1.7",
+  "version_name": "2.4.1-beta.7",
   "description": "Connect this Chrome browser to NeoAgent for browser automation.",
   "minimum_chrome_version": "118",
   "permissions": ["debugger", "storage", "tabs"],
   "host_permissions": ["http://*/*", "https://*/*"],
+  "icons": {
+    "16": "icons/icon16.png",
+    "48": "icons/icon48.png",
+    "128": "icons/icon128.png"
+  },
   "action": {
     "default_title": "NeoAgent Browser",
-    "default_popup": "popup.html"
+    "default_popup": "popup.html",
+    "default_icon": {
+      "16": "icons/icon16.png",
+      "48": "icons/icon48.png",
+      "128": "icons/icon128.png"
+    }
   },
   "background": {
     "service_worker": "background.mjs",

package/extensions/chrome-browser/popup.css

@@ -46,6 +46,11 @@ header {
   gap: 6px;
 }
 
+.logo {
+  width: 40px;
+  height: 40px;
+}
+
 h1,
 h2,
 p {

package/extensions/chrome-browser/popup.html

@@ -8,6 +8,7 @@
 <body>
   <main>
     <header>
+      <img src="icons/logo.svg" alt="NeoAgent" class="logo">
       <p class="eyebrow">NeoAgent Browser</p>
       <h1>Connect this Chrome</h1>
       <p class="intro">Pair once, then let NeoAgent control this browser when you ask it to.</p>
@@ -31,15 +32,17 @@
       </div>
     </section>
 
-    <button id="openApp" type="button" class="link-button">Open NeoAgent web page</button>
-
     <details id="settings" class="settings">
       <summary>Settings &amp; updates</summary>
       <label>
         Server URL
         <input id="serverUrl" type="url" placeholder="https://neoagent.example.com">
       </label>
-      <div class="settings-actions">
+      <label style="margin-top: 8px;">
+        Extension Name
+        <input id="extensionName" type="text" placeholder="e.g. Work Laptop, Personal Mac" value="Chrome Extension">
+      </label>
+      <div class="settings-actions" style="margin-top: 12px;">
         <button id="checkUpdate" type="button" class="secondary">Check for update</button>
         <button id="download" type="button" class="secondary">Download latest ZIP</button>
         <button id="disconnect" type="button" class="secondary danger">Disconnect</button>
@@ -47,8 +50,7 @@
       <p class="hint">The server URL is usually filled in by the ZIP downloaded from NeoAgent.</p>
     </details>
 
-    <p class="hint">Pairing opens NeoAgent in a tab. This extension never stores your NeoAgent password.</p>
-    <p id="message" class="message"></p>
+<p id="message" class="message"></p>
   </main>
   <script src="popup.js" type="module"></script>
 </body>

package/extensions/chrome-browser/popup.js

@@ -1,6 +1,7 @@
 const statusEl = document.querySelector('#status');
 const statusDotEl = document.querySelector('#statusDot');
 const serverUrlEl = document.querySelector('#serverUrl');
+const extensionNameEl = document.querySelector('#extensionName');
 const serverLabelEl = document.querySelector('#serverLabel');
 const messageEl = document.querySelector('#message');
 const settingsEl = document.querySelector('#settings');
@@ -9,7 +10,6 @@ const flowTitleEl = document.querySelector('#flowTitle');
 const flowDescriptionEl = document.querySelector('#flowDescription');
 const primaryActionEl = document.querySelector('#primaryAction');
 const secondaryActionEl = document.querySelector('#secondaryAction');
-const openAppEl = document.querySelector('#openApp');
 const disconnectEl = document.querySelector('#disconnect');
 const checkUpdateEl = document.querySelector('#checkUpdate');
 const downloadEl = document.querySelector('#download');
@@ -59,7 +59,7 @@ function setBusy(isBusy, label = 'Working...') {
   }
   const busy = pendingActions > 0;
 
-  [primaryActionEl, secondaryActionEl, openAppEl, disconnectEl, checkUpdateEl, downloadEl].forEach((button) => {
+  [primaryActionEl, secondaryActionEl, disconnectEl, checkUpdateEl, downloadEl].forEach((button) => {
     if (!button || button.hidden) return;
     if (busy) {
       if (!Object.prototype.hasOwnProperty.call(button.dataset, 'wasDisabled')) {
@@ -99,8 +99,6 @@ function updateFlow() {
   const hasToken = Boolean(currentState.token || currentState.tokenId);
   const approvalUrl = currentState.approvalUrl || '';
 
-  openAppEl.disabled = !hasServerUrl;
-
   if (!hasServerUrl) {
     stepLabelEl.textContent = 'Step 1 of 3';
     flowTitleEl.textContent = 'Add your NeoAgent server';
@@ -217,6 +215,10 @@ async function refresh() {
   if (serverUrl && document.activeElement !== serverUrlEl) {
     serverUrlEl.value = serverUrl;
   }
+  const extensionName = currentState.extensionName || 'Chrome Extension';
+  if (document.activeElement !== extensionNameEl) {
+    extensionNameEl.value = extensionName;
+  }
   if (!serverUrl) {
     settingsEl.open = true;
   }
@@ -240,10 +242,17 @@ function bindAsyncClick(element, handler) {
 }
 
 serverUrlEl.addEventListener('input', updateFlow);
+extensionNameEl.addEventListener('input', async () => {
+  const name = String(extensionNameEl.value || '').trim();
+  try {
+    await send('saveExtensionName', { extensionName: name });
+  } catch (err) {
+    console.error('Failed to save extension name', err);
+  }
+});
 
 bindAsyncClick(primaryActionEl, () => runAction(primaryActionEl.dataset.action));
 bindAsyncClick(secondaryActionEl, () => runAction(secondaryActionEl.dataset.action));
-bindAsyncClick(openAppEl, () => runAction('openApp'));
 bindAsyncClick(disconnectEl, async () => {
   await send('disconnect');
   await refresh();
@@ -253,8 +262,8 @@ bindAsyncClick(checkUpdateEl, async () => {
   const result = await send('checkForUpdates', { serverUrl: effectiveServerUrl() });
   setMessage(
     result.updateAvailable
-      ? `Update available: ${result.currentVersion} -> ${result.latestVersion}.`
-      : `Current version ${result.currentVersion} is up to date.`,
+      ? `Update available: ${result.currentVersionName || result.currentVersion} -> ${result.latestVersionName || result.latestVersion}.`
+      : `Current version ${result.currentVersionName || result.currentVersion} is up to date.`,
     result.updateAvailable ? '' : 'success',
   );
 });

package/flutter_app/lib/features/onboarding/onboarding_companion_step.dart

@@ -0,0 +1,391 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_animate/flutter_animate.dart';
+import 'package:url_launcher/url_launcher.dart';
+
+import '../../main.dart';
+import 'onboarding_chrome.dart';
+
+class OnboardingCompanionStep extends StatefulWidget {
+  const OnboardingCompanionStep({
+    super.key,
+    required this.onNext,
+    required this.controller,
+  });
+
+  final VoidCallback onNext;
+  final NeoAgentController controller;
+
+  @override
+  State<OnboardingCompanionStep> createState() => _OnboardingCompanionStepState();
+}
+
+class _OnboardingCompanionStepState extends State<OnboardingCompanionStep> {
+  final Set<String> _clickedDownloads = <String>{};
+
+  Future<void> _launchUrl(String urlString) async {
+    final url = Uri.parse(urlString);
+    if (await canLaunchUrl(url)) {
+      await launchUrl(url, mode: LaunchMode.externalApplication);
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final width = MediaQuery.sizeOf(context).width;
+    final useGrid = width >= 700;
+    final columns = width >= 1050 ? 3 : (useGrid ? 2 : 1);
+
+    return AnimatedBuilder(
+      animation: widget.controller,
+      builder: (context, _) {
+        final extConnected = widget.controller.browserExtensionConnected;
+        final desktopConnected = widget.controller.desktopCompanionConnected;
+
+        final items = <_CompanionItemData>[
+          _CompanionItemData(
+            id: 'extension',
+            title: 'Chrome Extension',
+            subtitle: 'Automate browser tasks and capture web page context directly.',
+            icon: Icons.extension_rounded,
+            accentColor: extConnected ? const Color(0xFF10A37F) : const Color(0xFF4285F4),
+            connected: extConnected,
+            buttonText: extConnected ? 'Extension Connected' : 'Download Extension',
+            onTap: () async {
+              setState(() => _clickedDownloads.add('extension'));
+              await widget.controller.downloadBrowserExtension();
+            },
+          ),
+          _CompanionItemData(
+            id: 'desktop',
+            title: 'Desktop App',
+            subtitle: 'Enable native command run, system capture, and global controls.',
+            icon: Icons.laptop_mac_rounded,
+            accentColor: desktopConnected ? const Color(0xFF10A37F) : const Color(0xFF8A5CF5),
+            connected: desktopConnected,
+            buttonText: desktopConnected ? 'Desktop Connected' : 'Get Desktop App',
+            onTap: () async {
+              setState(() => _clickedDownloads.add('desktop'));
+              await _launchUrl('https://github.com/NeoLabs-Systems/NeoAgent/releases');
+            },
+          ),
+          _CompanionItemData(
+            id: 'mobile',
+            title: 'Mobile Companion',
+            subtitle: 'Sync notifications, phone calls, and health connect metrics.',
+            icon: Icons.phone_iphone_rounded,
+            accentColor: const Color(0xFFF5A623),
+            connected: false,
+            buttonText: 'Download Android APK',
+            onTap: () async {
+              setState(() => _clickedDownloads.add('mobile'));
+              await _launchUrl('https://github.com/NeoLabs-Systems/NeoAgent/releases');
+            },
+          ),
+        ];
+
+        return OnboardingScaffold(
+          step: 1,
+          totalSteps: 4,
+          eyebrow: 'INTEGRATION',
+          title: 'Connect your\ndevices & apps.',
+          description: 'NeoOS works best when integrated with your desktop, browser, and mobile devices.',
+          footer: Row(
+            mainAxisAlignment: MainAxisAlignment.spaceBetween,
+            children: <Widget>[
+              OnboardingGhostButton(
+                label: 'Skip integration',
+                onPressed: widget.onNext,
+              ),
+              OnboardingPrimaryButton(
+                label: 'Continue',
+                icon: Icons.arrow_forward_rounded,
+                onPressed: widget.onNext,
+              ),
+            ],
+          ),
+          child: useGrid
+              ? GridView.builder(
+                  gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
+                    crossAxisCount: columns,
+                    crossAxisSpacing: 14,
+                    mainAxisSpacing: 14,
+                    childAspectRatio: width >= 1050 ? 1.42 : 1.25,
+                  ),
+                  itemCount: items.length,
+                  itemBuilder: (context, index) {
+                    final item = items[index];
+                    return _CompanionCard(
+                          item: item,
+                          compact: true,
+                          isClicked: _clickedDownloads.contains(item.id),
+                        )
+                        .animate()
+                        .fadeIn(duration: 420.ms, delay: (180 + (index * 80)).ms)
+                        .slideY(begin: 0.16, end: 0);
+                  },
+                )
+              : ListView.separated(
+                  itemCount: items.length,
+                  separatorBuilder: (_, __) => const SizedBox(height: 14),
+                  itemBuilder: (context, index) {
+                    final item = items[index];
+                    return _CompanionCard(
+                          item: item,
+                          compact: false,
+                          isClicked: _clickedDownloads.contains(item.id),
+                        )
+                        .animate()
+                        .fadeIn(duration: 420.ms, delay: (180 + (index * 80)).ms)
+                        .slideY(begin: 0.16, end: 0);
+                  },
+                ),
+        );
+      },
+    );
+  }
+}
+
+class _CompanionItemData {
+  const _CompanionItemData({
+    required this.id,
+    required this.title,
+    required this.subtitle,
+    required this.icon,
+    required this.accentColor,
+    required this.connected,
+    required this.buttonText,
+    required this.onTap,
+  });
+
+  final String id;
+  final String title;
+  final String subtitle;
+  final IconData icon;
+  final Color accentColor;
+  final bool connected;
+  final String buttonText;
+  final VoidCallback onTap;
+}
+
+class _CompanionCard extends StatelessWidget {
+  const _CompanionCard({
+    required this.item,
+    required this.compact,
+    required this.isClicked,
+  });
+
+  final _CompanionItemData item;
+  final bool compact;
+  final bool isClicked;
+
+  @override
+  Widget build(BuildContext context) {
+    final shellSize = compact ? 48.0 : 58.0;
+    final iconSize = compact ? 24.0 : 30.0;
+
+    final cardContent = compact
+        ? Column(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: <Widget>[
+              Row(
+                children: <Widget>[
+                  Container(
+                    width: shellSize,
+                    height: shellSize,
+                    decoration: BoxDecoration(
+                      color: item.accentColor.withValues(alpha: 0.18),
+                      borderRadius: BorderRadius.circular(16),
+                    ),
+                    child: Icon(
+                      item.icon,
+                      color: item.accentColor,
+                      size: iconSize,
+                    ),
+                  ),
+                  const Spacer(),
+                  _StatusIndicator(connected: item.connected, color: item.accentColor),
+                ],
+              ),
+              const SizedBox(height: 14),
+              Text(
+                item.title,
+                maxLines: 1,
+                overflow: TextOverflow.ellipsis,
+                style: const TextStyle(
+                  color: Colors.white,
+                  fontSize: 18,
+                  fontWeight: FontWeight.w800,
+                ),
+              ),
+              const SizedBox(height: 6),
+              Expanded(
+                child: Text(
+                  item.subtitle,
+                  maxLines: 3,
+                  overflow: TextOverflow.ellipsis,
+                  style: TextStyle(
+                    color: Colors.white.withValues(alpha: 0.68),
+                    fontSize: 13,
+                    height: 1.35,
+                  ),
+                ),
+              ),
+              const SizedBox(height: 12),
+              _DownloadButton(item: item, isClicked: isClicked),
+            ],
+          )
+        : Row(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: <Widget>[
+              Container(
+                width: shellSize,
+                height: shellSize,
+                decoration: BoxDecoration(
+                  color: item.accentColor.withValues(alpha: 0.18),
+                  borderRadius: BorderRadius.circular(18),
+                ),
+                child: Icon(
+                  item.icon,
+                  color: item.accentColor,
+                  size: iconSize,
+                ),
+              ),
+              const SizedBox(width: 18),
+              Expanded(
+                child: Column(
+                  crossAxisAlignment: CrossAxisAlignment.start,
+                  mainAxisSize: MainAxisSize.min,
+                  children: <Widget>[
+                    Text(
+                      item.title,
+                      style: const TextStyle(
+                        color: Colors.white,
+                        fontSize: 20,
+                        fontWeight: FontWeight.w800,
+                      ),
+                    ),
+                    const SizedBox(height: 5),
+                    Text(
+                      item.subtitle,
+                      style: TextStyle(
+                        color: Colors.white.withValues(alpha: 0.68),
+                        fontSize: 14,
+                        height: 1.45,
+                      ),
+                    ),
+                    const SizedBox(height: 14),
+                    _DownloadButton(item: item, isClicked: isClicked),
+                  ],
+                ),
+              ),
+              const SizedBox(width: 12),
+              _StatusIndicator(connected: item.connected, color: item.accentColor),
+            ],
+          );
+
+    return OnboardingOptionCard(
+      selected: item.connected,
+      accent: item.accentColor,
+      compact: compact,
+      onTap: item.onTap,
+      child: cardContent,
+    );
+  }
+}
+
+class _StatusIndicator extends StatelessWidget {
+  const _StatusIndicator({required this.connected, required this.color});
+
+  final bool connected;
+  final Color color;
+
+  @override
+  Widget build(BuildContext context) {
+    return AnimatedSwitcher(
+      duration: const Duration(milliseconds: 220),
+      child: connected
+          ? Icon(
+              Icons.check_circle_rounded,
+              key: const ValueKey<String>('connected'),
+              color: color,
+              size: 28,
+            )
+          : Icon(
+              Icons.arrow_circle_down_rounded,
+              key: const ValueKey<String>('downloadable'),
+              color: Colors.white.withValues(alpha: 0.26),
+              size: 28,
+            ),
+    );
+  }
+}
+
+class _DownloadButton extends StatelessWidget {
+  const _DownloadButton({required this.item, required this.isClicked});
+
+  final _CompanionItemData item;
+  final bool isClicked;
+
+  @override
+  Widget build(BuildContext context) {
+    if (item.connected) {
+      return Container(
+        padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
+        decoration: BoxDecoration(
+          color: item.accentColor.withValues(alpha: 0.16),
+          borderRadius: BorderRadius.circular(12),
+          border: Border.all(color: item.accentColor.withValues(alpha: 0.3)),
+        ),
+        child: Row(
+          mainAxisSize: MainAxisSize.min,
+          children: <Widget>[
+            Icon(Icons.done_all_rounded, size: 14, color: item.accentColor),
+            const SizedBox(width: 6),
+            Text(
+              'Connected',
+              style: TextStyle(
+                color: item.accentColor,
+                fontSize: 12,
+                fontWeight: FontWeight.w700,
+              ),
+            ),
+          ],
+        ),
+      );
+    }
+
+    return Container(
+      padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 8),
+      decoration: BoxDecoration(
+        color: isClicked 
+            ? Colors.white.withValues(alpha: 0.08) 
+            : item.accentColor.withValues(alpha: 0.12),
+        borderRadius: BorderRadius.circular(12),
+        border: Border.all(
+          color: isClicked 
+              ? Colors.white.withValues(alpha: 0.2) 
+              : item.accentColor.withValues(alpha: 0.25),
+        ),
+      ),
+      child: Row(
+        mainAxisSize: MainAxisSize.min,
+        children: <Widget>[
+          Icon(
+            isClicked ? Icons.hourglass_empty_rounded : Icons.open_in_new_rounded,
+            size: 14,
+            color: isClicked ? Colors.white70 : item.accentColor,
+          ),
+          const SizedBox(width: 6),
+          Text(
+            isClicked ? 'Waiting for pairing...' : item.buttonText,
+            style: TextStyle(
+              color: isClicked ? Colors.white70 : Colors.white,
+              fontSize: 12,
+              fontWeight: FontWeight.w700,
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}

package/flutter_app/lib/features/onboarding/onboarding_shell.dart

@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
 import '../../main.dart';
 import 'onboarding_video_step.dart';
 import 'onboarding_welcome_step.dart';
+import 'onboarding_companion_step.dart';
 import 'onboarding_messaging_step.dart';
 import 'onboarding_model_step.dart';
 
@@ -45,6 +46,10 @@ class _OnboardingShellState extends State<OnboardingShell> {
         children: <Widget>[
           OnboardingVideoStep(onComplete: _nextStep),
           OnboardingWelcomeStep(onNext: _nextStep),
+          OnboardingCompanionStep(
+            onNext: _nextStep,
+            controller: widget.controller,
+          ),
           OnboardingMessagingStep(
             onNext: _nextStep,
             controller: widget.controller,
@@ -55,3 +60,4 @@ class _OnboardingShellState extends State<OnboardingShell> {
     );
   }
 }
+

package/flutter_app/lib/features/onboarding/onboarding_welcome_step.dart

@@ -11,7 +11,7 @@ class OnboardingWelcomeStep extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return OnboardingScaffold(
-      step: 1,
+      step: 0,
       totalSteps: 4,
       eyebrow: 'WELCOME',
       title: 'Welcome to\nNeoOS',

package/flutter_app/lib/main.dart

@@ -39,6 +39,7 @@ import 'src/messaging_access_summary.dart';
 import 'src/oauth_launcher.dart';
 import 'src/recording_bridge.dart';
 import 'src/recording_payloads.dart';
+import 'src/stream_renderer.dart';
 import 'src/theme/palette.dart';
 import 'src/web_app_update_monitor.dart';
 import 'src/widget_bridge.dart';