import React, { useState, useMemo } from "react"; import { Lightbulb, ChevronRight, Sparkles, ArrowRight } from "lucide-react"; function detectLang(): string { try { const nav = typeof navigator !== "undefined" ? navigator.language || "" : ""; if (nav.startsWith("ko")) return "ko"; if (nav.startsWith("ja")) return "ja"; if (nav.startsWith("zh")) return "zh"; } catch {} return "en"; } function tx(texts: Record, lang: string): string { return texts[lang] || texts.en || ""; } export default function App() { const lang = useMemo(() => detectLang(), []); const [activeTab, setActiveTab] = useState(0); function tabLabel(idx: number): string { if (idx === 0) return tx({ ko: "시작", en: "Start", ja: "開始", zh: "开始" }, lang); if (idx === 1) return tx({ ko: "기능", en: "Features", ja: "機能", zh: "功能" }, lang); if (idx === 2) return tx({ ko: "공유", en: "Share", ja: "共有", zh: "分享" }, lang); return tx({ ko: "팁", en: "Tips", ja: "ヒント", zh: "技巧" }, lang); } return (

{/* Tab Bar */}

{[0, 1, 2, 3].map((i) => ( ))}

{/* Content */}

{activeTab === 0 && } {activeTab === 1 && } {activeTab === 2 && } {activeTab === 3 && }

); } function StepCard({ num, emoji, title, desc }: { num: number; emoji: string; title: string; desc: string }) { return (

{num}

{emoji}

{title}

{desc}

); } function TabStart({ lang }: { lang: string }) { return (

{/* Hero */}

{tx({ ko: "말하면 만들어집니다", en: "Say it, and it's built", ja: "話せば、作れる", zh: "说出来，就能做" }, lang)}

{tx({ ko: "아이디어를 앱으로, 코딩 없이", en: "From idea to app, no coding needed", ja: "アイデアをアプリに、コード不要", zh: "从想法到应用，无需编码" }, lang)}

{/* Steps */}

{/* Motivation */}

{tx({ ko: "지금 바로 만들어보세요", en: "Start creating now", ja: "今すぐ作ってみましょう", zh: "现在就开始创建吧" }, lang)}

); } function FeatureCard({ emoji, title, desc }: { emoji: string; title: string; desc: string }) { return (

{emoji}

{title}

{desc}

); } function TabFeatures({ lang }: { lang: string }) { return (

); } function ShareStep({ num, text }: { num: number; text: string }) { return (

{num}

{text}

); } function TabShare({ lang }: { lang: string }) { return (

{tx({ ko: "공유는 이렇게", en: "How sharing works", ja: "共有の方法", zh: "如何分享" }, lang)}

{tx({ ko: "데이터를 포함해서 공유하거나, 빈 상태로 새로 시작할 수 있습니다", en: "Share with existing data or let them start fresh", ja: "データを含めて共有、または新しく開始できます", zh: "可以带数据分享，也可以让对方全新开始", }, lang)}

); } function TipCard({ text }: { text: string }) { return (

{text}

); } function TabTips({ lang }: { lang: string }) { return (

{tx({ ko: "더 좋은 앱을 위한 팁", en: "Tips for better apps", ja: "より良いアプリのためのヒント", zh: "更好应用的技巧" }, lang)}

); }

Vibeland Guide

Vibeland Guide

reviews