@idosgames/mcp 0.1.19 → 0.1.20

package/registry/modules/coop-events.json

@@ -0,0 +1,67 @@
+{
+  "id": "coop-events",
+  "meta": {
+    "name": "Team event",
+    "type": "app",
+    "engine": "dom"
+  },
+  "catalog": {
+    "type": "feature",
+    "summary": "Team events for any game: join a group, each member spins the wheel to build their own object, the team shares a grand prize.",
+    "description": "A ready team event screen (engine CoopEvent) for ANY game, built on the @idosgames/react/ui kit and client.coopEvent. Not in a group: the running team events of the title with their timers and team prize, 'Join a team' (the server matches partners, helpers fill the gaps). In a group: every member with their object and its progress, 'Spin' (once or five at a time, free or for currency) to build your own object, the object's reward when it is done, the team prize when every object is done, and leaving the team. The group lives in one shared document on the server — the screen re-reads it after every action. Registers the 'coop-events' feature; its badge counts the object reward and the team prize waiting. Ships title-seed.json: a weekly team build event.",
+    "provides": [
+      "team event screen",
+      "join a team (matchmaking by the server)",
+      "spin to build your object",
+      "object reward and team prize",
+      "badge for rewards waiting"
+    ],
+    "tags": [
+      "coop",
+      "team",
+      "group",
+      "events",
+      "social",
+      "ui",
+      "screen"
+    ],
+    "author": {
+      "name": "iDos Games",
+      "url": "https://idosgames.com"
+    },
+    "version": "0.1.0"
+  },
+  "dependencies": {
+    "@idosgames/core": "0.19.1",
+    "@idosgames/module-sdk": "0.7.0",
+    "@idosgames/react": "0.3.0",
+    "react": "19.2.7"
+  },
+  "contentHash": "a8a8cda19becde2ed4fc12f338866442c3175a8e8ad0650110ca7057896541ab",
+  "files": [
+    {
+      "path": "CoopEventsScreen.tsx",
+      "content": "import {\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n  useSyncExternalStore,\n  type ReactNode,\n} from \"react\";\nimport type { ActiveCoopEventInfo, IDosGamesClient } from \"@idosgames/core\";\nimport type {\n  FeatureRegistry,\n  FeatureScreenProps,\n} from \"@idosgames/module-sdk\";\nimport { useIDosGamesClient, useUserState } from \"@idosgames/react\";\nimport {\n  Button,\n  Card,\n  Center,\n  EmptyState,\n  Icon,\n  Popup,\n  ProgressBar,\n  ResourceList,\n  SectionTitle,\n  Spinner,\n  Timer,\n  canAfford,\n  configSection,\n  errorText,\n  grantedBy,\n  outlined,\n  panel,\n  useCatalog,\n  useCelebrate,\n  useNow,\n  useStagger,\n  useToast,\n  useUiKit,\n  v,\n} from \"@idosgames/react/ui\";\nimport {\n  bulkSpins,\n  chainIDs,\n  coopBadge,\n  eventOf,\n  groupRows,\n  spinPrices,\n  type CoopEventView,\n  type CoopSection,\n  type GroupView,\n} from \"./model\";\nimport { t } from \"./i18n\";\n\n// Team events (engine CoopEvent): the player joins a group (the server matches partners, bots fill\n// the gaps), each member spins the wheel to build their own object, and the group shares a grand\n// prize when every object is done. The group lives in ONE shared document on the server, so the\n// screen always re-reads it after an action instead of patching it locally.\n\n/** The player's group and the active events, shared by the screen and the badge (one read). */\nexport function createCoopStore(features: FeatureRegistry) {\n  let group: GroupView | null | undefined = undefined;\n  const listeners = new Set<() => void>();\n  return {\n    get: () => group,\n    subscribe: (l: () => void) => {\n      listeners.add(l);\n      return () => listeners.delete(l);\n    },\n    async load(client: IDosGamesClient): Promise<void> {\n      const res = await client.coopEvent.getUserState();\n      group = res.ok\n        ? ((res.data.ActiveGroup as GroupView | null) ?? null)\n        : null;\n      const rows = groupRows(\n        group,\n        eventOf(configSection<CoopSection>(client, \"CoopEvent\"), group),\n        client.auth.context?.userID,\n      );\n      features.setBadge(\"coop-events\", group ? coopBadge(rows) : 0);\n      for (const l of listeners) l();\n    },\n  };\n}\nexport type CoopStore = ReturnType<typeof createCoopStore>;\n\nexport function makeCoopEventsScreen(store: CoopStore) {\n  return function CoopEventsScreen(_: FeatureScreenProps): ReactNode {\n    const client = useIDosGamesClient();\n    const group = useSyncExternalStore(store.subscribe, store.get, store.get);\n    useEffect(() => {\n      void store.load(client);\n    }, [client]);\n    if (group === undefined)\n      return (\n        <Center>\n          <Spinner />\n        </Center>\n      );\n    return group ? (\n      <Group group={group} store={store} />\n    ) : (\n      <Join store={store} />\n    );\n  };\n}\n\n// ── Not in a group: the running events to join ───────────────────────────────────────────────\n\nfunction Join({ store }: { store: CoopStore }): ReactNode {\n  const client = useIDosGamesClient();\n  const catalog = useCatalog();\n  const now = useNow();\n  const toast = useToast();\n  const stagger = useStagger();\n  const [active, setActive] = useState<ActiveCoopEventInfo[] | null>(null);\n  const [busy, setBusy] = useState<string | null>(null);\n  useEffect(() => {\n    const chains = chainIDs(configSection<CoopSection>(client, \"CoopEvent\"));\n    void Promise.all(\n      chains.map((c) => client.coopEvent.getActiveEvent(c)),\n    ).then((all) => setActive(all.flatMap((r) => (r.ok ? [r.data] : []))));\n  }, [client]);\n\n  const join = async (chainID: string) => {\n    setBusy(chainID);\n    const res = await client.coopEvent.joinOrCreateGroup(chainID);\n    setBusy(null);\n    if (!res.ok) return toast(errorText(res.error), \"error\");\n    await store.load(client);\n  };\n\n  if (!active)\n    return (\n      <Center>\n        <Spinner />\n      </Center>\n    );\n  const running = active.filter((a) => a.EventDef);\n  if (running.length === 0)\n    return <EmptyState glyph=\"friends\" text={t(\"noEvent\")} />;\n  return (\n    <div style={{ display: \"grid\", gap: 12 }}>\n      {running.map((a, i) => {\n        const def = a.EventDef as CoopEventView;\n        return (\n          <Card\n            key={a.CoopChainID}\n            style={{\n              display: \"grid\",\n              gap: 10,\n              background: \"linear-gradient(180deg, #2f7d6b 0%, #174a3f 100%)\",\n              ...stagger(i),\n            }}\n          >\n            <div style={{ display: \"flex\", alignItems: \"center\", gap: 12 }}>\n              <div className=\"idos-bounce\">\n                <Icon glyph=\"friends\" size={48} />\n              </div>\n              <div style={{ flex: 1, minWidth: 0 }}>\n                <div style={{ ...outlined, fontSize: 17 }}>\n                  {catalog.localize(def.DisplayName ?? a.CoopChainID)}\n                </div>\n                <Timer\n                  at={a.ComputedEndUtc as string | undefined}\n                  now={now}\n                  label={t(\"endsIn\")}\n                />\n              </div>\n            </div>\n            {def.Description ? (\n              <div\n                style={{\n                  ...outlined,\n                  fontWeight: 600,\n                  fontSize: 13,\n                  color: v.textDim,\n                }}\n              >\n                {catalog.localize(def.Description)}\n              </div>\n            ) : null}\n            <div\n              style={{\n                display: \"flex\",\n                gap: 8,\n                alignItems: \"center\",\n                flexWrap: \"wrap\",\n              }}\n            >\n              <span style={{ ...outlined, fontSize: 13, color: v.textDim }}>\n                {t(\"grandPrize\")}\n              </span>\n              <ResourceList\n                lines={groupRows(null, def, null).grandPrize}\n                size={20}\n              />\n            </div>\n            <Button\n              tone=\"green\"\n              size=\"lg\"\n              attract\n              busy={busy === a.CoopChainID}\n              onClick={() => void join(a.CoopChainID)}\n              data-tutorial-anchor={`coop:join:${a.CoopChainID}`}\n            >\n              {t(\"join\")} · {Number(def.PartnerCount ?? 0) + 1} {t(\"players\")}\n            </Button>\n          </Card>\n        );\n      })}\n    </div>\n  );\n}\n\n// ── In a group ───────────────────────────────────────────────────────────────────────────────\n\nfunction Group({\n  group,\n  store,\n}: {\n  group: GroupView;\n  store: CoopStore;\n}): ReactNode {\n  const client = useIDosGamesClient();\n  const state = useUserState();\n  const catalog = useCatalog();\n  const celebrate = useCelebrate();\n  const toast = useToast();\n  const kit = useUiKit();\n  const now = useNow();\n  const ref = useRef<HTMLDivElement>(null);\n  const [busy, setBusy] = useState<string | null>(null);\n  const [last, setLast] = useState<number | null>(null);\n  const [leaving, setLeaving] = useState(false);\n  const event = eventOf(configSection<CoopSection>(client, \"CoopEvent\"), group);\n  const rows = groupRows(group, event, client.auth.context?.userID);\n  const balances = state?.InventoryV2?.VirtualCurrencies as\n    Record<string, { Amount?: number }> | undefined;\n  const reload = useCallback(() => store.load(client), [client]);\n\n  const spin = async (optionID: string | null, count: number) => {\n    setBusy(`${optionID ?? \"\"}:${count}`);\n    const res = await client.coopEvent.spin(\n      group.CoopChainID ?? \"\",\n      group.GroupID ?? \"\",\n      count,\n      optionID ?? undefined,\n    );\n    setBusy(null);\n    if (!res.ok) return toast(errorText(res.error), \"error\");\n    kit.play(\"claim\");\n    kit.fx.burst(ref.current);\n    setLast(Number(res.data.ProgressDelta ?? 0));\n    await reload();\n  };\n  const claim = async (kind: \"object\" | \"grand\") => {\n    setBusy(kind);\n    const res =\n      kind === \"object\"\n        ? await client.coopEvent.claimObjectReward(group.GroupID ?? \"\")\n        : await client.coopEvent.claimGrandPrize(group.GroupID ?? \"\");\n    setBusy(null);\n    if (!res.ok) return toast(errorText(res.error), \"error\");\n    celebrate(\n      grantedBy(res.data),\n      kind === \"grand\" ? { sound: \"levelUp\" } : undefined,\n    );\n    await reload();\n  };\n  const leave = async () => {\n    setLeaving(false);\n    const res = await client.coopEvent.leaveGroup(group.GroupID ?? undefined);\n    if (!res.ok) return toast(errorText(res.error), \"error\");\n    await reload();\n  };\n\n  return (\n    <div ref={ref} style={{ display: \"grid\", gap: 12 }}>\n      <div style={{ ...panel, padding: 12, display: \"grid\", gap: 6 }}>\n        <div style={{ ...outlined, fontSize: 17 }}>\n          {catalog.localize(event?.DisplayName ?? group.CoopEventID ?? \"\")}\n        </div>\n        {group.ExpiresAtUtc && !rows.finished ? (\n          <Timer at={group.ExpiresAtUtc} now={now} label={t(\"endsIn\")} />\n        ) : null}\n        {rows.forming ? (\n          <div style={{ ...outlined, fontSize: 13, color: v.gold }}>\n            {t(\"forming\")}\n          </div>\n        ) : null}\n      </div>\n\n      <SectionTitle>{t(\"team\")}</SectionTitle>\n      {rows.members.map((m) => (\n        <Card\n          key={m.userID}\n          highlight={m.me}\n          style={{ display: \"grid\", gap: 6, opacity: m.left ? 0.5 : 1 }}\n        >\n          <div\n            style={{ display: \"flex\", justifyContent: \"space-between\", gap: 8 }}\n          >\n            <span style={{ ...outlined, fontSize: 14 }}>\n              {m.me ? t(\"you\") : m.name}\n              {m.bot ? ` · ${t(\"bot\")}` : \"\"}\n            </span>\n            <span style={{ ...outlined, fontSize: 13, color: v.textDim }}>\n              {catalog.localize(m.objectName)}\n            </span>\n          </div>\n          <ProgressBar\n            value={m.progress}\n            max={m.max}\n            tone={m.done ? \"gold\" : \"green\"}\n          />\n        </Card>\n      ))}\n\n      {rows.mine && !rows.mine.done && !rows.finished ? (\n        <div style={{ display: \"grid\", gap: 8 }}>\n          {last !== null ? (\n            <div\n              style={{\n                ...outlined,\n                fontSize: 14,\n                color: v.green,\n                textAlign: \"center\",\n              }}\n            >\n              +{last} {t(\"progress\")}\n            </div>\n          ) : null}\n          {spinPrices(event).map((o) => {\n            const affordable = canAfford(o.price, balances);\n            const bulk = bulkSpins(event);\n            return (\n              <div key={o.id ?? \"free\"} style={{ display: \"flex\", gap: 8 }}>\n                <Button\n                  tone=\"gold\"\n                  size=\"lg\"\n                  attract={affordable}\n                  disabled={!affordable}\n                  busy={busy === `${o.id ?? \"\"}:1`}\n                  onClick={() => void spin(o.id, 1)}\n                  style={{ flex: 1 }}\n                  data-tutorial-anchor=\"coop:spin\"\n                >\n                  {t(\"spin\")}{\" \"}\n                  {o.price.length > 0 ? (\n                    <ResourceList lines={o.price} size={18} />\n                  ) : null}\n                </Button>\n                {bulk > 0 ? (\n                  <Button\n                    tone=\"blue\"\n                    disabled={\n                      !canAfford(\n                        o.price.map((l) => ({ ...l, amount: l.amount * bulk })),\n                        balances,\n                      )\n                    }\n                    busy={busy === `${o.id ?? \"\"}:${bulk}`}\n                    onClick={() => void spin(o.id, bulk)}\n                  >\n                    ×{bulk}\n                  </Button>\n                ) : null}\n              </div>\n            );\n          })}\n        </div>\n      ) : null}\n\n      {rows.objectRewardReady ? (\n        <Button\n          tone=\"gold\"\n          attract\n          busy={busy === \"object\"}\n          onClick={() => void claim(\"object\")}\n        >\n          {t(\"claimObject\")}{\" \"}\n          <ResourceList lines={rows.objectReward} size={18} />\n        </Button>\n      ) : null}\n      {rows.grandPrizeReady ? (\n        <Button\n          tone=\"gold\"\n          size=\"lg\"\n          attract\n          busy={busy === \"grand\"}\n          onClick={() => void claim(\"grand\")}\n        >\n          {t(\"claimGrand\")} <ResourceList lines={rows.grandPrize} size={20} />\n        </Button>\n      ) : null}\n      {!rows.grandPrizeReady ? (\n        <Button\n          tone=\"grey\"\n          size=\"sm\"\n          onClick={() => (rows.finished ? void leave() : setLeaving(true))}\n        >\n          {rows.finished ? t(\"close\") : t(\"leave\")}\n        </Button>\n      ) : null}\n      {leaving ? (\n        <Popup title={t(\"leave\")} onClose={() => setLeaving(false)} width={360}>\n          <div style={{ ...outlined, fontSize: 14, textAlign: \"center\" }}>\n            {t(\"leaveConfirm\")}\n          </div>\n          <Button tone=\"red\" onClick={() => void leave()}>\n            {t(\"leave\")}\n          </Button>\n        </Popup>\n      ) : null}\n    </div>\n  );\n}\n\n/** Keeps the badge (object reward and grand prize waiting) — only on a title with team events. */\nexport function makeCoopWatcher(store: CoopStore) {\n  return function CoopWatcher(): ReactNode {\n    const client = useIDosGamesClient();\n    useEffect(() => {\n      void store.load(client);\n    }, [client]);\n    return null;\n  };\n}\n"
+    },
+    {
+      "path": "i18n.ts",
+      "content": "import { makeT } from \"@idosgames/react/ui\";\n\nconst EN = {\n  title: \"Team event\",\n  endsIn: \"Ends in\",\n  grandPrize: \"Team prize\",\n  join: \"Join a team\",\n  players: \"players\",\n  forming: \"Looking for teammates…\",\n  team: \"Your team\",\n  you: \"You\",\n  bot: \"helper\",\n  spin: \"Spin\",\n  progress: \"progress\",\n  claimObject: \"Claim\",\n  claimGrand: \"Claim the team prize\",\n  leave: \"Leave the team\",\n  leaveConfirm: \"Your progress in this event will be lost.\",\n  close: \"Finish\",\n  noEvent: \"No team event right now — check back later.\",\n} as const;\n\nexport const t = makeT<keyof typeof EN>(EN, {\n  title: \"Командный ивент\",\n  endsIn: \"До конца\",\n  grandPrize: \"Приз команды\",\n  join: \"Вступить в команду\",\n  players: \"игр.\",\n  forming: \"Ищем напарников…\",\n  team: \"Ваша команда\",\n  you: \"Вы\",\n  bot: \"помощник\",\n  spin: \"Крутить\",\n  progress: \"прогресса\",\n  claimObject: \"Забрать\",\n  claimGrand: \"Забрать приз команды\",\n  leave: \"Выйти из команды\",\n  leaveConfirm: \"Прогресс в этом ивенте пропадёт.\",\n  close: \"Завершить\",\n  noEvent: \"Сейчас командного ивента нет — загляните позже.\",\n});\n"
+    },
+    {
+      "path": "index.ts",
+      "content": "// @idosgames/mod-coop-events — Team events for any game: a group of players builds together - each spins the wheel for their own object, the group shares a grand prize.\n\nexport { coopEventsModule } from \"./module\";\n"
+    },
+    {
+      "path": "model.ts",
+      "content": "// Pure helpers of the team events screen — covered by model.test.ts. The group lives on the server\n// (one shared document per group); these only decide what the screen draws.\n\nimport type { ResourceGrant } from \"@idosgames/core\";\nimport { costLines, grantLines, type ResourceLine } from \"@idosgames/react/ui\";\n\n// ── Configuration (the fields this screen reads) ─────────────────────────────────────────────\n\nexport interface CoopObjectView {\n  Index?: number | null;\n  DisplayName?: string | null;\n  AssetPaths?: Record<string, string> | null;\n  MaxProgress?: number | null;\n  CompletionReward?: ResourceGrant | null;\n}\n\nexport interface CoopEventView {\n  CoopEventID?: string | null;\n  DisplayName?: string | null;\n  Description?: string | null;\n  PartnerCount?: number | null;\n  BuildObjects?: {\n    Objects?: CoopObjectView[] | null;\n    PriceOptions?: Record<\n      string,\n      { OptionID?: string | null; Cost?: unknown } | null\n    > | null;\n    MaxSpinsPerCall?: number | null;\n  } | null;\n  GrandPrize?: ResourceGrant | null;\n}\n\n/** The title's CoopEvent section, as far as the screen cares. */\nexport interface CoopSection {\n  Chains?: Record<\n    string,\n    {\n      CoopChainID?: string | null;\n      DisplayName?: string | null;\n      Events?: CoopEventView[] | null;\n    } | null\n  > | null;\n}\n\n/** The group's shared document (as the server returns it). */\nexport interface GroupView {\n  GroupID?: string | null;\n  CoopChainID?: string | null;\n  CoopEventID?: string | null;\n  Status?: string | null;\n  ExpiresAtUtc?: string | null;\n  Members?: Array<{\n    UserID?: string | null;\n    PublicData?: { Username?: string | null } | null;\n    IsBot?: boolean | null;\n    MemberStatus?: string | null;\n    GrandPrizeClaimed?: boolean | null;\n    BuildObjectsProgress?: {\n      ObjectIndex?: number | null;\n      ObjectCompletionRewardClaimed?: boolean | null;\n    } | null;\n  } | null> | null;\n  BuildObjectsState?: {\n    Objects?: Array<{\n      Index?: number | null;\n      OwnerUserID?: string | null;\n      CurrentProgress?: number | null;\n      MaxProgress?: number | null;\n      IsCompleted?: boolean | null;\n    } | null> | null;\n  } | null;\n}\n\n// ── Chains ───────────────────────────────────────────────────────────────────────────────────\n\n/** Chain ids of the title (each runs its own schedule of team events). */\nexport function chainIDs(section: CoopSection | null | undefined): string[] {\n  return Object.entries(section?.Chains ?? {})\n    .filter(([, c]) => c)\n    .map(([id, c]) => c!.CoopChainID || id)\n    .sort();\n}\n\n/** The event definition the group plays (by its CoopEventID across the chains). */\nexport function eventOf(\n  section: CoopSection | null | undefined,\n  group: GroupView | null | undefined,\n): CoopEventView | null {\n  for (const c of Object.values(section?.Chains ?? {}))\n    for (const e of c?.Events ?? [])\n      if (e?.CoopEventID && e.CoopEventID === group?.CoopEventID) return e;\n  return null;\n}\n\n// ── The group ────────────────────────────────────────────────────────────────────────────────\n\nexport interface MemberRow {\n  userID: string;\n  name: string;\n  me: boolean;\n  bot: boolean;\n  left: boolean;\n  objectName: string;\n  progress: number;\n  max: number;\n  done: boolean;\n}\n\nexport interface GroupRows {\n  members: MemberRow[];\n  /** The player's own object (null — not in this group). */\n  mine: MemberRow | null;\n  /** The player's object is complete and its reward is not taken yet. */\n  objectRewardReady: boolean;\n  objectReward: ResourceLine[];\n  /** The whole group is done and the player has not taken the grand prize. */\n  grandPrizeReady: boolean;\n  grandPrize: ResourceLine[];\n  /** Waiting for partners — the server matches the group. */\n  forming: boolean;\n  /** The event is over for the group (done, failed or expired). */\n  finished: boolean;\n}\n\n/** The group as the screen draws it: every member with their object's progress. */\nexport function groupRows(\n  group: GroupView | null | undefined,\n  event: CoopEventView | null | undefined,\n  myUserID: string | null | undefined,\n): GroupRows {\n  const objects = group?.BuildObjectsState?.Objects ?? [];\n  const defs = event?.BuildObjects?.Objects ?? [];\n  const members: MemberRow[] = (group?.Members ?? [])\n    .filter((m): m is NonNullable<typeof m> => !!m?.UserID)\n    .map((m) => {\n      const index = Number(m.BuildObjectsProgress?.ObjectIndex ?? -1);\n      const obj =\n        objects.find((o) => o?.OwnerUserID === m.UserID) ??\n        objects.find((o) => Number(o?.Index) === index);\n      const def = defs.find((d) => Number(d?.Index) === Number(obj?.Index));\n      const max = Math.max(\n        1,\n        Number(obj?.MaxProgress ?? def?.MaxProgress ?? 1),\n      );\n      return {\n        userID: m.UserID!,\n        name: m.PublicData?.Username || m.UserID!,\n        me: m.UserID === myUserID,\n        bot: m.IsBot === true,\n        left: !!m.MemberStatus && m.MemberStatus !== \"Active\",\n        objectName: def?.DisplayName || `#${Number(obj?.Index ?? index) + 1}`,\n        progress: Math.min(max, Number(obj?.CurrentProgress ?? 0)),\n        max,\n        done: obj?.IsCompleted === true,\n      };\n    });\n  const mine = members.find((m) => m.me) ?? null;\n  const meRaw = (group?.Members ?? []).find((m) => m?.UserID === myUserID);\n  const myObj = objects.find((o) => o?.OwnerUserID === myUserID);\n  const myDef = defs.find((d) => Number(d?.Index) === Number(myObj?.Index));\n  const status = group?.Status ?? \"\";\n  return {\n    members,\n    mine,\n    objectRewardReady:\n      !!mine?.done &&\n      meRaw?.BuildObjectsProgress?.ObjectCompletionRewardClaimed !== true &&\n      grantLines(myDef?.CompletionReward).length > 0,\n    objectReward: grantLines(myDef?.CompletionReward),\n    grandPrizeReady:\n      status === \"Completed\" &&\n      !!meRaw &&\n      meRaw.GrandPrizeClaimed !== true &&\n      grantLines(event?.GrandPrize).length > 0,\n    grandPrize: grantLines(event?.GrandPrize),\n    forming: status === \"Forming\",\n    finished: [\"Completed\", \"Failed\", \"Expired\"].includes(status),\n  };\n}\n\n/** Ways to pay for a spin (currencies/items); empty — spins are free. */\nexport function spinPrices(\n  event: CoopEventView | null | undefined,\n): Array<{ id: string | null; price: ResourceLine[] }> {\n  const options = Object.entries(event?.BuildObjects?.PriceOptions ?? {})\n    .filter(([, o]) => o)\n    .map(([oid, o]) => ({\n      id: o?.OptionID || oid,\n      price: costLines(o?.Cost as never).filter((l) => l.kind !== \"other\"),\n    }));\n  return options.length > 0 ? options : [{ id: null, price: [] }];\n}\n\n/** The bulk spin offered next to a single one: five, when the ceiling allows (platform default 25). */\nexport function bulkSpins(event: CoopEventView | null | undefined): number {\n  const max = Number(event?.BuildObjects?.MaxSpinsPerCall ?? 25);\n  return max >= 5 ? 5 : 0;\n}\n\n/** Badge: the object reward and the grand prize waiting. */\nexport function coopBadge(rows: GroupRows): number {\n  return (rows.objectRewardReady ? 1 : 0) + (rows.grandPrizeReady ? 1 : 0);\n}\n\n/** Whether the title has team events — until it does, the lobby hides the tab. */\nexport function hasTitleData(section: CoopSection | undefined): boolean {\n  return chainIDs(section).length > 0;\n}\n"
+    },
+    {
+      "path": "module.ts",
+      "content": "import { defineModule, type Module } from \"@idosgames/module-sdk\";\nimport { configSection } from \"@idosgames/react/ui\";\nimport {\n  createCoopStore,\n  makeCoopEventsScreen,\n  makeCoopWatcher,\n} from \"./CoopEventsScreen\";\nimport { hasTitleData, type CoopSection } from \"./model\";\nimport { t } from \"./i18n\";\n\n// Team events as a feature of the game. The watcher reads the player's group once on start and\n// keeps the badge (object reward and team prize waiting) — only on a title with team events.\nexport const coopEventsModule: Module = defineModule({\n  id: \"coop-events\",\n  meta: { name: \"Team event\", type: \"app\", engine: \"dom\" },\n  setup(ctx) {\n    const store = createCoopStore(ctx.features);\n    ctx.features.register({\n      id: \"coop-events\",\n      label: t(\"title\"),\n      icon: \"friends\",\n      group: \"events\",\n      order: 28,\n      available: false,\n      Screen: makeCoopEventsScreen(store),\n    });\n    const enabled = hasTitleData(\n      configSection<CoopSection>(ctx.client, \"CoopEvent\"),\n    );\n    ctx.features.setAvailable(\n      \"coop-events\",\n      enabled,\n      \"no team events on the title (CoopEvent chains)\",\n    );\n    if (enabled)\n      ctx.registerPanel({\n        id: \"badge\",\n        slot: \"modal\",\n        activeOnly: false,\n        component: makeCoopWatcher(store),\n      });\n    ctx.exposeToAgent({\n      state: () => ({\n        ui: \"dom\",\n        feature: \"coop-events\",\n        group: store.get()?.GroupID ?? null,\n      }),\n      describeActions: {},\n    });\n  },\n});\n"
+    },
+    {
+      "path": "module.meta.json",
+      "content": "{\n  \"id\": \"coop-events\",\n  \"type\": \"feature\",\n  \"summary\": \"Team events for any game: join a group, each member spins the wheel to build their own object, the team shares a grand prize.\",\n  \"description\": \"A ready team event screen (engine CoopEvent) for ANY game, built on the @idosgames/react/ui kit and client.coopEvent. Not in a group: the running team events of the title with their timers and team prize, 'Join a team' (the server matches partners, helpers fill the gaps). In a group: every member with their object and its progress, 'Spin' (once or five at a time, free or for currency) to build your own object, the object's reward when it is done, the team prize when every object is done, and leaving the team. The group lives in one shared document on the server — the screen re-reads it after every action. Registers the 'coop-events' feature; its badge counts the object reward and the team prize waiting. Ships title-seed.json: a weekly team build event.\",\n  \"provides\": [\n    \"team event screen\",\n    \"join a team (matchmaking by the server)\",\n    \"spin to build your object\",\n    \"object reward and team prize\",\n    \"badge for rewards waiting\"\n  ],\n  \"tags\": [\"coop\", \"team\", \"group\", \"events\", \"social\", \"ui\", \"screen\"],\n  \"author\": {\n    \"name\": \"iDos Games\",\n    \"url\": \"https://idosgames.com\"\n  },\n  \"version\": \"0.1.0\"\n}\n"
+    }
+  ]
+}

package/registry/modules/craft.json

@@ -7,7 +7,6 @@
   },
   "catalog": {
     "type": "feature",
-    "inBase": true,
     "summary": "Craft screen for any game: trade-up recipes by rarity or collection, a contract of owned items, auto-fill, price options and the result popup.",
     "description": "A ready craft screen (Unity Alikhan/Craft) for ANY game, built on the @idosgames/react/ui kit and client.craft. The screen lists the title's recipes as cards, lowest rarity first: what goes in (N items of a rarity or a collection) and what can come out. A recipe opens as a popup — the contract: the fitting items the player owns (worn equipment does not count), tap to add, 'Auto' fills from the most plentiful, the price options, and 'Craft'. The server rolls the result (only items with a roll Weight > 0 are promised) and the reward popup shows it flying into the inventory. 'Not enough coins' offers to open the shop (ctx.features.open('store')). Registers the 'craft' feature; its badge counts recipes the player can run now. Ships title-seed.json: 3 Common → Rare for coins and 3 Rare → Legendary for gems.",
     "provides": [
@@ -36,12 +35,12 @@
     "version": "0.1.0"
   },
   "dependencies": {
-    "@idosgames/core": "0.19.0",
-    "@idosgames/module-sdk": "0.6.0",
+    "@idosgames/core": "0.19.1",
+    "@idosgames/module-sdk": "0.7.0",
     "@idosgames/react": "0.3.0",
     "react": "19.2.7"
   },
-  "contentHash": "771cc072c7bf80a5f8c6822836ed3c4198d4572aa5bc7bea663add134d5e79ee",
+  "contentHash": "552ef22ea9a8d06c8306a72caa5dc8b86165a197c6a7fa7cb41a4fb39bf55df5",
   "files": [
     {
       "path": "CraftScreen.tsx",
@@ -65,7 +64,7 @@
     },
     {
       "path": "module.meta.json",
-      "content": "{\n  \"id\": \"craft\",\n  \"type\": \"feature\",\n  \"inBase\": true,\n  \"summary\": \"Craft screen for any game: trade-up recipes by rarity or collection, a contract of owned items, auto-fill, price options and the result popup.\",\n  \"description\": \"A ready craft screen (Unity Alikhan/Craft) for ANY game, built on the @idosgames/react/ui kit and client.craft. The screen lists the title's recipes as cards, lowest rarity first: what goes in (N items of a rarity or a collection) and what can come out. A recipe opens as a popup — the contract: the fitting items the player owns (worn equipment does not count), tap to add, 'Auto' fills from the most plentiful, the price options, and 'Craft'. The server rolls the result (only items with a roll Weight > 0 are promised) and the reward popup shows it flying into the inventory. 'Not enough coins' offers to open the shop (ctx.features.open('store')). Registers the 'craft' feature; its badge counts recipes the player can run now. Ships title-seed.json: 3 Common → Rare for coins and 3 Rare → Legendary for gems.\",\n  \"provides\": [\n    \"craft screen from the title's recipes\",\n    \"trade-up by rarity or collection\",\n    \"contract popup with owned items\",\n    \"auto-fill of the contract\",\n    \"price options\",\n    \"craft result with reward animation\",\n    \"craft badge for runnable recipes\",\n    \"demo recipes\"\n  ],\n  \"tags\": [\"craft\", \"crafting\", \"trade-up\", \"items\", \"ui\", \"screen\", \"economy\"],\n  \"author\": {\n    \"name\": \"iDos Games\",\n    \"url\": \"https://idosgames.com\"\n  },\n  \"version\": \"0.1.0\"\n}\n"
+      "content": "{\n  \"id\": \"craft\",\n  \"type\": \"feature\",\n  \"summary\": \"Craft screen for any game: trade-up recipes by rarity or collection, a contract of owned items, auto-fill, price options and the result popup.\",\n  \"description\": \"A ready craft screen (Unity Alikhan/Craft) for ANY game, built on the @idosgames/react/ui kit and client.craft. The screen lists the title's recipes as cards, lowest rarity first: what goes in (N items of a rarity or a collection) and what can come out. A recipe opens as a popup — the contract: the fitting items the player owns (worn equipment does not count), tap to add, 'Auto' fills from the most plentiful, the price options, and 'Craft'. The server rolls the result (only items with a roll Weight > 0 are promised) and the reward popup shows it flying into the inventory. 'Not enough coins' offers to open the shop (ctx.features.open('store')). Registers the 'craft' feature; its badge counts recipes the player can run now. Ships title-seed.json: 3 Common → Rare for coins and 3 Rare → Legendary for gems.\",\n  \"provides\": [\n    \"craft screen from the title's recipes\",\n    \"trade-up by rarity or collection\",\n    \"contract popup with owned items\",\n    \"auto-fill of the contract\",\n    \"price options\",\n    \"craft result with reward animation\",\n    \"craft badge for runnable recipes\",\n    \"demo recipes\"\n  ],\n  \"tags\": [\"craft\", \"crafting\", \"trade-up\", \"items\", \"ui\", \"screen\", \"economy\"],\n  \"author\": {\n    \"name\": \"iDos Games\",\n    \"url\": \"https://idosgames.com\"\n  },\n  \"version\": \"0.1.0\"\n}\n"
     }
   ]
 }

package/registry/modules/deals.json

@@ -7,7 +7,6 @@
   },
   "catalog": {
     "type": "feature",
-    "inBase": true,
     "summary": "Special offers for any game: a new deal pops up by itself; single offers, step chains and pick-one gifts with a milestone bar.",
     "description": "Special offers (Unity Alikhan/DealOffer) for ANY game, built on the @idosgames/react/ui kit and client.dealOffer. An always-on watcher pops a newly started deal up by itself once (and records the impression with recordShow); the 'Offers' screen lists every active deal with its timer and everything it can give. A deal opens as a popup shaped by its node graph: one big offer, a chain of steps (each unlocks the next, the server decides status), or cards to pick one from; free steps, currency prices, store-only steps and the milestone bar with its rewards. Registers the 'deals' feature; its badge counts free steps and milestone rewards waiting. Ships title-seed.json: a three-step starter pack with a bonus and a free pick-one welcome gift.",
     "provides": [
@@ -35,12 +34,12 @@
     "version": "0.1.0"
   },
   "dependencies": {
-    "@idosgames/core": "0.19.0",
-    "@idosgames/module-sdk": "0.6.0",
+    "@idosgames/core": "0.19.1",
+    "@idosgames/module-sdk": "0.7.0",
     "@idosgames/react": "0.3.0",
     "react": "19.2.7"
   },
-  "contentHash": "cc3d5ab811dc1299d64a4bcd4361d097ce776fcfd20949ddac015271111beed0",
+  "contentHash": "f4633cc8068e4679f7321ca9353fd633271d877e8e003b73c237a7dcfb5f7e71",
   "files": [
     {
       "path": "DealsScreen.tsx",
@@ -64,7 +63,7 @@
     },
     {
       "path": "module.meta.json",
-      "content": "{\n  \"id\": \"deals\",\n  \"type\": \"feature\",\n  \"inBase\": true,\n  \"summary\": \"Special offers for any game: a new deal pops up by itself; single offers, step chains and pick-one gifts with a milestone bar.\",\n  \"description\": \"Special offers (Unity Alikhan/DealOffer) for ANY game, built on the @idosgames/react/ui kit and client.dealOffer. An always-on watcher pops a newly started deal up by itself once (and records the impression with recordShow); the 'Offers' screen lists every active deal with its timer and everything it can give. A deal opens as a popup shaped by its node graph: one big offer, a chain of steps (each unlocks the next, the server decides status), or cards to pick one from; free steps, currency prices, store-only steps and the milestone bar with its rewards. Registers the 'deals' feature; its badge counts free steps and milestone rewards waiting. Ships title-seed.json: a three-step starter pack with a bonus and a free pick-one welcome gift.\",\n  \"provides\": [\n    \"special offers screen\",\n    \"auto-popup of a new deal\",\n    \"single, chain and pick-one offers\",\n    \"offer milestones\",\n    \"deals badge\",\n    \"demo offers\"\n  ],\n  \"tags\": [\n    \"offers\",\n    \"deals\",\n    \"starter-pack\",\n    \"monetization\",\n    \"popup\",\n    \"ui\",\n    \"screen\",\n    \"economy\"\n  ],\n  \"author\": {\n    \"name\": \"iDos Games\",\n    \"url\": \"https://idosgames.com\"\n  },\n  \"version\": \"0.1.0\"\n}\n"
+      "content": "{\n  \"id\": \"deals\",\n  \"type\": \"feature\",\n  \"summary\": \"Special offers for any game: a new deal pops up by itself; single offers, step chains and pick-one gifts with a milestone bar.\",\n  \"description\": \"Special offers (Unity Alikhan/DealOffer) for ANY game, built on the @idosgames/react/ui kit and client.dealOffer. An always-on watcher pops a newly started deal up by itself once (and records the impression with recordShow); the 'Offers' screen lists every active deal with its timer and everything it can give. A deal opens as a popup shaped by its node graph: one big offer, a chain of steps (each unlocks the next, the server decides status), or cards to pick one from; free steps, currency prices, store-only steps and the milestone bar with its rewards. Registers the 'deals' feature; its badge counts free steps and milestone rewards waiting. Ships title-seed.json: a three-step starter pack with a bonus and a free pick-one welcome gift.\",\n  \"provides\": [\n    \"special offers screen\",\n    \"auto-popup of a new deal\",\n    \"single, chain and pick-one offers\",\n    \"offer milestones\",\n    \"deals badge\",\n    \"demo offers\"\n  ],\n  \"tags\": [\n    \"offers\",\n    \"deals\",\n    \"starter-pack\",\n    \"monetization\",\n    \"popup\",\n    \"ui\",\n    \"screen\",\n    \"economy\"\n  ],\n  \"author\": {\n    \"name\": \"iDos Games\",\n    \"url\": \"https://idosgames.com\"\n  },\n  \"version\": \"0.1.0\"\n}\n"
     }
   ]
 }

package/registry/modules/events.json

@@ -7,9 +7,8 @@
   },
   "catalog": {
     "type": "feature",
-    "inBase": true,
     "summary": "Limited-time events for any game: event tabs with a timer, a token bar, a milestone track, claim all and a VIP second prize.",
-    "description": "A ready events screen (Unity Core/Window LimitedTimeEvent) for ANY game, built on the @idosgames/react/ui kit and client.timedEvent. Every active event the server resolves (scheduled, cyclic or chained) is a tab: its name and timer, the token bar toward the next prize and the milestone track in threshold order. A milestone pays its reward and, when the reward has premium tiers, a VIP second prize; a pass bought later tops up the milestones already claimed. 'Claim all' takes everything waiting in one call. How the tokens are earned (the event's token sources with their daily caps) and the VIP pass (its benefits and prices in currencies) are popups. Registers the 'events' feature; its badge counts milestones and VIP top-ups waiting. Tokens come from the game: a round of play is a CustomAction the game grants with client.timedEvent.grantTokens (the mini-game module does it for every active event that lists the action). Ships title-seed.json: a weekly 'Star festival' with five milestones and a VIP prize on each.",
+    "description": "A ready events screen (Unity Core/Window LimitedTimeEvent) for ANY game, built on the @idosgames/react/ui kit and client.timedEvent. Every active event the server resolves (scheduled, cyclic or chained) is a tab: its name and timer, the token bar toward the next prize and the milestone track in threshold order. A milestone pays its reward and, when the reward has premium tiers, a VIP second prize; a pass bought later tops up the milestones already claimed. 'Claim all' takes everything waiting in one call. How the tokens are earned (the event's token sources with their daily caps) is a popup; 'Get VIP' opens the VIP system (ctx.features.open('premium', { premiumID })) and shows only when it is installed and has a pass. Registers the 'events' feature; its badge counts milestones and VIP top-ups waiting. Tokens come from the game: a round of play is a CustomAction the game grants with client.timedEvent.grantTokens (the mini-game module does it for every active event that lists the action). Ships title-seed.json: a weekly 'Star festival' with five milestones and a VIP prize on each.",
     "provides": [
       "events screen with a tab per active event",
       "event timer and token progress bar",
@@ -17,7 +16,7 @@
       "VIP second prize and top-up after purchase",
       "claim all milestones",
       "how-to-earn popup with daily caps",
-      "VIP pass purchase popup",
+      "hand-off to the VIP system",
       "events badge",
       "demo weekly event"
     ],
@@ -38,20 +37,20 @@
     "version": "0.1.0"
   },
   "dependencies": {
-    "@idosgames/core": "0.19.0",
-    "@idosgames/module-sdk": "0.6.0",
+    "@idosgames/core": "0.19.1",
+    "@idosgames/module-sdk": "0.7.0",
     "@idosgames/react": "0.3.0",
     "react": "19.2.7"
   },
-  "contentHash": "4f8a725287979ac38c7332be0b9085920b08ca774914bf7c00bce6dcaa0cc9dc",
+  "contentHash": "a45709a4e04f56860341a73b92f49d71d6c44a10d2be944d001680d3e8c43af9",
   "files": [
     {
       "path": "EventsScreen.tsx",
-      "content": "import {\n  useEffect,\n  useRef,\n  useState,\n  useSyncExternalStore,\n  type CSSProperties,\n  type ReactNode,\n} from \"react\";\nimport type { ActiveEventInfo, IDosGamesClient } from \"@idosgames/core\";\nimport type {\n  FeatureRegistry,\n  FeatureScreenProps,\n} from \"@idosgames/module-sdk\";\nimport { useIDosGamesClient, useUserState } from \"@idosgames/react\";\nimport {\n  Button,\n  Card,\n  Center,\n  EmptyState,\n  Icon,\n  Popup,\n  ProgressBar,\n  ResourceList,\n  Spinner,\n  Tabs,\n  Timer,\n  errorText,\n  formatAmount,\n  grantedBy,\n  outlined,\n  panel,\n  useCatalog,\n  useCelebrate,\n  useNow,\n  useStagger,\n  useToast,\n  useUiKit,\n  v,\n} from \"@idosgames/react/ui\";\nimport {\n  claimableNow,\n  claimedLines,\n  eventsBadge,\n  hasPremium,\n  milestoneRows,\n  nextGoal,\n  premiumIDsOf,\n  tokenSources,\n  type MilestoneRow,\n  type PremiumView,\n} from \"./model\";\nimport { VipPopup } from \"./VipPopup\";\nimport { t } from \"./i18n\";\n\n// Limited-time events (Unity Core/Window LimitedTimeEvent): each active event is a tab — its timer,\n// the token bar toward the next prize and the milestone track. A milestone pays its reward and, for\n// a VIP, a second prize; a VIP bought later tops up the milestones already claimed. How the tokens\n// are earned and the VIP pass are popups.\n\n/** Active events, shared by the screen and the badge watcher (one request for both). */\nexport function createEventsStore(features: FeatureRegistry) {\n  let events: ActiveEventInfo[] | null = null;\n  const listeners = new Set<() => void>();\n  let premium: () => PremiumView | null | undefined = () => null;\n  const badge = () =>\n    features.setBadge(\n      \"events\",\n      events ? eventsBadge(events, premium(), Date.now()) : 0,\n    );\n  return {\n    get: () => events,\n    subscribe: (l: () => void) => {\n      listeners.add(l);\n      return () => listeners.delete(l);\n    },\n    async load(client: IDosGamesClient): Promise<void> {\n      premium = () =>\n        client.data.user.state?.Premium as PremiumView | undefined;\n      const res = await client.timedEvent.getActiveEvents();\n      events = res.ok ? (res.data.ActiveEvents ?? []) : [];\n      badge();\n      for (const l of listeners) l();\n    },\n    refreshBadge: badge,\n  };\n}\nexport type EventsStore = ReturnType<typeof createEventsStore>;\n\nexport function makeEventsScreen(store: EventsStore) {\n  return function EventsScreen(_: FeatureScreenProps): ReactNode {\n    const client = useIDosGamesClient();\n    const events = useSyncExternalStore(store.subscribe, store.get, store.get);\n    const catalog = useCatalog();\n    const [tab, setTab] = useState<string | null>(null);\n    useEffect(() => {\n      void store.load(client);\n    }, [client]);\n    if (!events)\n      return (\n        <Center>\n          <Spinner />\n        </Center>\n      );\n    if (events.length === 0)\n      return <EmptyState glyph=\"flame\" text={t(\"noEvents\")} />;\n    const current = events.find((e) => e.TimedEventID === tab) ?? events[0]!;\n    return (\n      <div\n        style={{\n          display: \"grid\",\n          gridTemplateColumns: \"minmax(0, 1fr)\",\n          gap: 12,\n        }}\n      >\n        <Tabs\n          tabs={events.map((e) => ({\n            id: e.TimedEventID!,\n            label: catalog.localize(e.Content?.DisplayName ?? e.TimedEventID),\n          }))}\n          value={current.TimedEventID!}\n          onChange={setTab}\n        />\n        <EventView key={current.TimedEventID} event={current} store={store} />\n      </div>\n    );\n  };\n}\n\n/** Keeps the badge current: loads the events once, then every few minutes and on premium changes. */\nexport function makeEventsWatcher(store: EventsStore) {\n  return function EventsWatcher(): ReactNode {\n    const client = useIDosGamesClient();\n    const state = useUserState();\n    useEffect(() => {\n      void store.load(client);\n      const id = setInterval(() => void store.load(client), 5 * 60_000);\n      return () => clearInterval(id);\n    }, [client]);\n    useEffect(() => store.refreshBadge(), [state?.Premium]);\n    return null;\n  };\n}\n\nfunction EventView({\n  event,\n  store,\n}: {\n  event: ActiveEventInfo;\n  store: EventsStore;\n}): ReactNode {\n  const client = useIDosGamesClient();\n  const state = useUserState();\n  const catalog = useCatalog();\n  const celebrate = useCelebrate();\n  const toast = useToast();\n  const now = useNow();\n  const stagger = useStagger();\n  const [sources, setSources] = useState(false);\n  const [vip, setVip] = useState<string | null>(null);\n  const [busyAll, setBusyAll] = useState(false);\n  const premium = state?.Premium as PremiumView | undefined;\n  const rows = milestoneRows(event, premium, now);\n  const goal = nextGoal(event, rows);\n  const token = catalog.localize(event.Content?.Token?.DisplayName ?? \"\");\n  const vipIDs = premiumIDsOf(\n    Object.values(event.Content?.Milestones ?? {}).map((m) => m?.Rewards),\n  );\n  const vipID = vipIDs[0] ?? null;\n  const vipHeld = vipID ? hasPremium(premium, vipID, 1, now) : false;\n  const ready = rows.filter(claimableNow);\n\n  const claimAll = async () => {\n    setBusyAll(true);\n    const res = await client.timedEvent.claimAllMilestones();\n    setBusyAll(false);\n    if (!res.ok) return toast(errorText(res.error), \"error\");\n    const got = claimedLines(res.data) ?? grantedBy(res.data);\n    celebrate(\n      got.length > 0\n        ? got\n        : ready.flatMap((r) => [\n            ...(r.state === \"ready\" ? r.reward : []),\n            ...(r.vipState === \"ready\" ? r.vip : []),\n          ]),\n    );\n    await store.load(client);\n  };\n\n  return (\n    <div style={{ display: \"grid\", gap: 12 }}>\n      <Card\n        style={{\n          display: \"grid\",\n          gap: 10,\n          background: \"linear-gradient(180deg, #e0672b 0%, #8a2c1a 100%)\",\n        }}\n      >\n        <div style={{ display: \"flex\", alignItems: \"center\", gap: 10 }}>\n          <div className=\"idos-bounce\">\n            <Icon\n              glyph={event.Content?.AssetPaths?.icon ?? \"flame\"}\n              size={46}\n            />\n          </div>\n          <div style={{ flex: 1, minWidth: 0 }}>\n            <div style={{ ...outlined, fontSize: 18 }}>\n              {catalog.localize(\n                event.Content?.DisplayName ?? event.TimedEventID,\n              )}\n            </div>\n            <Timer at={event.ComputedEndUtc} now={now} label={t(\"endsIn\")} />\n          </div>\n          <Button size=\"sm\" tone=\"blue\" onClick={() => setSources(true)}>\n            {t(\"howToEarn\")}\n          </Button>\n        </div>\n        {event.Content?.Description ? (\n          <div\n            style={{\n              ...outlined,\n              fontSize: 13,\n              fontWeight: 600,\n              color: \"rgba(255,255,255,.85)\",\n            }}\n          >\n            {catalog.localize(event.Content.Description)}\n          </div>\n        ) : null}\n        <div style={{ display: \"grid\", gap: 4 }}>\n          <div\n            style={{\n              display: \"flex\",\n              justifyContent: \"space-between\",\n              ...outlined,\n              fontSize: 13,\n            }}\n          >\n            <span\n              style={{ display: \"inline-flex\", alignItems: \"center\", gap: 4 }}\n            >\n              <Icon glyph=\"star\" size={16} /> {formatAmount(goal.earned)}{\" \"}\n              {token}\n            </span>\n            <span>\n              {goal.earned >= goal.goal\n                ? t(\"allDone\")\n                : `${t(\"nextPrize\")} ${formatAmount(goal.goal)}`}\n            </span>\n          </div>\n          <ProgressBar\n            value={Math.min(goal.earned, goal.goal)}\n            max={Math.max(1, goal.goal)}\n            tone=\"gold\"\n          />\n        </div>\n      </Card>\n\n      {vipID ? (\n        vipHeld ? (\n          <div\n            style={{\n              ...panel,\n              padding: 10,\n              display: \"flex\",\n              alignItems: \"center\",\n              gap: 8,\n              ...outlined,\n              fontSize: 13,\n              color: v.gold,\n            }}\n          >\n            <Icon glyph=\"crown\" size={22} /> {t(\"vipActive\")}\n          </div>\n        ) : (\n          <Card\n            onClick={() => setVip(vipID)}\n            style={{\n              display: \"flex\",\n              alignItems: \"center\",\n              gap: 10,\n              padding: 10,\n              border: `2px solid ${v.gold}`,\n            }}\n          >\n            <Icon glyph=\"crown\" size={30} />\n            <div style={{ flex: 1, minWidth: 0, ...outlined, fontSize: 13 }}>\n              {t(\"vipBenefit\")}\n            </div>\n            <Button size=\"sm\" tone=\"gold\" attract>\n              {t(\"getVip\")}\n            </Button>\n          </Card>\n        )\n      ) : null}\n\n      {ready.length > 1 ? (\n        <Button\n          tone=\"green\"\n          attract\n          busy={busyAll}\n          onClick={() => void claimAll()}\n          data-tutorial-anchor=\"events:claim-all\"\n        >\n          {t(\"claimAll\")} · {ready.length}\n        </Button>\n      ) : null}\n\n      <div style={{ display: \"grid\", gap: 8 }}>\n        {rows.map((row, i) => (\n          <MilestoneCard\n            key={row.id}\n            event={event}\n            row={row}\n            index={i}\n            earned={goal.earned}\n            store={store}\n            style={stagger(i)}\n          />\n        ))}\n      </div>\n\n      {sources ? (\n        <SourcesPopup event={event} onClose={() => setSources(false)} />\n      ) : null}\n      {vip ? <VipPopup premiumID={vip} onClose={() => setVip(null)} /> : null}\n    </div>\n  );\n}\n\nfunction MilestoneCard({\n  event,\n  row,\n  index,\n  earned,\n  store,\n  style,\n}: {\n  event: ActiveEventInfo;\n  row: MilestoneRow;\n  index: number;\n  earned: number;\n  store: EventsStore;\n  style: CSSProperties;\n}): ReactNode {\n  const client = useIDosGamesClient();\n  const catalog = useCatalog();\n  const celebrate = useCelebrate();\n  const toast = useToast();\n  const kit = useUiKit();\n  const ref = useRef<HTMLDivElement>(null);\n  const [busy, setBusy] = useState(false);\n  const claimable = claimableNow(row);\n\n  const claim = async () => {\n    setBusy(true);\n    const res = await client.timedEvent.claimMilestone(\n      event.Type!,\n      event.TimedEventID!,\n      row.id,\n    );\n    setBusy(false);\n    if (!res.ok) return toast(errorText(res.error), \"error\");\n    kit.play(\"claim\");\n    kit.fx.burst(ref.current);\n    const got = claimedLines(res.data) ?? grantedBy(res.data);\n    celebrate(\n      got.length > 0\n        ? got\n        : [\n            ...(row.state === \"ready\" ? row.reward : []),\n            ...(row.vipState === \"ready\" ? row.vip : []),\n          ],\n    );\n    await store.load(client);\n  };\n\n  const reached = earned >= row.required;\n  return (\n    <div\n      ref={ref}\n      style={{\n        ...panel,\n        padding: 10,\n        display: \"grid\",\n        gridTemplateColumns: \"auto minmax(0, 1fr) auto\",\n        alignItems: \"center\",\n        gap: 10,\n        border: claimable\n          ? `2px solid ${v.gold}`\n          : row.featured\n            ? `2px solid ${v.blue}`\n            : panel.border,\n        opacity: row.state === \"claimed\" && row.vipState !== \"ready\" ? 0.6 : 1,\n        ...style,\n      }}\n    >\n      <div style={{ display: \"grid\", justifyItems: \"center\", minWidth: 48 }}>\n        <Icon glyph={reached ? \"star\" : \"lock\"} size={24} />\n        <span style={{ ...outlined, fontSize: 14 }}>\n          {formatAmount(row.required)}\n        </span>\n      </div>\n      <div style={{ display: \"grid\", gap: 6, minWidth: 0 }}>\n        {row.name ? (\n          <div style={{ ...outlined, fontSize: 13, color: v.textDim }}>\n            {catalog.localize(row.name)}\n          </div>\n        ) : null}\n        <ResourceList lines={row.reward} size={26} />\n        {row.vip.length > 0 ? (\n          <div\n            style={{\n              display: \"flex\",\n              alignItems: \"center\",\n              gap: 6,\n              opacity: row.vipState === \"locked\" ? 0.5 : 1,\n            }}\n          >\n            <Icon glyph=\"crown\" size={18} />\n            <ResourceList lines={row.vip} size={20} />\n            {row.vipState === \"granted\" ? (\n              <Icon glyph=\"check\" size={16} />\n            ) : null}\n          </div>\n        ) : null}\n      </div>\n      <div data-index={index}>\n        {claimable ? (\n          <Button\n            size=\"sm\"\n            tone=\"green\"\n            attract\n            busy={busy}\n            onClick={() => void claim()}\n            data-tutorial-anchor={`events:claim:${row.id}`}\n          >\n            {row.state === \"claimed\" ? t(\"vipTopUp\") : t(\"claim\")}\n          </Button>\n        ) : row.state === \"claimed\" ? (\n          <span\n            style={{\n              display: \"inline-flex\",\n              alignItems: \"center\",\n              gap: 4,\n              ...outlined,\n              fontSize: 12,\n              color: v.green,\n            }}\n          >\n            <Icon glyph=\"check\" size={18} /> {t(\"claimed\")}\n          </span>\n        ) : (\n          <span style={{ ...outlined, fontSize: 12, color: v.textDim }}>\n            {t(\"locked\")}\n          </span>\n        )}\n      </div>\n    </div>\n  );\n}\n\nfunction SourcesPopup({\n  event,\n  onClose,\n}: {\n  event: ActiveEventInfo;\n  onClose: () => void;\n}): ReactNode {\n  const catalog = useCatalog();\n  const token = catalog.localize(event.Content?.Token?.DisplayName ?? \"\");\n  const label = (kind: string) =>\n    kind === \"CustomAction\"\n      ? t(\"playRound\")\n      : kind === \"StorePurchase\"\n        ? t(\"shopping\")\n        : kind === \"QuestComplete\"\n          ? t(\"quests\")\n          : kind === \"DailyLogin\"\n            ? t(\"login\")\n            : t(\"other\");\n  return (\n    <Popup title={t(\"howToEarn\")} onClose={onClose} width={420}>\n      <div style={{ display: \"grid\", gap: 8 }}>\n        {tokenSources(event).map((s, i) => (\n          <div\n            key={i}\n            style={{\n              ...panel,\n              padding: 10,\n              display: \"flex\",\n              alignItems: \"center\",\n              gap: 10,\n            }}\n          >\n            <Icon\n              glyph={\n                s.kind === \"StorePurchase\"\n                  ? \"shop\"\n                  : s.kind === \"QuestComplete\"\n                    ? \"quest\"\n                    : s.kind === \"DailyLogin\"\n                      ? \"calendar\"\n                      : \"star\"\n              }\n              size={26}\n            />\n            <div style={{ flex: 1, minWidth: 0, ...outlined, fontSize: 14 }}>\n              {label(s.kind)}\n            </div>\n            <div\n              style={{\n                textAlign: \"right\",\n                ...outlined,\n                fontSize: 14,\n                color: v.gold,\n              }}\n            >\n              +{formatAmount(s.amount)} {token}\n              {s.dailyCap > 0 ? (\n                <div\n                  style={{ fontSize: 11, color: v.textDim }}\n                >{`≤ ${s.dailyCap} ${t(\"perDay\")}`}</div>\n              ) : null}\n            </div>\n          </div>\n        ))}\n      </div>\n    </Popup>\n  );\n}\n"
+      "content": "import {\n  useEffect,\n  useRef,\n  useState,\n  useSyncExternalStore,\n  type CSSProperties,\n  type ReactNode,\n} from \"react\";\nimport type { ActiveEventInfo, IDosGamesClient } from \"@idosgames/core\";\nimport type {\n  FeatureRegistry,\n  FeatureScreenProps,\n} from \"@idosgames/module-sdk\";\nimport { useIDosGamesClient, useUserState } from \"@idosgames/react\";\nimport {\n  Button,\n  Card,\n  Center,\n  EmptyState,\n  Icon,\n  Popup,\n  ProgressBar,\n  ResourceList,\n  Spinner,\n  Tabs,\n  Timer,\n  errorText,\n  formatAmount,\n  grantedBy,\n  outlined,\n  panel,\n  useCatalog,\n  useCelebrate,\n  useNow,\n  useStagger,\n  useToast,\n  useUiKit,\n  v,\n} from \"@idosgames/react/ui\";\nimport {\n  claimableNow,\n  claimedLines,\n  eventsBadge,\n  hasPremium,\n  milestoneRows,\n  nextGoal,\n  premiumIDsOf,\n  tokenSources,\n  type MilestoneRow,\n  type PremiumView,\n} from \"./model\";\nimport { t } from \"./i18n\";\n\n// Limited-time events (Unity Core/Window LimitedTimeEvent): each active event is a tab — its timer,\n// the token bar toward the next prize and the milestone track. A milestone pays its reward and, for\n// a VIP, a second prize; a VIP bought later tops up the milestones already claimed. How the tokens\n// are earned is a popup; the VIP pass is sold by the VIP system (the premium module).\n\n/** Active events, shared by the screen and the badge watcher (one request for both). */\nexport function createEventsStore(features: FeatureRegistry) {\n  let events: ActiveEventInfo[] | null = null;\n  const listeners = new Set<() => void>();\n  let premium: () => PremiumView | null | undefined = () => null;\n  const badge = () =>\n    features.setBadge(\n      \"events\",\n      events ? eventsBadge(events, premium(), Date.now()) : 0,\n    );\n  return {\n    get: () => events,\n    subscribe: (l: () => void) => {\n      listeners.add(l);\n      return () => listeners.delete(l);\n    },\n    async load(client: IDosGamesClient): Promise<void> {\n      premium = () =>\n        client.data.user.state?.Premium as PremiumView | undefined;\n      const res = await client.timedEvent.getActiveEvents();\n      events = res.ok ? (res.data.ActiveEvents ?? []) : [];\n      badge();\n      for (const l of listeners) l();\n    },\n    refreshBadge: badge,\n    /** The VIP system is installed and has a pass on the title — the VIP prize can be bought. */\n    vipOnSale: () => features.get(\"premium\")?.available === true,\n    openVip: (premiumID: string) => features.open(\"premium\", { premiumID }),\n  };\n}\nexport type EventsStore = ReturnType<typeof createEventsStore>;\n\nexport function makeEventsScreen(store: EventsStore) {\n  return function EventsScreen(_: FeatureScreenProps): ReactNode {\n    const client = useIDosGamesClient();\n    const events = useSyncExternalStore(store.subscribe, store.get, store.get);\n    const catalog = useCatalog();\n    const [tab, setTab] = useState<string | null>(null);\n    useEffect(() => {\n      void store.load(client);\n    }, [client]);\n    if (!events)\n      return (\n        <Center>\n          <Spinner />\n        </Center>\n      );\n    if (events.length === 0)\n      return <EmptyState glyph=\"flame\" text={t(\"noEvents\")} />;\n    const current = events.find((e) => e.TimedEventID === tab) ?? events[0]!;\n    return (\n      <div\n        style={{\n          display: \"grid\",\n          gridTemplateColumns: \"minmax(0, 1fr)\",\n          gap: 12,\n        }}\n      >\n        <Tabs\n          tabs={events.map((e) => ({\n            id: e.TimedEventID!,\n            label: catalog.localize(e.Content?.DisplayName ?? e.TimedEventID),\n          }))}\n          value={current.TimedEventID!}\n          onChange={setTab}\n        />\n        <EventView key={current.TimedEventID} event={current} store={store} />\n      </div>\n    );\n  };\n}\n\n/** Keeps the badge current: loads the events once, then every few minutes and on premium changes. */\nexport function makeEventsWatcher(store: EventsStore) {\n  return function EventsWatcher(): ReactNode {\n    const client = useIDosGamesClient();\n    const state = useUserState();\n    useEffect(() => {\n      void store.load(client);\n      const id = setInterval(() => void store.load(client), 5 * 60_000);\n      return () => clearInterval(id);\n    }, [client]);\n    useEffect(() => store.refreshBadge(), [state?.Premium]);\n    return null;\n  };\n}\n\nfunction EventView({\n  event,\n  store,\n}: {\n  event: ActiveEventInfo;\n  store: EventsStore;\n}): ReactNode {\n  const client = useIDosGamesClient();\n  const state = useUserState();\n  const catalog = useCatalog();\n  const celebrate = useCelebrate();\n  const toast = useToast();\n  const now = useNow();\n  const stagger = useStagger();\n  const [sources, setSources] = useState(false);\n  const [busyAll, setBusyAll] = useState(false);\n  const premium = state?.Premium as PremiumView | undefined;\n  const rows = milestoneRows(event, premium, now);\n  const goal = nextGoal(event, rows);\n  const token = catalog.localize(event.Content?.Token?.DisplayName ?? \"\");\n  const vipIDs = premiumIDsOf(\n    Object.values(event.Content?.Milestones ?? {}).map((m) => m?.Rewards),\n  );\n  const vipID = vipIDs[0] ?? null;\n  const vipHeld = vipID ? hasPremium(premium, vipID, 1, now) : false;\n  const ready = rows.filter(claimableNow);\n\n  const claimAll = async () => {\n    setBusyAll(true);\n    const res = await client.timedEvent.claimAllMilestones();\n    setBusyAll(false);\n    if (!res.ok) return toast(errorText(res.error), \"error\");\n    const got = claimedLines(res.data) ?? grantedBy(res.data);\n    celebrate(\n      got.length > 0\n        ? got\n        : ready.flatMap((r) => [\n            ...(r.state === \"ready\" ? r.reward : []),\n            ...(r.vipState === \"ready\" ? r.vip : []),\n          ]),\n    );\n    await store.load(client);\n  };\n\n  return (\n    <div style={{ display: \"grid\", gap: 12 }}>\n      <Card\n        style={{\n          display: \"grid\",\n          gap: 10,\n          background: \"linear-gradient(180deg, #e0672b 0%, #8a2c1a 100%)\",\n        }}\n      >\n        <div style={{ display: \"flex\", alignItems: \"center\", gap: 10 }}>\n          <div className=\"idos-bounce\">\n            <Icon\n              glyph={event.Content?.AssetPaths?.icon ?? \"flame\"}\n              size={46}\n            />\n          </div>\n          <div style={{ flex: 1, minWidth: 0 }}>\n            <div style={{ ...outlined, fontSize: 18 }}>\n              {catalog.localize(\n                event.Content?.DisplayName ?? event.TimedEventID,\n              )}\n            </div>\n            <Timer at={event.ComputedEndUtc} now={now} label={t(\"endsIn\")} />\n          </div>\n          <Button size=\"sm\" tone=\"blue\" onClick={() => setSources(true)}>\n            {t(\"howToEarn\")}\n          </Button>\n        </div>\n        {event.Content?.Description ? (\n          <div\n            style={{\n              ...outlined,\n              fontSize: 13,\n              fontWeight: 600,\n              color: \"rgba(255,255,255,.85)\",\n            }}\n          >\n            {catalog.localize(event.Content.Description)}\n          </div>\n        ) : null}\n        <div style={{ display: \"grid\", gap: 4 }}>\n          <div\n            style={{\n              display: \"flex\",\n              justifyContent: \"space-between\",\n              ...outlined,\n              fontSize: 13,\n            }}\n          >\n            <span\n              style={{ display: \"inline-flex\", alignItems: \"center\", gap: 4 }}\n            >\n              <Icon glyph=\"star\" size={16} /> {formatAmount(goal.earned)}{\" \"}\n              {token}\n            </span>\n            <span>\n              {goal.earned >= goal.goal\n                ? t(\"allDone\")\n                : `${t(\"nextPrize\")} ${formatAmount(goal.goal)}`}\n            </span>\n          </div>\n          <ProgressBar\n            value={Math.min(goal.earned, goal.goal)}\n            max={Math.max(1, goal.goal)}\n            tone=\"gold\"\n          />\n        </div>\n      </Card>\n\n      {vipID && (vipHeld || store.vipOnSale()) ? (\n        vipHeld ? (\n          <div\n            style={{\n              ...panel,\n              padding: 10,\n              display: \"flex\",\n              alignItems: \"center\",\n              gap: 8,\n              ...outlined,\n              fontSize: 13,\n              color: v.gold,\n            }}\n          >\n            <Icon glyph=\"crown\" size={22} /> {t(\"vipActive\")}\n          </div>\n        ) : (\n          <Card\n            onClick={() => store.openVip(vipID)}\n            style={{\n              display: \"flex\",\n              alignItems: \"center\",\n              gap: 10,\n              padding: 10,\n              border: `2px solid ${v.gold}`,\n            }}\n          >\n            <Icon glyph=\"crown\" size={30} />\n            <div style={{ flex: 1, minWidth: 0, ...outlined, fontSize: 13 }}>\n              {t(\"vipBenefit\")}\n            </div>\n            <Button size=\"sm\" tone=\"gold\" attract>\n              {t(\"getVip\")}\n            </Button>\n          </Card>\n        )\n      ) : null}\n\n      {ready.length > 1 ? (\n        <Button\n          tone=\"green\"\n          attract\n          busy={busyAll}\n          onClick={() => void claimAll()}\n          data-tutorial-anchor=\"events:claim-all\"\n        >\n          {t(\"claimAll\")} · {ready.length}\n        </Button>\n      ) : null}\n\n      <div style={{ display: \"grid\", gap: 8 }}>\n        {rows.map((row, i) => (\n          <MilestoneCard\n            key={row.id}\n            event={event}\n            row={row}\n            index={i}\n            earned={goal.earned}\n            store={store}\n            style={stagger(i)}\n          />\n        ))}\n      </div>\n\n      {sources ? (\n        <SourcesPopup event={event} onClose={() => setSources(false)} />\n      ) : null}\n    </div>\n  );\n}\n\nfunction MilestoneCard({\n  event,\n  row,\n  index,\n  earned,\n  store,\n  style,\n}: {\n  event: ActiveEventInfo;\n  row: MilestoneRow;\n  index: number;\n  earned: number;\n  store: EventsStore;\n  style: CSSProperties;\n}): ReactNode {\n  const client = useIDosGamesClient();\n  const catalog = useCatalog();\n  const celebrate = useCelebrate();\n  const toast = useToast();\n  const kit = useUiKit();\n  const ref = useRef<HTMLDivElement>(null);\n  const [busy, setBusy] = useState(false);\n  const claimable = claimableNow(row);\n\n  const claim = async () => {\n    setBusy(true);\n    const res = await client.timedEvent.claimMilestone(\n      event.Type!,\n      event.TimedEventID!,\n      row.id,\n    );\n    setBusy(false);\n    if (!res.ok) return toast(errorText(res.error), \"error\");\n    kit.play(\"claim\");\n    kit.fx.burst(ref.current);\n    const got = claimedLines(res.data) ?? grantedBy(res.data);\n    celebrate(\n      got.length > 0\n        ? got\n        : [\n            ...(row.state === \"ready\" ? row.reward : []),\n            ...(row.vipState === \"ready\" ? row.vip : []),\n          ],\n    );\n    await store.load(client);\n  };\n\n  const reached = earned >= row.required;\n  return (\n    <div\n      ref={ref}\n      style={{\n        ...panel,\n        padding: 10,\n        display: \"grid\",\n        gridTemplateColumns: \"auto minmax(0, 1fr) auto\",\n        alignItems: \"center\",\n        gap: 10,\n        border: claimable\n          ? `2px solid ${v.gold}`\n          : row.featured\n            ? `2px solid ${v.blue}`\n            : panel.border,\n        opacity: row.state === \"claimed\" && row.vipState !== \"ready\" ? 0.6 : 1,\n        ...style,\n      }}\n    >\n      <div style={{ display: \"grid\", justifyItems: \"center\", minWidth: 48 }}>\n        <Icon glyph={reached ? \"star\" : \"lock\"} size={24} />\n        <span style={{ ...outlined, fontSize: 14 }}>\n          {formatAmount(row.required)}\n        </span>\n      </div>\n      <div style={{ display: \"grid\", gap: 6, minWidth: 0 }}>\n        {row.name ? (\n          <div style={{ ...outlined, fontSize: 13, color: v.textDim }}>\n            {catalog.localize(row.name)}\n          </div>\n        ) : null}\n        <ResourceList lines={row.reward} size={26} />\n        {row.vip.length > 0 ? (\n          <div\n            style={{\n              display: \"flex\",\n              alignItems: \"center\",\n              gap: 6,\n              opacity: row.vipState === \"locked\" ? 0.5 : 1,\n            }}\n          >\n            <Icon glyph=\"crown\" size={18} />\n            <ResourceList lines={row.vip} size={20} />\n            {row.vipState === \"granted\" ? (\n              <Icon glyph=\"check\" size={16} />\n            ) : null}\n          </div>\n        ) : null}\n      </div>\n      <div data-index={index}>\n        {claimable ? (\n          <Button\n            size=\"sm\"\n            tone=\"green\"\n            attract\n            busy={busy}\n            onClick={() => void claim()}\n            data-tutorial-anchor={`events:claim:${row.id}`}\n          >\n            {row.state === \"claimed\" ? t(\"vipTopUp\") : t(\"claim\")}\n          </Button>\n        ) : row.state === \"claimed\" ? (\n          <span\n            style={{\n              display: \"inline-flex\",\n              alignItems: \"center\",\n              gap: 4,\n              ...outlined,\n              fontSize: 12,\n              color: v.green,\n            }}\n          >\n            <Icon glyph=\"check\" size={18} /> {t(\"claimed\")}\n          </span>\n        ) : (\n          <span style={{ ...outlined, fontSize: 12, color: v.textDim }}>\n            {t(\"locked\")}\n          </span>\n        )}\n      </div>\n    </div>\n  );\n}\n\nfunction SourcesPopup({\n  event,\n  onClose,\n}: {\n  event: ActiveEventInfo;\n  onClose: () => void;\n}): ReactNode {\n  const catalog = useCatalog();\n  const token = catalog.localize(event.Content?.Token?.DisplayName ?? \"\");\n  const label = (kind: string) =>\n    kind === \"CustomAction\"\n      ? t(\"playRound\")\n      : kind === \"StorePurchase\"\n        ? t(\"shopping\")\n        : kind === \"QuestComplete\"\n          ? t(\"quests\")\n          : kind === \"DailyLogin\"\n            ? t(\"login\")\n            : t(\"other\");\n  return (\n    <Popup title={t(\"howToEarn\")} onClose={onClose} width={420}>\n      <div style={{ display: \"grid\", gap: 8 }}>\n        {tokenSources(event).map((s, i) => (\n          <div\n            key={i}\n            style={{\n              ...panel,\n              padding: 10,\n              display: \"flex\",\n              alignItems: \"center\",\n              gap: 10,\n            }}\n          >\n            <Icon\n              glyph={\n                s.kind === \"StorePurchase\"\n                  ? \"shop\"\n                  : s.kind === \"QuestComplete\"\n                    ? \"quest\"\n                    : s.kind === \"DailyLogin\"\n                      ? \"calendar\"\n                      : \"star\"\n              }\n              size={26}\n            />\n            <div style={{ flex: 1, minWidth: 0, ...outlined, fontSize: 14 }}>\n              {label(s.kind)}\n            </div>\n            <div\n              style={{\n                textAlign: \"right\",\n                ...outlined,\n                fontSize: 14,\n                color: v.gold,\n              }}\n            >\n              +{formatAmount(s.amount)} {token}\n              {s.dailyCap > 0 ? (\n                <div\n                  style={{ fontSize: 11, color: v.textDim }}\n                >{`≤ ${s.dailyCap} ${t(\"perDay\")}`}</div>\n              ) : null}\n            </div>\n          </div>\n        ))}\n      </div>\n    </Popup>\n  );\n}\n"
     },
     {
       "path": "i18n.ts",
-      "content": "import { makeT } from \"@idosgames/react/ui\";\n\nconst EN = {\n  title: \"Events\",\n  noEvents: \"No events right now — check back soon.\",\n  endsIn: \"Ends in\",\n  claim: \"Claim\",\n  claimAll: \"Claim all\",\n  claimed: \"Claimed\",\n  locked: \"Locked\",\n  vip: \"VIP\",\n  vipPrize: \"VIP prize\",\n  vipTopUp: \"Claim VIP\",\n  getVip: \"Get VIP\",\n  vipActive: \"VIP active\",\n  vipUntil: \"until\",\n  vipBenefit:\n    \"A second prize on every milestone — also for the ones you already claimed.\",\n  buy: \"Buy\",\n  howToEarn: \"How to earn\",\n  playRound: \"Play a round\",\n  perDay: \"per day\",\n  shopping: \"Buy in the shop\",\n  quests: \"Finish a quest\",\n  login: \"Log in\",\n  other: \"Other activity\",\n  nextPrize: \"Next prize at\",\n  allDone: \"All prizes collected!\",\n  days: \"days\",\n} as const;\n\nexport const t = makeT<keyof typeof EN>(EN, {\n  title: \"Ивенты\",\n  noEvents: \"Сейчас ивентов нет — загляните позже.\",\n  endsIn: \"До конца\",\n  claim: \"Забрать\",\n  claimAll: \"Забрать всё\",\n  claimed: \"Получено\",\n  locked: \"Закрыто\",\n  vip: \"VIP\",\n  vipPrize: \"Приз VIP\",\n  vipTopUp: \"Забрать VIP\",\n  getVip: \"Купить VIP\",\n  vipActive: \"VIP активен\",\n  vipUntil: \"до\",\n  vipBenefit: \"Второй приз на каждой вехе — и на тех, что вы уже забрали.\",\n  buy: \"Купить\",\n  howToEarn: \"Как получить\",\n  playRound: \"Сыграйте раунд\",\n  perDay: \"в день\",\n  shopping: \"Покупка в магазине\",\n  quests: \"Выполненное задание\",\n  login: \"Вход в игру\",\n  other: \"Другие действия\",\n  nextPrize: \"Следующий приз на\",\n  allDone: \"Все призы собраны!\",\n  days: \"дн.\",\n});\n"
+      "content": "import { makeT } from \"@idosgames/react/ui\";\n\nconst EN = {\n  title: \"Events\",\n  noEvents: \"No events right now — check back soon.\",\n  endsIn: \"Ends in\",\n  claim: \"Claim\",\n  claimAll: \"Claim all\",\n  claimed: \"Claimed\",\n  locked: \"Locked\",\n  vipPrize: \"VIP prize\",\n  vipTopUp: \"Claim VIP\",\n  getVip: \"Get VIP\",\n  vipActive: \"VIP active\",\n  vipUntil: \"until\",\n  vipBenefit:\n    \"A second prize on every milestone — also for the ones you already claimed.\",\n  howToEarn: \"How to earn\",\n  playRound: \"Play a round\",\n  perDay: \"per day\",\n  shopping: \"Buy in the shop\",\n  quests: \"Finish a quest\",\n  login: \"Log in\",\n  other: \"Other activity\",\n  nextPrize: \"Next prize at\",\n  allDone: \"All prizes collected!\",\n} as const;\n\nexport const t = makeT<keyof typeof EN>(EN, {\n  title: \"Ивенты\",\n  noEvents: \"Сейчас ивентов нет — загляните позже.\",\n  endsIn: \"До конца\",\n  claim: \"Забрать\",\n  claimAll: \"Забрать всё\",\n  claimed: \"Получено\",\n  locked: \"Закрыто\",\n  vipPrize: \"Приз VIP\",\n  vipTopUp: \"Забрать VIP\",\n  getVip: \"Купить VIP\",\n  vipActive: \"VIP активен\",\n  vipUntil: \"до\",\n  vipBenefit: \"Второй приз на каждой вехе — и на тех, что вы уже забрали.\",\n  howToEarn: \"Как получить\",\n  playRound: \"Сыграйте раунд\",\n  perDay: \"в день\",\n  shopping: \"Покупка в магазине\",\n  quests: \"Выполненное задание\",\n  login: \"Вход в игру\",\n  other: \"Другие действия\",\n  nextPrize: \"Следующий приз на\",\n  allDone: \"Все призы собраны!\",\n});\n"
     },
     {
       "path": "index.ts",
@@ -65,13 +64,9 @@
       "path": "module.ts",
       "content": "import { defineModule, type Module } from \"@idosgames/module-sdk\";\nimport {\n  createEventsStore,\n  makeEventsScreen,\n  makeEventsWatcher,\n} from \"./EventsScreen\";\nimport { t } from \"./i18n\";\n\n// Limited-time events as a feature of the game. The always-on watcher keeps the badge current\n// (milestones and VIP top-ups waiting); the screen shows every active event as a tab.\nexport const eventsModule: Module = defineModule({\n  id: \"events\",\n  meta: { name: \"Events\", type: \"app\", engine: \"dom\" },\n  setup(ctx) {\n    const store = createEventsStore(ctx.features);\n    ctx.features.register({\n      id: \"events\",\n      label: t(\"title\"),\n      icon: \"flame\",\n      group: \"events\",\n      order: 25,\n      available: false,\n      Screen: makeEventsScreen(store),\n    });\n    // The tab shows while an event is running — the watcher loads them at start.\n    store.subscribe(() =>\n      ctx.features.setAvailable(\n        \"events\",\n        (store.get()?.length ?? 0) > 0,\n        \"no active event right now (TimedEvent)\",\n      ),\n    );\n    ctx.registerPanel({\n      id: \"badge\",\n      slot: \"modal\",\n      activeOnly: false,\n      component: makeEventsWatcher(store),\n    });\n    ctx.exposeToAgent({\n      state: () => ({\n        ui: \"dom\",\n        feature: \"events\",\n        active: store.get()?.map((e) => e.TimedEventID) ?? [],\n      }),\n      describeActions: {},\n    });\n  },\n});\n"
     },
-    {
-      "path": "VipPopup.tsx",
-      "content": "import { useEffect, useState, type ReactNode } from \"react\";\nimport { useIDosGamesClient, useUserState } from \"@idosgames/react\";\nimport {\n  Button,\n  Center,\n  Icon,\n  Popup,\n  ResourceList,\n  Spinner,\n  canAfford,\n  costLines,\n  errorText,\n  outlined,\n  panel,\n  usePopupClose,\n  useToast,\n  useUiKit,\n  v,\n} from \"@idosgames/react/ui\";\nimport { t } from \"./i18n\";\n\n// The VIP pass (Unity PremiumPopUp): what it gives and a price option to buy it with currencies.\n// A pass paid in a store (real money) is not sold here — that is the platform's checkout.\n\n/** The part of a premium definition (config section Premium) the popup reads. */\ntype PremiumDefinition = {\n  PremiumID?: string | null;\n  DisplayName?: string | null;\n  DurationDays?: number | null;\n  Benefits?: Record<string, string> | null;\n  PriceOptions?: Record<\n    string,\n    { OptionID?: string | null; Cost?: unknown } | null\n  > | null;\n};\n\nexport function VipPopup({\n  premiumID,\n  onClose,\n}: {\n  premiumID: string;\n  onClose: () => void;\n}): ReactNode {\n  const client = useIDosGamesClient();\n  const [def, setDef] = useState<PremiumDefinition | null | undefined>(\n    undefined,\n  );\n  useEffect(() => {\n    void client.premium\n      .getDefinitions()\n      .then((res) =>\n        setDef(\n          res.ok\n            ? ((res.data.Premium?.Definitions?.[premiumID] as\n                PremiumDefinition | undefined) ?? null)\n            : null,\n        ),\n      );\n  }, [client, premiumID]);\n  return (\n    <Popup\n      title={def?.DisplayName ?? t(\"vip\")}\n      onClose={onClose}\n      width={420}\n      variant=\"center\"\n    >\n      {def === undefined ? (\n        <Center minHeight={120}>\n          <Spinner />\n        </Center>\n      ) : def === null ? (\n        <div\n          style={{\n            ...outlined,\n            fontSize: 14,\n            textAlign: \"center\",\n            color: v.textDim,\n          }}\n        >\n          —\n        </div>\n      ) : (\n        <VipOffer def={def} />\n      )}\n    </Popup>\n  );\n}\n\nfunction VipOffer({ def }: { def: PremiumDefinition }): ReactNode {\n  const client = useIDosGamesClient();\n  const state = useUserState();\n  const toast = useToast();\n  const kit = useUiKit();\n  const close = usePopupClose();\n  const [busy, setBusy] = useState<string | null>(null);\n  const balances = state?.InventoryV2?.VirtualCurrencies as\n    Record<string, { Amount?: number }> | undefined;\n  const options = Object.entries(def.PriceOptions ?? {})\n    .filter(([, o]) => o)\n    .map(([id, o]) => ({\n      id: o?.OptionID || id,\n      price: costLines(o?.Cost as never).filter((l) => l.kind !== \"other\"),\n    }))\n    .filter((o) => o.price.length > 0);\n\n  const buy = async (optionID: string) => {\n    setBusy(optionID);\n    const res = await client.premium.purchaseItemOrCurrency(\n      def.PremiumID!,\n      crypto.randomUUID(),\n      optionID,\n    );\n    setBusy(null);\n    if (!res.ok) return toast(errorText(res.error), \"error\");\n    kit.play(\"purchase\");\n    toast(t(\"vipActive\"), \"success\");\n    close();\n  };\n\n  return (\n    <div style={{ display: \"grid\", gap: 12, justifyItems: \"center\" }}>\n      <div className=\"idos-bounce\">\n        <Icon glyph=\"crown\" size={64} />\n      </div>\n      <div style={{ ...outlined, fontSize: 14, textAlign: \"center\" }}>\n        {t(\"vipBenefit\")}\n      </div>\n      {Object.values(def.Benefits ?? {}).length > 0 ? (\n        <div style={{ display: \"grid\", gap: 4, width: \"100%\" }}>\n          {Object.values(def.Benefits ?? {}).map((b, i) => (\n            <div\n              key={i}\n              style={{\n                ...panel,\n                padding: 8,\n                display: \"flex\",\n                gap: 8,\n                alignItems: \"center\",\n                ...outlined,\n                fontSize: 13,\n              }}\n            >\n              <Icon glyph=\"check\" size={18} /> {b}\n            </div>\n          ))}\n        </div>\n      ) : null}\n      {Number(def.DurationDays ?? 0) > 0 ? (\n        <div style={{ ...outlined, fontSize: 13, color: v.textDim }}>\n          {def.DurationDays} {t(\"days\")}\n        </div>\n      ) : null}\n      <div style={{ display: \"grid\", gap: 8, width: \"100%\" }}>\n        {options.map((o) => {\n          const affordable = canAfford(o.price, balances);\n          return (\n            <Button\n              key={o.id}\n              tone=\"gold\"\n              attract={affordable}\n              disabled={!affordable}\n              busy={busy === o.id}\n              onClick={() => void buy(o.id)}\n              data-tutorial-anchor=\"vip:buy\"\n            >\n              {t(\"buy\")}{\" \"}\n              <ResourceList\n                lines={o.price}\n                size={18}\n                dimIf={() => !affordable}\n              />\n            </Button>\n          );\n        })}\n      </div>\n    </div>\n  );\n}\n"
-    },
     {
       "path": "module.meta.json",
-      "content": "{\n  \"id\": \"events\",\n  \"type\": \"feature\",\n  \"inBase\": true,\n  \"summary\": \"Limited-time events for any game: event tabs with a timer, a token bar, a milestone track, claim all and a VIP second prize.\",\n  \"description\": \"A ready events screen (Unity Core/Window LimitedTimeEvent) for ANY game, built on the @idosgames/react/ui kit and client.timedEvent. Every active event the server resolves (scheduled, cyclic or chained) is a tab: its name and timer, the token bar toward the next prize and the milestone track in threshold order. A milestone pays its reward and, when the reward has premium tiers, a VIP second prize; a pass bought later tops up the milestones already claimed. 'Claim all' takes everything waiting in one call. How the tokens are earned (the event's token sources with their daily caps) and the VIP pass (its benefits and prices in currencies) are popups. Registers the 'events' feature; its badge counts milestones and VIP top-ups waiting. Tokens come from the game: a round of play is a CustomAction the game grants with client.timedEvent.grantTokens (the mini-game module does it for every active event that lists the action). Ships title-seed.json: a weekly 'Star festival' with five milestones and a VIP prize on each.\",\n  \"provides\": [\n    \"events screen with a tab per active event\",\n    \"event timer and token progress bar\",\n    \"milestone track with rewards\",\n    \"VIP second prize and top-up after purchase\",\n    \"claim all milestones\",\n    \"how-to-earn popup with daily caps\",\n    \"VIP pass purchase popup\",\n    \"events badge\",\n    \"demo weekly event\"\n  ],\n  \"tags\": [\n    \"events\",\n    \"live-ops\",\n    \"limited-time\",\n    \"milestones\",\n    \"battle-pass\",\n    \"vip\",\n    \"ui\",\n    \"screen\"\n  ],\n  \"author\": {\n    \"name\": \"iDos Games\",\n    \"url\": \"https://idosgames.com\"\n  },\n  \"version\": \"0.1.0\"\n}\n"
+      "content": "{\n  \"id\": \"events\",\n  \"type\": \"feature\",\n  \"summary\": \"Limited-time events for any game: event tabs with a timer, a token bar, a milestone track, claim all and a VIP second prize.\",\n  \"description\": \"A ready events screen (Unity Core/Window LimitedTimeEvent) for ANY game, built on the @idosgames/react/ui kit and client.timedEvent. Every active event the server resolves (scheduled, cyclic or chained) is a tab: its name and timer, the token bar toward the next prize and the milestone track in threshold order. A milestone pays its reward and, when the reward has premium tiers, a VIP second prize; a pass bought later tops up the milestones already claimed. 'Claim all' takes everything waiting in one call. How the tokens are earned (the event's token sources with their daily caps) is a popup; 'Get VIP' opens the VIP system (ctx.features.open('premium', { premiumID })) and shows only when it is installed and has a pass. Registers the 'events' feature; its badge counts milestones and VIP top-ups waiting. Tokens come from the game: a round of play is a CustomAction the game grants with client.timedEvent.grantTokens (the mini-game module does it for every active event that lists the action). Ships title-seed.json: a weekly 'Star festival' with five milestones and a VIP prize on each.\",\n  \"provides\": [\n    \"events screen with a tab per active event\",\n    \"event timer and token progress bar\",\n    \"milestone track with rewards\",\n    \"VIP second prize and top-up after purchase\",\n    \"claim all milestones\",\n    \"how-to-earn popup with daily caps\",\n    \"hand-off to the VIP system\",\n    \"events badge\",\n    \"demo weekly event\"\n  ],\n  \"tags\": [\n    \"events\",\n    \"live-ops\",\n    \"limited-time\",\n    \"milestones\",\n    \"battle-pass\",\n    \"vip\",\n    \"ui\",\n    \"screen\"\n  ],\n  \"author\": {\n    \"name\": \"iDos Games\",\n    \"url\": \"https://idosgames.com\"\n  },\n  \"version\": \"0.1.0\"\n}\n"
     }
   ]
 }

package/registry/modules/friends.json

@@ -35,20 +35,20 @@
     "version": "0.1.0"
   },
   "dependencies": {
-    "@idosgames/core": "0.19.0",
-    "@idosgames/module-sdk": "0.6.0",
+    "@idosgames/core": "0.19.1",
+    "@idosgames/module-sdk": "0.7.0",
     "@idosgames/react": "0.3.0",
     "react": "19.2.7"
   },
-  "contentHash": "a7ff6c415397f9e9f406bffa2b8f26da60ab46a1ebdb0d7b0155c3fe843dc862",
+  "contentHash": "24e30cf8e6717be3fa368830a3b5fdee5a5b8f823a890051274ef1900e570bc9",
   "files": [
     {
       "path": "FriendsScreen.tsx",
-      "content": "import { useCallback, useEffect, useState, type ReactNode } from \"react\";\nimport type {\n  FeatureRegistry,\n  FeatureScreenProps,\n} from \"@idosgames/module-sdk\";\nimport { useIDosGamesClient, useUserState } from \"@idosgames/react\";\nimport {\n  Button,\n  Center,\n  ConfirmPopup,\n  EmptyState,\n  Icon,\n  Popup,\n  Spinner,\n  Tabs,\n  errorText,\n  formatAmount,\n  outlined,\n  panel,\n  useStagger,\n  useToast,\n  useUiKit,\n  v,\n} from \"@idosgames/react/ui\";\nimport {\n  actorsText,\n  canRemove,\n  cleanUserID,\n  displayName,\n  friendsBadge,\n  inboxKind,\n  initial,\n  sortByName,\n  type InboxKind,\n  type ProfileView,\n} from \"./model\";\nimport { t } from \"./i18n\";\n\n// Friends (Unity Runtime/UI/Friends): the friends list, requests (incoming and sent), suggestions\n// and the notification inbox as tabs. A player card, adding by ID and the confirmations are popups.\n// In \"friends from idosgames.com only\" mode the requests, suggestions and \"Add\" disappear.\n\ntype Tab = \"friends\" | \"requests\" | \"suggested\" | \"inbox\";\ntype InboxItem = {\n  Id: string;\n  Verb?: string | null;\n  Count?: number | null;\n  LastActors?: Array<{ DisplayName?: string | null } | null> | null;\n  Payload?: { Title?: string | null } | null;\n  OccurredAt?: string | null;\n};\n\n/** Keeps the badge: incoming requests (sent with the player state) + unread notifications. */\nexport function makeFriendsWatcher(features: FeatureRegistry) {\n  return function FriendsWatcher(): ReactNode {\n    const client = useIDosGamesClient();\n    const state = useUserState();\n    const [unread, setUnread] = useState(0);\n    useEffect(() => {\n      const load = () =>\n        void client.social\n          .getInboxUnread()\n          .then((r) => r.ok && setUnread(Number(r.data.UnreadCount ?? 0)));\n      load();\n      const id = setInterval(load, 5 * 60_000);\n      const off = client.on(\"social:inboxBadge\", (r) =>\n        setUnread(Number(r.UnreadCount ?? 0)),\n      );\n      return () => {\n        clearInterval(id);\n        off();\n      };\n    }, [client]);\n    useEffect(\n      () =>\n        features.setBadge(\n          \"friends\",\n          friendsBadge(\n            state?.Social as { IncomingCount?: number } | undefined,\n            unread,\n          ),\n        ),\n      [state?.Social, unread],\n    );\n    return null;\n  };\n}\n\nexport function makeFriendsScreen(features: FeatureRegistry) {\n  return function FriendsScreen(_: FeatureScreenProps): ReactNode {\n    const client = useIDosGamesClient();\n    const state = useUserState();\n    const [tab, setTab] = useState<Tab>(\"friends\");\n    const [adding, setAdding] = useState(false);\n    const [card, setCard] = useState<ProfileView | null>(null);\n    const [version, setVersion] = useState(0);\n    const requestsAllowed = client.social.friendRequestsAllowed();\n    const incoming = Number(\n      (state?.Social as { IncomingCount?: number } | undefined)\n        ?.IncomingCount ?? 0,\n    );\n    const refresh = () => setVersion((n) => n + 1);\n    const tabs: Array<{ id: Tab; label: string; badge?: number }> = [\n      { id: \"friends\", label: t(\"friends\") },\n      ...(requestsAllowed\n        ? [\n            { id: \"requests\" as const, label: t(\"requests\"), badge: incoming },\n            { id: \"suggested\" as const, label: t(\"suggested\") },\n          ]\n        : []),\n      { id: \"inbox\", label: t(\"inbox\") },\n    ];\n    return (\n      <div\n        style={{\n          display: \"grid\",\n          gridTemplateColumns: \"minmax(0, 1fr)\",\n          gap: 12,\n        }}\n      >\n        <MyID />\n        <div style={{ display: \"flex\", gap: 10, alignItems: \"center\" }}>\n          <div style={{ flex: 1, minWidth: 0 }}>\n            <Tabs tabs={tabs} value={tab} onChange={setTab} />\n          </div>\n          {requestsAllowed ? (\n            <Button\n              tone=\"gold\"\n              size=\"sm\"\n              onClick={() => setAdding(true)}\n              data-tutorial-anchor=\"friends:add\"\n            >\n              <Icon glyph=\"plus\" size={16} /> {t(\"add\")}\n            </Button>\n          ) : null}\n        </div>\n        <div key={`${tab}:${version}`}>\n          {tab === \"friends\" ? <FriendList onPick={setCard} /> : null}\n          {tab === \"requests\" ? (\n            <Requests onChange={refresh} onPick={setCard} />\n          ) : null}\n          {tab === \"suggested\" ? <Suggested onPick={setCard} /> : null}\n          {tab === \"inbox\" ? <Inbox /> : null}\n        </div>\n        {adding ? (\n          <AddFriendPopup onClose={() => setAdding(false)} onSent={refresh} />\n        ) : null}\n        {card ? (\n          <PlayerCard\n            player={card}\n            features={features}\n            onClose={() => setCard(null)}\n            onChange={refresh}\n          />\n        ) : null}\n      </div>\n    );\n  };\n}\n\nfunction MyID(): ReactNode {\n  const client = useIDosGamesClient();\n  const toast = useToast();\n  const id = client.auth.context?.userID ?? \"\";\n  const copy = () =>\n    void navigator.clipboard?.writeText(id).then(() => toast(t(\"copied\")));\n  return (\n    <div\n      style={{\n        ...panel,\n        padding: 10,\n        display: \"flex\",\n        alignItems: \"center\",\n        gap: 8,\n      }}\n    >\n      <span style={{ ...outlined, fontSize: 12, color: v.textDim }}>\n        {t(\"yourID\")}\n      </span>\n      <span\n        style={{\n          flex: 1,\n          minWidth: 0,\n          overflow: \"hidden\",\n          textOverflow: \"ellipsis\",\n          whiteSpace: \"nowrap\",\n          fontFamily: \"monospace\",\n          fontSize: 13,\n        }}\n      >\n        {id}\n      </span>\n      <Button size=\"sm\" tone=\"blue\" onClick={copy}>\n        <Icon glyph=\"copy\" size={16} />\n      </Button>\n    </div>\n  );\n}\n\nfunction Avatar({\n  player,\n  size = 44,\n}: {\n  player: ProfileView;\n  size?: number;\n}): ReactNode {\n  const url = player.PublicData?.AvatarUrl;\n  return (\n    <div\n      style={{\n        width: size,\n        height: size,\n        flex: \"0 0 auto\",\n        borderRadius: \"50%\",\n        overflow: \"hidden\",\n        display: \"grid\",\n        placeItems: \"center\",\n        background: `linear-gradient(180deg, ${v.blue}, ${v.blueDeep})`,\n        border: \"2px solid rgba(255,255,255,.6)\",\n        ...outlined,\n        fontSize: size * 0.42,\n      }}\n    >\n      {url ? (\n        <img\n          src={url}\n          alt=\"\"\n          style={{ width: \"100%\", height: \"100%\", objectFit: \"cover\" }}\n        />\n      ) : (\n        initial(player)\n      )}\n    </div>\n  );\n}\n\nfunction PlayerRow({\n  player,\n  index,\n  onPick,\n  right,\n}: {\n  player: ProfileView;\n  index: number;\n  onPick?: (p: ProfileView) => void;\n  right?: ReactNode;\n}): ReactNode {\n  const stagger = useStagger();\n  return (\n    <div\n      onClick={onPick ? () => onPick(player) : undefined}\n      style={{\n        ...panel,\n        padding: 10,\n        display: \"flex\",\n        alignItems: \"center\",\n        gap: 10,\n        cursor: onPick ? \"pointer\" : undefined,\n        ...stagger(index),\n      }}\n    >\n      <Avatar player={player} />\n      <div style={{ flex: 1, minWidth: 0 }}>\n        <div\n          style={{\n            ...outlined,\n            fontSize: 15,\n            overflow: \"hidden\",\n            textOverflow: \"ellipsis\",\n            whiteSpace: \"nowrap\",\n          }}\n        >\n          {displayName(player)}\n        </div>\n        <div style={{ ...outlined, fontSize: 12, color: v.textDim }}>\n          {player.PublicData?.Level\n            ? `${t(\"level\")} ${player.PublicData.Level}`\n            : \"\"}\n          {player.PublicData?.Power\n            ? ` · ${t(\"power\")} ${formatAmount(player.PublicData.Power)}`\n            : \"\"}\n          {player.Source === \"Platform\" ? ` · ${t(\"platformFriend\")}` : \"\"}\n        </div>\n      </div>\n      {right}\n    </div>\n  );\n}\n\nfunction useList(\n  load: () => Promise<{\n    ok: boolean;\n    data?: { Friends?: ProfileView[] | null };\n  }>,\n): ProfileView[] | null {\n  const [list, setList] = useState<ProfileView[] | null>(null);\n  useEffect(() => {\n    void load().then((r) =>\n      setList(r.ok ? sortByName(r.data?.Friends ?? []) : []),\n    );\n  }, [load]);\n  return list;\n}\n\nfunction FriendList({\n  onPick,\n}: {\n  onPick: (p: ProfileView) => void;\n}): ReactNode {\n  const client = useIDosGamesClient();\n  const list = useList(\n    useCallback(() => client.social.getFriendsList(), [client]),\n  );\n  if (!list)\n    return (\n      <Center>\n        <Spinner />\n      </Center>\n    );\n  if (list.length === 0)\n    return <EmptyState glyph=\"friends\" text={t(\"noFriends\")} />;\n  return (\n    <div style={{ display: \"grid\", gap: 8 }}>\n      {list.map((p, i) => (\n        <PlayerRow key={p.UserID} player={p} index={i} onPick={onPick} />\n      ))}\n    </div>\n  );\n}\n\nfunction Requests({\n  onChange,\n  onPick,\n}: {\n  onChange: () => void;\n  onPick: (p: ProfileView) => void;\n}): ReactNode {\n  const client = useIDosGamesClient();\n  const toast = useToast();\n  const kit = useUiKit();\n  const incoming = useList(\n    useCallback(() => client.social.getIncomingRequests(), [client]),\n  );\n  const outgoing = useList(\n    useCallback(() => client.social.getOutgoingRequests(), [client]),\n  );\n  const [busy, setBusy] = useState<string | null>(null);\n  if (!incoming || !outgoing)\n    return (\n      <Center>\n        <Spinner />\n      </Center>\n    );\n  if (incoming.length === 0 && outgoing.length === 0)\n    return <EmptyState glyph=\"friends\" text={t(\"noRequests\")} />;\n  const answer = async (id: string, yes: boolean) => {\n    setBusy(id);\n    const res = yes\n      ? await client.social.acceptFriendRequest(id)\n      : await client.social.declineFriendRequest(id);\n    setBusy(null);\n    if (!res.ok) return toast(errorText(res.error), \"error\");\n    if (yes) kit.play(\"claim\");\n    onChange();\n  };\n  return (\n    <div style={{ display: \"grid\", gap: 12 }}>\n      {incoming.length > 0 ? (\n        <div style={{ ...outlined, fontSize: 13, color: v.textDim }}>\n          {t(\"incoming\")}\n        </div>\n      ) : null}\n      {incoming.map((p, i) => (\n        <PlayerRow\n          key={p.UserID}\n          player={p}\n          index={i}\n          onPick={onPick}\n          right={\n            <div\n              style={{ display: \"flex\", gap: 6 }}\n              onClick={(e) => e.stopPropagation()}\n            >\n              <Button\n                size=\"sm\"\n                tone=\"green\"\n                busy={busy === p.UserID}\n                onClick={() => void answer(p.UserID, true)}\n                data-tutorial-anchor=\"friends:accept\"\n              >\n                {t(\"accept\")}\n              </Button>\n              <Button\n                size=\"sm\"\n                tone=\"grey\"\n                disabled={busy === p.UserID}\n                onClick={() => void answer(p.UserID, false)}\n              >\n                ✕\n              </Button>\n            </div>\n          }\n        />\n      ))}\n      {outgoing.length > 0 ? (\n        <div style={{ ...outlined, fontSize: 13, color: v.textDim }}>\n          {t(\"outgoing\")}\n        </div>\n      ) : null}\n      {outgoing.map((p, i) => (\n        <PlayerRow\n          key={p.UserID}\n          player={p}\n          index={incoming.length + i}\n          onPick={onPick}\n          right={<Icon glyph=\"clock\" size={20} />}\n        />\n      ))}\n    </div>\n  );\n}\n\nfunction Suggested({\n  onPick,\n}: {\n  onPick: (p: ProfileView) => void;\n}): ReactNode {\n  const client = useIDosGamesClient();\n  const toast = useToast();\n  const list = useList(\n    useCallback(() => client.social.getRecommendedFriends(10), [client]),\n  );\n  const [sent, setSent] = useState<Set<string>>(new Set());\n  if (!list)\n    return (\n      <Center>\n        <Spinner />\n      </Center>\n    );\n  if (list.length === 0)\n    return <EmptyState glyph=\"friends\" text={t(\"noSuggestions\")} />;\n  const add = async (id: string) => {\n    const res = await client.social.sendFriendRequest(id);\n    if (!res.ok) return toast(errorText(res.error), \"error\");\n    setSent((s) => new Set(s).add(id));\n    toast(t(\"sent\"));\n  };\n  return (\n    <div style={{ display: \"grid\", gap: 8 }}>\n      {list.map((p, i) => (\n        <PlayerRow\n          key={p.UserID}\n          player={p}\n          index={i}\n          onPick={onPick}\n          right={\n            <span onClick={(e) => e.stopPropagation()}>\n              {sent.has(p.UserID) ? (\n                <Icon glyph=\"check\" size={22} />\n              ) : (\n                <Button\n                  size=\"sm\"\n                  tone=\"green\"\n                  onClick={() => void add(p.UserID)}\n                >\n                  {t(\"add\")}\n                </Button>\n              )}\n            </span>\n          }\n        />\n      ))}\n    </div>\n  );\n}\n\nconst VERB_TEXT: Record<InboxKind, Parameters<typeof t>[0]> = {\n  attack: \"vAttack\",\n  raid: \"vRaid\",\n  friend: \"vFriend\",\n  sale: \"vSale\",\n  follow: \"vFollow\",\n  like: \"vLike\",\n  comment: \"vComment\",\n  reply: \"vReply\",\n  other: \"vOther\",\n};\nconst VERB_GLYPH: Record<\n  InboxKind,\n  \"swords\" | \"flame\" | \"friends\" | \"coin\" | \"user\" | \"heart\" | \"chat\"\n> = {\n  attack: \"swords\",\n  raid: \"flame\",\n  friend: \"friends\",\n  sale: \"coin\",\n  follow: \"user\",\n  like: \"heart\",\n  comment: \"chat\",\n  reply: \"chat\",\n  other: \"chat\",\n};\n\nfunction Inbox(): ReactNode {\n  const client = useIDosGamesClient();\n  const stagger = useStagger();\n  const [items, setItems] = useState<InboxItem[] | null>(null);\n  useEffect(() => {\n    void client.social.getInbox({ limit: 30 }).then((r) => {\n      setItems(r.ok ? ((r.data.Items ?? []) as InboxItem[]) : []);\n      // Opening the news marks them seen (once, not per page).\n      if (r.ok) void client.social.markInboxSeen();\n    });\n  }, [client]);\n  if (!items)\n    return (\n      <Center>\n        <Spinner />\n      </Center>\n    );\n  if (items.length === 0)\n    return <EmptyState glyph=\"bell\" text={t(\"noInbox\")} />;\n  return (\n    <div style={{ display: \"grid\", gap: 8 }}>\n      {items.map((it, i) => {\n        const kind = inboxKind(it.Verb);\n        return (\n          <div\n            key={it.Id}\n            style={{\n              ...panel,\n              padding: 10,\n              display: \"flex\",\n              alignItems: \"center\",\n              gap: 10,\n              ...stagger(i),\n            }}\n          >\n            <Icon glyph={VERB_GLYPH[kind]} size={28} />\n            <div style={{ flex: 1, minWidth: 0 }}>\n              <div style={{ ...outlined, fontSize: 14 }}>\n                {actorsText(\n                  it.LastActors,\n                  it.Count,\n                  t(\"someone\"),\n                  t(\"and\"),\n                  t(\"more\"),\n                )}{\" \"}\n                {t(VERB_TEXT[kind])}\n                {it.Payload?.Title ? ` · ${it.Payload.Title}` : \"\"}\n              </div>\n              {it.OccurredAt ? (\n                <div style={{ fontSize: 11, color: v.textDim }}>\n                  {new Date(it.OccurredAt).toLocaleString()}\n                </div>\n              ) : null}\n            </div>\n          </div>\n        );\n      })}\n    </div>\n  );\n}\n\nfunction AddFriendPopup({\n  onClose,\n  onSent,\n}: {\n  onClose: () => void;\n  onSent: () => void;\n}): ReactNode {\n  const client = useIDosGamesClient();\n  const toast = useToast();\n  const kit = useUiKit();\n  const [value, setValue] = useState(\"\");\n  const [busy, setBusy] = useState(false);\n  const id = cleanUserID(value, client.auth.context?.userID);\n  const send = async () => {\n    if (!id) return;\n    setBusy(true);\n    const res = await client.social.sendFriendRequest(id);\n    setBusy(false);\n    if (!res.ok) return toast(errorText(res.error), \"error\");\n    kit.play(\"notify\");\n    toast(t(\"sent\"));\n    onSent();\n    onClose();\n  };\n  return (\n    <Popup title={t(\"addFriend\")} onClose={onClose} width={400}>\n      <div style={{ display: \"grid\", gap: 10 }}>\n        <input\n          value={value}\n          onChange={(e) => setValue(e.target.value)}\n          placeholder={t(\"playerID\")}\n          autoFocus\n          style={{\n            ...panel,\n            padding: \"12px 14px\",\n            fontSize: 15,\n            color: v.text,\n            outline: \"none\",\n            fontFamily: \"monospace\",\n          }}\n          onKeyDown={(e) => e.key === \"Enter\" && void send()}\n        />\n        {value && !id ? (\n          <div style={{ ...outlined, fontSize: 12, color: v.red }}>\n            {t(\"badID\")}\n          </div>\n        ) : null}\n        <Button\n          tone=\"green\"\n          disabled={!id}\n          busy={busy}\n          onClick={() => void send()}\n        >\n          {t(\"send\")}\n        </Button>\n      </div>\n    </Popup>\n  );\n}\n\nfunction PlayerCard({\n  player,\n  features,\n  onClose,\n  onChange,\n}: {\n  player: ProfileView;\n  features: FeatureRegistry;\n  onClose: () => void;\n  onChange: () => void;\n}): ReactNode {\n  const client = useIDosGamesClient();\n  const toast = useToast();\n  const [ask, setAsk] = useState<\"remove\" | \"block\" | null>(null);\n  const hasChat = !!features.get(\"chat\");\n  const isFriend =\n    !!player.Source ||\n    (\n      client.data.user.state?.Social?.Accepted as\n        Array<{ UserID?: string }> | undefined\n    )?.some((f) => f.UserID === player.UserID);\n  return (\n    <Popup title={displayName(player)} onClose={onClose} width={400}>\n      <div style={{ display: \"grid\", justifyItems: \"center\", gap: 8 }}>\n        <Avatar player={player} size={84} />\n        <div\n          style={{\n            ...outlined,\n            fontSize: 13,\n            color: v.textDim,\n            textAlign: \"center\",\n          }}\n        >\n          {player.PublicData?.Level\n            ? `${t(\"level\")} ${player.PublicData.Level}`\n            : \"\"}\n          {player.PublicData?.Power\n            ? ` · ${t(\"power\")} ${formatAmount(player.PublicData.Power)}`\n            : \"\"}\n        </div>\n        <div\n          style={{ fontFamily: \"monospace\", fontSize: 11, color: v.textDim }}\n        >\n          {player.UserID}\n        </div>\n      </div>\n      <div style={{ display: \"grid\", gap: 8 }}>\n        {hasChat && isFriend ? (\n          <Button\n            tone=\"blue\"\n            onClick={() => {\n              // The chat opens in its own window — the card must not stay on top of it.\n              onClose();\n              features.open(\"chat\", { userID: player.UserID });\n            }}\n          >\n            <Icon glyph=\"chat\" size={18} /> {t(\"message\")}\n          </Button>\n        ) : null}\n        {isFriend && canRemove(player) ? (\n          <Button tone=\"grey\" onClick={() => setAsk(\"remove\")}>\n            {t(\"remove\")}\n          </Button>\n        ) : null}\n        <Button tone=\"red\" onClick={() => setAsk(\"block\")}>\n          {t(\"block\")}\n        </Button>\n      </div>\n      {ask ? (\n        <ConfirmPopup\n          title={ask === \"remove\" ? t(\"remove\") : t(\"block\")}\n          tone=\"red\"\n          onClose={() => setAsk(null)}\n          onConfirm={async () => {\n            const res =\n              ask === \"remove\"\n                ? await client.social.removeFriend(player.UserID)\n                : await client.social.block(\"User\", player.UserID);\n            if (!res.ok) {\n              toast(errorText(res.error), \"error\");\n              return false;\n            }\n            if (ask === \"block\") toast(t(\"blocked\"));\n            onChange();\n            onClose();\n          }}\n        >\n          <div style={{ ...outlined, fontSize: 14, textAlign: \"center\" }}>\n            {ask === \"remove\" ? t(\"removeAsk\") : t(\"blockAsk\")}\n          </div>\n        </ConfirmPopup>\n      ) : null}\n    </Popup>\n  );\n}\n"
+      "content": "import { useCallback, useEffect, useState, type ReactNode } from \"react\";\nimport type {\n  FeatureRegistry,\n  FeatureScreenProps,\n} from \"@idosgames/module-sdk\";\nimport { useIDosGamesClient, useUserState } from \"@idosgames/react\";\nimport {\n  Button,\n  Center,\n  ConfirmPopup,\n  EmptyState,\n  Icon,\n  Popup,\n  Spinner,\n  Tabs,\n  errorText,\n  formatAmount,\n  outlined,\n  panel,\n  useStagger,\n  useToast,\n  useUiKit,\n  v,\n} from \"@idosgames/react/ui\";\nimport {\n  actorsText,\n  canRemove,\n  cleanUserID,\n  displayName,\n  friendsBadge,\n  inboxKind,\n  initial,\n  sortByName,\n  type InboxKind,\n  type ProfileView,\n} from \"./model\";\nimport { t } from \"./i18n\";\n\n// Friends (Unity Runtime/UI/Friends): the friends list, requests (incoming and sent), suggestions\n// and the notification inbox as tabs. A player card, adding by ID and the confirmations are popups.\n// In \"friends from idosgames.com only\" mode the requests, suggestions and \"Add\" disappear.\n\ntype Tab = \"friends\" | \"requests\" | \"suggested\" | \"inbox\";\ntype InboxItem = {\n  Id: string;\n  Verb?: string | null;\n  Count?: number | null;\n  LastActors?: Array<{ DisplayName?: string | null } | null> | null;\n  Payload?: { Title?: string | null } | null;\n  OccurredAt?: string | null;\n};\n\n/** Keeps the badge: incoming requests (sent with the player state) + unread notifications. */\nexport function makeFriendsWatcher(features: FeatureRegistry) {\n  return function FriendsWatcher(): ReactNode {\n    const client = useIDosGamesClient();\n    const state = useUserState();\n    const [unread, setUnread] = useState(0);\n    useEffect(() => {\n      const load = () =>\n        void client.social\n          .getInboxUnread()\n          .then((r) => r.ok && setUnread(Number(r.data.UnreadCount ?? 0)));\n      load();\n      const id = setInterval(load, 5 * 60_000);\n      const off = client.on(\"social:inboxBadge\", (r) =>\n        setUnread(Number(r.UnreadCount ?? 0)),\n      );\n      return () => {\n        clearInterval(id);\n        off();\n      };\n    }, [client]);\n    useEffect(\n      () =>\n        features.setBadge(\n          \"friends\",\n          friendsBadge(\n            state?.Social as { IncomingCount?: number } | undefined,\n            unread,\n          ),\n        ),\n      [state?.Social, unread],\n    );\n    return null;\n  };\n}\n\nexport function makeFriendsScreen(features: FeatureRegistry) {\n  return function FriendsScreen(_: FeatureScreenProps): ReactNode {\n    const client = useIDosGamesClient();\n    const state = useUserState();\n    const [tab, setTab] = useState<Tab>(\"friends\");\n    const [adding, setAdding] = useState(false);\n    const [card, setCard] = useState<ProfileView | null>(null);\n    const [version, setVersion] = useState(0);\n    const requestsAllowed = client.social.friendRequestsAllowed();\n    const incoming = Number(\n      (state?.Social as { IncomingCount?: number } | undefined)\n        ?.IncomingCount ?? 0,\n    );\n    const refresh = () => setVersion((n) => n + 1);\n    const tabs: Array<{ id: Tab; label: string; badge?: number }> = [\n      { id: \"friends\", label: t(\"friends\") },\n      ...(requestsAllowed\n        ? [\n            { id: \"requests\" as const, label: t(\"requests\"), badge: incoming },\n            { id: \"suggested\" as const, label: t(\"suggested\") },\n          ]\n        : []),\n      { id: \"inbox\", label: t(\"inbox\") },\n    ];\n    return (\n      <div\n        style={{\n          display: \"grid\",\n          gridTemplateColumns: \"minmax(0, 1fr)\",\n          gap: 12,\n        }}\n      >\n        <MyID />\n        <div style={{ display: \"flex\", gap: 10, alignItems: \"center\" }}>\n          <div style={{ flex: 1, minWidth: 0 }}>\n            <Tabs tabs={tabs} value={tab} onChange={setTab} />\n          </div>\n          {requestsAllowed ? (\n            <Button\n              tone=\"gold\"\n              size=\"sm\"\n              onClick={() => setAdding(true)}\n              data-tutorial-anchor=\"friends:add\"\n            >\n              <Icon glyph=\"plus\" size={16} /> {t(\"add\")}\n            </Button>\n          ) : null}\n        </div>\n        <div key={`${tab}:${version}`}>\n          {tab === \"friends\" ? <FriendList onPick={setCard} /> : null}\n          {tab === \"requests\" ? (\n            <Requests onChange={refresh} onPick={setCard} />\n          ) : null}\n          {tab === \"suggested\" ? <Suggested onPick={setCard} /> : null}\n          {tab === \"inbox\" ? <Inbox /> : null}\n        </div>\n        {adding ? (\n          <AddFriendPopup onClose={() => setAdding(false)} onSent={refresh} />\n        ) : null}\n        {card ? (\n          <PlayerCard\n            player={card}\n            features={features}\n            onClose={() => setCard(null)}\n            onChange={refresh}\n          />\n        ) : null}\n      </div>\n    );\n  };\n}\n\nfunction MyID(): ReactNode {\n  const client = useIDosGamesClient();\n  const toast = useToast();\n  const id = client.auth.context?.userID ?? \"\";\n  const copy = () =>\n    void navigator.clipboard?.writeText(id).then(() => toast(t(\"copied\")));\n  return (\n    <div\n      style={{\n        ...panel,\n        padding: 10,\n        display: \"flex\",\n        alignItems: \"center\",\n        gap: 8,\n      }}\n    >\n      <span style={{ ...outlined, fontSize: 12, color: v.textDim }}>\n        {t(\"yourID\")}\n      </span>\n      <span\n        style={{\n          flex: 1,\n          minWidth: 0,\n          overflow: \"hidden\",\n          textOverflow: \"ellipsis\",\n          whiteSpace: \"nowrap\",\n          fontFamily: \"monospace\",\n          fontSize: 13,\n        }}\n      >\n        {id}\n      </span>\n      <Button size=\"sm\" tone=\"blue\" onClick={copy}>\n        <Icon glyph=\"copy\" size={16} />\n      </Button>\n    </div>\n  );\n}\n\nfunction Avatar({\n  player,\n  size = 44,\n}: {\n  player: ProfileView;\n  size?: number;\n}): ReactNode {\n  const url = player.PublicData?.AvatarUrl;\n  return (\n    <div\n      style={{\n        width: size,\n        height: size,\n        flex: \"0 0 auto\",\n        borderRadius: \"50%\",\n        overflow: \"hidden\",\n        display: \"grid\",\n        placeItems: \"center\",\n        background: `linear-gradient(180deg, ${v.blue}, ${v.blueDeep})`,\n        border: \"2px solid rgba(255,255,255,.6)\",\n        ...outlined,\n        fontSize: size * 0.42,\n      }}\n    >\n      {url ? (\n        <img\n          src={url}\n          alt=\"\"\n          style={{ width: \"100%\", height: \"100%\", objectFit: \"cover\" }}\n        />\n      ) : (\n        initial(player)\n      )}\n    </div>\n  );\n}\n\nfunction PlayerRow({\n  player,\n  index,\n  onPick,\n  right,\n}: {\n  player: ProfileView;\n  index: number;\n  onPick?: (p: ProfileView) => void;\n  right?: ReactNode;\n}): ReactNode {\n  const stagger = useStagger();\n  return (\n    <div\n      onClick={onPick ? () => onPick(player) : undefined}\n      style={{\n        ...panel,\n        padding: 10,\n        display: \"flex\",\n        alignItems: \"center\",\n        gap: 10,\n        cursor: onPick ? \"pointer\" : undefined,\n        ...stagger(index),\n      }}\n    >\n      <Avatar player={player} />\n      <div style={{ flex: 1, minWidth: 0 }}>\n        <div\n          style={{\n            ...outlined,\n            fontSize: 15,\n            overflow: \"hidden\",\n            textOverflow: \"ellipsis\",\n            whiteSpace: \"nowrap\",\n          }}\n        >\n          {displayName(player)}\n        </div>\n        <div style={{ ...outlined, fontSize: 12, color: v.textDim }}>\n          {player.PublicData?.Level\n            ? `${t(\"level\")} ${player.PublicData.Level}`\n            : \"\"}\n          {player.PublicData?.Power\n            ? ` · ${t(\"power\")} ${formatAmount(player.PublicData.Power)}`\n            : \"\"}\n          {player.Source === \"Platform\" ? ` · ${t(\"platformFriend\")}` : \"\"}\n        </div>\n      </div>\n      {right}\n    </div>\n  );\n}\n\nfunction useList(\n  load: () => Promise<{\n    ok: boolean;\n    data?: { Friends?: ProfileView[] | null };\n  }>,\n): ProfileView[] | null {\n  const [list, setList] = useState<ProfileView[] | null>(null);\n  useEffect(() => {\n    void load().then((r) =>\n      setList(r.ok ? sortByName(r.data?.Friends ?? []) : []),\n    );\n  }, [load]);\n  return list;\n}\n\nfunction FriendList({\n  onPick,\n}: {\n  onPick: (p: ProfileView) => void;\n}): ReactNode {\n  const client = useIDosGamesClient();\n  const list = useList(\n    useCallback(() => client.social.getFriendsList(), [client]),\n  );\n  if (!list)\n    return (\n      <Center>\n        <Spinner />\n      </Center>\n    );\n  if (list.length === 0)\n    return <EmptyState glyph=\"friends\" text={t(\"noFriends\")} />;\n  return (\n    <div style={{ display: \"grid\", gap: 8 }}>\n      {list.map((p, i) => (\n        <PlayerRow key={p.UserID} player={p} index={i} onPick={onPick} />\n      ))}\n    </div>\n  );\n}\n\nfunction Requests({\n  onChange,\n  onPick,\n}: {\n  onChange: () => void;\n  onPick: (p: ProfileView) => void;\n}): ReactNode {\n  const client = useIDosGamesClient();\n  const toast = useToast();\n  const kit = useUiKit();\n  const incoming = useList(\n    useCallback(() => client.social.getIncomingRequests(), [client]),\n  );\n  const outgoing = useList(\n    useCallback(() => client.social.getOutgoingRequests(), [client]),\n  );\n  const [busy, setBusy] = useState<string | null>(null);\n  if (!incoming || !outgoing)\n    return (\n      <Center>\n        <Spinner />\n      </Center>\n    );\n  if (incoming.length === 0 && outgoing.length === 0)\n    return <EmptyState glyph=\"friends\" text={t(\"noRequests\")} />;\n  const answer = async (id: string, yes: boolean) => {\n    setBusy(id);\n    const res = yes\n      ? await client.social.acceptFriendRequest(id)\n      : await client.social.declineFriendRequest(id);\n    setBusy(null);\n    if (!res.ok) return toast(errorText(res.error), \"error\");\n    if (yes) kit.play(\"claim\");\n    onChange();\n  };\n  return (\n    <div style={{ display: \"grid\", gap: 12 }}>\n      {incoming.length > 0 ? (\n        <div style={{ ...outlined, fontSize: 13, color: v.textDim }}>\n          {t(\"incoming\")}\n        </div>\n      ) : null}\n      {incoming.map((p, i) => (\n        <PlayerRow\n          key={p.UserID}\n          player={p}\n          index={i}\n          onPick={onPick}\n          right={\n            <div\n              style={{ display: \"flex\", gap: 6 }}\n              onClick={(e) => e.stopPropagation()}\n            >\n              <Button\n                size=\"sm\"\n                tone=\"green\"\n                busy={busy === p.UserID}\n                onClick={() => void answer(p.UserID, true)}\n                data-tutorial-anchor=\"friends:accept\"\n              >\n                {t(\"accept\")}\n              </Button>\n              <Button\n                size=\"sm\"\n                tone=\"grey\"\n                disabled={busy === p.UserID}\n                onClick={() => void answer(p.UserID, false)}\n              >\n                ✕\n              </Button>\n            </div>\n          }\n        />\n      ))}\n      {outgoing.length > 0 ? (\n        <div style={{ ...outlined, fontSize: 13, color: v.textDim }}>\n          {t(\"outgoing\")}\n        </div>\n      ) : null}\n      {outgoing.map((p, i) => (\n        <PlayerRow\n          key={p.UserID}\n          player={p}\n          index={incoming.length + i}\n          onPick={onPick}\n          right={<Icon glyph=\"clock\" size={20} />}\n        />\n      ))}\n    </div>\n  );\n}\n\nfunction Suggested({\n  onPick,\n}: {\n  onPick: (p: ProfileView) => void;\n}): ReactNode {\n  const client = useIDosGamesClient();\n  const toast = useToast();\n  const list = useList(\n    useCallback(() => client.social.getRecommendedFriends(10), [client]),\n  );\n  const [sent, setSent] = useState<Set<string>>(new Set());\n  if (!list)\n    return (\n      <Center>\n        <Spinner />\n      </Center>\n    );\n  if (list.length === 0)\n    return <EmptyState glyph=\"friends\" text={t(\"noSuggestions\")} />;\n  const add = async (id: string) => {\n    const res = await client.social.sendFriendRequest(id);\n    if (!res.ok) return toast(errorText(res.error), \"error\");\n    setSent((s) => new Set(s).add(id));\n    toast(t(\"sent\"));\n  };\n  return (\n    <div style={{ display: \"grid\", gap: 8 }}>\n      {list.map((p, i) => (\n        <PlayerRow\n          key={p.UserID}\n          player={p}\n          index={i}\n          onPick={onPick}\n          right={\n            <span onClick={(e) => e.stopPropagation()}>\n              {sent.has(p.UserID) ? (\n                <Icon glyph=\"check\" size={22} />\n              ) : (\n                <Button\n                  size=\"sm\"\n                  tone=\"green\"\n                  onClick={() => void add(p.UserID)}\n                >\n                  {t(\"add\")}\n                </Button>\n              )}\n            </span>\n          }\n        />\n      ))}\n    </div>\n  );\n}\n\nconst VERB_TEXT: Record<InboxKind, Parameters<typeof t>[0]> = {\n  attack: \"vAttack\",\n  raid: \"vRaid\",\n  friend: \"vFriend\",\n  sale: \"vSale\",\n  follow: \"vFollow\",\n  like: \"vLike\",\n  comment: \"vComment\",\n  reply: \"vReply\",\n  other: \"vOther\",\n};\nconst VERB_GLYPH: Record<\n  InboxKind,\n  \"swords\" | \"flame\" | \"friends\" | \"coin\" | \"user\" | \"heart\" | \"chat\"\n> = {\n  attack: \"swords\",\n  raid: \"flame\",\n  friend: \"friends\",\n  sale: \"coin\",\n  follow: \"user\",\n  like: \"heart\",\n  comment: \"chat\",\n  reply: \"chat\",\n  other: \"chat\",\n};\n\nfunction Inbox(): ReactNode {\n  const client = useIDosGamesClient();\n  const stagger = useStagger();\n  const [items, setItems] = useState<InboxItem[] | null>(null);\n  useEffect(() => {\n    void client.social.getInbox({ limit: 30 }).then((r) => {\n      setItems(r.ok ? ((r.data.Items ?? []) as InboxItem[]) : []);\n      // Opening the news marks them seen (once, not per page).\n      if (r.ok) void client.social.markInboxSeen();\n    });\n  }, [client]);\n  if (!items)\n    return (\n      <Center>\n        <Spinner />\n      </Center>\n    );\n  if (items.length === 0)\n    return <EmptyState glyph=\"bell\" text={t(\"noInbox\")} />;\n  return (\n    <div style={{ display: \"grid\", gap: 8 }}>\n      {items.map((it, i) => {\n        const kind = inboxKind(it.Verb);\n        return (\n          <div\n            key={it.Id}\n            style={{\n              ...panel,\n              padding: 10,\n              display: \"flex\",\n              alignItems: \"center\",\n              gap: 10,\n              ...stagger(i),\n            }}\n          >\n            <Icon glyph={VERB_GLYPH[kind]} size={28} />\n            <div style={{ flex: 1, minWidth: 0 }}>\n              <div style={{ ...outlined, fontSize: 14 }}>\n                {actorsText(\n                  it.LastActors,\n                  it.Count,\n                  t(\"someone\"),\n                  t(\"and\"),\n                  t(\"more\"),\n                )}{\" \"}\n                {t(VERB_TEXT[kind])}\n                {it.Payload?.Title ? ` · ${it.Payload.Title}` : \"\"}\n              </div>\n              {it.OccurredAt ? (\n                <div style={{ fontSize: 11, color: v.textDim }}>\n                  {new Date(it.OccurredAt).toLocaleString()}\n                </div>\n              ) : null}\n            </div>\n          </div>\n        );\n      })}\n    </div>\n  );\n}\n\nfunction AddFriendPopup({\n  onClose,\n  onSent,\n}: {\n  onClose: () => void;\n  onSent: () => void;\n}): ReactNode {\n  const client = useIDosGamesClient();\n  const toast = useToast();\n  const kit = useUiKit();\n  const [value, setValue] = useState(\"\");\n  const [busy, setBusy] = useState(false);\n  const id = cleanUserID(value, client.auth.context?.userID);\n  const send = async () => {\n    if (!id) return;\n    setBusy(true);\n    const res = await client.social.sendFriendRequest(id);\n    setBusy(false);\n    if (!res.ok) return toast(errorText(res.error), \"error\");\n    kit.play(\"notify\");\n    toast(t(\"sent\"));\n    onSent();\n    onClose();\n  };\n  return (\n    <Popup title={t(\"addFriend\")} onClose={onClose} width={400}>\n      <div style={{ display: \"grid\", gap: 10 }}>\n        <input\n          value={value}\n          onChange={(e) => setValue(e.target.value)}\n          placeholder={t(\"playerID\")}\n          autoFocus\n          style={{\n            ...panel,\n            padding: \"12px 14px\",\n            fontSize: 15,\n            color: v.text,\n            outline: \"none\",\n            fontFamily: \"monospace\",\n          }}\n          onKeyDown={(e) => e.key === \"Enter\" && void send()}\n        />\n        {value && !id ? (\n          <div style={{ ...outlined, fontSize: 12, color: v.red }}>\n            {t(\"badID\")}\n          </div>\n        ) : null}\n        <Button\n          tone=\"green\"\n          disabled={!id}\n          busy={busy}\n          onClick={() => void send()}\n        >\n          {t(\"send\")}\n        </Button>\n      </div>\n    </Popup>\n  );\n}\n\nfunction PlayerCard({\n  player,\n  features,\n  onClose,\n  onChange,\n}: {\n  player: ProfileView;\n  features: FeatureRegistry;\n  onClose: () => void;\n  onChange: () => void;\n}): ReactNode {\n  const client = useIDosGamesClient();\n  const toast = useToast();\n  const [ask, setAsk] = useState<\"remove\" | \"block\" | null>(null);\n  const hasChat = !!features.get(\"chat\");\n  const hasMail = !!features.get(\"mailbox\")?.available;\n  const isFriend =\n    !!player.Source ||\n    (\n      client.data.user.state?.Social?.Accepted as\n        Array<{ UserID?: string }> | undefined\n    )?.some((f) => f.UserID === player.UserID);\n  return (\n    <Popup title={displayName(player)} onClose={onClose} width={400}>\n      <div style={{ display: \"grid\", justifyItems: \"center\", gap: 8 }}>\n        <Avatar player={player} size={84} />\n        <div\n          style={{\n            ...outlined,\n            fontSize: 13,\n            color: v.textDim,\n            textAlign: \"center\",\n          }}\n        >\n          {player.PublicData?.Level\n            ? `${t(\"level\")} ${player.PublicData.Level}`\n            : \"\"}\n          {player.PublicData?.Power\n            ? ` · ${t(\"power\")} ${formatAmount(player.PublicData.Power)}`\n            : \"\"}\n        </div>\n        <div\n          style={{ fontFamily: \"monospace\", fontSize: 11, color: v.textDim }}\n        >\n          {player.UserID}\n        </div>\n      </div>\n      <div style={{ display: \"grid\", gap: 8 }}>\n        {hasChat && isFriend ? (\n          <Button\n            tone=\"blue\"\n            onClick={() => {\n              // The chat opens in its own window — the card must not stay on top of it.\n              onClose();\n              features.open(\"chat\", { userID: player.UserID });\n            }}\n          >\n            <Icon glyph=\"chat\" size={18} /> {t(\"message\")}\n          </Button>\n        ) : null}\n        {hasMail && isFriend ? (\n          <Button\n            tone=\"gold\"\n            onClick={() => {\n              // Gifts and transfers live in the mailbox — it opens straight on this friend.\n              onClose();\n              features.open(\"mailbox\", {\n                friendUserID: player.UserID,\n                friendName: displayName(player),\n              });\n            }}\n          >\n            <Icon glyph=\"gift\" size={18} /> {t(\"gift\")}\n          </Button>\n        ) : null}\n        {isFriend && canRemove(player) ? (\n          <Button tone=\"grey\" onClick={() => setAsk(\"remove\")}>\n            {t(\"remove\")}\n          </Button>\n        ) : null}\n        <Button tone=\"red\" onClick={() => setAsk(\"block\")}>\n          {t(\"block\")}\n        </Button>\n      </div>\n      {ask ? (\n        <ConfirmPopup\n          title={ask === \"remove\" ? t(\"remove\") : t(\"block\")}\n          tone=\"red\"\n          onClose={() => setAsk(null)}\n          onConfirm={async () => {\n            const res =\n              ask === \"remove\"\n                ? await client.social.removeFriend(player.UserID)\n                : await client.social.block(\"User\", player.UserID);\n            if (!res.ok) {\n              toast(errorText(res.error), \"error\");\n              return false;\n            }\n            if (ask === \"block\") toast(t(\"blocked\"));\n            onChange();\n            onClose();\n          }}\n        >\n          <div style={{ ...outlined, fontSize: 14, textAlign: \"center\" }}>\n            {ask === \"remove\" ? t(\"removeAsk\") : t(\"blockAsk\")}\n          </div>\n        </ConfirmPopup>\n      ) : null}\n    </Popup>\n  );\n}\n"
     },
     {
       "path": "i18n.ts",
-      "content": "import { makeT } from \"@idosgames/react/ui\";\n\nconst EN = {\n  title: \"Friends\",\n  friends: \"Friends\",\n  requests: \"Requests\",\n  suggested: \"Suggested\",\n  inbox: \"News\",\n  noFriends: \"No friends yet — add someone by ID or pick from the suggestions.\",\n  noRequests: \"No requests right now.\",\n  noSuggestions: \"No suggestions right now — come back later.\",\n  noInbox: \"Nothing new yet.\",\n  incoming: \"Want to be friends\",\n  outgoing: \"Waiting for an answer\",\n  accept: \"Accept\",\n  decline: \"Decline\",\n  add: \"Add\",\n  addFriend: \"Add a friend\",\n  sent: \"Request sent\",\n  playerID: \"Player ID\",\n  yourID: \"Your ID\",\n  copied: \"Copied\",\n  send: \"Send request\",\n  badID: \"Enter another player's ID\",\n  message: \"Message\",\n  remove: \"Remove friend\",\n  removeAsk: \"Remove this player from your friends?\",\n  block: \"Block\",\n  blockAsk:\n    \"Block this player? You stop seeing each other, and the friendship ends.\",\n  blocked: \"Blocked\",\n  platformFriend: \"Friend on idosgames.com\",\n  level: \"Level\",\n  power: \"Power\",\n  someone: \"Someone\",\n  and: \"and\",\n  more: \"more\",\n  vAttack: \"attacked you\",\n  vRaid: \"raided you\",\n  vFriend: \"is now your friend\",\n  vSale: \"bought your creation\",\n  vFollow: \"followed you\",\n  vLike: \"liked your creation\",\n  vComment: \"commented\",\n  vReply: \"replied to you\",\n  vOther: \"did something\",\n} as const;\n\nexport const t = makeT<keyof typeof EN>(EN, {\n  title: \"Друзья\",\n  friends: \"Друзья\",\n  requests: \"Заявки\",\n  suggested: \"Рекомендуем\",\n  inbox: \"Новости\",\n  noFriends:\n    \"Друзей пока нет — добавьте игрока по ID или выберите из рекомендаций.\",\n  noRequests: \"Заявок нет.\",\n  noSuggestions: \"Рекомендаций пока нет — загляните позже.\",\n  noInbox: \"Пока ничего нового.\",\n  incoming: \"Хотят дружить\",\n  outgoing: \"Ждут ответа\",\n  accept: \"Принять\",\n  decline: \"Отклонить\",\n  add: \"Добавить\",\n  addFriend: \"Добавить друга\",\n  sent: \"Заявка отправлена\",\n  playerID: \"ID игрока\",\n  yourID: \"Ваш ID\",\n  copied: \"Скопировано\",\n  send: \"Отправить заявку\",\n  badID: \"Введите ID другого игрока\",\n  message: \"Написать\",\n  remove: \"Удалить из друзей\",\n  removeAsk: \"Удалить игрока из друзей?\",\n  block: \"Заблокировать\",\n  blockAsk:\n    \"Заблокировать игрока? Вы перестанете видеть друг друга, дружба закончится.\",\n  blocked: \"Заблокирован\",\n  platformFriend: \"Друг на idosgames.com\",\n  level: \"Уровень\",\n  power: \"Сила\",\n  someone: \"Кто-то\",\n  and: \"и\",\n  more: \"ещё\",\n  vAttack: \"напал на вас\",\n  vRaid: \"совершил набег\",\n  vFriend: \"теперь ваш друг\",\n  vSale: \"купил ваше творение\",\n  vFollow: \"подписался на вас\",\n  vLike: \"оценил ваше творение\",\n  vComment: \"оставил комментарий\",\n  vReply: \"ответил вам\",\n  vOther: \"что-то сделал\",\n});\n"
+      "content": "import { makeT } from \"@idosgames/react/ui\";\n\nconst EN = {\n  title: \"Friends\",\n  friends: \"Friends\",\n  requests: \"Requests\",\n  suggested: \"Suggested\",\n  inbox: \"News\",\n  noFriends: \"No friends yet — add someone by ID or pick from the suggestions.\",\n  noRequests: \"No requests right now.\",\n  noSuggestions: \"No suggestions right now — come back later.\",\n  noInbox: \"Nothing new yet.\",\n  incoming: \"Want to be friends\",\n  outgoing: \"Waiting for an answer\",\n  accept: \"Accept\",\n  decline: \"Decline\",\n  add: \"Add\",\n  addFriend: \"Add a friend\",\n  sent: \"Request sent\",\n  playerID: \"Player ID\",\n  yourID: \"Your ID\",\n  copied: \"Copied\",\n  send: \"Send request\",\n  badID: \"Enter another player's ID\",\n  message: \"Message\",\n  gift: \"Send a gift\",\n  remove: \"Remove friend\",\n  removeAsk: \"Remove this player from your friends?\",\n  block: \"Block\",\n  blockAsk:\n    \"Block this player? You stop seeing each other, and the friendship ends.\",\n  blocked: \"Blocked\",\n  platformFriend: \"Friend on idosgames.com\",\n  level: \"Level\",\n  power: \"Power\",\n  someone: \"Someone\",\n  and: \"and\",\n  more: \"more\",\n  vAttack: \"attacked you\",\n  vRaid: \"raided you\",\n  vFriend: \"is now your friend\",\n  vSale: \"bought your creation\",\n  vFollow: \"followed you\",\n  vLike: \"liked your creation\",\n  vComment: \"commented\",\n  vReply: \"replied to you\",\n  vOther: \"did something\",\n} as const;\n\nexport const t = makeT<keyof typeof EN>(EN, {\n  title: \"Друзья\",\n  friends: \"Друзья\",\n  requests: \"Заявки\",\n  suggested: \"Рекомендуем\",\n  inbox: \"Новости\",\n  noFriends:\n    \"Друзей пока нет — добавьте игрока по ID или выберите из рекомендаций.\",\n  noRequests: \"Заявок нет.\",\n  noSuggestions: \"Рекомендаций пока нет — загляните позже.\",\n  noInbox: \"Пока ничего нового.\",\n  incoming: \"Хотят дружить\",\n  outgoing: \"Ждут ответа\",\n  accept: \"Принять\",\n  decline: \"Отклонить\",\n  add: \"Добавить\",\n  addFriend: \"Добавить друга\",\n  sent: \"Заявка отправлена\",\n  playerID: \"ID игрока\",\n  yourID: \"Ваш ID\",\n  copied: \"Скопировано\",\n  send: \"Отправить заявку\",\n  badID: \"Введите ID другого игрока\",\n  message: \"Написать\",\n  gift: \"Подарить\",\n  remove: \"Удалить из друзей\",\n  removeAsk: \"Удалить игрока из друзей?\",\n  block: \"Заблокировать\",\n  blockAsk:\n    \"Заблокировать игрока? Вы перестанете видеть друг друга, дружба закончится.\",\n  blocked: \"Заблокирован\",\n  platformFriend: \"Друг на idosgames.com\",\n  level: \"Уровень\",\n  power: \"Сила\",\n  someone: \"Кто-то\",\n  and: \"и\",\n  more: \"ещё\",\n  vAttack: \"напал на вас\",\n  vRaid: \"совершил набег\",\n  vFriend: \"теперь ваш друг\",\n  vSale: \"купил ваше творение\",\n  vFollow: \"подписался на вас\",\n  vLike: \"оценил ваше творение\",\n  vComment: \"оставил комментарий\",\n  vReply: \"ответил вам\",\n  vOther: \"что-то сделал\",\n});\n"
     },
     {
       "path": "index.ts",

package/registry/modules/idle-rpg.json

@@ -49,10 +49,10 @@
     }
   },
   "dependencies": {
-    "@idosgames/core": "0.19.0",
-    "@idosgames/module-sdk": "0.6.0",
+    "@idosgames/core": "0.19.1",
+    "@idosgames/module-sdk": "0.7.0",
     "@idosgames/react": "0.3.0",
-    "@idosgames/wallet": "0.5.2",
+    "@idosgames/wallet": "0.6.0",
     "@tanstack/react-query": "5.101.2",
     "phaser": "4.2.1",
     "react": "19.2.7",