dharaneesh-r
414ba6dbf2
Assistant — assign:
- Order step is a dropdown, not a typed booking number. Exact bookingid /
bookingno matches now win across the whole list before any substring
fallback; row order previously decided the winner, so a short numeric id
could substring-match a different booking than the one on screen.
- Rider step resolves by id or name, so answering by typing no longer
leaves __rider undefined and throws inside executeAssign.
- notified now reflects whether the push actually went out. It was
Boolean(rider.milerprofileid) — "has an id, assume they were told" — so a
notify returning 400 still reported "The rider has been notified."
- Batch assign removed. /hub/bookings/batch-assign is a hub-console
endpoint; an admin JWT is refused (403 on an empty body, so the gate is
on identity). It read as the fast path and could never run.
Assistant — repeat runs:
- Bulk create response is read at data.results, the shape the live endpoint
returns. Only the two flatter shapes were checked, so every bookingid was
discarded while the count came out right by accident.
- Repeat carries each order's previous rider and re-assigns on create, one
admin call per order, one push per rider. Confirm cards say so.
- Message ids are clock-seeded and healed on load; the counter restarted at
1 each session and overwrote itself, giving duplicate React keys.
- Successful writes invalidate the query cache, so the page behind the panel
stops serving rows cached before the write.
Date range picker:
- Fields seed from the range already in force instead of opening blank on a
filtered table.
- Start field takes max={end}; only the end had a bound, so an inverted
range could be emitted and filtered to nothing.
UI:
- Deliveries filters moved outside the table card.
- Side nav keeps one hairline; the border and box-shadow stacked into a
heavy edge.
- KPI gloss lines removed across orders, riders, tenants, customers, hubs,
vehicles, exceptions, app users, orders summary/details, riders summary
and profitability.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Doormile Express - Operator Dispatch Console & Deliveries Portal
A high-fidelity, real-time dispatcher command center and order-delivery console built using React, React-Leaflet, TanStack Query, and Material UI.
This platform enables real-time visual tracking of delivery partners, responsive slot scheduling adjustments, route matching analysis, and direct order status management from a cohesive operational interface.
🚀 Key Features
📍 1. Real-Time Rider Live GPS Mapping
- Interactive Leaflet Maps: Displays live geolocated pins for every active and idle rider across Coimbatore.
- Polished Glassmorphism Popovers: High-fidelity Map Popups loaded with crucial metrics (Active Orders, Contact number, monospaced coordinates, and last-seen timestamps).
- Dynamic Pulsing Live Indicator: Double-ring animated indicator reflecting current partner connectivity state (pulsing green
#16a34afor active, red#dc2626for idle). - Rider Routes & Planned Path Overlay: Parallel Indigo/Emerald rails representing planned paths vs actual tracks side-by-side using perpendicular polyline offsets.
🕒 2. Five-Wave Dispatch Slot Bucketing
- Flexible Scheduling Boundaries: Segmented timing filters supporting precise fractional-hour offsets (e.g., Slot 1 ends at 12:30 PM, Slot 2 starts at 12:20 PM).
- Default Operational Waves:
- Slot 1 (Morning Rush): 8:00 AM → 12:30 PM
- Slot 2 (Lunch Wave): 12:20 PM → 3:00 PM
- Slot 3 (Afternoon Wave): 3:00 PM → 7:00 PM
- Slot 4 (Evening Wave): 7:00 PM → 8:00 PM
- Slot 5 (Night Wave): 8:00 PM → Midnight
- State Validation & Caching: Employs an array-length-validated state cache (Key version
v6in LocalStorage) that auto-invalidates older 3-slot schema outputs during reload or hot-deployments to eliminate UI sync race conditions.
📦 3. Live Deliveries Portal & Update Status Modal
- Dynamic Filter Tabs: Filter deliveries based on active operational states (pending, accepted, on road, completed).
- Interactive Status Dialog: Positioned directly underneath the Amount inputs, allowing dispatchers to dynamically select and execute delivery state changes rather than submitting hardcoded records.
🛠️ Technology Stack
- Framework: React 18
- State Management: Redux Toolkit & React Context
- Server Cache/Queries:
@tanstack/react-query - Mapping Libraries:
leaflet,react-leaflet, Custom Polyline Offset modules - Component Styling: MUI v5 (Material UI) & custom vanilla CSS design systems
- Date/Time Parsers:
dayjs
⚙️ Environment Variables Config (.env)
Configure the following variables in your root .env or .env.development file to supply runtime secrets and API targets:
REACT_APP_VERSION=v2.1.0
GENERATE_SOURCEMAP=false
# Backend Services Endpoint URLs
REACT_APP_DOORMILE_URL=https://api.doormile.com/api/v1
No Maps API key is required — maps and address search run on free Leaflet/OpenStreetMap (Nominatim + OSRM), not Google Maps.
🏃 Getting Started & Local Development
1. Prerequisite Installations
Ensure that Node.js (v16+ recommended) is installed on your computer.
2. Install Project Dependencies
Use either npm or yarn to fetch the required modules defined in the lockfiles:
# If using npm
npm install
# If using yarn
yarn install
3. Run Development Server
Launches the console locally with real-time hot-reloading:
# Start standard environment
npm start
# Start dev configuration (loads .env.development)
npm run start:dev
Open http://localhost:3000 in your web browser to view the console.
📦 Production Builds & Verification
To compile the application down to highly optimized, static production files, perform the following commands:
1. Compile the Bundle
npm run build
(Or yarn build). This compiles all files and outputs them to the build/ directory.
2. Verify static pages locally
To test the production compilation locally before deploying:
npx serve -s build
Click on the output Network addresses (e.g. http://localhost:3000 or the local IP address) to view the compiled pages.
Note
If you run the static build server locally and see a blank white page, ensure you have added
"homepage": "."to yourpackage.jsonto properly configure relative Webpack asset paths.