live update

src/features/store-admin/StoreAdminShell.tsx

@@ -2,6 +2,7 @@ import { useState, useRef, useEffect } from 'react';
 import { Check, ChevronDown, Monitor, Store, Users } from 'lucide-react';
 import { AppShell, type MenuEntry, type NavEntry } from '@/components/shell/AppShell';
 import { BranchScopeProvider, useBranchScope } from './BranchScope';
+import { useLiveEvents } from '@/queries/useLiveEvents';
 
 /**
  * Store Admin — the merchant workspace.
@@ -42,7 +43,7 @@ const MANAGE: readonly MenuEntry[] = [
     to: '/admin/users',
     label: 'Users & access',
     icon: <Users size={13} />,
-    note: 'Store and till accounts',
+    note: 'Store and terminal accounts',
   },
   {
     to: '/admin/terminals',
@@ -55,6 +56,7 @@ const MANAGE: readonly MenuEntry[] = [
 export function StoreAdminShell() {
   return (
     <BranchScopeProvider>
+      <LiveWatch />
       <AppShell
         nav={NAV}
         home="/admin/console"
@@ -66,6 +68,23 @@ export function StoreAdminShell() {
   );
 }
 
+/**
+ * Opens the live stream for the branch currently in scope.
+ *
+ * A component rather than a hook call in the shell body, because it has to sit
+ * INSIDE `BranchScopeProvider` to read the selection — and it renders nothing,
+ * so where it sits in the tree costs nothing either.
+ *
+ * Under "All branches" `current` is undefined and no stream opens. That is
+ * deliberate: the stream is per-outlet, and a six-branch tenant would otherwise
+ * hold six connections open for a screen that is already polling.
+ */
+function LiveWatch() {
+  const { tenantid, current } = useBranchScope();
+  useLiveEvents(tenantid, current?.locationid);
+  return null;
+}
+
 /**
  * The branch selector, in the header.
  *