Sales forecasts with live pipeline charts, built by Claude Code on Elements

Sales forecasts with live pipeline charts, built by Claude Code on Elements

Reps update deals and submit weekly calls. Managers track commit, best case and weighted pipeline against quota in live charts.

How it's built

Commitvane needed rep and manager accounts, a dashboard that moves as reps edit deals and submit calls, charts drawn from live numbers, and a weekly snapshot job. Each of those is a part of Elements, so the agent spent its 17 minutes on the forecast math itself.

  • A live manager dashboard. Deal edits and weekly calls notify a channel, and the manager's dashboard re-reads its numbers, so tiles, the call-versus-deals table and charts update within a second of a rep's change.
  • Charts that redraw. Each chart mounts when its canvas appears on the page and redraws when the numbers change. The charting package came in with elements install.
  • Edits as function calls. Reps update deals and submit weekly calls, and managers set quotas and stage probabilities, through @rpc functions called straight from the page. Marking a deal closed moves it to closed won in the same update.
  • A weekly snapshot job. A one-line cron schedule runs a job every Monday at 7am that records each rep's numbers for the week, so the week-over-week chart has history.
  • Forecast math in SQL. One query sums closed, commit, best case and pipeline per rep and weights each deal by its stage probability. Reps and managers each sign in to their own pages.
  • Data from SQL files. Migrations define the schema and seed two managers, eight reps with quotas, sixty deals, and eight weeks of snapshots and calls. The project server applied each one as soon as it was saved.

Why Elements

Elements is an integrated full-stack app framework and a project server. The project server checks the agent's work as it builds: it type-checks the server and browser code, analyzes the program, applies migrations and runs the tests, then reports the results to the agent. A security mistake, such as calling a server-only function from the browser, is a compile error. The agent reads the report and fixes its own mistakes before it tells you a feature is done. The same checks run on every feature you ask for next.

Run it yourself

  1. 1 Sign up

    Already have an account? Sign in

  2. 2 Install and run the demo One prompt to paste into your agent.

View the code on GitHub →

The prompt

What Claude was given to build this app.

Agent Prompt
Build a sales forecasting tool named commitvane for a sales team of eight reps and
two managers.

REP
- Log in, see their open deals: account, amount, stage, close date,
  forecast category (pipeline, best case, commit, closed).
- Update a deal's amount, close date or category.
- Submit a weekly call: their commit and best-case numbers for the quarter.

MANAGER
- Quarter dashboard: quota, closed won, commit, best case, pipeline, and a
  weighted forecast (amount x stage probability), for the team and per rep.
- Charts: closed won against quota by week (line), forecast by category per
  rep (stacked bar), and how the team's commit has moved week over week.
- A table of every rep's call next to what their deals add up to, with the gap
  highlighted.
- Set quotas per rep per quarter and stage probabilities.

Every Monday at 7am, snapshot each rep's numbers so the week-over-week chart
has history.

Use Chart.js for the charts.

Seed two managers, eight reps with quotas, sixty deals across stages and
categories this quarter, and eight weeks of snapshots. Show the seeded logins
on the sign-in page.

Deal edits and submitted calls update the manager dashboard in real time.