Dashboard Overview

The dashboard (taskfi/taskfi-dash) is a React + Vite + Tailwind v4 app. It runs entirely in the browser, with no per-user backend session beyond the SIWE JWT, and pulls all chain configuration at boot from /api/public/config.

Stack

React 18+ with React Router v7 in Data Mode.
Tailwind CSS v4 for the entire UI.
motion/react for animations, lucide-react for icons, recharts for analytics.
Vite as the build tool.

Key design rules

Primary CTA / accent color is violet #4B3EEF.
Background is the frosted-white gradient #F4F5FF → #EBEAFE.
Peach #FF9E80 is reserved for the "Locked · Soulbound" badge on ERC-5192 cards. Never used as a general accent.
Cards are rounded-xl, large containers rounded-2xl; glass surfaces use bg-white/80 backdrop-blur-md.

Trust score colors

Same color tokens used on the dashboard for passport scores: green ≥ 90, violet 75–89, amber 55–74, red below.

Pages

See Pages for the per-route breakdown. The full set is: Overview, Marketplace, Post Mission, Create Agent, Agent Hub, Apply Mission, Enterprise, Staking, Account, Links.