@7365admin1/layer-common 4.58.1 → 4.59.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @iservice365/layer-common
 
+## 4.59.0
+
+### Minor Changes
+
+- d7cf74d: Robot detail laid out for the operator: header (name, status, site, model · serial, Edit/Remove), one-row status strip, camera and live map side by side above the fold with the commands under the map (map full width for robots without a camera; stacks camera, map, commands, patrol when narrow), then Patrol schedule next to Recent patrols (5 rows, See all), this robot's Alerts, and "What this robot can do" folded at the bottom. New `detectPatrolSchedule` / `patrolSlotText`: for brands without a schedule API (PadBot) the patrol schedule is detected from the last 30 days of runs ("Patrolling Lvl3 · daily 20:00 · last ran 18 h ago · next expected 20:00 today"), clearly labelled.
+
+## 4.58.2
+
+### Patch Changes
+
+- 40a1da2: Robot live view (PadBot S2): the camera's stray H.264 delimiters are now rewritten into real H.265 access-unit delimiters (after a 4-byte start code). The S2 sends VPS/SPS/PPS each in its own PES; without an H.265 delimiter hls.js 1.7.3 dropped the PPS from the init segment and Chrome decoded 0 frames (black picture, clock running).
+
 ## 4.58.1
 
 ### Patch Changes
@@ -1624,11 +1636,11 @@
   `utils/console-tier.ts` + `composables/useConsoleTier.ts` mirror the server's
   own rule from two endpoints the console already calls, unprojected:
 
-                                                                                                                                                                                                                                                        GET /api/members/user/:user/app/admin    the Seven365 staff membership
-                                                                                                                                                                                                                                                        GET /api/roles/id/:role                  that membership's role document
+                                                                                                                                                                                                                                                            GET /api/members/user/:user/app/admin    the Seven365 staff membership
+                                                                                                                                                                                                                                                            GET /api/roles/id/:role                  that membership's role document
 
-                                                                                                                                                                                                                                                        owner  = member.type === "admin" && role.type === "admin" && role.default === true
-                                                                                                                                                                                                                                                        staff  = member.type === "admin" && role.type === "admin"
+                                                                                                                                                                                                                                                            owner  = member.type === "admin" && role.type === "admin" && role.default === true
+                                                                                                                                                                                                                                                            staff  = member.type === "admin" && role.type === "admin"
 
   `role.default` is the marker because it is the only property of a platform
   staff role no API caller can set - `role.controller.ts` validates create and

package/assets/css/robot-hero.css

@@ -801,6 +801,32 @@
   margin-bottom: 8px;
 }
 .hero-detail__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 24px; }
+
+/* Robot detail layout (2026-09-26): strip in one row, camera | map above the fold, stacked when narrow. */
+.hero-strip { grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); }
+.hero-strip .hero-fact { padding: 8px 12px; }
+.hero-strip .hero-fact__value { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+.hero-detail__main { display: grid; grid-template-columns: minmax(0, 11fr) minmax(0, 9fr); gap: 20px; align-items: start; }
+.hero-detail__main--single { grid-template-columns: minmax(0, 1fr); }
+.hero-detail__cam, .hero-detail__map { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
+.hero-detail__main .hero-plan--detail { max-height: 280px; }
+.hero-detail__main--single .hero-plan--detail { max-height: 360px; }
+.hero-detail__main .hero-livepanel .hero-dialog__actions:empty { display: none; }
+.hero-detail__commands { border-top: 2px solid var(--hero-divider); padding-top: 10px; }
+.hero-detail__alertcode { color: var(--hero-accent); }
+@media (max-width: 900px) { .hero-detail__main { grid-template-columns: minmax(0, 1fr); } }
+.hero-sched__note { font-size: 12px; opacity: 0.65; margin-bottom: 4px; }
+.hero-sched__row.hero-sched__row--slot { grid-template-columns: minmax(110px, 160px) minmax(0, 1fr); }
+.hero-sched__row.hero-sched__row--alert { grid-template-columns: 110px minmax(0, 1fr) auto; }
+.hero-detail__sub { display: flex; flex-wrap: wrap; gap: 4px 14px; opacity: 0.65; font-size: 12px; margin-top: 2px; }
+.hero-detail__title--main { flex-wrap: nowrap; min-width: 0; }
+.hero-detail__title--main h2 { overflow: hidden; text-overflow: ellipsis; min-width: 8ch; }
+@media (max-width: 700px) { .hero-detail__title--main { flex-wrap: wrap; } .hero-detail__title--main h2 { flex-basis: 100%; } }
+@media (max-width: 560px) { .hero-faultbar { grid-auto-flow: row; } .hero-faultbar > .v-btn, .hero-faultbar__badge { justify-self: start; } }
+.hero-detail__main .hero-mapsel { margin: 0; }
+.hero-can--fold { padding: 8px 14px; }
+.hero-can--fold > summary { cursor: pointer; list-style: revert; }
+.hero-can--fold[open] > summary { margin-bottom: 6px; }
 .hero-detail__grid .hero-aside__hint { opacity: 0.55; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
 
 .hero-sched__empty { padding: 20px 0; opacity: 0.65; }

package/components/Robot/Detail.vue

@@ -1,8 +1,16 @@
 <template>
-  <!-- Robot detail (README §3). -->
+  <!--
+    Robot detail (README §3), laid out for the operator's job (reasoning:
+    Project-Notes 2026-09-26-robot-detail-layout.md):
+    header (who / where / model) -> one-row status strip -> ABOVE THE FOLD the
+    camera (left, large) and the live map (right) with the commands that act on
+    them directly under the map -> patrol / cleaning: schedule next to recent
+    runs -> this robot's alerts -> "What this robot can do" folded at the bottom.
+    No camera: the map takes the full width. Narrow: camera, map, commands, patrol.
+  -->
   <div>
     <button type="button" class="hero-back hero-back--sm" @click="emit('back')">‹ {{ backLabel || `${record?.site?.name || "Site"} fleet` }}</button>
-    <div class="hero-detail__title">
+    <div class="hero-detail__title hero-detail__title--main">
       <h2>{{ record?.name ?? "Robot" }}</h2>
       <template v-if="statusMode">
         <RobotStatusChip :mode="statusMode" :type="robotType" />
@@ -10,13 +18,16 @@
       <span v-else-if="live && !live.ok" class="hero-tag hero-tag--neutral">Reconnecting</span>
       <span v-if="caps" class="hero-tag hero-tag--neutral">{{ capabilityLabel(caps) }}</span>
       <span class="hero-tag hero-tag--neutral">{{ typeLabel(robotType) }}</span>
-      <span v-if="record" class="hero-detail__where">{{ record.client?.name }} · {{ record.site?.name }}</span>
       <span class="hero-head__spacer" />
       <template v-if="record">
         <v-btn v-if="canEdit" variant="outlined" @click="editOpen = true">Edit</v-btn>
         <v-btn v-if="canDelete" variant="text" class="hero-ghost" @click="removeOpen = true">Remove</v-btn>
       </template>
     </div>
+    <div v-if="record" class="hero-detail__sub">
+      <span>{{ record.client?.name }} · {{ record.site?.name }}</span>
+      <span v-if="identity">{{ identity }}</span>
+    </div>
   </div>
 
   <div v-if="error" class="hero-notice" role="alert">{{ error }}</div>
@@ -31,49 +42,30 @@
         <template v-for="ph in faultPhotos(fault)" :key="ph.label"> · <a :href="ph.url" target="_blank" rel="noopener noreferrer">{{ ph.label }}</a></template>
       </div>
     </div>
-    <v-btn v-if="caps?.liveVideo === true && online" variant="outlined" size="small" @click="livePanel?.show()">Live view</v-btn>
     <v-btn v-if="canResolve" variant="outlined" size="small" :loading="resolving" @click="resolveFault">Mark resolved</v-btn>
     <span class="hero-faultbar__badge">{{ faultBadge(fault) }}</span>
   </div>
 
   <RobotNoMonitoring v-if="noInterface" :brand-name="brand" :model="live?.model || undefined" />
 
-  <!-- What THIS robot (brand + model) can do, in our words; nothing it can't. -->
-  <section v-if="abilities.length" class="hero-can" aria-label="What this robot can do">
-    <div class="hero-can__title">What this robot can do</div>
-    <div v-for="r in abilities" :key="r.label" class="hero-can__row">
-      <span class="hero-can__label">{{ r.label }}</span>
-      <span>{{ r.value }}</span>
+  <!-- Status strip: connection · battery · what it is doing · floor · last seen, one row. -->
+  <div v-if="stripFacts.length" class="hero-facts hero-strip" role="list" aria-label="Robot status">
+    <div v-for="f in stripFacts" :key="f.label" class="hero-fact" role="listitem">
+      <div class="hero-fact__label">{{ f.label }}</div>
+      <div class="hero-fact__value" :class="{ 'hero-fact__value--dim': f.dim }" :title="String(f.value ?? '')">{{ f.value }}</div>
     </div>
-  </section>
-
-  <div v-if="commands.length">
-    <div class="hero-section__title">Commands</div>
-    <RobotCommandBar
-      :capabilities="caps"
-      :can-command="canCommand"
-      :online="live?.ok === true && live.online === true"
-      :mode="statusMode"
-      :type="robotType"
-      :busy="busy"
-      @command="send"
-    />
   </div>
-  <RobotViewOnlyNotice v-if="!canCommand && !noInterface" />
 
-  <div>
-    <div class="hero-section__title">Status</div>
-    <div class="hero-facts" role="list" aria-label="Robot status">
-      <div v-for="f in statusFacts" :key="f.label" class="hero-fact" role="listitem">
-        <div class="hero-fact__label">{{ f.label }}</div>
-        <div class="hero-fact__value" :class="{ 'hero-fact__value--dim': f.dim }">{{ f.value }}</div>
+  <!-- Above the fold: camera | map, with the commands under the map they act on. -->
+  <div v-if="!noInterface" class="hero-detail__main" :class="{ 'hero-detail__main--single': !hasCamera }">
+    <section v-if="hasCamera" class="hero-detail__cam" aria-label="Camera">
+      <RobotLiveView v-if="caps?.liveVideo === true" ref="livePanel" panel :robot-id="robotId" :name="record?.name" :offline="!online" />
+      <div v-if="canDrive" class="hero-detail__video">
+        <v-btn variant="outlined" @click="driveOpen = true">Manual control</v-btn>
       </div>
-    </div>
-  </div>
+    </section>
 
-  <div v-if="!noInterface" class="hero-detail__grid">
-    <div>
-      <div class="hero-section__title">Location</div>
+    <section class="hero-detail__map" aria-label="Map">
       <div v-if="gapText" class="hero-notice" role="status">{{ gapText }}</div>
       <div v-if="locationFacts.length" class="hero-facts hero-facts--tight" role="list" aria-label="Robot location">
         <div v-for="f in locationFacts" :key="f.label" class="hero-fact" role="listitem">
@@ -92,7 +84,6 @@
           </select>
           <span v-if="selectedMap?.current" class="hero-mapsel__here">Robot is here</span>
           <span v-else-if="selectedMap" class="hero-mapsel__hint">{{ hereText }}</span>
-          <span v-if="selectedMap?.routeNames.length" class="hero-mapsel__hint">Routes: {{ selectedMap.routeNames.join(", ") }}</span>
         </div>
         <RobotLivePlan
           :name="record?.name"
@@ -122,43 +113,71 @@
         </div>
       </template>
       <div v-else-if="caps" class="hero-sched__empty">{{ brand }} doesn't share where this robot is with us yet.</div>
-    </div>
 
-    <div>
-      <div class="hero-section__title">{{ robotType === "security" ? "Patrol" : "Cleaning" }}</div>
-      <div class="hero-aside__head">
-        <span class="hero-aside__title">{{ robotType === "security" ? "Patrol schedule" : "Cleaning schedule" }}</span>
-        <span class="hero-aside__hint">{{
-          robotType === "security" ? "days · start–end · floor · checkpoints × rounds" : "days · start–end · jobs per floor · passes"
-        }}</span>
+      <div v-if="commands.length" class="hero-detail__commands">
+        <RobotCommandBar
+          :capabilities="caps"
+          :can-command="canCommand"
+          :online="live?.ok === true && live.online === true"
+          :mode="statusMode"
+          :type="robotType"
+          :busy="busy"
+          @command="send"
+        />
       </div>
-      <template v-if="!schedule.length && robotType === 'security' && patrol?.scheduleShared === false">
-        <div class="hero-sched__empty">{{ scheduleElsewhere }}</div>
-        <!-- The runs themselves are in Patrol history below (said once). -->
-        <div v-if="runHint" class="hero-sched__hint">{{ runHint }} - a guess from recent runs, not the schedule.</div>
+      <RobotViewOnlyNotice v-if="!canCommand" />
+    </section>
+  </div>
+
+  <!-- Patrol / cleaning: when it runs, next to what it did. -->
+  <div v-if="!noInterface" class="hero-detail__grid">
+    <div>
+      <div class="hero-section__title">{{ robotType === "security" ? "Patrol schedule" : "Cleaning schedule" }}</div>
+      <template v-if="robotType === 'security' && !schedule.length && patrol?.scheduleShared === false">
+        <div class="hero-sched__note">Detected from the robot's recent patrols (last 30 days). Schedules are changed in {{ makerApp }}.</div>
+        <div v-if="!runsLoaded" class="hero-sched__empty">Checking recent patrols…</div>
+        <div v-else-if="!detected.length" class="hero-sched__empty">No regular patrols detected in the last 30 days.</div>
+        <div v-for="s in detected" :key="s.route + s.minutes" class="hero-sched__row hero-sched__row--slot">
+          <b>{{ s.route }}</b><span>{{ patrolSlotText(s, now) }}</span>
+        </div>
+      </template>
+      <template v-else>
+        <div class="hero-sched__note">{{ robotType === "security" ? "days · start–end · floor · checkpoints × rounds" : "days · start–end · jobs per floor · passes" }}</div>
+        <div v-if="!schedule.length" class="hero-sched__empty">No schedule yet.</div>
+        <div v-for="p in schedule" :key="p.key" class="hero-sched__row">
+          <b>{{ p.days }}</b><span>{{ p.time }}</span><span>{{ p.jobs }}</span>
+        </div>
       </template>
-      <div v-else-if="!schedule.length" class="hero-sched__empty">No schedule yet.</div>
-      <div v-for="p in schedule" :key="p.key" class="hero-sched__row">
-        <b>{{ p.days }}</b><span>{{ p.time }}</span><span>{{ p.jobs }}</span>
-      </div>
       <template v-if="unplacedRoutes.length">
-        <div class="hero-aside__hint">Patrol routes (stops not placed on the plan)</div>
+        <div class="hero-sched__note">Patrol routes (stops not placed on the map)</div>
         <div v-for="r in unplacedRoutes" :key="r.id" class="hero-sched__row">
           <b>{{ r.name }}</b><span>Stops: {{ r.text }}</span>
         </div>
       </template>
     </div>
+    <div v-if="robotType === 'security' && caps?.patrolHistory === true">
+      <div class="hero-section__title">Recent patrols</div>
+      <RobotPatrolHistory :robot-id="robotId" compact />
+    </div>
   </div>
 
-  <RobotPatrolHistory v-if="robotType === 'security' && caps?.patrolHistory === true" :robot-id="robotId" />
+  <!-- This robot's open alerts (the newest also sits in the red bar on top while it is open). -->
+  <section v-if="!noInterface && record" aria-label="Alerts for this robot">
+    <div class="hero-section__title">Alerts</div>
+    <div v-if="!robotAlerts.length" class="hero-sched__empty">No open alerts for this robot.</div>
+    <div v-for="a in robotAlerts" :key="a.key" class="hero-sched__row hero-sched__row--alert">
+      <b class="hero-detail__alertcode">{{ a.code }}</b><span>{{ a.message }}</span><span>{{ a.since }}</span>
+    </div>
+  </section>
 
-  <div v-if="caps?.liveVideo === true || canDrive">
-    <div class="hero-section__title">Camera</div>
-    <RobotLiveView v-if="caps?.liveVideo === true" ref="livePanel" panel :robot-id="robotId" :name="record?.name" :offline="!online" />
-    <div v-if="canDrive" class="hero-detail__video">
-      <v-btn variant="outlined" @click="driveOpen = true">Manual control</v-btn>
+  <!-- What THIS robot (brand + model) can do, in our words; folded so it never pushes the camera down. -->
+  <details v-if="abilities.length" class="hero-can hero-can--fold">
+    <summary class="hero-can__title">What this robot can do</summary>
+    <div v-for="r in abilities" :key="r.label" class="hero-can__row">
+      <span class="hero-can__label">{{ r.label }}</span>
+      <span>{{ r.value }}</span>
     </div>
-  </div>
+  </details>
 
   <v-dialog v-model="confirmOpen" width="440">
     <div v-if="confirming" class="hero-dialog" role="alertdialog" aria-labelledby="hero-confirm-title">
@@ -234,6 +253,7 @@ import { faultPhotos } from "../../utils/robot-control";
 import { robotMapDefault, robotMapViews } from "../../utils/robot-maps";
 import useRobotLive, { siteStatesFeed } from "../../composables/useRobotLive";
 import {
+  attentionText,
   brandName,
   capabilityLabel,
   cleaningScheduleRows,
@@ -246,7 +266,8 @@ import {
   lastKnownLabel,
   mergePose,
   optimisticMode,
-  patrolRunHint,
+  detectPatrolSchedule,
+  patrolSlotText,
   patrolScheduleRows,
   pointCommandBody,
   savedPointGroups,
@@ -259,7 +280,6 @@ import {
   robotErrorMessage,
   robotFacts,
   robotStatus,
-  scheduleElsewhereText,
   showSpotClean,
   sinceText,
   speedText,
@@ -308,6 +328,7 @@ const {
   getRobotMapImages,
   resolveRobotAlerts,
   getPatrolHistory,
+  getSiteFaults,
 } = useRobots();
 
 const record = ref<Record<string, any> | null>(null);
@@ -363,14 +384,25 @@ const faultSince = computed(() => sinceText(fault.value?.since, now.value));
 
 // Only what THIS robot reports (hide, never grey); what its maker keeps back is said once, in the card.
 const facts = computed(() => robotFacts({ record: record.value, live: live.value as any, now: now.value, hideUnreported: true }));
-const LOCATION = new Set(["Floor", "Live position"]);
-const statusFacts = computed(() => facts.value.filter((f) => !LOCATION.has(f.label)));
+// The strip: connection · battery · what it is doing · floor · last seen (model and serial sit in the header).
+const STRIP_ORDER = ["Connection", "Battery", "Robot reports", "Floor", "Last seen"];
+const stripFacts = computed(() =>
+  STRIP_ORDER.map((l) => facts.value.find((f) => f.label === l))
+    .filter((f): f is NonNullable<typeof f> => !!f)
+    .map((f) => (f.label === "Robot reports" ? { ...f, label: "Doing now" } : f)),
+);
+const identity = computed(() => {
+  const model = facts.value.find((f) => f.label === "Model")?.value;
+  const serial = facts.value.find((f) => f.label === "Serial")?.value;
+  return [model, serial ? `Serial ${serial}` : ""].filter(Boolean).join(" · ");
+});
 // The plan's readout already shows the live position; the cell only when there is no plan.
-const locationFacts = computed(() => facts.value.filter((f) => LOCATION.has(f.label) && !(f.label === "Live position" && showPlan.value)));
+// Floor is in the strip; the plan's readout shows the live position, so the cell only when there is no plan.
+const locationFacts = computed(() => facts.value.filter((f) => f.label === "Live position" && !showPlan.value));
 const abilities = computed(() =>
   robotAbilities({ capabilities: caps.value, profile: live.value?.ok ? live.value.profile : null, type: robotType.value, brand: brand.value }),
 );
-const scheduleElsewhere = computed(() => scheduleElsewhereText(robotType.value, brand.value, live.value?.ok ? live.value.profile : null));
+const makerApp = computed(() => (live.value?.ok ? live.value.profile?.makerApp : "") || `${brand.value}'s own app`);
 
 const online = computed(() => live.value?.ok === true && live.value.online === true);
 const commands = computed(() =>
@@ -408,7 +440,7 @@ const spotOn = computed(() => showSpotClean({ canCommand: props.canCommand, capa
 const route = computed<TPatrolRouteView | null>(() =>
   selectedMap.value ? mapRoutes.value[0] ?? null : patrol.value?.routes?.find((r) => r.checkpoints?.length) ?? null,
 );
-const floorText = computed(() => locationFacts.value.find((f) => f.label === "Floor")?.value ?? "");
+const floorText = computed(() => facts.value.find((f) => f.label === "Floor")?.value ?? "");
 // The plan only for a robot that reports where it is, has maps to show, takes spot clicks, or walks a route we can draw.
 const showPlan = computed(
   () => !caps.value || reportsPosition.value || spotOn.value || mapViews.value.length > 0 || !!route.value?.checkpoints?.length,
@@ -433,17 +465,34 @@ const schedule = computed(() => (robotType.value === "security" ? patrolSchedule
 const unplacedRoutes = computed(() =>
   (patrol.value?.routes ?? []).map((r) => ({ id: r.id, name: r.name, text: unplacedStopsText(r) })).filter((r) => r.text),
 );
-// The brand keeps its schedules to itself: recent runs (and a labelled guess) instead.
+// The brand keeps its schedules to itself (PadBot): detect them from the last 30 days of runs.
 const runs = ref<any[]>([]);
-const runHint = computed(() => patrolRunHint(runs.value, now.value));
+const runsLoaded = ref(false);
+const detected = computed(() => detectPatrolSchedule(runs.value, now.value));
+/** Newest first, 100 a page, until a page reaches 30 days back. ponytail: capped at 5 pages (500 runs); raise if a robot patrols more than ~16x a day. */
+async function loadRuns() {
+  const since = Date.now() - 30 * 86_400_000;
+  const all: any[] = [];
+  for (let page = 1; page <= 5; page++) {
+    const res = await getPatrolHistory(props.robotId, { page, limit: 100 }).catch(() => null);
+    const items = res?.items ?? [];
+    all.push(...items);
+    const oldest = Date.parse(items[items.length - 1]?.startedAt ?? "");
+    if (!items.length || page >= (res?.pages ?? 0) || !(oldest >= since)) break;
+  }
+  runs.value = all;
+  runsLoaded.value = true;
+}
 
+let runsLoading = false;
 async function loadSchedule() {
   if (!record.value || noInterface.value) return;
   try {
     if (robotType.value === "security") {
       patrol.value = await getPatrolRoutes(props.robotId);
-      if (patrol.value?.scheduleShared === false && caps.value?.patrolHistory === true && !runs.value.length) {
-        runs.value = (await getPatrolHistory(props.robotId, { page: 1, limit: 20 }).catch(() => null))?.items ?? [];
+      if (patrol.value?.scheduleShared === false && caps.value?.patrolHistory === true && !runsLoaded.value && !runsLoading) {
+        runsLoading = true;
+        loadRuns().finally(() => (runsLoading = false));
       }
     } else plans.value = (await getRobotPlans(props.robotId))?.items ?? [];
   } catch {
@@ -613,6 +662,7 @@ function onPick(p: TSavedPoint) {
 
 /* ---- security-robot extras: live view (minted per open, never kept), manual control, resolve an alarm ---- */
 const livePanel = ref<{ show(): void } | null>(null);
+const hasCamera = computed(() => caps.value?.liveVideo === true || canDrive.value);
 const driveOpen = ref(false);
 const canDrive = computed(() => props.canCommand && caps.value?.manualDrive === true && online.value);
 const canResolve = computed(
@@ -631,6 +681,23 @@ async function resolveFault() {
   }
 }
 
+/* ---- this robot's open alerts: the site's alert list, narrowed to this robot ---- */
+const siteAlerts = ref<any[]>([]);
+const robotAlerts = computed(() =>
+  siteAlerts.value
+    .filter((a) => String(a?.robot?._id ?? "") === props.robotId)
+    .map((a, i) => ({ key: `${a?.code ?? ""}-${i}`, ...attentionText(a), since: a?.since ? `Since ${sinceText(a.since, now.value)}` : "" })),
+);
+async function loadAlerts() {
+  const site = String(record.value?.site?._id ?? "");
+  if (!site) return;
+  try {
+    siteAlerts.value = (await getSiteFaults(site, { page: 1, limit: 100 }))?.items ?? [];
+  } catch {
+    siteAlerts.value = [];
+  }
+}
+
 /* ---- edit / remove ---- */
 function onSaved() {
   editOpen.value = false;
@@ -674,9 +741,13 @@ watch(
     lastPose.value = null;
     prevPose.value = nextPose.value = null;
     streamLost.value = false;
+    runs.value = [];
+    runsLoaded.value = false;
+    siteAlerts.value = [];
     await loadRecord();
     loadSchedule();
     loadMaps();
+    loadAlerts();
   },
   { immediate: true },
 );
@@ -696,6 +767,7 @@ const timer = setInterval(() => {
   now.value = Date.now();
   if (typeof document !== "undefined" && document.visibilityState === "hidden") return;
   if (++ticks % 8 === 0 && robotType.value === "security") loadSchedule();
+  if (ticks % 30 === 0) loadAlerts();
 }, 1000);
 onBeforeUnmount(() => {
   clearInterval(timer);

package/components/Robot/PatrolHistory.vue

@@ -4,14 +4,14 @@
     patrols from its own cloud, newest first; a row opens what was captured at
     each checkpoint. Read only; photo links open the brand's image.
   -->
-  <div class="hero-patrolhist">
-    <div class="hero-aside__head">
+  <div class="hero-patrolhist" :class="{ 'hero-patrolhist--compact': compact }">
+    <div v-if="!compact" class="hero-aside__head">
       <span class="hero-aside__title">Patrol history</span>
       <span class="hero-aside__hint">route · result · time · distance · alerts</span>
     </div>
     <div v-if="error" class="hero-sched__empty">{{ error }}</div>
     <div v-else-if="loaded && !rows.length" class="hero-sched__empty">No patrols recorded yet.</div>
-    <template v-for="r in rows" :key="r.key">
+    <template v-for="r in shownRows" :key="r.key">
       <button type="button" class="hero-sched__row hero-patrolhist__row" :aria-expanded="open === r.key" @click="toggle(r.key)">
         <b>{{ r.when }}</b><span>{{ r.route }} · <span :class="`hero-patrolhist__${r.tone}`">{{ r.result }}</span></span><span>{{ r.detail }}</span>
       </button>
@@ -27,7 +27,11 @@
         </div>
       </div>
     </template>
-    <div v-if="pages > 1" class="hero-patrolhist__foot">
+    <div v-if="short && (rows.length > 5 || pages > 1)" class="hero-patrolhist__foot">
+      <v-btn variant="text" size="small" @click="all = true">See all</v-btn>
+    </div>
+    <div v-else-if="pages > 1" class="hero-patrolhist__foot">
+      <v-btn v-if="compact" variant="text" size="small" @click="(all = false), load(1)">Show fewer</v-btn>
       <v-btn variant="text" size="small" :disabled="page <= 1" @click="load(page - 1)">Newer</v-btn>
       <span>Page {{ page }} of {{ pages }}</span>
       <v-btn variant="text" size="small" :disabled="page >= pages" @click="load(page + 1)">Older</v-btn>
@@ -39,7 +43,10 @@
 import { computed, ref, watch } from "vue";
 import { activityWhen, patrolRecordRow, robotErrorMessage } from "../../utils/robot-display";
 
-const props = defineProps<{ robotId: string }>();
+/** `compact`: the newest 5 with "See all" (robot detail); the full pager after that. */
+const props = defineProps<{ robotId: string; compact?: boolean }>();
+const all = ref(false);
+const short = computed(() => props.compact && !all.value);
 const { getPatrolHistory, getPatrolVisits } = useRobots();
 
 const items = ref<any[]>([]);
@@ -52,6 +59,7 @@ const visits = ref<any[]>([]);
 const visitsLoading = ref(false);
 const now = Date.now();
 const rows = computed(() => items.value.map((r) => patrolRecordRow(r, now)));
+const shownRows = computed(() => (short.value ? rows.value.slice(0, 5) : rows.value));
 
 /** Only http(s) links from the brand are rendered. */
 const safeUrl = (u: unknown) => (typeof u === "string" && /^https?:\/\//i.test(u) ? u : "");
@@ -89,6 +97,8 @@ watch(() => props.robotId, () => load(1), { immediate: true });
 
 <style scoped>
 .hero-patrolhist { margin-top: 20px; }
+.hero-patrolhist--compact { margin-top: 0; }
+.hero-patrolhist--compact .hero-sched__row { grid-template-columns: 76px minmax(0, 1fr) auto; }
 .hero-patrolhist__row { width: 100%; text-align: left; background: none; border: 0; cursor: pointer; color: inherit; font: inherit; }
 .hero-patrolhist__visits { padding: 4px 0 8px 16px; }
 .hero-patrolhist__visit { display: flex; flex-wrap: wrap; gap: 12px; padding: 4px 0; font-size: 12px; }

package/package.json

@@ -2,7 +2,7 @@
   "name": "@7365admin1/layer-common",
   "license": "MIT",
   "type": "module",
-  "version": "4.58.1",
+  "version": "4.59.0",
   "author": "7365admin1",
   "main": "./nuxt.config.ts",
   "//files": "What a consumer extending this layer actually loads. Without this npm ships the whole working tree - the changesets, the CI workflows, the render harness in tools/ and any scratch directory that happened to exist at publish time. Nuxt resolves a layer by directory, so every runtime directory below has to stay listed; adding a new top-level runtime directory means adding it here too.",

package/utils/robot-control.ts

@@ -78,9 +78,20 @@ export type THlsCtor = { isSupported(): boolean; new (config?: Record<string, un
  * with these units removed Chrome's own decoder decodes 40/40 frames.
  *
  * Rewrites each such header in place, inside the TS packets of video PIDs
- * only, to an "unspecified" H.265 unit (type 48) that hls.js and decoders
- * ignore. Same length, so the TS stays intact. A valid single-layer H.265
+ * only. Same length, so the TS stays intact. A valid single-layer H.265
  * header never matches (its temporal id is never 0). Returns the count.
+ *
+ * - After a 4-byte start code (the real S2 stream) it becomes a real H.265
+ *   access-unit delimiter (type 35). This matters: the S2 sends every
+ *   parameter set (VPS, SPS, PPS) in its own PES packet. Without an H.265
+ *   delimiter hls.js 1.7.3 treats each PES as a new picture, and its HEVC
+ *   parser forgets the VPS on every picture push (initVPS = null), so the PPS
+ *   is never stored and the hvcC it writes has no PPS: Chrome then decodes
+ *   0 frames with no error - time runs, picture black (prod, 2026-09-26 late;
+ *   the page's own hls.js decoded the real segments once the delimiter was a
+ *   real one: 136 frames, PPS present).
+ * - After a 3-byte start code there is no spare byte: an "unspecified" unit
+ *   (type 48) that hls.js and decoders ignore.
  */
 export function neutraliseStrayAud(data: ArrayBuffer | Uint8Array): number {
   const b = data instanceof Uint8Array ? data : new Uint8Array(data);
@@ -107,8 +118,19 @@ export function neutraliseStrayAud(data: ArrayBuffer | Uint8Array): number {
     const len = t + end - p;
     for (let k = 0; k + 4 < len; k++) {
       if (b[at(k)] === 0 && b[at(k + 1)] === 0 && b[at(k + 2)] === 1 && b[at(k + 3)] === 0x09 && (b[at(k + 4)]! & 7) === 0) {
-        b[at(k + 3)] = 0x60;
-        b[at(k + 4)] = 0x01;
+        if (k > 0 && b[at(k - 1)] === 0) {
+          // 4-byte start code (what the S2 sends): borrow its spare zero and
+          // write a REAL H.265 access-unit delimiter, 00 00 01 46 01 50.
+          b[at(k - 1)] = 0;
+          b[at(k)] = 0;
+          b[at(k + 1)] = 1;
+          b[at(k + 2)] = 0x46;
+          b[at(k + 3)] = 0x01;
+          b[at(k + 4)] = 0x50;
+        } else {
+          b[at(k + 3)] = 0x60;
+          b[at(k + 4)] = 0x01;
+        }
         n++;
         k += 4;
       }

package/utils/robot-display.ts

@@ -1156,6 +1156,107 @@ export function patrolRunHint(records: Array<{ routeName?: unknown; startedAt?:
   return `Looks like "${best.name}" runs ${how} around ${hhmm} (based on the last 7 days)`;
 }
 
+/* ------------------------------------------ patrol schedule detected from past runs */
+
+export type TPatrolSlot = {
+  route: string;
+  /** Minutes after local midnight. */
+  minutes: number;
+  hhmm: string;
+  /** "daily" · "every Mon, Thu" · "on 4 of the last 30 days". */
+  days: string;
+  dayCount: number;
+  lastAt: number;
+  /** Next expected start, only while the pattern is still current. */
+  nextAt: number | null;
+};
+
+const DAY_MS = 86_400_000;
+const WEEKDAY = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
+const hhmmOf = (min: number) => `${String(Math.floor(min / 60) % 24).padStart(2, "0")}:${String(min % 60).padStart(2, "0")}`;
+const localDay = (t: number) => {
+  const d = new Date(t);
+  return new Date(d.getFullYear(), d.getMonth(), d.getDate()).getTime();
+};
+const atMinutes = (day: number, min: number) => {
+  const d = new Date(day);
+  return new Date(d.getFullYear(), d.getMonth(), d.getDate(), Math.floor(min / 60), min % 60).getTime();
+};
+
+/**
+ * The robot's brand keeps its patrol schedule to itself (PadBot has no
+ * schedule API), so we detect it from the robot's own recent runs: runs of
+ * the same route that start within 30 minutes of each other (local clock) on
+ * at least 2 different days in the last `windowDays` form one slot.
+ * Every day between the first and last run -> "daily"; the same weekdays
+ * repeated -> "every Mon, Thu"; else "on N of the last 30 days". The next
+ * start is only predicted while the pattern is current (daily: ran in the
+ * last 2 days; weekly: in the last 8). A one-off run is never a slot.
+ */
+export function detectPatrolSchedule(
+  records: Array<{ routeName?: unknown; startedAt?: unknown }> | null | undefined,
+  now: number = Date.now(),
+  windowDays = 30,
+): TPatrolSlot[] {
+  const since = now - windowDays * DAY_MS;
+  const byRoute = new Map<string, Array<{ t: number; min: number }>>();
+  for (const r of records ?? []) {
+    const t = typeof r?.startedAt === "string" ? Date.parse(r.startedAt) : NaN;
+    const name = typeof r?.routeName === "string" ? r.routeName.trim() : "";
+    if (!name || !finite(t) || t < since || t > now) continue;
+    const d = new Date(t);
+    byRoute.set(name, [...(byRoute.get(name) ?? []), { t, min: d.getHours() * 60 + d.getMinutes() }]);
+  }
+  const slots: TPatrolSlot[] = [];
+  for (const [route, runs] of byRoute) {
+    // Group by time of day; a gap over 30 min starts a new group (a group may wrap past midnight).
+    const sorted = [...runs].sort((a, b) => a.min - b.min);
+    const groups: Array<typeof sorted> = [];
+    for (const r of sorted) {
+      const g = groups[groups.length - 1];
+      if (g && r.min - g[g.length - 1]!.min <= 30) g.push(r);
+      else groups.push([r]);
+    }
+    if (groups.length > 1) {
+      const first = groups[0]!, last = groups[groups.length - 1]!;
+      if (first[0]!.min + 1440 - last[last.length - 1]!.min <= 30) groups[0] = [...groups.pop()!.map((r) => ({ ...r, min: r.min - 1440 })), ...first];
+    }
+    for (const g of groups) {
+      const days = [...new Set(g.map((r) => localDay(r.t)))].sort((a, b) => a - b);
+      if (days.length < 2) continue;
+      const mins = g.map((r) => r.min).sort((a, b) => a - b);
+      const minutes = (mins[Math.floor((mins.length - 1) / 2)]! + 1440) % 1440;
+      const lastAt = Math.max(...g.map((r) => r.t));
+      const span = Math.round((days[days.length - 1]! - days[0]!) / DAY_MS) + 1;
+      const wdCount = new Map<number, number>();
+      for (const d of days) wdCount.set(new Date(d).getDay(), (wdCount.get(new Date(d).getDay()) ?? 0) + 1);
+      const weekly = span > 7 && wdCount.size <= 5 && [...wdCount.values()].every((n) => n >= 2);
+      const kind = days.length === span ? "daily" : weekly ? "weekly" : "some";
+      const label =
+        kind === "daily" ? "daily" : kind === "weekly" ? `every ${[...wdCount.keys()].sort((a, b) => ((a + 6) % 7) - ((b + 6) % 7)).map((d) => WEEKDAY[d]).join(", ")}` : `on ${days.length} of the last ${windowDays} days`;
+      let nextAt: number | null = null;
+      if ((kind === "daily" && now - lastAt <= 2 * DAY_MS) || (kind === "weekly" && now - lastAt <= 8 * DAY_MS)) {
+        for (let i = 0; i <= 7 && nextAt === null; i++) {
+          const at = atMinutes(localDay(now) + i * DAY_MS + DAY_MS / 2, minutes); // noon offset survives DST days
+          if (at > now && (kind === "daily" || wdCount.has(new Date(at).getDay()))) nextAt = at;
+        }
+      }
+      slots.push({ route, minutes, hhmm: hhmmOf(minutes), days: label, dayCount: days.length, lastAt, nextAt });
+    }
+  }
+  return slots.sort((a, b) => a.minutes - b.minutes || a.route.localeCompare(b.route));
+}
+
+/** One slot as a line: "daily 20:00 · last ran 19 h ago · next expected 20:00 today". */
+export function patrolSlotText(slot: TPatrolSlot, now: number = Date.now()): string {
+  const parts = [`${slot.days} ${slot.hhmm}`, `last ran ${agoText(slot.lastAt, now)}`];
+  if (slot.nextAt !== null) {
+    const d = Math.round((localDay(slot.nextAt) - localDay(now)) / DAY_MS);
+    parts.push(`next expected ${slot.hhmm} ${d === 0 ? "today" : d === 1 ? "tomorrow" : WEEKDAY[new Date(slot.nextAt).getDay()]}`);
+  }
+  return parts.join(" · ");
+}
+
 /**
  * May the plan take spot-clean clicks? A Manager, a cleaning robot, a brand
  * that declares `spotClean`, and a robot confirmed online. (A busy robot keeps