Core workflows

How to run mobile mechanic jobs, inspections & invoices

Step by step: log a booking, add customers, assign and complete inspection forms with photos, create invoices and export branded PDFs in MechanicDesk.

MechanicDesk helps an operator or technician manage mobile mechanic jobs from a phone, tablet or desktop browser. During the migration, the retained mobile bundle can still be deployed through iOS or Android native shells, and the Next.js platform can be wrapped by Capacitor for hosted native builds.

What it does

  • Logs bookings and jobs.
  • Stores customer and vehicle details.
  • Assigns versioned form templates to jobs.
  • Includes generic pre-condition, maintenance-log, post-diagnosis, handover and vehicle health-check templates.
  • Lets paid users import customer-specific PDF/image templates into editable Pro templates when Pro access is active.
  • Supports icon-coded checklist rows, Yes/No service checks, vehicle diagram marks and tyre tread-depth fields.
  • Attaches camera/photos to checklist items.
  • Creates invoices with line items and totals.
  • Produces PDFs for forms and invoices.
  • Stores business details, bank details, logo and technicians for generated paperwork.
  • Provides browser address autofill plus UK postcode suggestions for address fields.

Where to find it

  • Navigation: bottom navigation bar
  • URL: /
  • Native prototype: Capacitor iOS/Android shells generated from either the bundled fallback or the hosted Next platform URL.

Step by step

Log or edit a job

  1. Open Jobs.
  2. Select Log booking or choose an existing job.
  3. Add or select a customer.
  4. Enter booking status, date, time, location, VRN, make, model, colour and mileage.
  5. Add notes where needed.
  6. Select Save or Save job.

In the hosted /app workspace, open Operations, create a job under New job, or choose Edit on an existing row in Jobs. The Selected job panel lets you change the customer, status, job title, booking date/time, vehicle registration, make, model, colour, mileage, location and notes, then select Save job. To edit a customer, select a row under Saved customers, update the name, email, phone or address, then select Save customer; the shared customer update action also refreshes linked job and invoice customer details.

Assign a form to a job

  1. Open Jobs.
  2. Select the job.
  3. In Forms, open the template picker and choose a template version.
  4. Select Add form.
  5. Open the new form from the job screen or the Forms tab.
  6. A job cannot add the same template version twice. If the template is saved as a new version, that new version becomes available.

Import a Pro bespoke template

  1. Open More.
  2. Select Templates.
  3. In Pro bespoke templates, check the Pro access message. If Pro is active, select Import template.
  4. Choose a PDF or image from the device.
  5. MechanicDesk creates an editable Pro template with source-file metadata and suggested sections/checks.
  6. Select Review on the imported template.
  7. Check the source preview, required fields, confidence scores and review messages.
  8. Add review notes where useful.
  9. Select Approve conversion when the mapping is ready, or choose Edit fields to rename sections and checks first.
  10. Assign the approved template to a job and preview the generated PDF before using it operationally.

In the hosted /app workspace, converted bespoke forms show whether PDF output will use mapped fields over the source background. When background pages and field mappings are present, Download PDF and Print create source-background overlay pages first, followed by a structured summary appendix for notes, unmapped checks and photos.

Current limitation: image imports can be preserved as a first-page PDF background locally. PDF imports are retained with the template/form record, but production-quality OCR/field detection and multi-page raster backgrounds need the paid backend conversion service and, for PDFs, a configured rasteriser endpoint.

Edit a form template

  1. Open More.
  2. Select Templates.
  3. Choose Edit on a template card.
  4. Update the template name or description.
  5. Add, rename, move or delete sections.
  6. Add, edit, move or delete checks.
  7. Choose Tick or Yes/No as the response style.
  8. Tick Photo if a check should prompt for evidence.
  9. Select Save new version.

Complete a checklist

  1. Open Forms.
  2. Use filters/sorting if needed.
  3. Select the required form.
  4. Change status, technician and mileage.
  5. Tick normal rows or choose Yes / No for service-check rows.
  6. Use row note/photo controls for evidence.
  7. Complete diagram marks, tyre tread depths, service details, comments and signature metadata where the template includes those fields.
  8. Select Done to return to the form list.

In the hosted /app workspace, open Forms, select the form row, update status, technician, mileage, checklist results, notes, photos, maintenance details, tyre tread depths or vehicle marks, then use Download PDF, Share PDF or Print when ready. Select Remove form if the form was assigned to the wrong job or is no longer needed; the workspace selects the next available form afterwards.

Fill a form on its PDF layout (Pro)

Bespoke templates that have been imported and converted can be completed on the real source page instead of the mobile checklist. In the hosted /app workspace:

  1. Open Forms and select the form.
  2. Choose PDF layout on the Mobile layout / PDF layout toggle.
  3. Tap a box to tick it, or use the Yes / No pair on service-check rows.
  4. Pinch, or hold Ctrl and scroll, to zoom. Drag the page to move around. Use Fit to reset and Previous page / Next page on multi-page forms.
  5. Switch back to Mobile layout at any time - both views fill the same form, so nothing is lost.

The toggle only appears for a Pro account and only when the template has converted source pages with field mappings; otherwise the hint explains what is missing. The PDF layout is intentionally simpler than the mobile UX because it has to fit the printed page: it shows tick boxes, yes/no pairs and the fields the conversion mapped. Free text is only offered where the page has a real notes or comments area, and there are no photo controls - use Mobile layout to attach photos. Customer and vehicle regions are filled from the job record and shown as they will print, so there is nothing to retype. Whatever you tick here is what the exported PDF prints over the source page.

Control positions come from the conversion's field mappings, so accurate placement on your own forms depends on the conversion backend that detects them.

Export, print or email a form PDF

  1. Open a form.
  2. Select Preview PDF to open the PDF viewer.
  3. Select Print to open the print flow.
  4. Select Email to use the device share sheet where available, or to download the PDF and open an email draft.

In hosted /app native iOS/Android builds, select Share PDF to write the generated PDF to the Capacitor cache and open the platform share sheet. In a browser or PWA, the same action uses browser file sharing when available or downloads the PDF when sharing is not supported.

Create and send an invoice

  1. Open Jobs.
  2. Select the job.
  3. In Invoices, select Add invoice.
  4. Open the invoice from the job screen or the Invoices tab.
  5. Edit issue date, due date, sale type, status, VAT, customer details, line items, totals and notes.
  6. Select Preview PDF, Print or Email.

In the hosted /app workspace, open Invoices, select the invoice row, edit status, sale type, dates, tax rate, vehicle registration, notes and line items, then use Add line or line-level Remove to manage charges. Use Download PDF, Share PDF or Print to hand off the invoice. Select Remove invoice if the invoice should be deleted from the workspace; the workspace selects the next available invoice afterwards.

Set business details

  1. Open More.
  2. Select Settings.
  3. Update business details, bank details, logo and technician names.
  4. Use Protect storage where supported.
  5. If Supabase is configured, use Cloud backup to sign in, back up records, restore records or back up photos.
  6. Use Pro access -> Refresh Pro after a subscription or entitlement change.

In the hosted /app workspace, select Settings to update Business name, Company number, Phone, Email, Business address, invoice bank details, the logo and technician names. These settings use the same shared record fields as the mobile shell, so hosted PDFs, reminders and form technician pickers use the updated values.

Native build workflow

For maintainers:

npm run native:sync
MECHANICDESK_CAPACITOR_SERVER_URL=https://your-vercel-app.example npm run native:sync:hosted
cd android && ./gradlew assembleDebug
xcodebuild -project ios/App/App.xcodeproj -scheme App -configuration Debug -sdk iphonesimulator -derivedDataPath ios/build CODE_SIGNING_ALLOWED=NO build

Tips and good to know

  • Structured records are stored on the device first.
  • Photo bytes are stored in the device's local file store.
  • Supabase backup is optional and requires deployment credentials.
  • Pro access appears in More -> Settings -> Pro access. In local demo builds it may be unlocked; in production it should come from the Supabase entitlement table written by the billing webhook.
  • Hosted /app job edits update the shared structured job record, so the dashboard, forms, invoices, reminders and PDFs use the latest booking and vehicle details.
  • Hosted /app form and invoice removal updates the same shared structured records as the mobile shell. Export or back up records first if you need an audit copy before deleting draft paperwork.
  • Hosted /app business settings update the shared structured records in the browser. Use Data import and export, Share export, hosted snapshots or shared organisation snapshots to move those values between devices.
  • Hosted /app form and invoice PDF sharing and structured JSON export sharing use Capacitor native share in iOS/Android shells, browser file sharing where supported, and download fallback otherwise.
  • Automatic server-side email attachment delivery is not implemented yet.
  • Paid template import has entitlement gating, direct Stripe and CX Stripe Gateway webhook scaffolding, a conversion backend scaffold, an in-app review workflow and hosted mapped-overlay PDF output when converted background pages are available. Production OCR/layout quality still depends on the configured conversion/raster service.
  • Vehicle registration lookup needs a secure backend DVLA Vehicle Enquiry Service proxy and API key.

Troubleshooting

Problem What to try
A photo does not save Use a smaller image, check the Settings storage card, remove older large photos, then try again.
A hosted form or invoice was removed by mistake Restore from a recent JSON export, hosted user snapshot or shared organisation snapshot if one is available.
Cloud backup controls are unavailable Configure NEXT_PUBLIC_SUPABASE_URL, NEXT_PUBLIC_SUPABASE_ANON_KEY and run the Supabase setup SQL for this deployment.
Hosted Share PDF downloads instead of opening a share sheet The current browser does not support file sharing, or the hosted app is not running inside a Capacitor iOS/Android shell. Use the downloaded PDF or test through a native build.
Hosted Share export downloads instead of opening a share sheet The current browser does not support file sharing, or the hosted app is not running inside a Capacitor iOS/Android shell. Use the downloaded JSON export or test through a native build.
Email does not attach the PDF Use the downloaded PDF and attach it manually, or use the device share sheet if available.
Preview PDF does not open Check the browser allows pop-ups/new tabs, then use Email or Print as a fallback.
Imported template fields are too generic Edit the converted template and rename/add checks before assigning it to live jobs.
Import template is locked Sign in with a Pro-enabled account, or check the build's NEXT_PUBLIC_MECHANICDESK_PRO_MODE setting for pilot/demo access.
PDF source has a local preview but no canonical background Configure the paid conversion service with PDF_RASTERIZER_ENDPOINT and matching PDF_RASTERIZER_SHARED_SECRET, then import again or rerun conversion.

Related guides

Ready to try it? Open the workspace and follow along — it works in your browser, installs as an app and runs offline.

Open the workspace