{"slug": "build-a-dispatch-command-centre-with-tooljet-mcp", "title": "Build a Dispatch Command Centre with ToolJet MCP", "summary": "A developer built a two-page dispatch command centre for a regional broadband operator using ToolJet MCP, combining a live map of technician positions, urgency-ranked job queues, and outage overlays with an end-of-day summary view. The app uses five related Supabase Postgres tables and role-scoped queries for dispatchers, technicians, and regional managers, with a reassignment flow that surfaces overbooked minutes, skill match, and detour impact before saving. The developer notes the build took several passes and consolidated the requirements into a single reusable prompt.", "body_md": "You build a dispatch command centre with ToolJet MCP for a regional broadband operator when technician locations, open jobs, and outage zones all change at once. The result is a structured ToolJet application, with data, queries, and interface working together, so dispatchers keep operating from the same place instead of juggling separate views. This article shows the app that came out of the build, then gives you the prompt below so you can reproduce the same structure in your own environment. You get a two-page workflow that keeps live routing and end-of-day review inside one app.\n\n*Dispatch Command Centre — live map, breach-risk job queue, and active outages*\n\n*End of Day Summary — completed vs. missed jobs and the by-region hot-areas table*\n\nThe map does the real work on page one, with technician pins, job pins, and outage shading sharing one view. A queue on the left sorts unassigned jobs by urgency, and each suggestion shows why a technician rises to the top before you act. Clicking a job or technician opens the relevant detail panel, then the reassignment flow shows the overbooked minutes, skill match, and detour impact before anything is saved. Page two switches to a read-only summary, and the branded header keeps the title, subtitle, live counter, and page link visible across both views.\n\nWant to build it yourself? Start with the [ToolJet MCP repository](https://github.com/ToolJet/mcp-v2) for setup instructions, supported agents, and everything you need to follow along.\n\nThe real build took several passes, and the requirements are now consolidated into one prompt you can use from the start. That gives you a single-shot reference for reproducing the same app instead of reconstructing the work from the iteration history.\n\n*Build a polished internal app called Dispatch Command Centre for a regional broadband provider in Ontario, using Supabase Postgres.*\n\n*Keep it to two pages: Dispatch Command Centre, showing technician positions, open jobs, outage overlays, urgency-ranked unassigned work, technician suggestions, and the reassignment flow. End of Day Summary, showing completed, missed, total, and on-time results, plus regional breakdowns and hot areas.*\n\n*Design it as a muted warm enterprise operations app with soft shadows, rounded corners, warm orange accents, cozy spacing, and a friendly hierarchy. Support light and dark mode with distinct color tokens for each, and replace the default page chrome with a custom branded header band that includes an eyebrow label, title, subtitle, live open-jobs counter, and a link to the summary page.*\n\n*Use five related tables: technicians, jobs, outage_areas, staff, and reassignment_log. Resolve the signed-in user's role and region from staff on page load, then scope every query and list to that role. Dispatchers can reassign work, technicians see only their own day as read-only, and regional managers see everything read-only.*\n\n*A reassignment confirmation must show the overbooked minutes, skill match, and detour minutes before save. On confirm, update the assigned technician and write the audit row. The prompt also seeds about 80 technicians, 150 jobs, and a handful of active outage areas across five Ontario regions.*\n\nToolJet MCP works through the whole application, not just the screen, so the data model, pages, components, queries, and the wiring between them land together as one structured ToolJet app. That matters here because dispatch software does not stop at the interface, it also needs data connectivity, workflows, permissions, deployment, and ongoing change, and the generated app sits on a runtime that carries those where supported instead of leaving you with a codebase to operate yourself. The path stays open after generation, because you can keep editing visually and drop into code when a specific detail calls for it.\n\nThe map looked finished, but the technician and job markers never appeared, which made the live view feel empty even though the data was present. A marker ID mismatch in the Map component caused the problem, and fixing that wiring restored every pin.\n\nThe app ended up with five tables. `staff` maps login email to role, region, and technician assignment, `technicians` stores each field technician and their shift capacity, `jobs` tracks service work and assignment, `outage_areas` marks active regional outage zones, and `reassignment_log` keeps the audit trail for every change. The live map, the urgency queue, and the summary page all read from those tables, while the reassignment flow writes back to `jobs` and records the decision in `reassignment_log`.\n\n| Page | Components | What they cover | \n|---|---|---|\n| Dispatch Command Centre | 39 | Live map, breach-risk job queue, active outages, and the reassignment flow with consequence preview | \n| End of Day Summary | 14 | Completed/missed/on-time stats and a by-region hot-areas table | \n\n| Metric | Result | \n|---|---|\n| Pages | 2 | \n| ToolJet DB tables | 5 | \n| Queries | 17 | \n| Components | 53 | \n| Code files to maintain | 0 | \n| Repair cycles | 1 | \n| Final validation | 2 errors | \n\nRegional broadband and telecom providers, utilities, field-service and home-repair networks, HVAC and plumbing dispatch operations, and any business that has to coordinate a distributed field workforce against time-boxed customer commitments.\n\nDispatchers can reassign jobs and see their own region (or every region, if unscoped). Technicians have read-only access to their own day's jobs. Regional managers have read-only access across every region. Access is enforced at the application/query level against a staff table keyed by login email, not as a hard database-level security boundary.\n\nA dispatch command centre handles technician locations, customer job details, and outage zones. ToolJet covers that governance at the platform layer, so you configure it once instead of rebuilding it in every app.\n\nToolJet Workflows adds the notification layer. One workflow fires when a reassignment is confirmed, sends a Slack message to dispatch, sends a Gmail message to the technician, and writes the decision back to `reassignment_log`.\n\nThis build shows a dispatcher can move from a single prompt to a live map, urgency sorting, pre-save consequence checks, and a read-only summary page tied to real regional data. The important part is not the screen alone, it is the structured ToolJet application behind it, because the result stays editable inside the same runtime instead of becoming a code handoff you must reassemble later. That is where visual editing, code where needed, and the runtime's data and workflow pieces fit together with role scoping and audit history, so the app can keep changing as dispatch rules change.\n\n*Three to four builds per model across four-page apps. 1 credit = 1 cent. Credits and time are estimates only and will vary with the complexity of what you ask for. This measures cost and speed only, not how complete or polished the result is.*\n\nEven averaging across model tiers, ToolJet MCP can turn $10 into a dozen or more working 4-page apps.\n\nBuild a dispatch command centre with ToolJet MCP for your own field data, then request a [ToolJet demo](https://tooljet.com/schedule-demo).\n\nIt opens on the map, the urgent job queue, and the outage overlay, with the header showing the current open-work count and a link to the summary page. Clicking a technician or job opens the details needed to route work without leaving the page.\n\nUse the prompt in this article as the full spec and let ToolJet MCP build the structure in one pass. The goal is the same two-page dispatch app, with the tables, role scoping, map, preview modal, and summary page already defined.\n\nNot for the core flow. The prompt drives the data model, page layout, role scoping, map behavior, preview modal, and summary page, and you only drop into code when a specific edge case needs it.\n\nYou keep a ToolJet application, not a disposable draft. The runtime carries the data connections, workflows, permissions, and maintenance path where supported, so changes stay inside the same app as dispatch rules change.\n\nYes, the build is centered on a Postgres datasource. Your technicians, jobs, outage areas, and staff tables can supply the live data while the prompt in this article defines the app shape.\n\nThe preview compares the target technician's remaining capacity, required skills, and added route time before the reassignment is saved. The dispatcher sees the consequence values first, then decides whether to proceed.\n\nYes. The app reads the signed-in user's role and region from `staff`, then scopes each page so dispatchers can reassign, technicians stay read-only, and regional managers see the full picture.", "url": "https://wpnews.pro/news/build-a-dispatch-command-centre-with-tooljet-mcp", "canonical_source": "https://dev.to/tooljet/build-a-dispatch-command-centre-with-tooljet-mcp-233c", "published_at": "2026-09-18 13:59:37+00:00", "updated_at": "2026-09-18 14:22:59.252411+00:00", "lang": "en", "topics": ["ai-agents", "ai-tools", "developer-tools", "agent-protocols"], "entities": ["ToolJet", "ToolJet MCP", "Supabase", "Postgres", "Ontario"], "alternates": {"html": "https://wpnews.pro/news/build-a-dispatch-command-centre-with-tooljet-mcp", "markdown": "https://wpnews.pro/news/build-a-dispatch-command-centre-with-tooljet-mcp.md", "text": "https://wpnews.pro/news/build-a-dispatch-command-centre-with-tooljet-mcp.txt", "jsonld": "https://wpnews.pro/news/build-a-dispatch-command-centre-with-tooljet-mcp.jsonld"}}