{"id":"d3896099-5422-4329-8f0e-dc39a48a0403","slug":"clawhub-iliaal-compound-eng-react-frontend","name":"ia-react-frontend","description":"React architecture patterns, TypeScript, Next.js, hooks, and testing. Use when working with React component structure, state management, Next.js routing, Vitest, React Testing Library, reviewing React code, or synchronizing JSON locales and reviewing translations in a React or frontend interface. For visual design and aesthetic direction, use frontend-design instead.","canonicalUrl":"https://www.xpersona.co/agent/clawhub-iliaal-compound-eng-react-frontend","sourceUrl":"https://clawhub.ai/iliaal/compound-eng-react-frontend","homepage":"https://clawhub.ai/iliaal/skills/compound-eng-react-frontend","source":"CLAWHUB","vendor":{"slug":"clawhub","label":"Clawhub","url":"https://clawhub.ai/iliaal/skills/compound-eng-react-frontend"},"protocols":["OPENCLEW"],"capabilities":[],"trustScore":null,"trustConfidence":"unknown","artifactCount":0,"benchmarkCount":0,"lastRelease":"5.0.1","freshnessAt":"2026-10-09T12:23:05.549Z","freshnessLabel":"Oct 9, 2026","securityReviewed":true,"openapiReady":false,"stats":[{"label":"Trust score","value":"Unknown"},{"label":"Compatibility","value":"OpenClaw"},{"label":"Freshness","value":"Oct 9, 2026"},{"label":"Vendor","value":"Clawhub"},{"label":"Artifacts","value":"0"},{"label":"Benchmarks","value":"0"},{"label":"Last release","value":"5.0.1"}],"factsPreview":[{"factKey":"vendor","category":"vendor","label":"Vendor","value":"Clawhub","href":"https://clawhub.ai/iliaal/skills/compound-eng-react-frontend","sourceUrl":"https://clawhub.ai/iliaal/skills/compound-eng-react-frontend","sourceType":"profile","confidence":"medium","observedAt":"2026-10-09T12:23:05.550Z","isPublic":true},{"factKey":"protocols","category":"compatibility","label":"Protocol compatibility","value":"OpenClaw","href":"https://www.xpersona.co/api/v1/agents/clawhub-iliaal-compound-eng-react-frontend/contract","sourceUrl":"https://www.xpersona.co/api/v1/agents/clawhub-iliaal-compound-eng-react-frontend/contract","sourceType":"contract","confidence":"medium","observedAt":"2026-10-09T12:23:05.550Z","isPublic":true},{"factKey":"traction","category":"adoption","label":"Adoption signal","value":"2.7K downloads","href":"https://clawhub.ai/iliaal/compound-eng-react-frontend","sourceUrl":"https://clawhub.ai/iliaal/compound-eng-react-frontend","sourceType":"profile","confidence":"medium","observedAt":"2026-10-09T12:23:05.550Z","isPublic":true},{"factKey":"latest_release","category":"release","label":"Latest release","value":"5.0.1","href":"https://clawhub.ai/iliaal/compound-eng-react-frontend","sourceUrl":"https://clawhub.ai/iliaal/compound-eng-react-frontend","sourceType":"release","confidence":"medium","observedAt":"2026-10-03T17:07:02.338Z","isPublic":true},{"factKey":"handshake_status","category":"security","label":"Handshake status","value":"UNKNOWN","href":"https://www.xpersona.co/api/v1/agents/clawhub-iliaal-compound-eng-react-frontend/trust","sourceUrl":"https://www.xpersona.co/api/v1/agents/clawhub-iliaal-compound-eng-react-frontend/trust","sourceType":"trust","confidence":"medium","observedAt":null,"isPublic":true}],"highlights":["2.7K downloads","Trust evidence available"],"agentCard":{"name":"ia-react-frontend","description":"React architecture patterns, TypeScript, Next.js, hooks, and testing. Use when working with React component structure, state management, Next.js routing, Vitest, React Testing Library, reviewing React code, or synchronizing JSON locales and reviewing translations in a React or frontend interface. For visual design and aesthetic direction, use frontend-design instead.","source":"CLAWHUB","sourceId":"clawhub:s17bcar8wq0xhegs0ny6f57ypd8484bw:compound-eng-react-frontend","homepage":"https://clawhub.ai/iliaal/skills/compound-eng-react-frontend","repository":"https://clawhub.ai/iliaal/compound-eng-react-frontend","documentation":"https://www.xpersona.co/agent/clawhub-iliaal-compound-eng-react-frontend","protocols":["OPENCLEW"],"examples":[{"kind":"example","language":"text","snippet":"Local UI state       → useState, useReducer\nShared client state  → Zustand (simple) | Redux Toolkit (complex)\nAtomic/granular      → Jotai\nServer/remote data   → React Query (TanStack Query)\nURL state            → nuqs, router search params\nForm state           → React Hook Form"},{"kind":"example","language":"text","snippet":"project-root/\n├── playwright.config.ts\n└── e2e/\n    ├── fixtures/\n    │   ├── auth.fixture.ts\n    │   └── test-data.fixture.ts\n    ├── pages/\n    │   ├── base.page.ts\n    │   └── <page-name>.page.ts\n    ├── tests/\n    │   ├── auth/\n    │   │   └── login.spec.ts\n    │   └── smoke/\n    │       └── critical-paths.spec.ts\n    └── utils/\n        └── api-helpers.ts"}]}}