// Shared components — Navbar, Footer, Hero, TrustStrip, WhatsAppFab, etc.
// Make available globally for the page scripts.
const { useState, useEffect, useRef, useMemo } = React;
/* ---------- Nav ---------- */
function DSCNavbar({ route, navigate }) {
const [scrolled, setScrolled] = useState(false);
useEffect(() => {
const onScroll = () => setScrolled(window.scrollY > 20);
onScroll();
window.addEventListener("scroll", onScroll, { passive: true });
return () => window.removeEventListener("scroll", onScroll);
}, []);
const links = [
{ id: "treatments", label: "Treatments" },
{ id: "dentists", label: "Dentists" },
{ id: "contact", label: "Visit" },
];
return (
);
}
/* ---------- Trust strip ---------- */
function DSCTrustStrip() {
const d = window.DSC_DATA;
return (
{d.ratings.doctify.score}/{d.ratings.doctify.of}
Doctify · {d.ratings.doctify.count} verified reviews
{d.ratings.google.score}/{d.ratings.google.of}
Google · ~{d.ratings.google.count} reviews
20+ yrs
In Dubai since {d.clinic.foundedYear}
DHA
Regulated · Trio Dental LLC
);
}
/* ---------- Hero v2 — editorial theatre ---------- */
function DSCHero({ navigate }) {
const d = window.DSC_DATA;
// Live-ish clock (Dubai time — UTC+4)
const [now, setNow] = useState(() => new Date());
useEffect(() => {
const t = setInterval(() => setNow(new Date()), 30000);
return () => clearInterval(t);
}, []);
const dubaiTime = useMemo(() => {
const fmt = new Intl.DateTimeFormat("en-GB", {
hour: "2-digit", minute: "2-digit", timeZone: "Asia/Dubai", hour12: false
});
return fmt.format(now);
}, [now]);
// Floor counter that climbs to 21 on mount
const [floor, setFloor] = useState(1);
useEffect(() => {
let f = 1;
const id = setInterval(() => {
f += 1;
setFloor(f);
if (f >= 21) clearInterval(id);
}, 75);
return () => clearInterval(id);
}, []);
return (
{/* Meta ticker line */}
25.2513° N · 55.3014° E
Burjuman Business Tower · Level 21
Dubai · {dubaiTime} GST
Altitude · ~84 m
Now booking — consultations
{/* Floor counter — elevator strip */}
{[21, 18, 15, 12, 9, 6, 3, 1].map((n) => {
const isActive = n === 21 && floor >= 21;
const isPassing = n === floor;
const isReached = floor >= n;
return (
{String(n).padStart(2, "0")}
);
})}
{/* Headline + lede + CTAs */}
Est. 2006 · By appointment
Dental excellence
with a view.
Twenty years of trusted, higher-ticket dentistry — practised on Dubai's twenty-first floor , by an internationally trained team that explains everything before they begin.
{/* The Window — actual clinic interior with overlays */}
View · East / 21F
Floor
{String(floor).padStart(2, "0")} / 21
↗
Burjuman · interior
clinic-interior-01.webp · Trio
{dubaiTime}
{/* Marquee */}
);
}
function DSCMarqueeBlock() {
const items = [
{ kind: "num", num: "4.99", text: "on Doctify · 40 verified reviews" },
{ kind: "text", text: "DHA-regulated" },
{ kind: "num", num: "~4.8", text: "on Google · 392 reviews" },
{ kind: "text", text: <>German-Swedish founders · est. 2006 > },
{ kind: "text", text: "3D CBCT · digital scanning · laser" },
{ kind: "num", num: "20+", text: "years in Dubai" },
{ kind: "text", text: <>WIN lingual braces · Smile Design > },
{ kind: "text", text: "EN · DE · AR · FR" },
{ kind: "num", num: "21F", text: "Burjuman Business Tower" },
{ kind: "text", text: <>Tabby · pay in four> },
];
return (
<>
{items.map((it, i) => (
{it.kind === "num" ? {it.num} : null}
{it.text}
))}
>
);
}
/* ---------- WhatsApp FAB ---------- */
function DSCWhatsAppFab() {
return (
);
}
/* ---------- Mobile sticky CTA ---------- */
function DSCMobileCTA({ navigate }) {
return (
);
}
/* ---------- Footer ---------- */
function DSCFooter({ navigate }) {
const d = window.DSC_DATA;
return (
);
}
/* ---------- Section header helper ---------- */
function DSCSectionHead({ eyebrow, title, link }) {
return (
);
}
/* ---------- Treatment card ---------- */
function DSCTreatmentCard({ t, onClick }) {
return (
{t.name}
{t.blurb}
{t.category} →
);
}
/* ---------- Dentist card ---------- */
function DSCDentistCard({ d, onClick }) {
return (
{d.verified &&
Verified credentials }
{d.name}
{d.role}
{(d.languages || []).join(" · ")}
);
}
/* ---------- Tabby strip ---------- */
function DSCTabbyStrip() {
return (
Pay in 4 with Tabby . Implants, smile makeovers and aligners are eligible. Subject to Tabby's approval.
);
}
Object.assign(window, {
DSCNavbar, DSCTrustStrip, DSCHero, DSCMarqueeBlock, DSCWhatsAppFab, DSCMobileCTA,
DSCFooter, DSCSectionHead, DSCTreatmentCard, DSCDentistCard, DSCTabbyStrip,
});