@linxin666/dsh-pet 0.3.3 → 0.3.5

package/src/client/gameplay-hud.tsx

@@ -0,0 +1,403 @@
+/**
+ * Gameplay HUD — the client half of the manifest 'gameplay' block (miku-pet
+ * generalization). One component owns everything the block needs: the stat
+ * bars and shop card (menu / shop pages), the touch-zone tap
+ * handling, the idle director rolls, the work and sleep loops, and the
+ * float-text toasts. It talks to the host through the injected verb API,
+ * writes results straight back into the store (the 2 s poll stays the
+ * backstop), and steers the frames2d renderer through the per-pet bus.
+ * @module @linxin666/dsh-pet/client/GameplayHud
+ */
+
+import { useEffect, useLayoutEffect, useRef, useState, useSyncExternalStore, type ReactElement } from 'react'
+import type { PropsLocale } from '@deepseek-ai/dsh-client-ui-slots'
+import type { PetDefinition } from '../registry.ts'
+import type { PetGameplayVerbResult } from '../service.ts'
+import { touchZoneAt } from '../gameplay.ts'
+import type { PetStoreInstance } from './pet-store.ts'
+import type { DragStream } from './drag-stream.ts'
+import type { NS } from './locales.ts'
+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>
+  workTick: () => Promise<PetGameplayVerbResult>
+  buy: (item: string) => Promise<PetGameplayVerbResult>
+}
+
+/**
+ * The per-pet coordination bus. The frames2d visual mount registers the
+ * track override (setTrack); the HUD registers the sprite tap handler; the
+ * chrome calls into whatever is registered. Optional chaining everywhere —
+ * either side may be mid-remount during a hot reload.
+ */
+export interface GameplayBus {
+  setTrack?: (track?: string) => void
+  tap?: (fx: number, fy: number) => void
+  /**
+   * Card open/close request from the chrome (the hover panel's 玩法 action):
+   * the HUD registers this, and calling it with no argument toggles the card
+   * while a boolean pins the state (same chrome -> HUD direction as tap).
+   */
+  openCard?: (open?: boolean) => void
+}
+
+type HudPage = 'root' | 'shop'
+
+/** One floating toast (prize / insufficient funds). */
+interface HudFloat {
+  id: number
+  text: string
+}
+
+let floatSeq = 0
+
+/** The gameplay overlay for one frames2d pet that declares 'gameplay'. */
+export function GameplayHud(props: {
+  definition: PetDefinition
+  store: PetStoreInstance
+  api: GameplayApi
+  bus: GameplayBus
+  drag: DragStream
+  t: PropsLocale<typeof NS>['t']
+}): ReactElement | null {
+  const { definition, store, api, bus } = props
+  const ui = useSyncExternalStore(store.subscribe, store.getSnapshot)
+  const def = definition.gameplay
+  const view = ui.snapshot?.gameplay
+  const phase = ui.snapshot?.phase ?? 'idle'
+
+  const [open, setOpen] = useState(false)
+  const [page, setPage] = useState<HudPage>('root')
+  const hudRef = useRef<HTMLDivElement | null>(null)
+  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)
+  modeRef.current = view?.mode ?? null
+  const phaseRef = useRef(phase)
+  phaseRef.current = phase
+  const draggingRef = useRef(false)
+  const touchLockUntilRef = useRef(0)
+  const missRef = useRef(0)
+  const busyRef = useRef(false)
+
+  // 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
+  const statLabel = (name: string): string => tr('pet.gameplay.stat.' + name)
+  const currencyLabel = (name: string): string => tr('pet.gameplay.currency.' + name)
+
+  const pushFloat = (text: string): void => {
+    const id = ++floatSeq
+    setFloats(list => [...list.slice(-3), { id, text }])
+    window.setTimeout(() => {
+      setFloats(list => list.filter(entry => entry.id !== id))
+    }, 1100)
+  }
+
+  const applyResult = (result: PetGameplayVerbResult): void => {
+    if (result.view !== undefined) store.actions.setGameplayView(result.view)
+  }
+
+  // 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.
+  useEffect(() => {
+    if (def === undefined) return undefined
+    bus.tap = (fx, fy) => {
+      if (modeRef.current === 'sleep') {
+        void api.setMode(null).then(applyResult, () => undefined)
+        return
+      }
+      if (modeRef.current === 'work') return
+      const box = def.hitBox ?? { x0: 0, y0: 0, x1: 1, y1: 1 }
+      const hx = (fx - box.x0) / (box.x1 - box.x0)
+      const hy = (fy - box.y0) / (box.y1 - box.y0)
+      if (hx < 0 || hx > 1 || hy < 0 || hy > 1) return
+      if (Date.now() < touchLockUntilRef.current) {
+        void api.touch().then(applyResult, () => undefined)
+        return
+      }
+      const zone = def.touch === undefined ? undefined : touchZoneAt(def.touch, hy)
+      if (zone === undefined) return
+      void api.touch(zone.name).then((result) => {
+        applyResult(result)
+        if (result.hit !== true) return
+        if (result.state !== undefined) {
+          bus.setTrack?.(result.state)
+          const holdMs = result.stateMs ?? 3000
+          touchLockUntilRef.current = Date.now() + holdMs
+          window.setTimeout(() => {
+            if (Date.now() >= touchLockUntilRef.current) bus.setTrack?.(undefined)
+          }, holdMs)
+        }
+        if (result.phrase !== undefined) {
+          store.actions.setFeedback({ text: result.phrase, kind: 'none', at: Date.now() })
+        }
+      }, () => undefined)
+    }
+    return () => { bus.tap = undefined }
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- one registration per pet definition
+  }, [definition.id, def])
+
+  // Panel entry (chrome -> HUD): the hover panel's 玩法 button drives the
+  // card through this channel so the chrome never needs the card's state.
+  useEffect(() => {
+    bus.openCard = (next?: boolean) => {
+      setOpen(prev => next ?? !prev)
+      setPage('root')
+    }
+    return () => { bus.openCard = undefined }
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- one registration per bus
+  }, [bus])
+
+  // Card placement: the card must not enter the bubble band above the sprite
+  // or the hover-panel band below it, so it opens beside the sprite instead
+  // of growing upward from the pet's feet. It is vertically centered on the
+  // sprite box, clamped to the sprite's height, and the side is chosen by
+  // the space available to each side (right first; a pet parked near the
+  // right viewport edge flips the card to the left).
+  useLayoutEffect(() => {
+    if (!open) return undefined
+    const hud = hudRef.current
+    const card = cardRef.current
+    if (hud === null || card === null) return undefined
+    const place = (): void => {
+      const box = hud.parentElement?.getBoundingClientRect()
+      if (box === undefined) return
+      const gap = 8
+      const width = card.getBoundingClientRect().width
+      const toRight = window.innerWidth - box.right
+      const x = toRight >= width + gap ? box.width + gap : -(width + gap)
+      card.style.transform = 'translate(' + Math.round(x) + 'px, ' + Math.round(-box.height / 2) + 'px) translateY(50%)'
+      card.style.maxHeight = Math.round(box.height) + 'px'
+    }
+    place()
+    window.addEventListener('resize', place)
+    return () => { window.removeEventListener('resize', place) }
+    // 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.
+  useEffect(() => {
+    return props.drag.subscribe((dragging) => {
+      draggingRef.current = dragging
+      if (dragging && modeRef.current === 'sleep') {
+        void api.setMode(null).then(applyResult, () => undefined)
+      }
+    })
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- one subscription per drag stream
+  }, [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.
+  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
+    const timer = window.setInterval(() => {
+      if (phaseRef.current !== 'idle') return
+      if (modeRef.current !== null || draggingRef.current) return
+      if (Date.now() < touchLockUntilRef.current) return
+      let pickedAct: { track: string; weight: number; phrases?: string[] } | undefined
+      if (missRef.current >= director.maxMiss) {
+        // Forced act: pick among the acts only.
+        const actTotal = director.acts.reduce((sum, act) => sum + act.weight, 0)
+        let actRoll = Math.random() * actTotal
+        for (const act of director.acts) {
+          actRoll -= act.weight
+          if (actRoll < 0) { pickedAct = act; break }
+        }
+      } else {
+        let roll = Math.random() * total
+        for (const act of director.acts) {
+          roll -= act.weight
+          if (roll < 0) { pickedAct = act; break }
+        }
+      }
+      if (pickedAct === undefined) {
+        missRef.current += 1
+        return
+      }
+      missRef.current = 0
+      bus.setTrack?.(pickedAct.track)
+      // 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)
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- one director per pet definition
+  }, [definition.id, def])
+
+  // Work loop: hold the work track, adjudicate one round per tick, play the
+  // result track for its hold window, then resume. Leaving the mode
+  // releases the override so the phase mapping takes over.
+  useEffect(() => {
+    const work = def?.work
+    if (def === undefined || work === undefined || view?.mode !== 'work') return undefined
+    bus.setTrack?.(work.state)
+    let resultTimer = 0
+    const timer = window.setInterval(() => {
+      if (busyRef.current) return
+      busyRef.current = true
+      void api.workTick().then((result) => {
+        busyRef.current = false
+        applyResult(result)
+        if (result.ok !== true || result.outcome === undefined) return
+        const resultTrack = result.outcome === 'success' ? work.successState : work.failState
+        const hold = result.outcome === 'success' ? work.resultMs?.success ?? 1300 : work.resultMs?.fail ?? 1900
+        bus.setTrack?.(resultTrack)
+        resultTimer = window.setTimeout(() => {
+          if (modeRef.current === 'work') bus.setTrack?.(work.state)
+        }, hold)
+      }, () => { busyRef.current = false })
+    }, work.tickMs)
+    return () => {
+      window.clearInterval(timer)
+      window.clearTimeout(resultTimer)
+      bus.setTrack?.(undefined)
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- the loop keys on the mode value
+  }, [definition.id, def, view?.mode])
+
+  // Sleep loop: hold the sleep track; restore is host-side (lazy settle).
+  useEffect(() => {
+    const sleep = def?.sleep
+    if (def === undefined || sleep === undefined || view?.mode !== 'sleep') return undefined
+    bus.setTrack?.(sleep.state)
+    return () => bus.setTrack?.(undefined)
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- the loop keys on the mode value
+  }, [definition.id, def, view?.mode])
+
+  if (def === undefined || view === undefined) return null
+
+  const mode = view.mode
+  const stats = def.stats ?? {}
+  const shop = def.shop
+
+  const buy = (itemId: string): void => {
+    void api.buy(itemId).then((result) => {
+      applyResult(result)
+      if (result.ok !== true) {
+        if (result.error === 'insufficient-funds') {
+          const item = shop?.items.find(entry => entry.id === itemId)
+          pushFloat(tr('pet.gameplay.insufficient', { currency: currencyLabel(item?.currency ?? 'treats') }))
+        }
+        return
+      }
+      if (result.prize !== undefined) {
+        pushFloat(tr('pet.gameplay.prize', { amount: result.prize.amount, currency: currencyLabel(result.prize.currency) }))
+      }
+    }, () => undefined)
+  }
+
+  const setMode = (next: 'work' | 'sleep' | null): void => {
+    void api.setMode(next).then(applyResult, () => undefined)
+  }
+
+  return (
+    <div ref={hudRef} className={styles.gameplayHud} data-dsh-pet-gameplay={definition.id}>
+      {floats.map(entry => (
+        <div key={entry.id} className={styles.gameplayFloat}>{entry.text}</div>
+      ))}
+      {mode !== null && (
+        <div className={styles.gameplayModeChip}>
+          {tr(mode === 'work' ? 'pet.gameplay.working' : 'pet.gameplay.sleeping')}
+        </div>
+      )}
+      {open && (
+        <div ref={cardRef} className={styles.gameplayCard} data-page={page}>
+          {page === 'root' && (
+            <>
+              <div className={styles.gameplayBars}>
+                {Object.entries(stats).map(([name, stat]) => {
+                  const value = view.stats[name] ?? 0
+                  return (
+                    <div key={name} className={styles.gameplayBarRow} title={statLabel(name) + ' ' + String(value) + '/' + String(stat.max)}>
+                      <span className={styles.gameplayBarLabel}>{statLabel(name)}</span>
+                      <span className={styles.gameplayBarTrack}>
+                        <span
+                          className={styles.gameplayBarFill}
+                          style={{ width: Math.round((value / stat.max) * 100) + '%' }}
+                        />
+                      </span>
+                    </div>
+                  )
+                })}
+              </div>
+              <div className={styles.gameplayActions}>
+                {def.work !== undefined && (
+                  <button
+                    type="button"
+                    className={styles.action}
+                    onClick={() => setMode(mode === 'work' ? null : 'work')}
+                  >
+                    {tr(mode === 'work' ? 'pet.gameplay.stopWork' : 'pet.gameplay.work')}
+                  </button>
+                )}
+                {def.sleep !== undefined && (
+                  <button
+                    type="button"
+                    className={styles.action}
+                    onClick={() => setMode(mode === 'sleep' ? null : 'sleep')}
+                  >
+                    {tr(mode === 'sleep' ? 'pet.gameplay.wake' : 'pet.gameplay.sleep')}
+                  </button>
+                )}
+                {shop !== undefined && (
+                  <button type="button" className={styles.action} onClick={() => setPage('shop')}>
+                    {tr('pet.gameplay.shop')}
+                  </button>
+                )}
+              </div>
+            </>
+          )}
+          {page === 'shop' && shop !== undefined && (
+            <>
+              <div className={styles.gameplayShopItems}>
+                {shop.items.map(item => (
+                  <button
+                    key={item.id}
+                    type="button"
+                    className={styles.gameplayShopItem}
+                    onClick={() => buy(item.id)}
+                    title={item.label + ' — ' + String(item.price) + ' ' + currencyLabel(item.currency)}
+                  >
+                    {item.image !== undefined && (
+                      <img className={styles.gameplayShopItemImage} src={item.image} alt="" draggable={false} />
+                    )}
+                    <span className={styles.gameplayShopItemLabel}>{item.label}</span>
+                    <span className={styles.gameplayShopItemPrice}>
+                      {item.price} {currencyLabel(item.currency)}
+                    </span>
+                  </button>
+                ))}
+              </div>
+              <div className={styles.gameplayActions}>
+                <button type="button" className={styles.action} onClick={() => setPage('root')}>
+                  {tr('pet.gameplay.back')}
+                </button>
+              </div>
+            </>
+          )}
+          <button
+            type="button"
+            className={styles.gameplayClose}
+            aria-label={tr('pet.gameplay.back')}
+            onClick={() => setOpen(false)}
+          >
+            ×
+          </button>
+        </div>
+      )}
+    </div>
+  )
+}

package/src/client/index.test.tsx

@@ -110,7 +110,16 @@ function fakeContext(): FakeClientLifecycle {
       },
       register: () => () => {},
     },
-    sessions: undefined,
+    sessions: {
+      list: {
+        getSnapshot: () => ({ current: undefined, byId: {} }),
+        subscribe: (listener: () => void) => {
+          const set = new Set<() => void>([listener])
+          return () => { set.delete(listener) }
+        },
+      },
+      open: () => {},
+    },
   } as unknown as ClientContext
   let disposed = false
   const lifecycle: FakeClientLifecycle = {

package/src/client/index.ts

@@ -19,7 +19,7 @@ import type {} from '@deepseek-ai/dsh-client-ui-settings/client'
 import type {} from '@deepseek-ai/dsh-client-ui-slots'
 import type {} from '@deepseek-ai/dsh-client-ui-conversation/client'
 import type { PetDisplayConfig } from '../persist.ts'
-import type { PetInteractResult, PetStateView } from '../service.ts'
+import type { PetGameplayVerbResult, PetInteractResult, PetStateView } from '../service.ts'
 import type { PetInteraction } from '../affinity.ts'
 import type { PetDefinition } from '../registry.ts'
 import { createElement } from 'react'
@@ -28,6 +28,7 @@ import { createPetStore, type PetStoreInstance } from './pet-store.ts'
 import { PetDockEntry, type PetInjected } from './PetDockEntry.tsx'
 import { defaultPetRendererRegistry } from './renderers/registry.ts'
 import { live2dRenderer } from './renderers/live2d.ts'
+import { frames2dRenderer } from './renderers/frames2d.ts'
 import { registerPetUiTeardown, takeoverPetUiTeardown } from './ui-teardown.ts'
 import { PetSettingsSection, PetSettingsCardController, type PetSettings } from './PetSettingsCard.tsx'
 import { NS, en, zh, t } from './locales.ts'
@@ -35,13 +36,18 @@ import { reportDailyHeartbeat } from './telemetry.ts'
 
 /** The host pet API as the browser sees it (same-origin JSON endpoints). */
 interface PetHttpApi {
-  state(): Promise<PetStateView>
+  /** Poll the host snapshot; the GUI's current session id rides the query. */
+  state(currentSessionId?: string): Promise<PetStateView>
   pets(): Promise<PetDefinition[]>
   interact(kind: PetInteraction): Promise<PetInteractResult>
   setVisible(visible: boolean): Promise<{ ok: true; display: PetDisplayConfig }>
   setConfig(patch: Partial<PetDisplayConfig>): Promise<{ ok: true; display: PetDisplayConfig }>
   setName(name: string): Promise<{ ok: true; name: string } | { ok: false; error: string }>
   setPet(petId: string): Promise<{ ok: true; petId: string } | { ok: false; error: string }>
+  gameplayTouch(zone?: string): Promise<PetGameplayVerbResult>
+  gameplaySetMode(mode: 'work' | 'sleep' | null): Promise<PetGameplayVerbResult>
+  gameplayWorkTick(): Promise<PetGameplayVerbResult>
+  gameplayBuy(item: string): Promise<PetGameplayVerbResult>
 }
 
 /** Same-origin JSON fetch helper (GET without body, POST with JSON body). */
@@ -61,13 +67,18 @@ async function petFetch<T>(path: string, body?: unknown): Promise<T> {
 
 /** The live host API instance (always defined; failures surface per call). */
 const petApi: PetHttpApi = {
-  state: () => petFetch('/api/pet/state'),
+  state: (currentSessionId) => petFetch('/api/pet/state'
+    + (currentSessionId === undefined ? '' : '?current=' + encodeURIComponent(currentSessionId))),
   pets: () => petFetch('/api/pet/pets'),
   interact: (kind) => petFetch('/api/pet/interact', { kind }),
   setVisible: (visible) => petFetch('/api/pet/set-visible', { visible }),
   setConfig: (patch) => petFetch('/api/pet/set-config', patch),
   setName: (name) => petFetch('/api/pet/set-name', { name }),
   setPet: (petId) => petFetch('/api/pet/set-pet', { petId }),
+  gameplayTouch: (zone) => petFetch('/api/pet/gameplay/touch', zone === undefined ? {} : { zone }),
+  gameplaySetMode: (mode) => petFetch('/api/pet/gameplay/mode', { mode }),
+  gameplayWorkTick: () => petFetch('/api/pet/gameplay/work-tick', {}),
+  gameplayBuy: (item) => petFetch('/api/pet/gameplay/buy', { item }),
 }
 
 /** Poll interval for the host snapshot. */
@@ -120,6 +131,7 @@ export function apply(ctx: ClientContext): void {
   // Built-in renderers dispatch through the plugin-wide registry (pet-center
   // M3). Registration is idempotent (id wins), so re-applies stay clean.
   defaultPetRendererRegistry.register(live2dRenderer)
+  defaultPetRendererRegistry.register(frames2dRenderer)
 
   const binder = ctx.get('webUiSettings') ?? ctx.settingsScope
   const settingsScope = binder.bind<PetSettings>({ namespace: PET_SETTINGS_NS })
@@ -187,6 +199,20 @@ export function apply(ctx: ClientContext): void {
       const setState = petStore.actions.setState
       const setFeedback = petStore.actions.setFeedback
 
+      // Clicking a session bubble jumps the GUI to that session; the same
+      // sessions face reports which session the user is currently on, so the
+      // host can lead the bubble stack with it. A bubble can outlive its
+      // disposed session by one poll tick, and the sessions service fails
+      // loud on unknown ids, so consult the live list first. The pet's type
+      // program also loads the host-side dsh-session package through the
+      // service types, whose Context merge declares a different 'sessions'
+      // face; pin the browser runtime's outward face here.
+      const sessions = ctx.sessions as unknown as ISessions
+      const currentSessionId = (): string | undefined => {
+        const current = sessions.list.getSnapshot().current
+        return current === undefined ? undefined : String(current)
+      }
+
       // The registry list is fetched lazily with retries baked into the poll
       // cycle: until it lands, the dock entry renders nothing and every 2s
       // tick tries again. After it lands, one list feeds both the sprite and
@@ -208,7 +234,7 @@ export function apply(ctx: ClientContext): void {
         }
         const seq = stateSeq + 1
         stateSeq = seq
-        petApi.state().then((snapshot) => {
+        petApi.state(currentSessionId()).then((snapshot) => {
           if (seq !== stateSeq) return
           setSnapshot(snapshot)
         }, () => {
@@ -251,13 +277,16 @@ export function apply(ctx: ClientContext): void {
         }
       }, 'pet: poll')
 
-      // Clicking a session bubble jumps the GUI to that session. A bubble
-      // can outlive its disposed session by one poll tick, and the sessions
-      // service fails loud on unknown ids, so consult the live list first.
-      // The pet's type program also loads the host-side dsh-session package
-      // through the service types, whose Context merge declares a different
-      // 'sessions' face; pin the browser runtime's outward face here.
-      const sessions = ctx.sessions as unknown as ISessions
+      // A current-session switch should re-order the bubble stack right away,
+      // not on the next 2s tick. Poll only while the tab is visible, as the
+      // poll loop itself does.
+      const disposeSessionWatch = ctx.effect(() => {
+        const unsubscribe = sessions.list.subscribe(() => {
+          if (document.visibilityState === 'visible') pollNow()
+        })
+        return unsubscribe
+      }, 'pet: current-session watch')
+
       const openSession = (sessionId: string): void => {
         const list = sessions.list.getSnapshot()
         if (list.byId[sessionId as SessionId] === undefined) return
@@ -321,6 +350,12 @@ export function apply(ctx: ClientContext): void {
         feedbackDone: () => {
           setFeedback(null)
         },
+        gameplay: {
+          touch: (zone) => petApi.gameplayTouch(zone),
+          setMode: (mode) => petApi.gameplaySetMode(mode),
+          workTick: () => petApi.gameplayWorkTick(),
+          buy: (item) => petApi.gameplayBuy(item),
+        },
       })
 
       // The pet is host-global (its state/display/interactions have no session

package/src/client/locales.ts

@@ -24,6 +24,24 @@ export const zh = {
   'pet.live2d.vendor-missing': 'Live2D 组件缺失，请升级宠物插件。',
   'pet.live2d.load-failed': 'Live2D 模型加载失败，请检查该宠物目录的完整性。',
   'pet.openSessionHint': '点击跳转到对应会话',
+  // 玩法 HUD（miku-pet 泛化：属性条 / 打工 / 睡觉 / 商店；统一小鱼干经济）。
+  'pet.gameplay.menu': '玩法',
+  'pet.gameplay.work': '打工',
+  'pet.gameplay.stopWork': '收工',
+  'pet.gameplay.sleep': '睡觉',
+  'pet.gameplay.wake': '起床',
+  'pet.gameplay.shop': '商店',
+  'pet.gameplay.back': '返回',
+  'pet.gameplay.buy': '购买',
+  'pet.gameplay.insufficient': '{currency}不足',
+  'pet.gameplay.prize': '中奖 +{amount} {currency}',
+  'pet.gameplay.working': '打工中',
+  'pet.gameplay.sleeping': '睡觉中',
+  'pet.gameplay.stat.hunger': '饱食',
+  'pet.gameplay.stat.mood': '心情',
+  'pet.gameplay.stat.energy': '精力',
+  'pet.gameplay.stat.affection': '好感',
+  'pet.gameplay.currency.treats': '小鱼干',
   'pet.moreSessions': '展开其余 {n} 个会话的气泡',
   'pet.collapseSessions': '收起会话气泡',
   // 一级设置页（settings.section 席位）。
@@ -79,6 +97,24 @@ export const en = {
   'pet.live2d.vendor-missing': 'The Live2D component is missing; please update the pet plugin.',
   'pet.live2d.load-failed': 'The Live2D model failed to load; check the pet directory is complete.',
   'pet.openSessionHint': 'Click to jump to this session',
+  // Gameplay HUD (miku-pet generalization: stat bars / work / sleep / shop; unified treats economy).
+  'pet.gameplay.menu': 'Play',
+  'pet.gameplay.work': 'Work',
+  'pet.gameplay.stopWork': 'Stop work',
+  'pet.gameplay.sleep': 'Sleep',
+  'pet.gameplay.wake': 'Wake up',
+  'pet.gameplay.shop': 'Shop',
+  'pet.gameplay.back': 'Back',
+  'pet.gameplay.buy': 'Buy',
+  'pet.gameplay.insufficient': 'Not enough {currency}',
+  'pet.gameplay.prize': 'Prize +{amount} {currency}',
+  'pet.gameplay.working': 'Working',
+  'pet.gameplay.sleeping': 'Sleeping',
+  'pet.gameplay.stat.hunger': 'Hunger',
+  'pet.gameplay.stat.mood': 'Mood',
+  'pet.gameplay.stat.energy': 'Energy',
+  'pet.gameplay.stat.affection': 'Affection',
+  'pet.gameplay.currency.treats': 'Treats',
   'pet.moreSessions': 'Expand {n} more session bubbles',
   'pet.collapseSessions': 'Collapse session bubbles',
   // First-level settings section (the `settings.section` seat).

package/src/client/pet-store.ts

@@ -8,7 +8,7 @@
 
 import { defineStore } from '@deepseek-ai/dsh-client-runtime/client'
 import type { EngineStoreHandle, EngineStoreInstance } from '@deepseek-ai/dsh-client-runtime/client'
-import type { PetStateView } from '../service.ts'
+import type { PetGameplayStateView, PetStateView } from '../service.ts'
 import type { PetInteraction } from '../affinity.ts'
 import type { PetDefinition } from '../registry.ts'
 
@@ -46,6 +46,12 @@ export type PetUiActions = {
   setState: (draft: PetUiState, state: PetUiState['state'], error: string | null) => void
   /** Show a reaction bubble. */
   setFeedback: (draft: PetUiState, feedback: PetFeedback | null) => void
+  /**
+   * Patch the gameplay slice of the snapshot (verb write-back), so the HUD
+   * reflects a touch/mode/buy result immediately instead of waiting one
+   * poll tick (2 s).
+   */
+  setGameplayView: (draft: PetUiState, view: PetGameplayStateView) => void
 }
 
 /** Create the pet store handle (apply world only; never module-level). */
@@ -74,6 +80,9 @@ export function createPetStore(): EngineStoreHandle<PetUiState, PetUiActions> {
       setFeedback: (draft, feedback) => {
         draft.feedback = feedback
       },
+      setGameplayView: (draft, view) => {
+        if (draft.snapshot !== null) draft.snapshot = { ...draft.snapshot, gameplay: view }
+      },
     },
   })
 }