| public | ||
| src | ||
| .gitignore | ||
| CLAUDE.md | ||
| eslint.config.js | ||
| index.html | ||
| package-lock.json | ||
| package.json | ||
| README.md | ||
| tsconfig.app.json | ||
| tsconfig.json | ||
| tsconfig.node.json | ||
| vite.config.ts | ||
Krishna Sales
Field-sales console for Zino sandbox app 434. A Vite + React + TypeScript SPA that browses the app's three workflows (Order Booking, Store, Daily Reports) over the Zino gateway.
- Base URL:
https://sandbox.getzino.in - Stack: React 19 · TypeScript · Vite 8 · Tailwind v4 · react-router v7 · lucide-react
Getting started
npm install
npm run dev # http://localhost:5173
Sign in with your sandbox credentials (email / password, optional org id). The JWT is stored in localStorage and shared across all three workflow clients.
Other scripts:
npm run build # tsc -b && vite build → dist/
npm run preview # serve the production build
npm run lint # eslint
Workflows (app 434)
The app has three workflows, each with its own workflow_uuid (shared APP_ID 434). One ZinoClient is bound per workflow.
Slug (config.ts) |
UI | Record views | Detail views |
|---|---|---|---|
orderBooking |
Order Booking | Orders, Calls | Orders, Calls |
store |
Store | Store | Store |
dailyReports |
Daily Reports | Daily Logs | Daily Logs |
All ids live in src/api/config.ts, sourced from the API docs in src/docs/api/.
Structure
src/
api/
client.ts ZinoClient — HTTP client (login, views, activities, upload)
clients.ts per-workflow client singletons + shared auth (loginAll…)
config.ts app 434 ids: APP_ID, workflow uuids, activities, fields, views
types.ts API response types
auth/ AuthProvider + useAuth (JWT session)
components/
buttons/ Button, IconButton
reusable/ Card, Badge, Input, Select, Pagination, Modal, Spinner, EmptyState
rv/ generic RecordView + wired Orders/Calls/Stores/DailyLogs views
dv/ generic DetailView + wired Order/Call/Store/DailyLog details
screens/ LoginPage, ConsoleLayout, WorkflowPage, tab defs
lib/ cn (classnames), format (value formatting)
styles/ Tailwind v4 theme + design tokens
docs/api/ source API docs (one per workflow)
Routing
| Path | Screen |
|---|---|
/login |
Login gate |
/:tab |
Record view (orders · calls · stores · daily) |
/:tab/:instanceId |
Same list with the detail modal open (deep-linkable) |
Unknown paths redirect to /orders. Routes under the console require an authenticated session; a 401 bounces back to /login.
Design system
Tailwind v4 with CSS-variable design tokens (src/styles/) — navy brand surface, sunrise accent gradient, slate neutrals. Utility names (bg-navy-900, text-strong, shadow-md, rounded-lg) resolve to the tokens via an @theme block. Referenced from the lead-to-policy console.