// Shared UI components + icons + helpers for 2TTEST landing // Exposed to window so other Babel scripts can use them. const { useState, useEffect, useRef, useMemo } = React; // ───────── Icons (inline SVG, no external lib) ───────── const Icon = { Logo: ({ size = 28, color = "var(--brand)" }) => ( ), Search: (p) => , Menu: (p) => , X: (p) => , ChevDown: (p) => , ChevRight: (p) => , Sparkle: (p) => , Check: (p) => , Clock: (p) => , Stack: (p) => , ListCheck: (p) => , TrendUp: (p) => , Star: (p) => , Mail: (p) => , // LINE — match the official brand mark: rounded square chat bubble with // a downward tail at the bottom-left and the four wordmark letters // (L · I · N · E) drawn in line-style so it composes with the rest of // the minimal icon set. Line: (p) => ( ), Shield: (p) => , Bolt: (p) => , Filter: (p) => , ArrowRight: (p) => , // Social — minimal line silhouettes that read as the brand at small sizes. // Facebook: lowercase "f" inside rounded square Facebook: (p) => ( ), // TikTok: stylized music note (the official "d" silhouette) TikTok: (p) => ( ), // YouTube: rounded rectangle with play triangle YouTube: (p) => ( ), // Instagram: rounded camera body with lens + indicator dot Instagram: (p) => ( ), }; // ───────── Helpers ───────── const fmtBaht = (n) => { if (n == null) return ""; return "฿" + Math.round(n).toLocaleString("en-US"); }; const pct = (orig, price) => { if (!orig || !price || orig <= price) return null; return Math.round(((orig - price) / orig) * 100); }; // Category palette + Thai labels const CATS = { toeic: { th: "TOEIC", stripe: "stripe-placeholder", glyph: "T" }, alevel: { th: "A-Level", stripe: "stripe-violet", glyph: "A" }, m1: { th: "ม.1", stripe: "stripe-emerald", glyph: "1" }, m4: { th: "ม.4", stripe: "stripe-rose", glyph: "4" }, gpax: { th: "กพ. ภาค ก.", stripe: "stripe-yellow", glyph: "ก" }, }; // Banner placeholder — no fake stock imagery function BannerPlaceholder({ category, label, ratio = "16/10" }) { const cat = CATS[category] || CATS.toeic; return (

{cat.glyph}

{label || cat.th}

); } // Section wrapper with consistent rhythm function Section({ id, kicker, title, subtitle, children, tone = "white", className = "" }) { const bg = tone === "panel" ? "bg-[var(--panel)]" : tone === "ink" ? "bg-[var(--ink)] text-white" : "bg-white"; return (

{(kicker || title) && (

{kicker &&

{kicker}

} {title &&

{title}

} {subtitle &&

{subtitle}

}

)} {children}

); } // Login-required modal function LoginModal({ open, onClose }) { useEffect(() => { if (!open) return; const onKey = (e) => e.key === "Escape" && onClose(); document.addEventListener("keydown", onKey); return () => document.removeEventListener("keydown", onKey); }, [open, onClose]); if (!open) return null; return (

e.stopPropagation()}>

กรุณาเข้าสู่ระบบเพื่อซื้อ

คุณต้องมีบัญชี 2TTEST เพื่อสั่งซื้อชุดข้อสอบและเข้าฝึกได้

เข้าสู่ระบบ สมัครฟรี

การสมัครใช้เวลา < 1 นาที · ไม่มีค่าใช้จ่ายในการสมัคร

); } // API helper const API_BASE = (() => { if (typeof localStorage !== "undefined") { const o = localStorage.getItem("ttest_api_url"); if (o) return o; } const h = (typeof window !== "undefined" && window.location && window.location.hostname) || ""; if (h === "localhost" || h === "127.0.0.1" || h === "0.0.0.0") return "http://localhost:8000"; return "https://2ttest.up.railway.app"; })(); async function safeFetch(path) { try { const r = await fetch(API_BASE + path, { headers: { "accept": "application/json" } }); if (!r.ok) throw new Error("HTTP " + r.status); return await r.json(); } catch (e) { console.warn("[2TTEST] fetch failed:", path, e.message); return null; } } // ───────── Real-data only — show empty state if API doesn't return ───────── // (Demo seed previously here was 9 fake ExamSets + 3 fake Packages + Songkran sale. // Removed to avoid misleading visitors into thinking those products exist.) const MOCK_SETS = []; const MOCK_PACKAGES = []; const MOCK_SEASON = null; const MOCK_SETTINGS = { brand_name: "2TTEST", brand_tagline: "ระบบฝึกข้อสอบออนไลน์ — เห็นพัฒนาการจริง", brand_logo_url: null, brand_primary_color: "#0A6CFF", support_email: "support@2ttest.com", support_line: "@2ttest", payment_text: "พร้อมเพย์ · บัตรเครดิต/เดบิต · TrueMoney", vat_percent: 7, refund_window_days: 7, }; // Expose to other Babel scripts Object.assign(window, { Icon, fmtBaht, pct, CATS, BannerPlaceholder, Section, LoginModal, API_BASE, safeFetch, MOCK_SETS, MOCK_PACKAGES, MOCK_SEASON, MOCK_SETTINGS, });