Removing the demo
Start from a starter
The fastest way to remove the demo is to not have it. Each of the five starters — starters/html/, starters/react/, starters/nextjs/, starters/vue/ and starters/nuxt/ — is built by stripping every demo-only file out of its edition: no demo data, no mock API, no auth and no record search. A deny-list, LEFTOVER_RE in tools/starter/build.mjs, then fails the build if anything demo-shaped survived by accident. See starters for how to copy one out and run it.
What follows is for a full edition that already has screens built against the demo, where switching to a starter is not an option.
What the demo is
| Demo bar (role switcher, Reset) | Mock API | Demo accounts / session | Landing page | /crash | |
|---|---|---|---|---|---|
| HTML | html/partials/demobar.html, included by {{> demobar}} | shared/mock/api.mjs, bundled into html/assets/vendor/orion-shared.js | shared/auth/session.mjs, read in html/assets/js/app.js and html/assets/js/page-auth.js | html/pages/landing.html, html/layouts/landing.html, html/assets/js/page-landing.js | — |
| React | react/src/components/DemoBar.tsx | react/src/app/mocks/handle.ts and react/src/app/mocks/server.ts (MSW) over shared/mock/api.mjs | react/src/shared/auth/session.mjs, read in react/src/app/session.ts | react/src/pages/Landing.tsx | react/src/pages/Crash.tsx |
| Vue | vue/src/components/DemoBar.vue | vue/src/app/mocks/handle.ts and vue/src/app/mocks/server.ts (MSW) over shared/mock/api.mjs | vue/src/shared/auth/session.mjs, read in vue/src/app/session.ts | — | vue/src/pages/Crash.vue |
| Next.js | nextjs/src/components/demo-bar.tsx | nextjs/src/server/api.ts, in the server process directly (no MSW) | nextjs/src/shared/auth/session.mjs, read in nextjs/src/server/api.ts and nextjs/src/server/auth-actions.ts | — | nextjs/src/app/[locale]/crash/page.tsx |
| Nuxt | nuxt/app/components/DemoBar.vue | nuxt/server/utils/mock.ts and nuxt/server/api/[...path].ts, in the server process directly (no MSW) | nuxt/app/shared/auth/session.mjs, read in nuxt/server/api/[...path].ts | — | nuxt/app/pages/crash.vue |
The demo fixtures are the generated JSON under each edition's shared/mock/ mirror — the product, customer and order data, and the rest of it — produced by tools/mock-data/build.mjs. Replacing the mock API with your own backend is what stops them being read at all; there is nothing else to delete for them specifically.
HTML
The toolbar. partials/demobar.html is included by {{> demobar}} in
every page that has it — 16 of this edition's pages
(grep -l '{{> demobar}}' pages/*.html). Delete the partial and its
{{> demobar}} line from each of them. The role switcher (the
data-or-role-switch group) lives inside that same partial and goes with it.
Two more pieces of the toolbar live outside it, in assets/js/app.js: the
[data-or-demo], [data-or-demo-reset] and [data-or-demo-role] click
handlers. A sixth piece lives in six page scripts' own error state —
page-customer.js, page-customers.js, page-dashboard.js, page-order.js,
page-orders.js and page-products.js each render a "Try again"
data-or-demo button of their own. Delete the handlers and the six buttons
along with the partial, or the markup left behind has nothing to click.
Mock data. Of the four scripts injected in partials/foot.html, only one
is demo-only: remove the shared/mock/dataset.inline.js tag and keep
shared/icons/sprite.inline.js, shared/brand/wordmark.inline.js and
shared/locales/locales.inline.js, which every edition needs regardless. In
bundle.mjs, drop the shared/mock/* re-exports — createDataset/
summarise, createApi/createFetchLike, persistMutations, runQuery/
paramsFromSearch, COLLECTIONS, createDemoState/DEMO_DEFAULTS/
errorBody — and shared/mock/analytics.mjs's analyse, the function that
builds the Analytics report from the mock dataset. Keep that module's
rangeFrom and HEATMAP_BLOCKS, and analyticsView from
shared/analytics/view.mjs: assets/js/page-analytics.js reads all three
straight from the browser, not through the mock API, so the Analytics screen
still needs them once GET /api/metrics/analytics is your own endpoint.
In assets/js/app.js, replace the data layer built from those exports —
window.OR_DATA, Shared.createDataset, Shared.createDemoState,
Shared.persistMutations(Shared.createApi(…)) and Shared.createFetchLike
— with a fetch to your own API behind the get/send helpers the page
controllers already call. One more thing reads the dataset directly: the
window.Orion object's dataset property is that same
Shared.createDataset(…) instance, and assets/js/page-dashboard.js calls
its .rows('orders') and .rows('deals') to total order statuses and
pipeline stages without a round trip through get/send. Give the
dashboard a real source for those two totals — a summary endpoint, or count
them from data you already fetched — before dropping dataset from the app
object.
Demo session. Following shared/auth/README.md's "What to keep, what to
delete," replace Session.readToken, Session.sessionUser and
Session.bearer in assets/js/app.js, and the token write in
assets/js/page-auth.js's login screen (shared.session.writeToken(…)),
with your real sign-in. The lock screen's own
window.Orion.get('/auth/session') call, further down
assets/js/page-auth.js, needs no change: it already goes through the same
fetch wrapper as every other request, calling the real GET /auth/session
contract shared/auth/README.md documents. Then drop export * as session
from bundle.mjs. Keep permissions — shared/auth/permissions.mjs is
product code a real backend still needs.
Landing. If you are not keeping the marketing page, delete
pages/landing.html, layouts/landing.html and assets/js/page-landing.js.
Keep assets/js/plans.js if pages/pricing.html stays — it draws the plan
cards both pages read from shared/billing/pricing.mjs.
React
react/src/components/DemoBar.tsx— delete, and remove its import and use from every page underreact/src/pages/that renders it:Analytics.tsx,Calendar.tsx,CustomerProfile.tsx,Customers.tsx,Dashboard.tsx,Forbidden.tsx,Inbox.tsx,Invoice.tsx,OrderDetail.tsx,Orders.tsx,Pipeline.tsx,Pricing.tsx,ProductEdit.tsx,Products.tsx,Profile.tsxandSettings.tsx.react/src/app/demo.ts— delete last. ItsuseDemo/useApplyDemoare woven into the query cache:react/src/app/queries.tshas an internaluseDemoKey()helper threaded into the query key of about fourteen hooks (summary, timeseries, settings, profile, invoices, list, detail, notifications, search and their mutations) so that toggling the demo bar's empty/error switches invalidates the right cache entries — delete that helper and dropdemoKeyfrom each of those query keys.react/src/pages/Analytics.tsx,Calendar.tsxandInbox.tsxeach build their own inline demo key the same way for their own query — remove it from each.react/src/pages/Dashboard.tsxcallsuseApplyDemoonly to refetch right after a demo-state change — remove that call too, then deletedemo.tsitself.react/src/app/mocks/handle.tsandreact/src/app/mocks/server.ts— delete the MSW mock server, and drop thestartMockServer()call and its import fromreact/src/main.tsx.react/src/layout/Palette.tsx— remove the command palette's "Reset demo" command (POST /__reset).react/src/app/session.ts— deleteDEMO_ACCOUNTS,tokenForandswitchAccount, and pointreact/src/app/api.ts's token source at your real sign-in instead of the demo'sreadToken/browserStorage. See what to keep, what to delete for the module split.react/src/pages/Crash.tsx— delete, and its/crashroute inreact/src/app/App.tsx.react/src/pages/Landing.tsx— delete if you are not keeping the marketing page, and its/landingroute inreact/src/app/App.tsx.
Vue
vue/src/components/DemoBar.vue— delete, and remove it from every page undervue/src/pages/that renders it:Analytics.vue,Calendar.vue,CustomerProfile.vue,Customers.vue,Dashboard.vue,Forbidden.vue,Inbox.vue,Invoice.vue,OrderDetail.vue,Orders.vue,Pipeline.vue,Pricing.vue,ProductEdit.vue,Products.vue,Profile.vueandSettings.vue.vue/src/app/demo.ts— delete last. ItsuseDemo/useApplyDemoare woven into the query cache:vue/src/app/queries.tshas an internaluseDemoKey()helper threaded into the query key of about fourteen hooks (summary, timeseries, analytics, calendar, inbox, settings, profile, invoices, list, detail, notifications and search, and their mutations) so that toggling the demo bar's empty/error switches invalidates the right cache entries — delete that helper and dropdemoKeyfrom each of those query keys.vue/src/pages/Dashboard.vuecallsuseApplyDemoonly to refetch right after a demo-state change — remove that call too, then deletedemo.tsitself.vue/src/app/mocks/handle.tsandvue/src/app/mocks/server.ts— delete the MSW mock server, and drop thestartMockServer()call fromvue/src/main.ts.vue/src/layout/Palette.vue— remove the command palette's "Reset demo" command (POST /__reset).vue/src/app/session.ts— deleteDEMO_ACCOUNTSandswitchAccount, and pointvue/src/app/api.ts's token source at your real sign-in. See what to keep, what to delete for the module split.vue/src/pages/Crash.vue— delete, and its/crashroute invue/src/router.ts.
Next.js
nextjs/src/components/demo-bar.tsx— delete, and remove its import and use from everypage.tsxundernextjs/src/app/[locale]/that renders it: the dashboard page and itsanalytics,calendar,customers(list and detail),forbidden,inbox,invoices(detail),orders(list and detail),pipeline,pricing,products(list and detail),profileandsettingsroute folders.nextjs/src/server/demo.ts— delete theresetDemoserver action.nextjs/src/layout/palette.tsx— remove the command palette's own "Reset demo" command, which also imports and callsresetDemo.nextjs/src/server/api.tsandnextjs/src/server/auth-actions.ts— this edition has no separate mock-server folder; the mock router runs inside the server process itself. Point these at your real backend instead of the in-memory dataset, and replace the demo's session-cookie handling with your real sign-in. See what to keep, what to delete for the module split.nextjs/src/app/[locale]/crash/page.tsx— delete the file; routing is file-based here, so there is no separate route registration to remove.- This edition has no landing page.
Nuxt
nuxt/app/components/DemoBar.vue— delete, and remove it from every page undernuxt/app/pages/that renders it:index.vue,analytics.vue,calendar.vue,forbidden.vue,inbox.vue,pipeline.vue,pricing.vue,profile.vue,settings.vue, thecustomers,ordersandproductslist and detail pages, and theinvoicesdetail page.nuxt/server/utils/mock.tsandnuxt/server/api/[...path].ts— this edition also has no separate mock-server folder; the mock router runs on Nuxt's own server. Point these at your real backend, and replace the demo's cookie-based session with your real sign-in. See what to keep, what to delete for the module split.nuxt/app/pages/crash.vue— delete the file; routing is file-based here too, so there is no separate route registration to remove.- This edition has no landing page.