@simon-says-build/demo-player 0.9.0 → 0.10.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@simon-says-build/demo-player",
-  "version": "0.9.0",
+  "version": "0.10.0",
   "description": "SimonSays mobile demo player: walks a preview's viewer through a job's change, inside the app. Renders nothing unless the bundle carries a demo.",
   "repository": {
     "type": "git",

package/src/DemoHost.js

@@ -15,7 +15,7 @@
 import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { Linking, Pressable, ScrollView, StyleSheet, Text, TextInput, View, useWindowDimensions } from 'react-native';
 import { pageName } from './page-name.js';
-import { OVERLAY_ID, cardBox, currentDemo, demoConfig, findTarget, handlerFor, onDemo, phoneSteps, playDemo, releaseOf, reviewChangesOf, scalePoint, rescueNote, screenCandidates, stepTitle, targetOfKey } from './core.js';
+import { OVERLAY_ID, cardBox, currentDemo, demoConfig, findTarget, handlerFor, introBody, introOf, onDemo, phoneSteps, playDemo, releaseOf, reviewChangesOf, scalePoint, rescueNote, screenCandidates, stepTitle, targetOfKey } from './core.js';
 import { demoApi, tourOf } from './api.js';
 import { signInFirst, openInApp } from './signin.js';
 import { runEvent, fillStep } from './events.js';
@@ -76,6 +76,7 @@ function Player({ config, router, insets, onClose, children }) {
   const [changes, setChanges] = useState([]);     // what the last card reviews (reviewChangesOf)
   const [release, setRelease] = useState(null);   // a release's demo ends on releasing it (releaseOf)
   const [reviewing, setReviewing] = useState(false);
+  const [intro, setIntro] = useState(null);       // the first screen: who asked, what, signed in as (introOf)
   const [signIn, setSignIn] = useState(null);     // a `signin` step: null while it runs, else { ok, error }
   const [event, setEvent] = useState(null);       // an `event` step: null while it runs, else { ok, error }
   const [vars, setVars] = useState({});           // per person: what their events set up ({walkId} in later steps)
@@ -86,7 +87,7 @@ function Player({ config, router, insets, onClose, children }) {
   useEffect(() => {
     let live = true;
     api.load()
-      .then((d) => { if (live) { setSteps(phoneSteps(tourOf(d, { here: !!config.here })).concat()); setChanges(reviewChangesOf(d)); setRelease(releaseOf(d)); } })
+      .then((d) => { if (live) { setSteps(phoneSteps(tourOf(d, { here: !!config.here })).concat()); setChanges(reviewChangesOf(d)); setRelease(releaseOf(d)); setIntro(introOf(d)); } })
       .catch((e) => { if (live) setError(e.message); });
     return () => { live = false; };
   }, [api]);
@@ -221,6 +222,12 @@ function Player({ config, router, insets, onClose, children }) {
   const overlay = (() => {
     if (error) return h(Card, { at: null, screen, insets, card, setCard, title: 'Demo', body: `The demo didn't load: ${error}` });
     if (!steps) return null;
+    if (intro && !tucked && !done) {
+      return h(Card, {
+        at: null, screen, insets, card, setCard, title: 'Guided Review', body: introBody(intro),
+        actions: [{ label: 'Hide', onPress: () => setTucked(true) }, { label: 'Start the review', onPress: () => setIntro(null), primary: true }],
+      });
+    }
     if (reviewing && !tucked) return h(Review, { api, changes, release, screen, insets, onBack: steps.length ? () => setReviewing(false) : null, onDone: finish, onHide: () => setTucked(true) });
     if (flash) return h(View, { pointerEvents: 'none', style: [s.flash, { top: insets.top + screen.height * 0.4 }], testID: 'ssb-demo-flash' },
       h(Text, { style: s.flashText, accessibilityLiveRegion: 'polite' }, flash));

package/src/core.js

@@ -10,7 +10,7 @@ import { bubbleBox } from './step-place.js';
 // What this player is, said when the app registers for "Ready to see"
 // (packages/ssb-overlay sends it; functions/in-app-notify.mjs clientOf). Kept
 // equal to package.json by test/core.test.mjs.
-export const PLAYER_VERSION = '0.9.0';
+export const PLAYER_VERSION = '0.10.0';
 
 export const HOST = 5;
 export const TEXT = 6;
@@ -219,3 +219,30 @@ export function releaseOf(demo) {
   if (!sm || typeof sm.jobId !== 'string' || !sm.jobId) return null;
   return { jobId: sm.jobId, label: String(sm.label || 'Approve & release'), note: String(sm.note || '') };
 }
+
+// THE FIRST SCREEN OF A REVIEW (0.10.0, Michael 2026-11-03): a very brief
+// outline before anything plays — who asked for it, what they asked for, and
+// who the review signs in as — then a button to start. Pure.
+//   → { requestedBy: [string], asks: [{ title, asked }], as: [string] } | null
+const firstSentence = (t) => { const x = String(t || '').replace(/\s+/g, ' ').trim(); const m = /^(.{20,160}?[.!?])(\s|$)/.exec(x); return (m ? m[1] : x.slice(0, 140) + (x.length > 140 ? '…' : '')); };
+export function introOf(demo) {
+  const asks = [], by = new Set(), as = [];
+  for (const a of demo?.actors || []) {
+    if (a?.label && !as.includes(a.label)) as.push(String(a.label));
+    for (const sec of a.sections || []) for (const f of sec.features || []) {
+      if (f?.requestedBy) by.add(String(f.requestedBy).trim());
+      if (!asks.some((x) => x.title === f.title)) asks.push({ title: String(f.title || 'This change'), ...(f.tryIt?.steps ? { asked: firstSentence(f.tryIt.steps) } : {}) });
+    }
+  }
+  return asks.length || as.length ? { requestedBy: [...by], asks, as } : null;
+}
+export function introBody(intro) {
+  if (!intro) return '';
+  const lines = [];
+  if (intro.requestedBy.length) lines.push(`Requested by ${intro.requestedBy.join(', ')}`);
+  const shown = intro.asks.slice(0, 3);
+  for (const a of shown) lines.push(`• ${a.title}`);
+  if (intro.asks.length > shown.length) lines.push(`…and ${intro.asks.length - shown.length} more`);
+  if (intro.as.length) lines.push(`Signed in as ${intro.as.join(', then ')}`);
+  return lines.join('\n');
+}