// ChairShare — owner cluster (15-19) const OwnerShell = ({ active, children, title, subtitle, action }) => { const items = [ ["home", "Today", 15], ["pin", "Properties", 16], ["scissors", "Practitioners", 17], ["plus", "Onboard", 18], ["card", "Revenue", 19], ]; return (

{subtitle}

{title}

{action}

{children}

); }; const OwnerHome = () => { const stats = [ { l: "Active practitioners", v: "9", sub: "of 12 chairs" }, { l: "GMV this month", v: "$48.2k", sub: "+18% vs Apr" }, { l: "Chair rent collected", v: "$11,240", sub: "of $11,540 due" }, { l: "Occupancy", v: "75%", sub: "9 of 12 chairs" }, ]; const alerts = [ { dot: "warn", t: "KYC stuck for Lara K.", sub: "Stripe pending 4 days · nudge", action: "Nudge" }, { dot: "err", t: "Rent overdue · Iris T.", sub: "$285 · 2 days late", action: "Send reminder" }, { dot: "warn", t: "Chair 03 maintenance overdue", sub: "Yarraville · last serviced 3 mo", action: "Schedule" }, ]; return ( + Onboard practitioner}>

{stats.map(s => (

{s.l}

{s.v}

{s.sub}

))}

Needs attention

{alerts.length} alerts

{alerts.map((a, i) => (

{a.t}

{a.sub}

))}

Properties

{[ { name: "Atelier · Yarraville", chairs: "4 of 4 leased", gmv: "$22.1k", occ: 100 }, { name: "House of Lune · Brunswick", chairs: "3 of 5 leased", gmv: "$18.4k", occ: 60 }, { name: "Studio West · Footscray", chairs: "2 of 3 leased", gmv: "$7.6k", occ: 67 }, ].map((p, i) => (

{p.name} {p.gmv}

{p.chairs}{p.occ}% occupied

))}

); }; const OwnerProperties = () => { const props = [ { name: "The Atelier · Yarraville", chairs: [ { n: "Chair 01", status: "leased", who: "Amelia M.", rate: "$285", tone: "rose" }, { n: "Chair 02", status: "leased", who: "Hannah G.", rate: "$285", tone: "gold" }, { n: "Chair 03", status: "leased", who: "Marco T.", rate: "$320", tone: "default" }, { n: "Chair 04", status: "maintenance", who: null, rate: "$285", tone: null }, ]}, { name: "House of Lune · Brunswick", chairs: [ { n: "Chair 01", status: "leased", who: "Iris T.", rate: "$245", tone: "rose" }, { n: "Chair 02", status: "available", who: null, rate: "$245", tone: null }, { n: "Chair 03", status: "leased", who: "Lara K.", rate: "$245", tone: "gold" }, { n: "Chair 04", status: "available", who: null, rate: "$245", tone: null }, { n: "Chair 05", status: "leased", who: "Priya N.", rate: "$245", tone: "default" }, ]}, ]; const statusPill = s => { if (s === "leased") return leased; if (s === "available") return available; return maintenance; }; return ( + Add chair}>

{props.map(p => (

{p.name}

{p.chairs.filter(c => c.status === "leased").length} of {p.chairs.length} leased

{p.chairs.map(c => (

{c.n} {statusPill(c.status)}

{c.who ? (

{c.who}

) : (

{c.status === "maintenance" ? "Backwash repair · 2 days" : "Open for lease"}

)}

{c.rate} / week

))}

); }; const OwnerPractitioners = () => { const rows = [ { name: "Amelia Marcheva", slug: "amelia.cuts", chair: "Atelier 01", rent: "ok", kyc: "ok", gmv: "$8.4k", tone: "rose" }, { name: "Hannah Geist", slug: "hannah.hair", chair: "Atelier 02", rent: "ok", kyc: "ok", gmv: "$6.1k", tone: "gold" }, { name: "Marco Trevi", slug: "marco.cuts", chair: "Atelier 03", rent: "ok", kyc: "ok", gmv: "$7.6k", tone: "default" }, { name: "Iris Tan", slug: "iris.studio", chair: "Lune 01", rent: "late", kyc: "ok", gmv: "$3.2k", tone: "rose" }, { name: "Lara Khoury", slug: "lara.k", chair: "Lune 03", rent: "ok", kyc: "pending", gmv: "$0.9k", tone: "gold" }, { name: "Priya Nair", slug: "priya.colour", chair: "Lune 05", rent: "ok", kyc: "ok", gmv: "$5.8k", tone: "default" }, ]; const pill = (kind, val) => { if (kind === "rent" && val === "ok") return paid; if (kind === "rent" && val === "late") return late; if (val === "ok") return verified; if (val === "pending") return pending; }; return ( }>

{["All", "Active", "KYC pending", "Ended"].map((c, i) => ( {c} ))}

PractitionerSubdomainChairRentKYCGMV (mo)

{rows.map((r, i) => (

{r.name}

{r.slug}.voxink {r.chair} {pill("rent", r.rent)} {pill("kyc", r.kyc)} {r.gmv}

))}

); }; const OwnerOnboard = () => { return ( Save draft}>

Practitioner details

First name

Last name

Phone

ABN

Instagram

Chair assignment

Chair

Days

Weekly rent

Lease preview · auto-generated

CLEO_VANCE_LEASE_DRAFT.pdf

Chair Rental Agreement

House of Lune · Chair 02

Between: ChairShare Pty Ltd and Cleo Vance (ABN 44 555 666 777).

1. Chair. Chair 02 at 14 Sydney Rd, Brunswick — Thursdays, Fridays, Saturdays.

2. Rent. $245 per week, direct debit weekly in advance.

3. Term. Three months minimum, rolling. 30 days notice after.

4. Included. Chair, station, mirror, backwash, towels, utilities, wifi, cleaning, booking platform.

This document will be emailed to cleo@vancehair.co alongside a magic-link signup. She types her name to sign.

); }; const OwnerRevenue = () => { const props = [ { p: "Atelier · Yarraville", gmv: 22100, rent: 4280, mkt: 410 }, { p: "House of Lune · Brunswick", gmv: 18400, rent: 3860, mkt: 280 }, { p: "Studio West · Footscray", gmv: 7600, rent: 2520, mkt: 0 }, ]; const max = 22100; return (

{["Month", "Quarter", "Year", "Custom"].map((v, i) => ( ))}

{[ { l: "Customer GMV", v: "$48,200", sub: "127 bookings", main: false }, { l: "Marketing fees", v: "$690", sub: "1.4% of GMV" }, { l: "Chair rent", v: "$10,660", sub: "9 of 12 chairs" }, { l: "To ChairShare", v: "$11,350", sub: "+18% vs Apr", main: true }, ].map((s, i) => (

{s.l}

{s.v}

{s.sub}

))}

By property · GMV

{props.map(r => (

{r.p} ${(r.gmv/1000).toFixed(1)}k

))}

Stripe payouts log

{[ { d: "Mon May 4", a: "$3,820.40", to: "ChairShare ANZ ····7702" }, { d: "Mon Apr 27", a: "$2,940.80", to: "ChairShare ANZ ····7702" }, { d: "Mon Apr 20", a: "$3,108.20", to: "ChairShare ANZ ····7702" }, ].map((p, i) => (

{p.a}

{p.d} · {p.to}

arrived

))}

); }; window.OwnerHome = OwnerHome; window.OwnerProperties = OwnerProperties; window.OwnerPractitioners = OwnerPractitioners; window.OwnerOnboard = OwnerOnboard; window.OwnerRevenue = OwnerRevenue;