web-frontend

Name: web-frontend
Author: tienoho

Use for the React web messenger, Fluent UI wrappers, IndexedDB, TanStack Query, Zustand, message timelines, and web accessibility.

by tienoho(0) 0 installs

Free

Free account. Installing gives you the manifest plus copy-paste snippets.

See reviews

About

Claude Code subagent imported from tienoho/retro-messenger (.claude/agents/web-frontend.md). Copyright stays with the author.

Tuân thủ AGENTS.md và docs/PROJECT_CONTEXT.md. Khi cần quy trình chi tiết, sử dụng skill web-frontend.

Phạm vi

React Web.
Vite.
Fluent UI wrapper.
TanStack Query.
Zustand.
IndexedDB/Dexie.
SignalR.
LiveKit.
Lexical composer.

Quy tắc

Server state vào TanStack Query.
UI state vào Zustand.
Message cache/outbox/cursor vào IndexedDB.
Không lưu refresh token trong LocalStorage.
Không import Fluent UI trực tiếp ngoài @retro/web-ui nếu đã có wrapper.
Message renderer theo registry/type.
Reconnect phải trigger sync.
UI phải hỗ trợ Classic và Modern theme.
Hỗ trợ keyboard và accessibility.

Test bắt buộc

Optimistic send.
Retry.
Deduplication.
Load older messages.
Scroll anchoring.
Reconnect.
Theme switch.

Use it

Copy one of these into your project. Installing also returns the manifest and these snippets.

yaml

targets:
  - https://api.opensmartroute.ai/api/v1/registry/tienoho-retro-messenger-web-frontend-subagent/manifest   # or paste the manifest below

Manifest

An Open Capability Manifest: the router reads it to know what this does, what it costs and when to pick it.

tienoho-retro-messenger-web-frontend-subagent.ocm.jsonjson

{
  "ocm": "1",
  "id": "tienoho-retro-messenger-web-frontend-subagent",
  "kind": "agent",
  "name": "web-frontend",
  "description": "Use for the React web messenger, Fluent UI wrappers, IndexedDB, TanStack Query, Zustand, message timelines, and web accessibility.",
  "publisher": "tienoho",
  "version": "1.0.0",
  "capabilities": {
    "domains": [
      "data_analysis"
    ],
    "tags": [
      "agent-md",
      "github-claude-agents"
    ],
    "languages": [
      "en"
    ]
  },
  "quality_prior": 0.6,
  "examples": [
    "Use for the React web messenger, Fluent UI wrappers, IndexedDB, TanStack Query, Zustand, message timelines, and web accessibility."
  ],
  "primary": false,
  "metadata": {
    "source": {
      "provider": "github-claude-agents",
      "repository": "https://github.com/tienoho/retro-messenger",
      "path": ".claude/agents/web-frontend.md",
      "ref": "7f6c4b8fc8dcbd0f3d1958893607b62c5a9f873f",
      "url": "https://github.com/tienoho/retro-messenger/blob/7f6c4b8fc8dcbd0f3d1958893607b62c5a9f873f/.claude/agents/web-frontend.md",
      "key": "tienoho/retro-messenger/.claude/agents/web-frontend.md"
    },
    "tools": [
      "Read",
      "Glob",
      "Grep",
      "Edit",
      "Write",
      "Bash"
    ],
    "model": "inherit"
  },
  "instructions": "<!-- GENERATED FROM agents/web-frontend.md; DO NOT EDIT DIRECTLY -->\n\nTuân thủ `AGENTS.md` và `docs/PROJECT_CONTEXT.md`. Khi cần quy trình chi tiết, sử dụng skill `web-frontend`.\n\n## Phạm vi\n\n- React Web.\n- Vite.\n- Fluent UI wrapper.\n- TanStack Query.\n- Zustand.\n- IndexedDB/Dexie.\n- SignalR.\n- LiveKit.\n- Lexical composer.\n\n## Quy tắc\n\n- Server state vào TanStack Query.\n- UI state vào Zustand.\n- Message cache/outbox/cursor vào IndexedDB.\n- Không lưu refresh token trong LocalStorage.\n- Không import Fluent UI trực tiếp ngoài `@retro/web-ui` nếu đã có wrapper.\n- Message renderer theo registry/type",
  "cost": {
    "context_tokens": 211
  }
}

Fetch it by URL: GET /api/v1/registry/tienoho-retro-messenger-web-frontend-subagent/manifest?version=1.0.0