@linxin666/dsh-pet 0.3.24 → 0.3.25

package/src/client/PluginSettingsCard.tsx

@@ -64,6 +64,10 @@ export interface PluginSettingsCardProps<TKey extends string = string> {
    * edits, so the footer would sit there permanently disabled.
    */
   hideFooter?: boolean
+  /** Render children even when the settings namespace is not exposed by the host. */
+  renderChildrenWhenNotExposed?: boolean
+  /** Hide the 'not exposed' warning banner when the settings namespace is not exposed. */
+  hideNotExposedNotice?: boolean
   /** The plugin's controls. */
   children: ReactNode
 }
@@ -126,14 +130,15 @@ export function PluginSettingsCard<TKey extends string = string>(props: PluginSe
   // official settings allowlist omits third-party namespaces): show a card
   // that explains the gap instead of vanishing, so a missing card never
   // reads as a missing plugin.
-  if (!state.exposed) {
+  if (!state.exposed && props.renderChildrenWhenNotExposed !== true) {
+    const showNotice = props.hideNotExposedNotice !== true
     return (
       <li className={cardClass}>
         {header}
         {expanded
           ? (
             <div className={css.body}>
-              <p className={css.notExposed} role="status">{props.t('settings.notExposed')}</p>
+              {showNotice ? <p className={css.notExposed} role="status">{props.t('settings.notExposed')}</p> : null}
             </div>
           )
           : null}

package/src/client/gameplay-hud.test.tsx

@@ -44,6 +44,7 @@ import { createDragStream } from './drag-stream.ts'
 import { t } from './locales.ts'
 import type { PetDefinition } from '../registry.ts'
 import type { PetGameplayStateView, PetGameplayVerbResult, PetStateView } from '../service.ts'
+import type { ActivityPhase } from '../state.ts'
 
 const VIEW: PetGameplayStateView = {
   stats: { hunger: 100, mood: 100, energy: 100, affection: 100 },
@@ -110,10 +111,10 @@ function petDefinition(): PetDefinition {
   }
 }
 
-function snapshot(view: PetGameplayStateView, skin?: string): PetStateView {
+function snapshot(view: PetGameplayStateView, skin?: string, phase: ActivityPhase = 'idle'): PetStateView {
   return {
     animation: 'idle',
-    phase: 'idle',
+    phase,
     sessionActive: false,
     sessions: [],
     affinity: { points: 0, rank: '幼鲸', rankEmoji: '*', pets: 0, feeds: 0, turns: 0, petCooldown: false, feedCooldown: false },
@@ -135,7 +136,7 @@ interface Harness {
   setView: (view: PetGameplayStateView) => void
 }
 
-function harness(view: PetGameplayStateView = gameplayView()): Harness {
+function harness(view: PetGameplayStateView = gameplayView(), definition: PetDefinition = petDefinition()): Harness {
   const store = createPetStore().create()
   store.actions.setSnapshot(snapshot(view))
   const bus: GameplayBus = {}
@@ -145,13 +146,13 @@ function harness(view: PetGameplayStateView = gameplayView()): Harness {
   const ok = (patch?: Partial<PetGameplayVerbResult>): PetGameplayVerbResult => ({ ok: true, ...patch })
   const api = {
     touch: vi.fn(async () => ok({ hit: true, state: 'happy', stateMs: 3000, phrase: 'happy!', view: gameplayView({ stats: { ...VIEW.stats, affection: 105 } }) })),
-    setMode: vi.fn(async (mode: 'work' | 'sleep' | null) => ok({ view: gameplayView({ mode }) })),
+    setMode: vi.fn(async (mode: string | null) => ok({ view: gameplayView({ mode }) })),
     workTick: vi.fn(async () => ok({ outcome: 'success' as const, view: gameplayView({ mode: 'work' }) })),
     buy: vi.fn(async () => ok({ view: gameplayView() })),
     setSkin: vi.fn(async () => ({ ok: true })),
   }
   const setView = (next: PetGameplayStateView): void => store.actions.setSnapshot(snapshot(next))
-  render(<GameplayHud definition={petDefinition()} store={store} api={api} bus={bus} drag={drag} t={t} />)
+  render(<GameplayHud definition={definition} store={store} api={api} bus={bus} drag={drag} t={t} />)
   return { store, bus, api, setTrack, drag, setView }
 }
 
@@ -164,6 +165,102 @@ describe('GameplayHud', () => {
     vi.useRealTimers()
   })
 
+  it('user sees the pet roam on its interval and hold the walk track', () => {
+    // Given a pet whose roam always fires; when the roam interval elapses; then
+    // the bus walk runs, the walk track is held, then released.
+    const definition = petDefinition()
+    definition.gameplay = {
+      ...definition.gameplay,
+      // Park the director far away so this test isolates the roam roll (an act
+      // firing on the same tick owns the visual and skips the roam).
+      idleDirector: { intervalMs: 60_000, maxMiss: 2, idleWeight: 0, acts: [{ track: 'eat', weight: 1 }] },
+      roam: { state: 'happy', intervalMs: 5000, probability: 1, distanceMin: 100, distanceMax: 100, speed: 100 },
+    }
+    const h = harness(gameplayView(), definition)
+    const walk = vi.fn((_direction: string, _distance: number, _speed: number) => 100)
+    h.bus.walk = walk
+    act(() => { vi.advanceTimersByTime(5000) })
+    expect(walk).toHaveBeenCalledTimes(1)
+    const first = walk.mock.calls[0] ?? ['left', 0, 0]
+    expect(['up', 'down', 'left', 'right']).toContain(first[0])
+    expect(first[1]).toBe(100)
+    expect(first[2]).toBe(100)
+    expect(h.setTrack).toHaveBeenCalledWith('happy')
+    // The hold is exactly the travel time (100 px at 100 px/s), then released.
+    act(() => { vi.advanceTimersByTime(1000) })
+    expect(h.setTrack).toHaveBeenLastCalledWith(undefined)
+    // A pet with no room to move does not hold the walk art at all (the
+    // idle director's own setTrack calls are ignored here).
+    walk.mockReturnValue(0)
+    act(() => { vi.advanceTimersByTime(5000) })
+    expect(walk).toHaveBeenCalledTimes(2)
+    expect(h.setTrack.mock.calls.filter(call => call[0] === 'happy')).toHaveLength(1)
+  })
+
+  it('user sees the pet roam outside the idle phase too', () => {
+    // Given the agent is mid-tool-call; when the roam interval elapses; then the
+    // pet still wanders (only the director's acts are idle-gated).
+    const definition = petDefinition()
+    definition.gameplay = {
+      ...definition.gameplay,
+      idleDirector: { intervalMs: 60_000, maxMiss: 2, idleWeight: 0, acts: [{ track: 'eat', weight: 1 }] },
+      roam: { state: 'happy', intervalMs: 5000, probability: 1, distanceMin: 100, distanceMax: 100, speed: 100 },
+    }
+    const h = harness(gameplayView(), definition)
+    // The agent is mid-tool-call: the pet still wanders (only the director's
+    // acts are idle-gated).
+    h.store.actions.setSnapshot(snapshot(gameplayView(), undefined, 'tool'))
+    const walk = vi.fn((_direction: string, _distance: number, _speed: number) => 100)
+    h.bus.walk = walk
+    act(() => { vi.advanceTimersByTime(5000) })
+    expect(walk).toHaveBeenCalledTimes(1)
+    const first = walk.mock.calls[0] ?? ['left', 0, 0]
+    expect(first[1]).toBe(100)
+  })
+
+  it('user switching to sleep keeps the sleep track when a walk ends', () => {
+    // Given a walk holds the walk track; when the user enters sleep mid-walk;
+    // then the finished walk must not release the sleep owner's track.
+    const definition = petDefinition()
+    definition.gameplay = {
+      ...definition.gameplay,
+      idleDirector: { intervalMs: 60_000, maxMiss: 2, idleWeight: 0, acts: [{ track: 'eat', weight: 1 }] },
+      roam: { state: 'happy', intervalMs: 5000, probability: 1, distanceMin: 100, distanceMax: 100, speed: 100 },
+    }
+    const h = harness(gameplayView(), definition)
+    h.bus.walk = vi.fn((_direction: string, _distance: number, _speed: number) => 100)
+    // The staggered first roam tick starts a 1 s walk and holds the track.
+    act(() => { vi.advanceTimersByTime(2500) })
+    expect(h.setTrack).toHaveBeenCalledWith('happy')
+    // The user enters sleep mid-walk: the mode loop takes the slot.
+    act(() => { h.store.actions.setSnapshot(snapshot(gameplayView({ mode: 'sleep' }))) })
+    expect(h.setTrack).toHaveBeenLastCalledWith('sleep')
+    // The walk's hold window elapses: it must not clear the sleep track.
+    act(() => { vi.advanceTimersByTime(3000) })
+    expect(h.setTrack).toHaveBeenLastCalledWith('sleep')
+  })
+
+  it('user cannot see the roam cut into an idle-director act', () => {
+    // Given an act that owns the visual; when the roam's staggered tick lands;
+    // then the walk is skipped.
+    const definition = petDefinition()
+    definition.frames2d!.tracks.eat!.durations = [60_000]
+    definition.gameplay = {
+      ...definition.gameplay,
+      idleDirector: { intervalMs: 2000, maxMiss: 2, idleWeight: 0, acts: [{ track: 'eat', weight: 1 }] },
+      roam: { state: 'happy', intervalMs: 6000, probability: 1, distanceMin: 100, distanceMax: 100, speed: 100 },
+    }
+    const h = harness(gameplayView(), definition)
+    const walk = vi.fn((_direction: string, _distance: number, _speed: number) => 100)
+    h.bus.walk = walk
+    // 2 s: the director fires its act, which owns the visual for its duration.
+    act(() => { vi.advanceTimersByTime(2000) })
+    expect(h.setTrack).toHaveBeenCalledWith('eat')
+    // 3 s: the roam's staggered first tick lands, but the act still owns the pet.
+    act(() => { vi.advanceTimersByTime(1000) })
+    expect(walk).not.toHaveBeenCalled()
+  })
+
   it('opens the menu card through the bus openCard channel and shows the shop page', () => {
     const h = harness()
     expect(h.bus.openCard).toBeDefined()
@@ -440,8 +537,9 @@ describe('GameplayHud', () => {
       vi.advanceTimersByTime(5000)
     })
     expect(h.setTrack).toHaveBeenCalledWith('eat')
-    // A non-idle phase suppresses the roll.
-    h.store.actions.setSnapshot(snapshot(gameplayView()))
+    // Ambient acts are not phase-gated: while the agent works (thinking/tool)
+    // the roll still fires, otherwise she would only ever act when nobody is
+    // busy -- the idle phase is rare while an active session is running.
     h.setTrack.mockClear()
     const busy = snapshot(gameplayView())
     busy.phase = 'thinking'
@@ -451,7 +549,7 @@ describe('GameplayHud', () => {
     await act(async () => {
       vi.advanceTimersByTime(5000)
     })
-    expect(h.setTrack).not.toHaveBeenCalled()
+    expect(h.setTrack).toHaveBeenCalledWith('eat')
   })
 
   it('drives the work loop: work track, adjudicated ticks, result hold', async () => {

package/src/client/gameplay-hud.tsx

@@ -13,7 +13,7 @@ import { useEffect, useLayoutEffect, useRef, useState, useSyncExternalStore, typ
 import type { PropsLocale } from '@deepseek-ai/dsh-client-ui-slots'
 import type { PetDefinition, PetSkinDefinition } from '../registry.ts'
 import type { PetGameplayVerbResult } from '../service.ts'
-import { touchZoneAt } from '../gameplay.ts'
+import { declaredModes, modeStateOf, PET_ROAM_DIRECTIONS, touchZoneAt, type PetRoamDirection } from '../gameplay.ts'
 import type { PetStoreInstance } from './pet-store.ts'
 import type { DragStream } from './drag-stream.ts'
 import type { NS } from './locales.ts'
@@ -22,7 +22,7 @@ import styles from './pet.module.css'
 /** The gameplay verb API the plugin apply body injects (host-authoritative). */
 export interface GameplayApi {
   touch: (zone?: string) => Promise<PetGameplayVerbResult>
-  setMode: (mode: 'work' | 'sleep' | null) => Promise<PetGameplayVerbResult>
+  setMode: (mode: string | null) => Promise<PetGameplayVerbResult>
   workTick: () => Promise<PetGameplayVerbResult>
   buy: (item: string) => Promise<PetGameplayVerbResult>
   /**
@@ -56,6 +56,14 @@ export interface GameplayBus {
    * while a boolean pins the state (same chrome -> HUD direction as tap).
    */
   openCard?: (open?: boolean) => void
+  /**
+   * Walk the sprite in `direction` by `distance` px at `speed` px/s, clamped
+   * to the viewport, and persist the resting spot like a drag. Returns the
+   * distance actually travelled (0 when it cannot move), so the caller can
+   * hold the walk art for exactly that long. Registered by the chrome
+   * (PetSprite); absent while the sprite is unmounted.
+   */
+  walk?: (direction: PetRoamDirection, distance: number, speed: number) => number
 }
 
 type HudPage = 'root' | 'shop' | 'skins'
@@ -81,7 +89,6 @@ export function GameplayHud(props: {
   const ui = useSyncExternalStore(store.subscribe, store.getSnapshot)
   const def = definition.gameplay
   const view = ui.snapshot?.gameplay
-  const phase = ui.snapshot?.phase ?? 'idle'
   // Host-persisted skin selection for this pet (undefined = default look).
   const persistedSkin = ui.snapshot?.skin
 
@@ -95,14 +102,21 @@ export function GameplayHud(props: {
   const cardRef = useRef<HTMLDivElement | null>(null)
   const [floats, setFloats] = useState<HudFloat[]>([])
   // Mutable driver state (refs so intervals never re-arm on a poll tick).
-  const modeRef = useRef<'work' | 'sleep' | null>(view?.mode ?? null)
+  const modeRef = useRef<string | null>(view?.mode ?? null)
   modeRef.current = view?.mode ?? null
-  const phaseRef = useRef(phase)
-  phaseRef.current = phase
+  /** Live gameplay view for the interval loops (def identity is stable, view is not). */
+  const viewRef = useRef(view)
+  viewRef.current = view
   const draggingRef = useRef(false)
   const touchLockUntilRef = useRef(0)
   const missRef = useRef(0)
   const busyRef = useRef(false)
+  /** A roam walk owns the visual right now (the idle director must not steal it). */
+  const roamHeldRef = useRef(false)
+  /** A one-shot idle-director act owns the visual right now (the roam must not cut in). */
+  const actHeldRef = useRef(false)
+  /** Pending release of the roam's walk track (cleared when another owner takes it). */
+  const roamTimerRef = useRef(0)
 
   // Dynamic-key lookups (stat ids / currency ids are manifest data).
   const tr = props.t as unknown as (key: string, values?: Record<string, string | number>) => string
@@ -121,6 +135,20 @@ export function GameplayHud(props: {
     if (result.view !== undefined) store.actions.setGameplayView(result.view)
   }
 
+  /**
+   * Give up the roam's claim on the shared track-override slot. Every other
+   * owner (a mode, a touch reaction, a drag) calls this before it takes the
+   * slot, so a walk that is still in flight can never release someone else's
+   * track when its own hold window elapses.
+   */
+  const yieldRoam = (): void => {
+    if (roamTimerRef.current !== 0) {
+      window.clearTimeout(roamTimerRef.current)
+      roamTimerRef.current = 0
+    }
+    roamHeldRef.current = false
+  }
+
   // Tap handling (registered on the bus; PetSprite reports sprite-box
   // fractions). Sleep wakes on tap; work blocks taps; a held touch
   // animation turns taps into the plain-click boost.
@@ -134,6 +162,7 @@ export function GameplayHud(props: {
     // consecutive taps cannot retrigger mid-play (skin click actions and
     // default touch-zone reactions share this path).
     const holdTrack = (track: string, holdMs: number): void => {
+      yieldRoam()
       bus.setTrack?.(track)
       touchLockUntilRef.current = Date.now() + holdMs
       window.setTimeout(() => {
@@ -151,7 +180,9 @@ export function GameplayHud(props: {
     const trackDuration = (track: string): number =>
       definition.frames2d?.tracks[track]?.durations.reduce((sum, ms) => sum + ms, 0) ?? 0
     bus.tap = (fx, fy) => {
-      if (modeRef.current === 'sleep') {
+      // Any non-work mode ends on a tap (sleep wakes up, a bath steps out);
+      // work keeps swallowing taps while its round is running.
+      if (modeRef.current !== null && modeRef.current !== 'work') {
         void api.setMode(null).then(applyResult, () => undefined)
         return
       }
@@ -239,12 +270,13 @@ export function GameplayHud(props: {
     // eslint-disable-next-line react-hooks/exhaustive-deps -- one placement per open/page change
   }, [open, page])
 
-  // Drag gestures wake a sleeping pet (miku behavior); the drag stream also
-  // feeds the idle director's suppression check.
+  // Drag gestures end any non-work mode (sleep wakes, a bath steps out); the
+  // drag stream also feeds the idle director's suppression check.
   useEffect(() => {
     return props.drag.subscribe((dragging) => {
       draggingRef.current = dragging
-      if (dragging && modeRef.current === 'sleep') {
+      if (dragging) yieldRoam()
+      if (dragging && modeRef.current !== null && modeRef.current !== 'work') {
         void api.setMode(null).then(applyResult, () => undefined)
       }
     })
@@ -252,18 +284,22 @@ export function GameplayHud(props: {
   }, [props.drag])
 
   // Idle director: weighted rolls between staying idle and playing an act.
-  // Runs only while the phase mapping owns the visual (idle phase, no mode,
-  // no drag, no held touch animation); maxMiss forces an act after too many
-  // idle rolls in a row.
+  // Rolls in every phase -- an ambient act is not a waiting-room performance,
+  // and the idle phase only appears when neither the agent nor the user is busy
+  // -- but only while nothing else owns the visual: no mode, no drag, no held
+  // touch animation, no roam walk and no act already playing. maxMiss forces an
+  // act after too many idle rolls in a row.
   useEffect(() => {
     const director = def?.idleDirector
     if (def === undefined || director === undefined) return undefined
     const total = director.idleWeight + director.acts.reduce((sum, act) => sum + act.weight, 0)
     if (total <= 0) return undefined
+    let actTimer = 0
     const timer = window.setInterval(() => {
-      if (phaseRef.current !== 'idle') return
       if (modeRef.current !== null || draggingRef.current) return
       if (Date.now() < touchLockUntilRef.current) return
+      if (roamHeldRef.current) return // a roam walk owns the visual
+      if (actHeldRef.current) return // the previous act is still playing
       let pickedAct: { track: string; weight: number; phrases?: string[] } | undefined
       if (missRef.current >= director.maxMiss) {
         // Forced act: pick among the acts only.
@@ -285,14 +321,24 @@ export function GameplayHud(props: {
         return
       }
       missRef.current = 0
+      actHeldRef.current = true
       bus.setTrack?.(pickedAct.track)
+      // A one-shot act owns the visual until its own duration elapses (the
+      // renderer then falls back to the phase map); the roam must not cut in.
+      const holdMs = definition.frames2d?.tracks[pickedAct.track]?.durations.reduce((sum, ms) => sum + ms, 0) ?? 0
+      window.clearTimeout(actTimer)
+      actTimer = window.setTimeout(() => { actHeldRef.current = false }, holdMs > 0 ? holdMs : 3000)
       // Acts with a phrase pool speak one line while they play (miku parity).
       if (pickedAct.phrases !== undefined && pickedAct.phrases.length > 0) {
         const phrase = pickedAct.phrases[Math.floor(Math.random() * pickedAct.phrases.length)]!
         store.actions.setFeedback({ text: phrase, kind: 'none', at: Date.now() })
       }
     }, director.intervalMs)
-    return () => window.clearInterval(timer)
+    return () => {
+      window.clearInterval(timer)
+      window.clearTimeout(actTimer)
+      actHeldRef.current = false
+    }
     // eslint-disable-next-line react-hooks/exhaustive-deps -- one director per pet definition
   }, [definition.id, def])
 
@@ -335,25 +381,93 @@ export function GameplayHud(props: {
     // eslint-disable-next-line react-hooks/exhaustive-deps -- the loop keys on the mode and the selected skin
   }, [definition.id, def, view?.mode, skinId])
 
-  // Sleep loop: hold the sleep track; restore is host-side (lazy settle).
-  // While a skin with a gameplayTracks.sleep override is selected, the skin's
-  // own track replaces the default sleep track (e.g. a skin-specific doze).
+  // Mode loop: hold the active non-work mode's track (sleep, a bath, any
+  // extra 'modes' entry). The stat restore is host-side (lazy settle). While a
+  // skin with a matching gameplayTracks override is selected, the skin's own
+  // track replaces the default one (e.g. a skin-specific doze).
   useEffect(() => {
-    const sleep = def?.sleep
-    if (def === undefined || sleep === undefined || view?.mode !== 'sleep') return undefined
+    const active = view?.mode
+    if (def === undefined || active === undefined || active === null || active === 'work') return undefined
+    const hold = modeStateOf(def, active)
+    if (hold === undefined) return undefined
     const skinGameplay = definition.frames2d?.skins?.find(skin => skin.id === skinIdRef.current)?.gameplayTracks
-    const hold = skinGameplay?.['sleep'] ?? sleep.state
-    bus.setTrack?.(hold)
+    yieldRoam()
+    bus.setTrack?.(skinGameplay?.[active] ?? hold)
     return () => bus.setTrack?.(undefined)
     // eslint-disable-next-line react-hooks/exhaustive-deps -- the loop keys on the mode value
   }, [definition.id, def, view?.mode, skinId])
 
+  // Random roaming (manifest 'roam'): on a slow interval -- in any phase, as long
+  // as no mode, drag, touch animation or director act owns the pet -- roll a
+  // wander. The chrome walks the sprite and persists the new spot; this side
+  // holds the walk track for exactly the travel time.
+  useEffect(() => {
+    const roam = def?.roam
+    if (def === undefined || roam === undefined) return undefined
+    const roll = (): void => {
+      // Every phase: a wandering pet is ambient, not a performance, so she
+      // keeps walking while the agent works (the idle director's acts stay
+      // idle-only). A mode, a drag, a touch animation and a director
+      // act all still own the pet and suppress the roll.
+      if (modeRef.current !== null || draggingRef.current) return
+      if (Date.now() < touchLockUntilRef.current) return
+      if (roamHeldRef.current || actHeldRef.current) return
+      if (Math.random() >= roam.probability) return
+      const span = roam.distanceMax - roam.distanceMin
+      const distance = roam.distanceMin + Math.random() * span
+      const directions = roam.directions ?? PET_ROAM_DIRECTIONS
+      const direction = directions[Math.floor(Math.random() * directions.length)] ?? 'left'
+      const travelled = bus.walk?.(direction, distance, roam.speed) ?? 0
+      if (travelled === 0) return
+      roamHeldRef.current = true
+      bus.setTrack?.(roam.state)
+      roamTimerRef.current = window.setTimeout(() => {
+        roamTimerRef.current = 0
+        if (!roamHeldRef.current) return // another owner already took the slot
+        roamHeldRef.current = false
+        bus.setTrack?.(undefined)
+      }, Math.max(150, (Math.abs(travelled) / roam.speed) * 1000))
+    }
+    // The two decision timers must never share a tick. The roam starts half an
+    // interval late, so its ticks interleave with the idle director's instead
+    // of landing on the same instant (10 s and 15 s coincide every 30 s).
+    let timer = 0
+    const lead = window.setTimeout(() => {
+      roll()
+      timer = window.setInterval(roll, roam.intervalMs)
+    }, Math.round(roam.intervalMs / 2))
+    return () => {
+      window.clearTimeout(lead)
+      window.clearInterval(timer)
+      yieldRoam()
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- one director per pet definition
+  }, [definition.id, def])
+
   if (def === undefined || view === undefined) return null
 
   const mode = view.mode
   const stats = def.stats ?? {}
   const shop = def.shop
 
+  // Every menu mode beyond work: sleep plus any extra 'modes' the pet declares.
+  const menuModes = declaredModes(def)
+
+  /** Action-button label for one mode (active = the button that leaves it). */
+  const modeLabel = (name: string, active: boolean): string => {
+    if (name === 'sleep') return tr(active ? 'pet.gameplay.wake' : 'pet.gameplay.sleep')
+    const declared = def.modes?.[name]
+    return (active ? declared?.activeLabel ?? declared?.label : declared?.label) ?? tr('pet.gameplay.' + name)
+  }
+
+  /** Chip label for the mode the pet is in right now. */
+  const modeChip = (name: string): string => {
+    if (name === 'work') return tr('pet.gameplay.working')
+    if (name === 'sleep') return tr('pet.gameplay.sleeping')
+    const declared = def.modes?.[name]
+    return declared?.activeLabel ?? declared?.label ?? tr('pet.gameplay.' + name)
+  }
+
   const buy = (itemId: string): void => {
     void api.buy(itemId).then((result) => {
       applyResult(result)
@@ -370,7 +484,7 @@ export function GameplayHud(props: {
     }, () => undefined)
   }
 
-  const setMode = (next: 'work' | 'sleep' | null): void => {
+  const setMode = (next: string | null): void => {
     void api.setMode(next).then(applyResult, () => undefined)
   }
 
@@ -421,7 +535,7 @@ export function GameplayHud(props: {
       ))}
       {mode !== null && (
         <div className={styles.gameplayModeChip}>
-          {tr(mode === 'work' ? 'pet.gameplay.working' : 'pet.gameplay.sleeping')}
+          {modeChip(mode)}
         </div>
       )}
       {open && (
@@ -445,15 +559,16 @@ export function GameplayHud(props: {
                 })}
               </div>
               <div className={styles.gameplayActions}>
-                {def.sleep !== undefined && (
+                {menuModes.map(name => (
                   <button
+                    key={name}
                     type="button"
                     className={styles.action}
-                    onClick={() => setMode(mode === 'sleep' ? null : 'sleep')}
+                    onClick={() => setMode(mode === name ? null : name)}
                   >
-                    {tr(mode === 'sleep' ? 'pet.gameplay.wake' : 'pet.gameplay.sleep')}
+                    {modeLabel(name, mode === name)}
                   </button>
-                )}
+                ))}
                 {shop !== undefined && (
                   <button type="button" className={styles.action} onClick={() => setPage('shop')}>
                     {tr('pet.gameplay.shop')}

package/src/client/index.test.tsx

@@ -63,6 +63,8 @@ interface FakeClientLifecycle {
   emitSettings(): void
   sessionsListenerCount(): number
   setEnabled(enabled: boolean): void
+  /** Namespaces the family settings binder was asked for (empty without one). */
+  boundNamespaces(): string[]
 }
 
 const activeLifecycles: FakeClientLifecycle[] = []
@@ -72,11 +74,19 @@ afterEach(() => {
   document.body.replaceChildren()
 })
 
-function fakeContext(): FakeClientLifecycle {
+interface FakeContextOptions {
+  /** Provide the dsh-web-settings family binder, as the group plugin does. */
+  familyBinder?: boolean
+  /** Initial value of the settings section the bound form answers with. */
+  enabled?: boolean
+}
+
+function fakeContext(options: FakeContextOptions = {}): FakeClientLifecycle {
   const disposers: (() => void)[] = []
   const settingsListeners = new Set<() => void>()
   const sessionListeners = new Set<() => void>()
-  let settingsValue: { enabled?: boolean } | undefined
+  const boundNamespaces: string[] = []
+  let settingsValue: { enabled?: boolean } | undefined = options.enabled === undefined ? undefined : { enabled: options.enabled }
   const scope = {
     getSnapshot: () => ({
       status: 'ready',
@@ -92,6 +102,12 @@ function fakeContext(): FakeClientLifecycle {
       return () => { settingsListeners.delete(listener) }
     },
   }
+  const familyBinder = {
+    bind: (spec: { namespace: string }) => {
+      boundNamespaces.push(spec.namespace)
+      return scope
+    },
+  }
   const ctx = {
     effect: (fn: () => unknown, _label?: string) => {
       const dispose = fn()
@@ -101,8 +117,10 @@ function fakeContext(): FakeClientLifecycle {
       return cleanup
     },
     locale: { register: () => () => {} },
-    get: () => undefined,
-    settingsScope: { bind: () => scope },
+    // The family binder is optional (dsh-web-settings may be absent); both
+    // answers are the shared per-entry form of this plugin's own profile entry.
+    get: (name: string) => name === 'webUiSettings' && options.familyBinder === true ? familyBinder : undefined,
+    configForms: { get: () => scope },
     slots: {
       // Cordis runs the factory when the slot mounts and its returned
       // disposer when the fiber disposes; mirror that so slot content
@@ -139,6 +157,7 @@ function fakeContext(): FakeClientLifecycle {
     },
     sessionsListenerCount: () => sessionListeners.size,
     setEnabled: (enabled: boolean) => { settingsValue = { enabled } },
+    boundNamespaces: () => boundNamespaces,
   }
   activeLifecycles.push(lifecycle)
   return lifecycle
@@ -236,4 +255,18 @@ describe('pet client apply', () => {
     expect(lifecycle.sessionsListenerCount()).toBe(1)
     expect(document.body.querySelectorAll('[data-dsh-pet-root]')).toHaveLength(1)
   })
+
+  it('user gets the pet settings form through the family binder when the group plugin is mounted', () => {
+    // Given a client context that provides the dsh-web-settings family binder
+    // and answers 'disabled' through the form that binder returns
+    const lifecycle = fakeContext({ familyBinder: true, enabled: false })
+
+    // When the pet client plugin applies
+    apply(lifecycle.ctx)
+
+    // Then the card bound the 'pet' namespace through that binder...
+    expect(lifecycle.boundNamespaces()).toEqual(['pet'])
+    // ...and the pet surface followed the form it answered (disabled -> hidden)
+    expect(document.body.querySelectorAll('[data-dsh-pet-root]')).toHaveLength(0)
+  })
 })