As a user, I want the platform to visually match the mock-design pages exactly, so that the UI feels consistent and professional. This task covers applying the Mars-themed color palette (#F3F4F6 background, #FFFFFF surface, #1F2937 text, #FF5733 accent, #A0AEC0 muted), typography, spacing, and layout structure across all existing scaffold pages (home, login, signup, welcome, dashboard/overview, dashboard/ai-assistant, dashboard/settings). Remove any pages not referenced in the design or user flows. This task must remain independent of all others and be completed first.
As a user, I want to be able to use the backend API for role-based access control, so that sensitive financial data is protected and each persona sees only their permitted views. Implement RBAC middleware in FastAPI: Admin (full access), Technician (jobs + inventory logging only), Owner/Financial Manager (financials + analytics read-only). Protect the Financials route and any financial data endpoints. Include role assignment on login token.
As a user, I want to be able to use the frontend login page to sign in securely, so that I can access the platform based on my role. Implement the Login page (v3) based on the existing JSX design. The login page is the entry point for all personas (Admin, Technician, Owner). On success, redirect to the Dashboard. Ensure role-based routing is applied post-login.
As a user, I want to be able to use the backend API for ServiceM8 integration, so that jobs, technician notes, queues, and billing data stay in sync in real time. Build the ServiceM8 sync feature module within the platform backend: webhook receiver (UUID → follow-up GET pattern), reconciliation cron job as backup, two-way job status sync, queue mirroring. Respect the 20,000 req/day rate limit. Scaffold with typed interfaces and stub implementations for all ServiceM8 API calls.
As a user, I want to be able to use the backend API for inventory management, so that parts stock across warehouse and vans is accurate and transferable. Build FastAPI endpoints: parts catalog CRUD (~16,000 items), storage location management (warehouse + vans), stock transfer (warehouse → van), usage logging per job, low-stock alert triggers. Support part photo URLs via AWS S3 (stub S3 upload; actual S3 wiring optional). Include supplier SKU mapping per part.
As a user, I want to be able to use the backend API for financial tracking, so that paid/unpaid invoices, overdue balances, and revenue data are available to authorised roles. Build FastAPI endpoints: invoice list (paid/unpaid/overdue), outstanding balance per customer, revenue summary. All endpoints role-gated to Owner/Financial Manager. Note: Xero integration has been removed from scope; use internal data only.
As a user, I want to be able to use the frontend dashboard to view job queues, alerts, analytics summaries, and operational metrics, so that I have a single-pane-of-glass overview of all operations. Implement the Dashboard (v2) based on the existing JSX design. Features include: job queue cards by stage, aging indicators (drive-thru timer style), counts for outstanding jobs/quotes/overdue invoices, month-over-month job comparison, top clients, and an alerts panel (low stock, aged jobs, stuck follow-ups). The interactive galaxy map concept should be incorporated as the hero element. Linked from Login; links to Jobs, Inventory, Quotes, Suppliers.
As a user, I want to be able to use the backend API for job management, so that jobs can be created, updated, and lifecycle-tracked from the platform. Build FastAPI endpoints: list jobs (with filters by stage, date, search), get job detail, create job, update job status, link related jobs (by customer/appliance/issue). Sync job mutations to ServiceM8. Support job ID format (year+sequence). Include technician-facing endpoints for viewing assigned jobs and logging parts.
As a user, I want to be able to use the backend API for purchase order and supplier communication, so that parts ordering and follow-ups are tracked and automated. Build FastAPI endpoints: PO CRUD (supplier, parts, job ID ref, delivery, price, status), supplier follow-up scheduler (configurable cadence, default 24h, max N attempts then alert), Gmail send/receive stub for supplier emails, supplier scorecard calculations (avg response time, delivery time, pricing consistency).
As a user, I want to be able to use the AI API for technician note cleanup, so that raw messy notes are automatically formatted into professional customer-facing text without altering part numbers or raw data. Build LLM pipeline using LiteLLM/Langchain: trigger on technician checkout from ServiceM8 webhook, preserve raw note in job Notes section (immutable), write cleaned version to quote/invoice description (MAKE/MODEL/SERIAL/LOCATION format). Use asterisk delimiters for idempotency. Append new cleaned blocks on repeat visits; never rewrite existing ones. Use cost-appropriate model (Claude 4.6 Opus preferred). Accept user-provided API key.
As a user, I want to be able to use the AI API for automated work order ingestion, so that incoming email/PDF work orders are parsed and draft jobs are created without manual data entry. Build LLM pipeline: watch dedicated inbox for work order emails + PDF attachments, extract (customer name/contact, site location, appliance make/model/serial, fault description, requested service), create draft job in ServiceM8 via API, present to office for confirmation/edit before going live. Use cost-appropriate model.
As a user, I want to be able to use the frontend jobs page to list, view, create, and manage job lifecycles, so that I can track every job from creation to invoicing. Implement the Jobs page (v2) based on the existing JSX design. Covers: job list with status filters, job detail view (lifecycle stages: Created → Technician Assigned → Diagnosed → Quote Required → Quote Sent → Awaiting Approval → Awaiting Parts → Scheduled → Completed → Invoiced), job creation form, linked jobs view (by customer/appliance/issue), and technician view for assigned jobs and parts logging. Linked from Dashboard; links to Quotes.
As a user, I want to be able to use the frontend inventory page to view and manage parts stock across warehouse and technician vans, so that I can track availability and trigger transfers. Implement the Inventory page (v2) based on the existing JSX design. Features: parts catalog list (~16,000 items), per-part details (SKU, supplier SKUs, photo, quantity, price, min-stock threshold), storage location views (Warehouse + per-van), transfer UI (Warehouse → Van), low-stock alerts display. Linked from Dashboard.
As a user, I want to be able to use the frontend quotes page to send quotes to customers and track automated follow-ups, so that no quote falls through the cracks. Implement the Quotes page (v2) based on the existing JSX design. Features: quote list with status (sent, follow-up 1, follow-up 2, intervention required, approved, rejected), quote detail view, follow-up timeline display, manual override option with reason capture, approval history. Linked from Dashboard and Jobs.
As a user, I want to be able to use the frontend suppliers page to create purchase orders, track supplier responses, and view supplier scorecards, so that parts ordering is organised and automated. Implement the Suppliers page (v2) based on the existing JSX design. Features: PO creation form (supplier, parts, job ID, expected delivery, price, status), PO list/tracker, supplier response timeline, auto-follow-up status display, manual override for stopping automation, supplier scorecard (avg response time, delivery time, pricing consistency). Linked from Dashboard.
As a user, I want to be able to use the frontend financials page to view revenue, invoices, and overdue payments, so that financial health is visible to authorised roles only. Implement the Financials page (v2) based on the existing JSX design. Features: paid vs unpaid invoices, overdue invoice list, outstanding balance per customer, role-gated views (only Kylie/Elaine). Linked from Dashboard. Ensure RBAC guards are applied on this route.
As a user, I want to be able to use the frontend analytics page to view operational reports and performance metrics, so that I can make data-driven decisions. Implement the Analytics page (v2) based on the existing JSX design. Features: jobs by month with YoY comparison charts, component usage (most-used/high-failure parts), repair trend breakdowns by appliance type, technician efficiency metrics, supplier performance charts, top clients. Linked from Dashboard.
As a user, I want to be able to use the backend API for quote follow-up automation, so that customers are reminded on schedule without manual chasing. Build FastAPI endpoints and scheduler: trigger follow-up sequence on first quote send, Day+3 reminder email, Day+7 expiry warning, stop after N attempts and create Intervention Required alert. Push job queue updates back to ServiceM8. Log sent timestamp, response, approval history. Allow manual override with reason.
As a user, I want to be able to use the backend API for cross-job parts reconciliation, so that duplicate part billing across linked jobs is detected and flagged before quotes are sent. Build reconciliation engine: Centralized Parts Usage Ledger (ordered/allocated/installed events per part per job), cross-job fuzzy/NLP matching on (customer, appliance, issue, SKU, part name), pre-quote validation endpoint that flags duplicate parts on linked jobs, manual override with reason capture and audit log. Auto-link related jobs by customer + appliance + issue.
As a user, I want to be able to use the backend API for analytics and reporting, so that operational metrics are computed and served to the analytics dashboard. Build FastAPI endpoints: jobs by month (YoY), component usage stats (most-used/high-failure parts), repair trends by appliance type, technician efficiency metrics, supplier performance scores, top clients by spend and job count. Aggregate from internal data.
As a user, I want to be able to use the frontend jobs page with live data from the backend, so that job list, details, and lifecycle updates are real and persisted. Wire the Jobs (v2) page to the Jobs API: fetch job list with filters, create/update job forms submit to API, lifecycle stage transitions call API, linked jobs display fetched from API. Handle loading/error states.
As a user, I want to be able to use the frontend inventory page with live data, so that stock levels, transfers, and low-stock alerts reflect real inventory state. Wire the Inventory (v2) page to the Inventory API: parts catalog listing/search, transfer form submissions, low-stock alert display. Handle loading/error states.
As a user, I want to be able to use the frontend quotes page with live follow-up data, so that quote statuses and automation timelines are accurate. Wire the Quotes (v2) page to the Quotes Follow-Up API: quote list with live statuses, follow-up timeline display, manual override form. Handle loading/error states.
As a user, I want to be able to use the frontend suppliers page with live PO and scorecard data, so that purchase orders and follow-up statuses are tracked in real time. Wire the Suppliers (v2) page to the Suppliers PO API: PO list/creation form, follow-up status display, manual override, supplier scorecard charts. Handle loading/error states.
As a user, I want to be able to use the frontend financials page with live invoice and revenue data, so that financial overviews are accurate and role-gated. Wire the Financials (v2) page to the Financials API: invoice lists, overdue display, revenue summaries. Enforce role-gate on the frontend route. Handle loading/error states.
As a user, I want to be able to use the frontend analytics page with live report data, so that charts and metrics reflect current operational performance. Wire the Analytics (v2) page to the Analytics API: all chart data fetched from API, loading/error states handled, role-appropriate data displayed.
As a user, I want to be able to use the frontend dashboard with live operational data, so that job queues, alerts, counts, and analytics summaries are real and up to date. Wire the Dashboard (v2) page to Jobs, Inventory, Quotes, Analytics, and Suppliers APIs: job queue cards, aging indicators, alert panel, counts, YoY charts, top clients. Handle loading/error states and real-time refresh.

Sign in to your account
No comments yet. Be the first!