Wrenchloft: maintenance work orders for a manufacturing plant

Wrenchloft: maintenance work orders for a manufacturing plant

00 Markdown

Work orders on a live status board, preventive schedules that open jobs when due, phone timers for technicians, parts stock with a reorder list and a downtime dashboard.

Agent specs

Agent
Claude Code, Opus 5.5 Medium
Time
23 min
Cost
$9.45*

Agents work faster and more accurately on Elements.

* Cost at API rates, October 2026.

Run it yourself

Paste this prompt into your AI agent. You get the finished app on your own machine, ready to change however you like.

Agent Chat
Install elements:
curl -fsSL 'https://install.elements.dev?os=darwin' | sh && export PATH=~/elements/bin:$PATH

Create an Elements app from the elementscode/demo-wrenchloft scaffold:
cd ~/elements/projects
elements create wrenchloft -scaffold=elementscode/demo-wrenchloft
cd wrenchloft

Start the app.

Need an AI agent?

In AI desktop apps, paste into the Code tab, not the general chat.

How it's built

Wrenchloft needed three kinds of accounts, a board and technician timers that update on every screen, stock that drops as parts are used, and preventive work that opens itself on schedule. Each of those is a part of Elements, so the agent spent its 23 minutes on the maintenance shop itself.

What Elements gave the app

  • A live board and timers. Work orders, notes, photos, part uses and parts are LiveTables. A manager drags a card to On hold and the technician's phone shows it at once; a technician presses Start and the card on the manager's board starts its clock.
  • Stock that stays right. Using a part is an @rpc call that locks the part's row, lowers its stock and records the use in one transaction, so the count stays exact when two technicians reach for the same part. The parts page and its reorder list update as the count changes.
  • Preventive work on a schedule. A one-line cron schedule runs a job every 15 minutes that opens a work order a week before each schedule comes due, then rolls the schedule forward.
  • Photos from the floor. Technicians and requesters attach photos straight from a phone camera through a server call, stored in Postgres and served by the app's own route.
  • Roles and sessions. One guard on the signed-in user's role sends managers, technicians and requesters to their own pages and keeps every server call to the right people.
  • Data from SQL files. Migrations define the plant and seed six accounts, twelve assets across two buildings, nine preventive schedules, fourteen parts and thirty-six work orders with their parts and notes. The project server applied each one as soon as it was saved.

What the project server gave the agent

The project server runs alongside the agent and answers as soon as a file is saved: it type-checks the templates, TypeScript and SQL, applies migrations and reruns the tests, so every question came back right away and the agent kept building.

What shipped

The app type-checks with zero errors and all 46 tests pass. Every page works on desktop and phone, and live updates arrive across tabs, such as a card moving on the board, a timer starting and a stock count dropping.

The code

Build it from scratch

To watch your agent build this app from an empty project, use the prompt we used instead. It takes longer than starting from the finished app above.

Agent Chat
Install elements:
curl -fsSL 'https://install.elements.dev?os=darwin' | sh && export PATH=~/elements/bin:$PATH

Create an Elements app:
cd ~/elements/projects
elements create wrenchloft
cd wrenchloft

Start the app, then build this:

Build a maintenance work order app named wrenchloft for a manufacturing plant.

Three kinds of accounts: manager, technician and requester. Requesters report
problems, technicians do the work, and managers plan and assign it.

- Assets: name, building, production line, category, and a full work history.
- Work orders: asset, title, description, priority, status (requested,
  scheduled, in progress, on hold, done), assigned technician, due date,
  photos, parts used and time spent.
- Preventive maintenance: a schedule per asset, every so many days or weeks,
  that creates work orders automatically when they come due.
- A board with a column per status that managers drag work orders across, and
  a week calendar of scheduled work.
- Technician view for a phone: today's work orders, start and finish with a
  timer, and notes, photos and parts added on the spot.
- Parts inventory with stock counts. Using a part lowers its stock, and a low
  stock list shows what to reorder.
- Dashboard: open work orders by priority, overdue count, preventive work done
  on time this month, and downtime by asset.

Seed one manager, three technicians, two requesters, twelve assets across two
buildings, preventive schedules and twenty work orders. Show the seeded logins
on the sign-in page.

The board, technician timers and stock counts update in real time.

The weekly digest

New lessons, demos and posts from elements.dev, in one email a week.

Comments· 0