در حالِ بررسیِ اتصال به بک‌اند…
;
- }
-
- if (state.kind === 'error') {
- return (
-
- اتصال برقرار نشد
-
- );
- }
-
- return (
- {state.message}
- {state.hint}
- {api.http.baseUrl}
-
- اتصال برقرار است
-
- );
-}
diff --git a/src/api/README.md b/src/api/README.md
deleted file mode 100644
index a678b23..0000000
--- a/src/api/README.md
+++ /dev/null
@@ -1,91 +0,0 @@
-# اتصال به بک‌اند
-
-کلِ ارتباط با سرور از همین پوشه رد می‌شود. **هیچ‌جای اپ مستقیم `fetch` نزنید** —
-مدیریتِ توکن، تکرارِ درخواست و رفتارِ درستِ خطا اینجا یک‌جا حل شده‌اند.
-
-## راه‌اندازی
-
-**هیچ تنظیماتی لازم نیست.** به‌طورِ پیش‌فرض به بک‌اندِ مشترک
-(`https://api.math.tadrisino2.ir/api`) وصل می‌شود:
-
-```bash
-npm install
-npm run dev
-```
-
-فقط اگر بک‌اند را روی ماشینِ خودتان بالا آورده‌اید:
-
-```bash
-cp .env.example .env # و خطِ VITE_API_BASE_URL را باز کنید
-```
-
-برای اینکه ببینید اتصال برقرار است، یک خط کافی‌ست (بعداً پاکش کنید):
-
-```tsx
-import { ConnectionCheck } from '@/api/ConnectionCheck';
-// داخلِ خروجیِ App:
-
- {state.grades.length} پایه از سرور آمد
- {state.grades.length > 0 && `: ${state.grades.map((g) => g.title).join('، ')}`}
-
- {api.http.baseUrl}
-
- {items.map(({ id, icon: Icon, label }) => (
-
- ))}
-
- );
-}
-
-// ─── Splash Screen ────────────────────────────────────────────────────────────
-
-function SplashScreen({ onNew, onReturning }: { onNew: () => void; onReturning: () => void }) {
- useEffect(() => {
- // Auto-advance after 2.2 s; returning users press button
- const t = setTimeout(onNew, 2200);
- return () => clearTimeout(t);
- }, [onNew]);
-
- return (
-
-
-
-
-
- قبلاً وارد شدم
-
-
-
- );
-}
-
-// ─── Onboarding ───────────────────────────────────────────────────────────────
-
-function OnboardingScreen({ onDone }: { onDone: () => void }) {
- const [step, setStep] = useState(0);
- const slides = [
- {
- mood: "wave" as RobotMood, bg: "#ED6956",
- title: "به تدریسینو خوش آمدی! 🤖",
- sub: "دستیار ریاضی هوشمند",
- desc: "با رُبو ریاضی یاد بگیر و هر روز باهوش‌تر بشو. یادگیری می‌تونه هم آسون هم جالب باشه!",
- },
- {
- mood: "point" as RobotMood, bg: "#91ADC6",
- title: "مسیر ریاضیت رو بساز",
- sub: "گام به گام پیشرفت کن",
- desc: "از جمع و تفریق شروع کن تا به ضرب، تقسیم و کسرها برسی. رُبو همه‌جا کنارته!",
- },
- {
- mood: "explain" as RobotMood, bg: "#97C0C0",
- title: "هر چیزی نفهمیدی بپرس!",
- sub: "توضیح ساده و صبورانه",
- desc: "رُبو هر مسئله‌ای رو با مثال‌های جالب برات توضیح می‌ده تا مطمئن بشی خوب یاد گرفتی.",
- },
- ];
- const slide = slides[step];
- return (
-
-
-
- تدریسینو
-یادگیری ریاضی با هوش مصنوعی
-
- {step > 0 && (
-
- )}
-
+
+
);
}
-//-----login screen
-interface AuthData {
- userId: string;
- isGuest: boolean;
-}
-function LoginScreen({ onDone }: { onDone: (auth: AuthData) => void }) {
- const [step, setStep] = useState<"phone" | "otp">("phone");
- const [phone, setPhone] = useState("");
- const [otp, setOtp] = useState("");
- const [devOtp, setDevOtp] = useState
+
+
-
- void afterLogin()} />}
+ {flow.kind === 'setup' && (
+ setFlow({ kind: 'main', profile, grades: flow.grades })}
+ />
+ )}
+ {flow.kind === 'main' && (
+ setFlow({ kind: 'login' })}
+ onRegistered={trackReferral}
+ />
+ )}
-
- {/* Dots */}
-
-
+ {flow.kind === 'boot' && {
+ store.set(KEYS.onboarded, '1');
+ setFlow({ kind: 'login' });
+ }}
/>
-
-
+ void boot()} />
+
+ )}
+ {flow.kind === 'onboarding' && (
+
-
+ )}
+ {flow.kind === 'login' && {slide.sub}
-{slide.title}
-{slide.desc}
-
- {slides.map((_, i) => (
-
- ))}
-
-
- {step < slides.length - 1 ? (
- <>
-
-
-
- ) : (
-
- )}
-
-
-
- );
-}
-// ─── Profile Setup ────────────────────────────────────────────────────────────
-
-const AGES = Array.from({ length: 7 }, (_, i) => i + 12);
-
-const toPersianNumber = (value: number | string) =>
- String(value).replace(
- /\d/g,
- (d) => "۰۱۲۳۴۵۶۷۸۹"[Number(d)]
- );
-
-function ProfileSetupScreen({
- onDone,
-}: {
- onDone: (p: Profile) => void;
-}) {
-
- const [name, setName] = useState("");
- const [age, setAge] = useState(15);
- const [grade, setGrade] = useState("");
- const [touched, setTouched] = useState(false);
- const [grades, setGrades] = useState
-
-
-
-
-
-
- ورود به تدریسینو
-- {step === "phone" ? "شماره موبایلت رو وارد کن" : "کد پیامک‌شده رو وارد کن"} -
-
-
-
-
- {step === "phone" ? (
-
-
-
- setPhone(e.target.value.replace(/\D/g, "").slice(0, 11))}
- placeholder="09xxxxxxxxx"
- dir="ltr"
- inputMode="numeric"
- className={`w-full px-4 py-4 rounded-2xl text-sm bg-white border-2 outline-none text-[#1a1a2e] placeholder:text-[#b0b0c8] transition-all font-medium text-left ${
- error ? "border-red-400 bg-red-50" : phone ? "border-[#ED6956]" : "border-[#e8e4ff]"
- }`}
- />
- {error && (
-
- ) : (
-
- {error}
-
- )}
-
- setOtp(e.target.value.replace(/\D/g, "").slice(0, 6))}
- placeholder="----"
- dir="ltr"
- inputMode="numeric"
- className={`w-full px-4 py-4 rounded-2xl text-lg tracking-[0.5em] text-center bg-white border-2 outline-none text-[#1a1a2e] placeholder:text-[#b0b0c8] transition-all font-bold ${
- error ? "border-red-400 bg-red-50" : otp ? "border-[#ED6956]" : "border-[#e8e4ff]"
- }`}
- />
- {error && (
-
- )}
-
-
-
-
-
- {error}
-
- )}
- {devOtp && (
- - کد تست محیط توسعه: {devOtp} (یا ۰۰۰۰) -
- )} - -
-
- {/* ───────────────── HEADER ───────────────── */}
-
-
- );
-}
-// ─── Home Screen ──────────────────────────────────────────────────────────────
-
-function HomeScreen({
- profile,
- home,
- summary,
- unreadCount,
- onNavigate,
- onContinue,
-}: {
- profile: Profile;
- home: HomeResponse | null;
- summary: { xp: number; coins: number; streak: { current: number; longest: number } } | null;
- unreadCount: number;
- onNavigate: (s: MainScreen) => void;
- onContinue: (unitId: string) => void;
-}) {
- const toFa = (n: number) => String(n).replace(/\d/g, (d) => "۰۱۲۳۴۵۶۷۸۹"[Number(d)]);
- const cont = findContinueNode(home);
- const cUnit = cont?.unit;
- const cProg = cUnit ? unitProgress(cUnit) : { done: 0, total: 0, percent: 0 };
- const cColor = cont ? unitColor(cont.unitIndex) : "#ED6956";
- const xp = summary?.xp ?? 0;
- const level = Math.floor(xp / 100) + 1;
- return (
-
-
- {/* decorative circles */}
-
-
-
-
-
-
-
-
- {/* ───────────────── FORM ───────────────── */}
-
-
-
-
-
-
-
-
-
-
- فقط چندتا سؤال کوچیک
-
-
- - بیا باهم آشنا بشیم! -
- - -
-
-
-
-
-
-
-
-
-
- {/* ───────── NAME ───────── */}
-
-
-
-
-
-
-
- setName(e.target.value)}
- placeholder="مثلاً سارا یا علی"
- dir="rtl"
- className={`
- w-full px-4 py-4 rounded-2xl text-sm
- bg-white border-2 outline-none
- text-[#1a1a2e]
- placeholder:text-[#b0b0c8]
- transition-all font-medium
- ${
- nameErr
- ? "border-red-400 bg-red-50"
- : name
- ? "border-[#ED6956]"
- : "border-[#e8e4ff]"
- }
- `}
- />
-
- {nameErr && (
-
- {/* ───────── AGE ───────── */}
-
-
- )}
-
-
-
-
-
- {/* ───────── GRADE ───────── */}
-
-
-
- {/* selection highlight - ثابت */}
-
-
- {/* fade بالا */}
-
-
- {/* fade پایین */}
-
-
- {/* اسکرول واقعی */}
-
- {
- const el = e.currentTarget;
-
- const itemHeight = 36;
- const center = el.clientHeight / 2;
-
- const index = Math.round(
- (el.scrollTop + center - 67) / itemHeight
- );
-
- const newAge = AGES[Math.max(0, Math.min(AGES.length - 1, index))];
-
- if (newAge !== age) {
- setAge(newAge);
- playTick();
- }
- }}
- >
-
-
- {AGES.map((value) => {
- const distance = Math.abs(value - age);
-
- return (
-
- );
- })}
-
- {/* فضای خالی پایین */}
-
-
-
-
-
-
- {grades.length === 0 && !gradesError && (
-
- {saveError && (
-
- {[0, 1, 2, 3].map((i) => (
-
- ))}
-
- )}
-
- {gradesError && (
-
- فهرستِ پایه‌ها نیومد؛ اتصالت رو چک کن و دوباره باز کن.
-
- )}
-
-
-
- {grades.map((g) => {
-
- const selected = grade === String(g.id);
-
- return (
-
-
-
- );
-
- })}
-
-
-
-
- {gradeErr && (
-
-
- )}
-
-
- {saveError}
-
- )}
-
- {/* ───────── START ───────── */}
-
-
-
-
- {/* ── Header ─────────────────────────────────────────────────────────── */}
-
- );
-}
-
-// // ─── Skill Map ────────────────────────────────────────────────────────────────
-
-// function SkillMapScreen({ onNavigate }: { onNavigate: (s: MainScreen) => void }) {
-// // هر آیتم یا ویدیوی درس است یا آزمون آن؛ ترتیب آرایه همان ترتیب واقعی خواندن دانش‌آموز است
-// const items: { id: number; type: "video" | "quiz"; title: string; meta: string; done: boolean }[] = [
-// { id: 1, type: "video", title: "آشنایی با اعداد", meta: "۸ دقیقه", done: true },
-// { id: 2, type: "quiz", title: "آزمون اعداد", meta: "۵ سوال", done: true },
-// { id: 3, type: "video", title: "جمع اعداد", meta: "۱۰ دقیقه", done: true },
-// { id: 4, type: "quiz", title: "آزمون جمع", meta: "۵ سوال", done: false },
-// { id: 5, type: "video", title: "تفریق اعداد", meta: "۹ دقیقه", done: false },
-// { id: 6, type: "quiz", title: "آزمون تفریق", meta: "۵ سوال", done: false },
-// { id: 7, type: "video", title: "ضرب مقدماتی", meta: "۱۱ دقیقه", done: false },
-// { id: 8, type: "quiz", title: "آزمون پایانی", meta: "۱۰ سوال", done: false },
-// ];
-
-// const doneCount = items.filter((it) => it.done).length;
-// const percent = Math.round((doneCount / items.length) * 100);
-// const percentFa = String(percent).replace(/\d/g, (d) => "۰۱۲۳۴۵۶۷۸۹"[Number(d)]);
-
-// return (
-//
- {/* decorative blobs */}
-
-
-
- {/* Greeting row */}
-
-
- {/* ── Bold stat bar — overlaps the header for more visual weight ─────── */}
-
-
-
-
- سلام، {profile.name}!
-- آماده‌ای ریاضی رو شروع کنیم؟ -
- {profile.gradeName && ( - - {profile.gradeName} - - )} -
-
-
-
-
-
-
-
- {/* ── Scrollable content ──────────────────────────────────────────────── */}
- {[
- { icon: Flame, val: toFa(summary?.streak.current ?? 0), label: "روز پیاپی", fg: "#FF7A3D", bg: "#FFF1E6" },
- { icon: Star, val: toFa(xp), label: "امتیاز", fg: "#E8A400", bg: "#FFF8E1" },
- { icon: Trophy, val: toFa(level), label: "سطح", fg: "#9B7BFF", bg: "#F5F1FF" },
- ].map(({ icon: Icon, val, label, fg, bg }) => (
-
-
-
- ))}
-
-
- {val}
- {label}
-
-
- {/* Continue card */}
- {cont && cUnit ? (
-
-
-
- ) : (
-
-
- {/* Progress bar */}
-
-
- ادامه از جایی که موندی
-{cont.node.title}
-{cUnit.title} · {toFa(cProg.done)} از {toFa(cProg.total)} · {toFa(cProg.percent)}٪ تکمیل
-
-
-
-
-
-
-
-
-
-
- )}
-
- {/* Quick access grid */}
- - {home ? "همه‌ی فصل‌های این پایه رو تموم کردی! 🎉" : "در حال آوردنِ مسیر یادگیری..."} -
-
-
-
-
-
-//
-// );
-// }
-
-// ─── Topic Select ───────────────────────────────────────────────────────────
-
-// چیدمانِ فصل‌ها روی نقشه — به‌شکلِ مارپیچ، مثلِ نقشه‌ی مهارت ولی برای کلِ فصل‌ها
-function TopicSelectScreen({ home, onSelect }: { home: HomeResponse | null; onSelect: (unitId: string) => void }) {
- const toFa = (n: number) => String(n).replace(/\d/g, (d) => "۰۱۲۳۴۵۶۷۸۹"[Number(d)]);
- const units = home?.units ?? [];
- const positions = zigzagPositions(units.length);
- const mapHeight = positions.length ? positions[positions.length - 1].y + 190 : 400;
-
- const overallPct = home?.stats.progressPercent ?? 0;
-
- return (
-
-//
-//
-//
-//
-//
-//
-// مسیر ریاضی
-//{percentFa}٪ مسیر طی شده
-//
-//
-//
-//
-//
-//
-// {/* خط تایم‌لاین که از وسط آیکن‌ها رد می‌شود */}
-//
-//
-//
-// {items.map((item, i) => {
-// const locked = i > 0 && !items[i - 1].done;
-// const isCurrent = !locked && !item.done;
-// const Icon = item.type === "video" ? Play : Brain;
-// return (
-//
-// );
-// })}
-//
-//
- {/* Header */}
-
- );
-}
-
-// ─── Skill Map (مسیر مبحث، شبیه دولینگو) ────────────────────────────────────
-
-// ─── Beautiful Skill Map ─────────────────────────────────────────────────────
-
-const MAP_NODE = 76;
-
-const MAP_POSITIONS = [
- { x: 50, y: 70 },
- { x: 72, y: 190 },
- { x: 43, y: 310 },
- { x: 25, y: 430 },
- { x: 55, y: 550 },
- { x: 76, y: 670 },
- { x: 48, y: 790 },
- { x: 28, y: 910 },
- { x: 58, y: 1030 },
- { x: 75, y: 1150 },
-];
-
-function SkillMapScreen({
- unitId,
- home,
- onOpenLesson,
- onBack,
-}: {
- unitId: string;
- home: HomeResponse | null;
- onOpenLesson: (lessonId: number) => void;
- onBack: () => void;
-}) {
- const unitIndex = home?.units.findIndex((u) => u.id === unitId) ?? -1;
- const unit = unitIndex >= 0 ? home!.units[unitIndex] : undefined;
- const items = unit?.nodes ?? [];
- const color = unitIndex >= 0 ? unitColor(unitIndex) : "#91ADC6";
-
- const doneCount = items.filter((it) => it.status === "completed").length;
- const percent = items.length
- ? Math.round((doneCount / items.length) * 100)
- : 0;
-
- const percentFa = String(percent).replace(
- /\d/g,
- (d) => "۰۱۲۳۴۵۶۷۸۹"[Number(d)]
- );
-
- const positions = items.map((_, i) => {
- if (MAP_POSITIONS[i]) return MAP_POSITIONS[i];
-
- const pattern = [
- { x: 50, y: 70 },
- { x: 72, y: 190 },
- { x: 43, y: 310 },
- { x: 25, y: 430 },
- ];
-
- const p = pattern[i % pattern.length];
-
- return {
- x: p.x,
- y: p.y + Math.floor(i / pattern.length) * 480,
- };
- });
-
- const mapHeight =
- positions.length > 0
- ? positions[positions.length - 1].y + 150
- : 500;
-
- return (
-
-
-
-
- {/* Map */}
-
- 0 ? "happy" : "idle"} size={64}/>
-
-
-
- نقشه‌ی فصل‌ها
-{toFa(overallPct)}٪ از کل مسیر رو رفتی
-
-
-
-
- {!home ? (
-
-
-
-
- ) : units.length === 0 ? (
- در حال آوردنِ فصل‌ها...
-
-
-
- ) : (
- هنوز فصلی برای این پایه ثبت نشده
-
-
- {/* مسیرِ اتصال بینِ خونه‌های فصل‌ها */}
-
-
- {/* خونه‌های فصل‌ها */}
- {units.map((unit, i) => {
- const pos = positions[i];
- if (!pos) return null;
- const prog = unitProgress(unit);
- const complete = prog.percent === 100;
- const color = unitColor(i);
- const Icon = unitIcon(i);
- return (
-
-
-
-
-
- );
- })}
-
- {/* پی، منتظرِ انتهای مسیر */}
-
- )}
-
-
- {unit.title}
- {toFa(prog.done)} از {toFa(prog.total)} ایستگاه
-
-
-
-
- {overallPct === 100 ? "همه رو تموم کردی! 🎉" : "همینجا منتظرتم"}
-
-
-
- {/* ───────── Header ───────── */}
-
-
- );
-}
-// ─── Lessons Hub (تب «درس‌ها») ──────────────────────────────────────────────
-// دسته‌بندی‌شده و مناسبِ دانش‌آموزِ دبیرستانی: کارتِ ادامه، سه دسته‌ی درسی،
-// و یه دعوتِ کوچیک از دلتا برای یه چالشِ سریع.
-
-function LessonsHubScreen({
- home,
- onOpenUnit,
- onNavigate,
-}: {
- home: HomeResponse | null;
- onOpenUnit: (unitId: string) => void;
- onNavigate: (s: MainScreen) => void;
-}) {
- const toFa = (n: number) => String(n).replace(/\d/g, (d) => "۰۱۲۳۴۵۶۷۸۹"[Number(d)]);
-
- // اولین ایستگاهِ ناتمام رو برای کارتِ «ادامه بده» پیدا می‌کنیم
- const cont = findContinueNode(home);
- const cUnit = cont?.unit;
- const cProg = cUnit ? unitProgress(cUnit) : { done: 0, total: 0, percent: 0 };
- const cColor = cont ? unitColor(cont.unitIndex) : "#97C0C0";
- const units = home?.units ?? [];
-
- return (
-
-
- {/* Decorative circles */}
-
-
-
-
-
-
-
-
- {/* ───────── Map ───────── */}
-
-
-
-
-
-
-
-
- = 50 ? "happy" : "idle"}
- size={76}
- />
-
-
-
- {/* Progress */}
-
-
-
-
-
- مسیر یادگیری
-
-
- - {unit?.title ?? "..."} -
- -- {percentFa}٪ مسیر رو رفتی -
-
-
-
-
-
- پیشرفت تو
- {percentFa}٪
-
-
-
-
-
-
-
-
-
-
-
-
- {/* Background decorative dots */}
-
-
-
- {/* Current lesson label */}
-
- {current && (
-
-
-
-
-
- )}
-
-
- {/* Current glow */}
-
- {current && (
-
-
-
- );
-
- })}
-
-
- {/* Finish decoration */}
-
- {items.length > 0 && (
-
-
-
-
-
- {[...Array(18)].map((_, i) => (
-
-
-
- ))}
-
-
-
-
- {/* ───────── Curved Path ───────── */}
-
-
-
-
- {/* ───────── Nodes ───────── */}
-
- {items.map((item, i) => {
-
- const position = positions[i];
-
- const locked = item.status === "locked";
-
- const current = item.status === "unlocked" || item.status === "in_progress";
-
- const completed = item.status === "completed";
-
- const Icon = Play;
-
- return (
-
-
-
- {item.title}
-
- {/* little arrow */}
-
-
-
-
-
-
-
-
-
- )}
-
-
- ادامه بده!
-
-
-
-
-
-
- {/* Header */}
-
- );
-}
-
-// ─── Lesson Screen ────────────────────────────────────────────────────────────
-
-function LessonScreen({
- unitId,
- lessonId,
- home,
- onNavigate,
- onBack,
-}: {
- unitId: string;
- lessonId: number;
- home: HomeResponse | null;
- onNavigate: (s: MainScreen) => void;
- onBack: () => void;
-}) {
- const toFa = (n: number) => String(n).replace(/\d/g, (d) => "۰۱۲۳۴۵۶۷۸۹"[Number(d)]);
- const unitIndex = home?.units.findIndex((u) => u.id === unitId) ?? -1;
- const unit = unitIndex >= 0 ? home!.units[unitIndex] : undefined;
- const color = unitIndex >= 0 ? unitColor(unitIndex) : "#ED6956";
-
- const [intro, setIntro] = useState
-
-
-
-
-
-
-
-
- درس‌ها
-با سه‌یار، قدم‌به‌قدم جلو برو
-
-
- {/* Continue card */}
- {cont && cUnit ? (
-
-
-
- ) : (
-
-
-
-
- ادامه از جایی که موندی
-{cUnit.title}
-{cont.node.title} · {toFa(cProg.done)} از {toFa(cProg.total)} درس
-
-
-
-
-
-
-
-
-
-
- )}
-
- {/* همه‌ی فصل‌ها */}
- {units.length > 0 && (
- - {home ? "همه‌ی فصل‌ها تموم شدن! 🎉" : "در حال آوردنِ درس‌ها..."} -
-
-
- )}
-
- {/* دعوتِ دلتا به یه چالشِ سریع */}
-
-
-
-
- فصل‌های این پایه
- {toFa(units.length)} فصل -
- {units.map((unit, i) => {
- const prog = unitProgress(unit);
- const color = unitColor(i);
- const Icon = unitIcon(i);
- return (
-
- );
- })}
-
-
-
- );
-}
-
-// ─── Question Screen ──────────────────────────────────────────────────────────
-
-function QuestionScreen({ lessonId, onNavigate, onBack, onComplete }: { lessonId: number; onNavigate: (s: MainScreen) => void; onBack: () => void; onComplete?: () => void }) {
- const [questions, setQuestions] = useState
-
-
-
-
-
-
- {unit && (
-
-
-
- )}
- {intro?.title ?? "..."}
-
-
-
-
- {/* توضیحِ سیگما، به‌جای پنلِ متنیِ خشک */}
-
-
-
-
- {intro && intro.questionCount === 0 ? (
-
-
-
-
- {loadErr ? (
-
- این درس الان بارگذاری نشد. یه بار دیگه امتحان کن.
- ) : !intro ? ( -در حال آوردنِ توضیح درس...
- ) : ( -{intro.introText}
- )} -
- آزمونِ این درس به‌زودی اضافه می‌شه
-
- ) : (
-
- )}
-
-
-
- );
- }
-
- if (!questions || !q) {
- return (
- این سوال‌ها الان بارگذاری نشدن.
- -
-
-
- );
- }
-
- return (
- در حال آوردنِ سوال‌ها...
-
- {/* Top bar */}
-
- );
-}
-
-// ─── Ask AI ───────────────────────────────────────────────────────────────────
-
-function AskAIScreen({ profile }: { profile: Profile }) {
- const [input, setInput] = useState("");
- const [loading, setLoading] = useState(false);
- const [streamingText, setStreamingText] = useState
-
-
-
-
-
-
- {/* جون‌ها (قلب‌ها) */}
-
-
-
- {qIdx + 1}/{questions.length}
-
- {Array.from({ length: 5 }).map((_, i) => {
- const filled = i < lives;
- return (
-
-
-
-
- {filled && (
-
-
-
- )}
-
-
- );
- })}
-
- {/* سه‌یار bubble */}
-
- {outOfLives ? <>دوباره تلاش کن :
- qIdx < questions.length - 1 ? <>سوال بعدی :
- <>پایان تمرین }
-
- )}
-
-
-
-
-
-
-
-
-
- {/* Problem card */}
-
- {sel === null ? "جواب درست رو انتخاب کن! " :
- correct ? "آفرین! درست بود ⚡ ادامه بده!" :
- outOfLives ? "جونات تموم شد؛ نگران نباش، از اول با هم شروع می‌کنیم." :
- "اشکالی نداره، بیا با هم دوباره نگاهش کنیم."}
-
-
-
-
- {/* Options grid */}
- سوال {qIdx + 1}
-{q.prompt}
-
- {q.options.map((opt) => (
- selectAnswer(opt.id)}
- whileTap={{ scale: sel === null ? 0.93 : 1 }}
- className={`py-4 rounded-2xl text-xl font-black flex items-center justify-center gap-1.5 transition-all ${optCls(opt.id)}`}>
- {opt.value}
- {result && opt.id === result.correctOptionId && }
- {sel === opt.id && result && !result.correct && }
-
- ))}
-
-
- {result && (
-
-
- );
-}
-
-// ─── Notifications Screen ──────────────────────────────────────────────────────
-
-function NotificationsScreen({
- items,
- loading,
- loadErr,
- onBack,
- onMarkRead,
- onMarkAllRead,
-}: {
- items: NotificationItem[] | null;
- loading: boolean;
- loadErr: boolean;
- onBack: () => void;
- onMarkRead: (id: number) => void;
- onMarkAllRead: () => void;
-}) {
- const unreadCount = items?.filter((n) => !n.isRead).length ?? 0;
-
- return (
-
-
-
-
-
-
-
- از پی بپرس
-دستیار هوشمند ریاضی
-
-
-
-
- {messages.map((msg, i) => (
-
-
-
- {msg.from === "bot" && (
-
- ))}
- {loading && (
-
-
-
- )}
- {msg.text}
-
-
- )}
-
-
-
- {streamingText ? (
-
- {streamingText}
-
- ) : (
-
- {[0, 1, 2].map(i => (
-
- )}
-
-
-
-
- setInput(e.target.value)}
- onKeyDown={e => e.key === "Enter" && send()}
- placeholder="سوالت رو بنویس..." dir="rtl"
- className="flex-1 h-10 bg-[#f0eeff] rounded-full px-4 text-sm outline-none text-[#1a1a2e] placeholder:text-[#b0b0c8]"/>
-
-
-
-
- );
-}
-
-// ─── Leaderboard Screen ─────────────────────────────────────────────────────────
-// توجه: کلاینتِ api.ts پارامترِ period رو "weekly" | "monthly" تایپ کرده، ولی
-// بک‌اندِ واقعی فقط "weekly" | "all_time" رو قبول می‌کنه (سریالایزرِ خودشون رو
-// دیدم). اینجا از مقادیرِ واقعیِ بک‌اند استفاده می‌کنیم.
-
-interface LeaderboardEntry { rank: number; userId: string; name: string; xpInPeriod: number }
-type LeaderboardPeriod = "weekly" | "all_time";
-
-const RANK_MEDAL: Record
-
-
-
-
-
- اعلان‌ها
- {unreadCount > 0 && ( - - )} -
- {loading ? (
-
-
-
-
- ) : loadErr ? (
- در حال آوردنِ اعلان‌ها...
-
-
-
- ) : !items || items.length === 0 ? (
- اعلان‌ها الان نیومدن، بعداً دوباره امتحان کن.
-
-
-
- ) : (
- فعلاً خبری نیست
-
- {items.map((n) => {
- const style = notifStyle(n.type);
- const Icon = style.icon;
- return (
-
- );
- })}
-
- )}
-
- {/* Header */}
-
- );
-}
-
-
-
-// ─── Characters Screen (کاتالوگِ گیمیفیکیشنِ بک‌اند) ─────────────────────────
-// کاراکترها رو خودِ بک‌اند مدیریت می‌کنه (مثلِ subscription.Plan)، پس تعدادشون
-// می‌تونه هر چقدر باشه. اگه slug با سیگما/دلتا/پی جور دربیاد، طرحِ سه‌یارِ
-// خودمون (انیمیشن‌دار) نشون داده می‌شه؛ وگرنه یه کارتِ عمومی.
-
-function CharactersScreen({
- characters,
- loading,
- loadErr,
- selecting,
- onSelect,
- onBack,
-}: {
- characters: ApiCharacter[] | null;
- loading: boolean;
- loadErr: boolean;
- selecting: string | null;
- onSelect: (characterId: string) => void;
- onBack: () => void;
-}) {
- const toFa = (n: number) => String(n).replace(/\d/g, (d) => "۰۱۲۳۴۵۶۷۸۹"[Number(d)]);
-
- return (
-
-
-
-
-
-
-
-
-
-
-
- {/* Period toggle */}
- جدولِ امتیازها
-
- {([["weekly", "این هفته"], ["all_time", "کل زمان"]] as [LeaderboardPeriod, string][]).map(([p, label]) => (
-
- ))}
-
-
- {loading ? (
-
-
-
-
- ) : loadErr ? (
- در حال آوردنِ جدول...
-
-
-
- ) : !entries || entries.length === 0 ? (
- جدول الان نیومد، بعداً دوباره امتحان کن.
-
-
-
- ) : (
- <>
- {/* سکوی سه نفرِ برتر */}
- {top3.length > 0 && (
- هنوز کسی تو این جدول نیست
-
- {[top3[1], top3[0], top3[2]].filter(Boolean).map((e) => {
- const isMe = e.userId === myUserId;
- const medal = RANK_MEDAL[e.rank];
- const podiumH = e.rank === 1 ? 92 : e.rank === 2 ? 72 : 56;
- return (
-
- )}
-
- {/* بقیه‌ی رتبه‌ها */}
-
-
- );
- })}
-
- {toFa(e.rank)}
-
- {isMe ? "تو" : e.name}
-{toFa(e.xpInPeriod)} XP
- -
- {rest.map((e) => {
- const isMe = e.userId === myUserId;
- return (
-
-
- )}
-
- {toFa(e.rank)}
-
- );
- })}
-
- {e.name ? e.name[0] : "؟"}
-
- {isMe ? "تو" : e.name}
- {toFa(e.xpInPeriod)} XP -
-
- );
-}
-
-// ─── Subscription ─────────────────────────────────────────────────────────────
-
-const PLAN_STYLES = [
- { card: "bg-white border border-[#ede9ff]", titleCls: "text-[#1a1a2e]", subCls: "text-[#9e9ec0]", fCls: "text-[#3a3a5c]", checkCls: "text-[#ED6956]", btnCls: "border-2 border-[#ED6956] text-[#ED6956]" },
- { card: "bg-[#FF7A3D] border-2 border-white/40", titleCls: "text-white", subCls: "text-white/60", fCls: "text-white/85", checkCls: "text-white", btnCls: "bg-white text-[#FF7A3D] font-bold" },
- { card: "bg-[#91ADC6] border-2 border-white/30", titleCls: "text-white", subCls: "text-white/60", fCls: "text-white/88", checkCls: "text-white", btnCls: "bg-white text-[#91ADC6] font-bold" },
-];
-
-function durationLabel(days: number): string {
- if (days === 0) return "";
- if (days === 30) return "ماهانه";
- if (days >= 360 && days <= 370) return "سالانه";
- const toFa = (n: number) => String(n).replace(/\d/g, (d) => "۰۱۲۳۴۵۶۷۸۹"[Number(d)]);
- return `${toFa(days)} روزه`;
-}
-
-function SubscriptionScreen() {
- const [plans, setPlans] = useState
-
-
-
-
-
-
-
-
- همراهت رو انتخاب کن
-با کسبِ امتیاز، کاراکترهای بیشتری باز می‌شن
-
- {loading ? (
-
-
-
-
- ) : loadErr ? (
- در حال آوردنِ کاراکترها...
-
-
-
- ) : !characters || characters.length === 0 ? (
- لیست الان نیومد، بعداً دوباره امتحان کن.
-
-
-
- ) : (
- فعلاً کاراکتری تعریف نشده
-
- {characters.map((c) => {
- const seyar = seyarSlugMatch(c.slug);
- const isBusy = selecting === c.characterId;
- return (
-
- );
- })}
-
- )}
-
-
- );
-}
-
-// ─── Root ─────────────────────────────────────────────────────────────────────
-
-export default function App() {
- const [flow, setFlow] = useState
-
-
- اشتراک ویژه
-یادگیری ریاضی رو جدی بگیر
-
- {loadErr && (
-
-
- پلن‌ها الان نیومدن؛ اتصالت رو چک کن.
-
- )}
-
- {!plans && !loadErr && (
-
-
-
- )}
-
- {/* Plan cards */}
- {plans?.map((plan, i) => {
- const style = PLAN_STYLES[i % PLAN_STYLES.length];
- const isFree = plan.price === 0;
- const dur = durationLabel(plan.durationDays);
- return (
- در حال آوردنِ پلن‌ها...
-
-
- );
- })}
-
- {plans &&
-
-
-
-
-
- {plan.title}
- {dur &&{dur}
} -
-
- - {isFree ? "رایگان" : `${toFa(plan.price.toLocaleString())} تومان`} -
-
- {plan.features.map(f => (
-
-
-
-
- {f}
-
- ))}
- هر زمان می‌توانید لغو کنید · بدون تعهد
} -
- {/* Phone frame */}
-
- );
}
diff --git a/src/app/MainApp.tsx b/src/app/MainApp.tsx
new file mode 100644
index 0000000..5d4a071
--- /dev/null
+++ b/src/app/MainApp.tsx
@@ -0,0 +1,149 @@
+import { useEffect, useState } from 'react';
+import { AnimatePresence, motion } from 'motion/react';
+import { CheckCircle2, XCircle } from 'lucide-react';
+import { api, type Grade, type UserProfile } from '@/api';
+import { AppDataProvider, useAppData } from '@/state/AppData';
+import { NavigatorProvider, useNav } from '@/nav/Navigator';
+import { isTab, type Route } from '@/nav/routes';
+import { BottomNav } from '@/components/BottomNav';
+import { Sheet } from '@/components/Sheet';
+import { useToast } from '@/components/Toast';
+import { PrimaryButton } from '@/components/ui';
+import { AskScreen } from '@/screens/AskScreen';
+import { CharactersScreen } from '@/screens/CharactersScreen';
+import { FamilyScreen } from '@/screens/FamilyScreen';
+import { HomeScreen } from '@/screens/HomeScreen';
+import { InviteScreen } from '@/screens/InviteScreen';
+import { LeaderboardScreen } from '@/screens/LeaderboardScreen';
+import { LessonScreen } from '@/screens/LessonScreen';
+import { LoginScreen } from '@/screens/LoginScreen';
+import { MapScreen } from '@/screens/MapScreen';
+import { NotificationsScreen } from '@/screens/NotificationsScreen';
+import { ProfileScreen } from '@/screens/ProfileScreen';
+import { QuizScreen } from '@/screens/QuizScreen';
+import { StreakScreen } from '@/screens/StreakScreen';
+import { SubscriptionScreen } from '@/screens/SubscriptionScreen';
+import { SupportScreen } from '@/screens/SupportScreen';
+import { UnitScreen } from '@/screens/UnitScreen';
+import type { PaymentReturn } from './launchParams';
+
+interface Props {
+ profile: UserProfile;
+ grades: Grade[];
+ payment: PaymentReturn | null;
+ onSignedOut: () => void;
+ onRegistered: (profile: UserProfile) => Promise
-
- {/* Status bar */}
- }
-
-
- ۹:۴۱
-
-
- {/* Screen area */}
-
-
-
- {[3,4,5].map(h => )}
-
-
-
-
-
-
-
- {flow === "splash" && setFlow("onboarding")} onReturning={handleReturning}/>}
- {flow === "onboarding"&& }
- {flow === "profile" && }
- {flow === "main" && screen === "lesson" && }
- {flow === "main" && screen === "question" && }
- {flow === "main" && screen === "askai" && }
- {flow === "main" && screen === "subscription" && }
- {flow === "main" && screen === "home" && { setUnitId(id); navigate("skillmap"); }}/>}
- {flow === "main" && screen === "notifications" && }
- {flow === "main" && screen === "leaderboard" && { setLbPeriod(p); refreshLeaderboard(p); }} onBack={goBack}/>}
- {flow === "main" && screen === "characters" && }
- {flow === "main" && screen === "topics" && { setUnitId(id); navigate("skillmap"); }}/>}
- {flow === "main" && screen === "lessons" && { setUnitId(id); navigate("skillmap"); }} onNavigate={navigate}/>}
- {flow === "main" && screen === "skillmap" && { setLessonId(id); navigate("lesson"); }} onBack={goBack}/>}
-
-
-
-
- {showNav &&
+
+
+
+
+
+ {showNav &&
+ {paid ? setOpen(false)}>باشه
+
+ {paid ? 'پرداخت موفق بود! 🎉' : 'پرداخت انجام نشد'}
++ {paid + ? 'اشتراکت فعال شد؛ از الان قلب‌هات نامحدوده.' + : 'اگه مبلغی از حسابت کم شده، نگران نباش؛ طیِ چند ساعت خودکار برمی‌گرده یا اشتراکت فعال می‌شه.'} +
+
-
- ) : (
-
- 
-
- {children}
-
- {children}
-
-
-
-
- );
-}
-
-function CarouselItem({ className, ...props }: React.ComponentProps<"div">) {
- const { orientation } = useCarousel();
-
- return (
-
- );
-}
-
-function CarouselPrevious({
- className,
- variant = "outline",
- size = "icon",
- ...props
-}: React.ComponentProps
-
- {children}
-
-
-