Worksed.mehdi

Spindle Admin Kit

A white-label admin dashboard: one codebase runs a server host, a SaaS, a store, an academy and a print shop, all on synthetic data.

Try the Live Demo of Spindle Admin Kit
The Spindle Admin Kit dashboard for Nodemill, a fictional server host, in the dark theme: active servers, orders, MRR, average order value and churn, all synthetic

The problem

The admin panel I built for GozarX could not be shown to anyone: every figure on it is real, and it was written for one business. A dashboard worth showing had to run without a server and without real data, and for more than one kind of company.

What I built

  • Profiles, not forks. One profile object per business sets the brand, the navigation, the KPIs, the charts, the radar, the live figures, the health checks, the tables and every word of copy, in English and Persian. A server host, a SaaS, a store, an academy and a print shop run on the same components.
  • A seeded generator whose numbers add up. Every figure comes from one deterministic stream per business, the same for every visitor: a KPI is the sum of the days its chart draws, the 7-day window is the tail of the 14-day one, the servers running are the servers delivered minus the ones deleted, and a CSV export holds exactly what is on screen.
  • Keyboard first. Ctrl/Cmd+K opens a command palette for every page, business, range and theme, and every control has a visible focus ring and a name.
  • Right to left. Persian mirrors the layout and the time axes and prints Persian digits, and no figure is reordered by the bidi algorithm on the way.
  • Accessible. Text reaches 4.5:1 on the colour really under it, touch targets are 44px on phones, and Reduce Motion stills every animation and the live ticker.

How it is tested

Every browser check first runs on a page broken on purpose, by a stylesheet, a script or a rewritten response that the shipped code knows nothing about, and has to fail there before its pass on the real page counts. A display audit then measures the rendered pages at eight widths, in both themes and both languages: contrast on the real background, cut text, focus hidden under the bars, touch targets and layout shift.

The numbers

  • 104.1 KB of JavaScript, gzipped, on the first load; every other page loads when it is opened.
  • 132 unit tests and 18 browser checks, each browser check proven on a broken page first.
  • No request to any other host: the data is made in the browser and nothing leaves it.