A modern, eBay-style React web interface for mifind universal search.

• Vite - Fast build tool with HMR
• React 18 + TypeScript - UI framework
• Tailwind CSS - Styling
• shadcn/ui - High-quality React components
• React Query (TanStack Query) - API state management
• Zustand - Lightweight UI state management
• Lucide React - Icon library

• Node.js 18+ and npm
• Go 1.21+ (for backend)
• mifind API server running on port 8080

cd web
npm install

Run Vite dev server (terminal 1):

npm run dev

Run mifind API (terminal 2):

cd ..
go run cmd/mifind/main.go

Visit http://localhost:5173

The React build needs to be copied to the Go embed directory before building the Go binary:

cd web
./copy-to-api.sh
cd ..
go build -o mifind cmd/mifind/main.go
./mifind

Visit http://localhost:8080

• components/ui/ - shadcn/ui base components
• components/layout/ - Layout components (MainLayout, Header)
• components/search/ - Search components (SearchBar, EntityCard, SearchResults, FilterSidebar)
• components/entity/ - Entity detail components (EntityModal)

• Zustand (stores/searchStore.ts) - UI state (query, filters, selected entity)
• React Query (hooks/useSearch.ts) - API state (search results, filters, providers)

The UI connects to the mifind API at /api endpoints:

• POST /api/search - Search
• GET /api/entity/{id} - Get entity details
• GET /api/filters - Get available filters
• GET /api/providers - List providers

The UI follows an eBay-inspired design:

• Light gray background (#f5f5f5)
• White cards with subtle shadows
• Blue accent (#0654ba)
• Responsive grid (1-4 columns)
• Clean typography with clear hierarchy