Component kit/App shellPhone

App shell

The frame every admin page sits in: the navy menu, the place you are working in, the trail back, and a way to jump anywhere.

RJ HQ and each brand share one shell. The place card, its tile and a steel hairline make the difference obvious at a glance.

Two shells, one system

Same navy column; the place card, its tile and the steel hairline say which world you are in before you read a word.

RJ HQsuper admin · Overview, Catalogue, Brands & access
Staging

Global Store

214 products offered to brands · 38 drafts waiting to publish

Navy birdseye two-piece suit
HS 81045 · Crystal Springs
Available£1,150v4
Mid-grey flannel trousers
HS 64033 · Sherry Flannel
Draft£340v1
Navy chalk-stripe three-piece
VBC 403.0118 · Revenge
Available£1,390v3
Brown glen check waistcoat
HS 92201 · Moorland Tweed
Retired£260v5
Brand: RJ Clothingbrand admin · menu filtered by role and capability
Staging

My Products

38 products on RJ Clothing · 6 drafts

Navy birdseye two-piece suit
HS 81045 · Crystal Springs
Available£1,150v4
Charcoal herringbone jacket
VBC 218.1003 · Perennial
Available£780v2
Stone linen jacket
HS 30612 · Irish Linen
Draft£690v1
shadcnSidebar · SidebarHeader · SidebarGroup · SidebarMenuButton · SidebarMenuBadgeUses.frame.app.sidebar.sh-hq.sh-place.sh-mono.hq|.br.sb-item.sh-cnt--sidebar-*

Settings sub-nav

Under /settings the column swaps to Settings, with one way back to the full menu.

Staging

Brand

Identity, storefront theme, contact and features for RJ Clothing

Display name
RJ Clothing
Slug
rj-clothing
Storefront domain
rjclothing.com
Subdomain rjmtm.com
rjclothing
shadcnSidebar · SidebarGroupLabel · SidebarMenuButton[isActive]Uses.sh-back.sh-sub-h.sb-item.on.page.ph

Top bar and environment

Where you are on the left; environment, page help and account on the right, in the same order on every page.

Stagingamber badge, plus the 32px engineers' banner on every page
Engineers' staging copy. To edit or publish your website, use dtc-admin.rjmtm.com
Staging
Production
Production
Local, with the access noticesits under the bar until the brand is picked again
Local
Site selection expired or access changed. Select the brand again.
Account button
default
hover
focus
loading
Environment badge
StagingProductionLocal
Account menu, open
shadcnBadge · Alert · DropdownMenu · DropdownMenuLabel · DropdownMenuItem[disabled] · AvatarUses.topbar.staging.env-prod.sh-banner.sh-notice.help-q.menu.mi

Place switcher

The card at the top of the column. ⌘B opens it; RJ HQ sits first for super admins.

default
hover
focus
disabled
RCRJ ClothingOnly brand you can open
error
loading
Open
Find a brandesc
Global DTC2
B2B1
?Unresolved brand nameBrand names unavailable
3 brands · super adminOpen in production
No match
linenesc
No brand matches “linen”Check the spelling, or look under B2B.
3 brands · super adminOpen in production
Try itopens with the approved drop; Escape closes
Find a brandesc
Global DTC2
Failed to load
Find a brandesc
3 brands · super adminOpen in production
shadcnPopover · Command · CommandInput · CommandGroup · CommandItem · CommandEmptyUses.sh-place.menu.sh-pop-s.sh-row.sh-grp.sh-mono.l-hq|.l-dtc|.l-b2b[data-k-pop]--motion-pop-in

Command palette

⌘K from anywhere. It only goes to pages you can open in this place, grouped the way the menu is.

Trigger
default
hover
focus
Staging

My Products

38 products on RJ Clothing · 6 drafts

Navy birdseye two-piece suit
HS 81045 · Crystal Springs
Available£1,150v4
Charcoal herringbone jacket
VBC 218.1003 · Perennial
Available£780v2
Stone linen jacket
HS 30612 · Irish Linen
Draft£690v1
Nothing typedevery page in this place, by group
Jump to…esc
Store
Dashboard/Orders/ordersCustomers/customers
Products
Global Store/global-storePricing/pricing
↑↓Move↵OpenRJ Clothing menu · 20 pages
No results
shadcnCommandDialog · CommandInput · CommandList · CommandGroup · CommandItem · CommandEmptyUses.sh-jump.sh-cmd.sh-cmd-in.sh-row.actkbd.k-dialog--e-dialog--motion-sheet-in

Embedded Payload CMS

Our chrome around Payload's editor: what it is, which brand it is scoped to, reload and pop-out. The editor inside stays Payload's own.

Payload CMSScoped to RJ Clothing
cms.rjmtm.com/admin
CollectionsPagesNavigationMediaGlobalsHeaderFooter

Pages

TitleSlugStatusUpdated
HomehomePublished2 Oct
SuitssuitsPublished29 Sep
Our clothsour-clothsDraftToday 14:20
Book a fittingbook-a-fittingPublishedYesterday
Loading
Payload CMS
Opening the editorLoading Payload for RJ Clothing.
Error
Payload CMS
Empty
Payload CMS
No brand selectedPick a brand to edit content.
Not wired
Payload CMSNot wired
Editor is off on this environmentThe Payload address is not set on staging, so content can only be edited in production.
shadcnCard · CardHeader · Badge · Button[variant=ghost,size=icon] · SkeletonUses.sh-frame.sh-frame-h.sh-frame-b.chip.info.chip.warning.icon-btn.ghost