// Shared shell for kolabs site: router, apps registry, nav, footer, motion helpers
const { useState, useEffect, useRef } = React;
const clamp01 = (v) => Number.isFinite(v) ? Math.max(0, Math.min(1, v)) : 0;
const easeOut = (t) => 1 - Math.pow(1 - t, 3);
// ─── Mağaza linkleri ─────────────────────────────────────────────
const PLAY_DEV = 'https://play.google.com/store/apps/dev?id=4847348210883195663';
const APPLE_DEV = 'https://apps.apple.com/tr/developer/alperen-kolamuc/id6779129794';
const TENAX_APP_STORE = 'https://apps.apple.com/us/app/tenax-easy-workout/id6800214009';
const VAKIT_APP_STORE = 'https://apps.apple.com/us/app/vakit-ezan-namaz-k%C4%B1ble/id6786204640';
const ZIKIRMATIK_APP_STORE = 'https://apps.apple.com/tr/app/zikirmatik-zikir-sayac%C4%B1/id6779129792';
// ─── Uygulama kaydı ──────────────────────────────────────────────
// Dile bağlı olmayan kimlik: yol, renk, logo, mağaza kimlikleri, video.
// Görünen metinlerin hepsi i18n.jsx'ten okunuyor (appText).
// play: Play Store paket adı (yayında değilse null) · ios: App Store linki.
const APPS = [
{ key: 'tenax', route: '/tenax', color: '#b9ff3a', glow: '#5f9e1a', logo: 'assets/tenax-logo.png',
play: 'com.kolabs.tenax', ios: TENAX_APP_STORE, video: null, shots: 3 },
{ key: 'noctavia', route: '/noctavia', color: '#a58bff', glow: '#7a6cf0', logo: 'assets/noctavia-logo.png',
play: 'com.kolabs.noctavia', ios: null, video: 'gqFKvhNwTvY', shots: 6 },
{ key: 'zikirmatik', route: '/zikirmatik', color: '#3ddc97', glow: '#2f7bff', logo: 'assets/zikirmatik-logo.png',
play: 'com.kolabs.zikirmatik', ios: ZIKIRMATIK_APP_STORE, video: 'tkZ7tQ_YLM0', shots: 3 },
// Yol /ramazan olarak kalıyor: mağazadaki eski sürümlerin destek linkleri buraya bakıyor.
{ key: 'ramazan', route: '/ramazan', color: '#f5b83d', glow: '#3d74e0', logo: 'assets/ramazan-logo.jpg',
play: 'com.kolabs.imsakiye', ios: VAKIT_APP_STORE, video: 'q_ctbszurLQ', shots: 3 },
{ key: 'kelimebul', route: '/kelime-bul', color: '#ff7a45', glow: '#a8e04a', logo: 'assets/kelimebul-logo.jpg',
play: 'com.kolabs.kelimebul', ios: null, video: 'maW_PTYIIEg', shots: 3 },
{ key: 'hesapvakti', route: '/hesap-vakti', color: '#ff5a82', glow: '#ffd23a', logo: 'assets/hesapvakti-logo.png',
play: 'com.kolabs.hesapvakti', ios: null, video: 'C04hQT9sNX0', shots: 3 },
// Kapalı B2B, henüz iki mağazada da yok.
{ key: 'patisstray', route: '/patisstray', color: '#a57cff', glow: '#6d28d9', logo: 'assets/patisstray-logo.png',
play: null, ios: null, video: null, shots: 3, soon: true },
];
const appByKey = (k) => APPS.find(a => a.key === k);
// Mağaza görselleri metin içerir, yani dile bağlıdır. İngilizcesi YALNIZCA
// bu iki uygulamada var; diğerlerinde `-en` dosyası yok ve istenirse 404 döner.
const EN_SHOTS = new Set(['tenax', 'patisstray']);
function shotSrc(slug, name, lang) {
const suffix = (lang === 'en' && EN_SHOTS.has(slug)) ? '-en' : '';
return `assets/${slug}-${name}${suffix}.png`;
}
const shotsOf = (a, lang) => Array.from({ length: a.shots }, (_, i) => shotSrc(a.key, i + 1, lang));
// Uygulamanın o dildeki metinleri. Noctavia'nın metinleri ayrı bir ağaçta duruyor.
// `card`: ana sayfa kartının adı, açıklaması ve kategorisi (t.home.apps) — hero bunları gösterir.
function appText(t, key) {
const meta = t.appsMeta[key];
const home = t.home.apps[key];
if (key === 'noctavia') {
const n = t.noctavia.home;
const seen = new Set();
const faq = ['sesliYorum', 'ruyaSozlugu', 'temaAnalizi', 'ruyaGunlugu', 'premium']
.flatMap(k => t.noctavia[k].faq)
.filter(f => !seen.has(f.q) && seen.add(f.q));
return {
name: meta.name, fullName: home.name, short: meta.desc, cat: n.eyebrow,
tagline: n.h2, lead: n.lead, ctaTitle: n.ctaTitle, ctaSub: n.ctaSub,
features: n.features.map(f => ({ title: f.title, desc: f.desc, to: f.to.split('/').pop() })),
faq, stats: t.appStats[key], card: home,
};
}
const a = t.apps[key];
return {
name: meta.name, fullName: home.name, short: meta.desc, cat: a.eyebrow,
tagline: a.h2, lead: a.lead, ctaTitle: a.ctaTitle, ctaSub: a.ctaSub,
features: a.features, faq: a.faq, stats: t.appStats[key], raw: a, card: home,
};
}
// ─── Router (history API) ────────────────────────────────────────
function usePathRoute() {
const [path, setPath] = useState(() => decodeURIComponent(window.location.pathname || '/'));
useEffect(() => {
const onPop = () => setPath(decodeURIComponent(window.location.pathname || '/'));
window.addEventListener('popstate', onPop);
window.addEventListener('kolabs:navigate', onPop);
return () => {
window.removeEventListener('popstate', onPop);
window.removeEventListener('kolabs:navigate', onPop);
};
}, []);
return path;
}
function navigate(to) {
if (!to) return;
if (window.location.pathname === to) return;
window.history.pushState({}, '', to);
window.dispatchEvent(new Event('kolabs:navigate'));
window.scrollTo({ top: 0, behavior: 'instant' });
}
// Backward-compat alias. The single source of truth for path↔lang mapping
// is `pathForLang` in i18n.jsx (uses PATH_MAP for slug translation).
function applyLang(to, lang) {
return pathForLang(to, lang);
}
function Link({ to, children, className, onClick: extraOnClick, ...rest }) {
const { lang } = useLang();
const href = applyLang(to, lang);
const onClick = (e) => {
if (e.metaKey || e.ctrlKey || e.shiftKey || e.altKey || e.button === 1) return;
e.preventDefault();
if (extraOnClick) extraOnClick(e);
navigate(href);
};
return {children};
}
function scrollToId(id, offset = 80) {
const el = document.getElementById(id);
if (el) window.scrollTo({ top: el.getBoundingClientRect().top + window.scrollY - offset, behavior: 'smooth' });
}
// ─── Motion helpers ──────────────────────────────────────────────
function useScrollProgress(ref) {
const [p, setP] = useState(0);
useEffect(() => {
let raf;
const f = () => {
const el = ref.current; if (!el) return;
const r = el.getBoundingClientRect();
const total = r.height - window.innerHeight;
setP(total > 0 ? clamp01(-r.top / total) : clamp01((window.innerHeight - r.top) / (window.innerHeight + r.height)));
};
const on = () => { cancelAnimationFrame(raf); raf = requestAnimationFrame(f); };
f();
window.addEventListener('scroll', on, { passive: true });
window.addEventListener('resize', on);
return () => { window.removeEventListener('scroll', on); window.removeEventListener('resize', on); cancelAnimationFrame(raf); };
}, []);
return p;
}
function Reveal({ children, className = '', delay = 0, as: Tag = 'div', style, ...rest }) {
const ref = useRef(null);
const [inView, setIn] = useState(false);
useEffect(() => {
const io = new IntersectionObserver(([e]) => { if (e.isIntersecting) { setIn(true); io.disconnect(); } }, { threshold: 0.12 });
ref.current && io.observe(ref.current);
return () => io.disconnect();
}, []);
return {children};
}
function SplitWord({ text, className = '', base = 0 }) {
return {[...text].map((ch, i) => {ch === ' ' ? ' ' : ch})};
}
function Phone({ children, className = '', style }) {
return ;
}
function SectionLabel({ num, children }) {
return ({num}){children}
;
}
// ─── Store buttons ───────────────────────────────────────────────
const ICON_PLAY = ;
const ICON_APPLE = ;
const playUrl = (pkg) => `https://play.google.com/store/apps/details?id=${pkg}`;
function StoreBadge({ href, kind, variant = 'solid', small = false }) {
const t = useT();
const cls = `store store-${variant} ${small ? 'store-sm' : ''}`;
const apple = kind === 'apple';
return (
{apple ? ICON_APPLE : ICON_PLAY}
{apple ? t.ui.badgeAppleSmall : t.ui.badgePlaySmall}{apple ? t.ui.badgeApple : t.ui.badgePlay}
);
}
// Uygulamanın yayında olduğu mağazaların rozetleri. Olmayan mağaza için rozet çıkmaz;
// `pending` verilirse yerine "yakında" çipi durur (Tenax'in Play'i, PatissTray).
function StoreButtons({ app, variant = 'solid', small = false, pending }) {
if (!app.play && !app.ios) return pending ? {pending} : null;
return (
{app.play && }
{app.ios && }
{pending && {pending}}
);
}
// Tekil Play düğmesi (Noctavia fiyat kartları)
function PlayButton({ appId, children, variant = 'solid' }) {
return (
{children}↗
);
}
// ─── Theme ───────────────────────────────────────────────────────
function switchTheme(e, next, set) {
const apply = () => { ReactDOM.flushSync(() => set(next)); document.documentElement.setAttribute('data-theme', next); };
if (!document.startViewTransition || window.matchMedia('(prefers-reduced-motion: reduce)').matches) { apply(); return; }
const r = e.currentTarget.getBoundingClientRect();
const x = r.left + r.width / 2, y = r.top + r.height / 2;
const end = Math.hypot(Math.max(x, innerWidth - x), Math.max(y, innerHeight - y));
const tr = document.startViewTransition(apply);
tr.ready.then(() => document.documentElement.animate(
{ clipPath: [`circle(0px at ${x}px ${y}px)`, `circle(${end}px at ${x}px ${y}px)`] },
{ duration: 900, easing: 'cubic-bezier(.76,0,.24,1)', pseudoElement: '::view-transition-new(root)' }
));
}
// ─── Nav ─────────────────────────────────────────────────────────
function Nav({ current, theme, setTheme }) {
const t = useT();
const [open, setOpen] = useState(false);
const [mob, setMob] = useState(false);
const [scrolled, setScrolled] = useState(false);
useEffect(() => {
const on = () => setScrolled(window.scrollY > 40);
on(); window.addEventListener('scroll', on, { passive: true });
return () => window.removeEventListener('scroll', on);
}, []);
useEffect(() => { setOpen(false); setMob(false); }, [current]);
const onApp = APPS.some(a => current === a.route || current.startsWith(a.route + '/'));
return (
);
}
// ─── Footer ──────────────────────────────────────────────────────
function Footer() {
const t = useT();
return (
);
}
// Crumbs (yasal ve veri silme sayfaları)
function Crumbs({ items }) {
return (
{items.map((it, i) => (
{i > 0 && /}
{it.to ? {it.label} : {it.label}}
))}
);
}
Object.assign(window, {
PLAY_DEV, APPLE_DEV, TENAX_APP_STORE, VAKIT_APP_STORE, ZIKIRMATIK_APP_STORE,
APPS, appByKey, shotSrc, shotsOf, appText, clamp01, easeOut,
usePathRoute, navigate, applyLang, Link, scrollToId, useScrollProgress, Reveal, SplitWord, Phone, SectionLabel,
StoreBadge, StoreButtons, PlayButton, playUrl, switchTheme, Nav, Footer, Crumbs,
});
{t.appsMeta[a.key].name}
{a.soon ? t.home.statusSoon : t.appsMeta[a.key].desc}
))}