@tinyweb_dev/oe-exam-sdk 0.1.27 → 0.1.29

package/dist/components/exams/TemplateSelector.js

@@ -1 +1,76 @@
-"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import{useEffect as t,useState as l}from"react";import{BookOpen as s,ChevronLeft as n,ChevronRight as i,Clock as r,Loader2 as c,Search as o,Users as m}from"lucide-react";import{Button as d}from"../../components/ui/button";import{Card as p,CardContent as g,CardDescription as h,CardHeader as x,CardTitle as u}from"../../components/ui/card";import{Input as N}from"../../components/ui/input";import{useT as f}from"../../shared/lib/i18n";import{mapTemplateDetailToExamTemplate as v}from"../../api/exam-create";export function TemplateSelector({api:s,onTemplateSelect:r,onCancel:m}){const p=f(),[g,h]=l(""),[x,u]=l(1),[b,y]=l([]),[k,j]=l(1),[C,E]=l(0),[T,L]=l(!0),[S,D]=l(),[P,q]=l();t(()=>{u(1)},[g]),t(()=>{let e=!1;return L(!0),s.getExamTemplates({page:x,search:g||void 0}).then(a=>{e||(y(a.items),j(a.totalPages),E(a.totalItems))}).catch(a=>{e||D(a instanceof Error?a.message:p("admin.exams.questions.loadError"))}).finally(()=>{e||L(!1)}),()=>{e=!0}},[s,x,g,p]);const z=async e=>{D(void 0),q(e.id);try{const t="data"in(a=await s.getExamTemplateDetail(e.id))?a.data:a;r(v(t))}catch(e){D(e instanceof Error?e.message:p("admin.exams.questions.loadError"))}finally{q(void 0)}var a},A=x>1&&!T,I=x<k&&!T;return a("div",{className:"flex min-h-0 flex-1 flex-col gap-4",children:[a("div",{className:"relative",children:[e(o,{className:"absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-gray-400"}),e(N,{value:g,onChange:e=>h(e.target.value),placeholder:p("admin.templates.searchPlaceholder"),className:"pl-9"})]}),T?e("div",{className:"flex flex-1 items-center justify-center",children:e(c,{className:"h-6 w-6 animate-spin text-blue-600"})}):null,!T&&S?e("p",{className:"text-sm text-red-600",children:S}):null,T||S?null:e("div",{className:"grid flex-1 content-start gap-3 overflow-y-auto md:grid-cols-2 lg:grid-cols-3",children:b.map((a,t)=>e(w,{template:a,index:t,onSelect:z,isLoading:P===a.id,disabled:!!P},a.id))}),T||S||0!==b.length?null:e("p",{className:"flex-1 text-center text-sm text-gray-500",children:p("admin.templates.table.empty")}),!T&&!S&&C>0?a("div",{className:"flex shrink-0 items-center justify-between border-t border-gray-100 pt-3",children:[e("span",{className:"text-sm text-gray-500",children:p("admin.templates.table.showing",{count:b.length,total:C})}),a("div",{className:"flex items-center gap-2",children:[a(d,{variant:"outline",size:"sm",disabled:!A,onClick:()=>u(e=>Math.max(1,e-1)),children:[e(n,{className:"h-4 w-4"}),p("common.pagination.previous")]}),e("span",{className:"text-sm text-gray-600",children:p("admin.schedules.list.page",{current:x,total:k})}),a(d,{variant:"outline",size:"sm",disabled:!I,onClick:()=>u(e=>e+1),children:[p("common.pagination.next"),e(i,{className:"h-4 w-4"})]})]})]}):null,m&&e("div",{className:"flex shrink-0 justify-end",children:e(d,{variant:"outline",onClick:m,children:p("common.cancel")})})]})}const b=["blue","green","purple","orange","pink","indigo"],y={blue:"bg-blue-100 text-blue-600",green:"bg-green-100 text-green-600",purple:"bg-purple-100 text-purple-600",orange:"bg-orange-100 text-orange-600",pink:"bg-pink-100 text-pink-600",indigo:"bg-indigo-100 text-indigo-600"};function w({template:t,index:l,onSelect:n,isLoading:i,disabled:o}){const d=b[l%b.length];return a(p,{className:"relative cursor-pointer border-2 border-gray-200 bg-white transition-all duration-200 hover:border-gray-300 hover:bg-gray-50 hover:shadow-md "+(o?"pointer-events-none opacity-60":""),onClick:()=>n(t),children:[e(x,{className:"px-4 py-3",children:a("div",{className:"flex items-center gap-2",children:[e("div",{className:`rounded-md p-1.5 ${y[d]}`,children:e(s,{className:"h-4 w-4"})}),a("div",{className:"min-w-0 flex-1",children:[e(u,{className:"truncate text-sm font-semibold",children:t.title}),t.subTitle&&e(h,{className:"truncate text-[11px]",children:t.subTitle})]})]})}),e(g,{className:"space-y-2 px-4 pb-3 pt-0",children:a("div",{className:"grid grid-cols-2 gap-x-3 gap-y-1 text-xs",children:[a("div",{className:"flex items-center gap-1.5",children:[e(s,{className:"h-3 w-3 text-gray-500"}),a("span",{className:"text-gray-600",children:[t.totalQuestions," câu hỏi"]})]}),a("div",{className:"flex items-center gap-1.5",children:[e("div",{className:"h-3 w-3 rounded-full bg-gray-300"}),a("span",{className:"text-gray-600",children:[t.totalParts," phần"]})]}),t.examLevel&&a("div",{className:"flex items-center gap-1.5",children:[e(m,{className:"h-3 w-3 text-gray-500"}),a("span",{className:"text-gray-600",children:["Cấp độ ",t.examLevel]})]}),t.createdAt&&a("div",{className:"flex items-center gap-1.5",children:[e(r,{className:"h-3 w-3 text-gray-500"}),e("span",{className:"text-gray-600",children:new Date(t.createdAt).toLocaleDateString("vi-VN")})]})]})}),i?e("div",{className:"absolute inset-0 flex items-center justify-center rounded-xl bg-white/60",children:e(c,{className:"h-5 w-5 animate-spin text-blue-600"})}):null]})}
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { BookOpen, ChevronLeft, ChevronRight, Clock, Loader2, Search, Users } from 'lucide-react';
+import { Button } from '../../components/ui/button';
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '../../components/ui/card';
+import { Input } from '../../components/ui/input';
+import { useT } from '../../shared/lib/i18n';
+import { mapTemplateDetailToExamTemplate } from '../../api/exam-create';
+export function TemplateSelector({ api, onTemplateSelect, onCancel }) {
+    const t = useT();
+    const [search, setSearch] = useState('');
+    const [page, setPage] = useState(1);
+    const [templates, setTemplates] = useState([]);
+    const [totalPages, setTotalPages] = useState(1);
+    const [totalItems, setTotalItems] = useState(0);
+    const [isLoading, setIsLoading] = useState(true);
+    const [error, setError] = useState();
+    const [loadingId, setLoadingId] = useState();
+    // Reset to the first page whenever the search term changes so results stay in sync.
+    useEffect(() => { setPage(1); }, [search]);
+    useEffect(() => {
+        let ignore = false;
+        setIsLoading(true);
+        api.getExamTemplates({ page, search: search || undefined })
+            .then((result) => {
+            if (ignore)
+                return;
+            setTemplates(result.items);
+            setTotalPages(result.totalPages);
+            setTotalItems(result.totalItems);
+        })
+            .catch((err) => { if (!ignore)
+            setError(err instanceof Error ? err.message : t('admin.exams.questions.loadError')); })
+            .finally(() => { if (!ignore)
+            setIsLoading(false); });
+        return () => { ignore = true; };
+    }, [api, page, search, t]);
+    // The list endpoint returns lightweight summaries (no `parts`). Fetch the full template detail by
+    // id and map it to an `ExamTemplate` before emitting, so downstream (TemplateSection /
+    // buildExamTemplatePayload) gets a complete entity. Ported from oe-exam-fe TemplateSelector.
+    const handleSelect = async (summary) => {
+        setError(undefined);
+        setLoadingId(summary.id);
+        try {
+            const detail = unwrapDetail(await api.getExamTemplateDetail(summary.id));
+            onTemplateSelect(mapTemplateDetailToExamTemplate(detail));
+        }
+        catch (err) {
+            setError(err instanceof Error ? err.message : t('admin.exams.questions.loadError'));
+        }
+        finally {
+            setLoadingId(undefined);
+        }
+    };
+    const canPrev = page > 1 && !isLoading;
+    const canNext = page < totalPages && !isLoading;
+    return (_jsxs("div", { className: "flex min-h-0 flex-1 flex-col gap-4", children: [_jsxs("div", { className: "relative", children: [_jsx(Search, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-gray-400" }), _jsx(Input, { value: search, onChange: (event) => setSearch(event.target.value), placeholder: t('admin.templates.searchPlaceholder'), className: "pl-9" })] }), isLoading ? _jsx("div", { className: "flex flex-1 items-center justify-center", children: _jsx(Loader2, { className: "h-6 w-6 animate-spin text-blue-600" }) }) : null, !isLoading && error ? _jsx("p", { className: "text-sm text-red-600", children: error }) : null, !isLoading && !error ? _jsx("div", { className: "grid flex-1 content-start gap-3 overflow-y-auto md:grid-cols-2 lg:grid-cols-3", children: templates.map((template, index) => _jsx(TemplateCard, { template: template, index: index, onSelect: handleSelect, isLoading: loadingId === template.id, disabled: !!loadingId }, template.id)) }) : null, !isLoading && !error && templates.length === 0 ? _jsx("p", { className: "flex-1 text-center text-sm text-gray-500", children: t('admin.templates.table.empty') }) : null, !isLoading && !error && totalItems > 0 ? (_jsxs("div", { className: "flex shrink-0 items-center justify-between border-t border-gray-100 pt-3", children: [_jsx("span", { className: "text-sm text-gray-500", children: t('admin.templates.table.showing', { count: templates.length, total: totalItems }) }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs(Button, { variant: "outline", size: "sm", disabled: !canPrev, onClick: () => setPage((value) => Math.max(1, value - 1)), children: [_jsx(ChevronLeft, { className: "h-4 w-4" }), t('common.pagination.previous')] }), _jsx("span", { className: "text-sm text-gray-600", children: t('admin.schedules.list.page', { current: page, total: totalPages }) }), _jsxs(Button, { variant: "outline", size: "sm", disabled: !canNext, onClick: () => setPage((value) => value + 1), children: [t('common.pagination.next'), _jsx(ChevronRight, { className: "h-4 w-4" })] })] })] })) : null, onCancel && _jsx("div", { className: "flex shrink-0 justify-end", children: _jsx(Button, { variant: "outline", onClick: onCancel, children: t('common.cancel') }) })] }));
+}
+const TEMPLATE_COLORS = ['blue', 'green', 'purple', 'orange', 'pink', 'indigo'];
+const ICON_COLOR_CLASSES = {
+    blue: 'bg-blue-100 text-blue-600',
+    green: 'bg-green-100 text-green-600',
+    purple: 'bg-purple-100 text-purple-600',
+    orange: 'bg-orange-100 text-orange-600',
+    pink: 'bg-pink-100 text-pink-600',
+    indigo: 'bg-indigo-100 text-indigo-600',
+};
+function TemplateCard({ template, index, onSelect, isLoading, disabled }) {
+    const color = TEMPLATE_COLORS[index % TEMPLATE_COLORS.length];
+    return (_jsxs(Card, { className: `relative cursor-pointer border-2 border-gray-200 bg-white transition-all duration-200 hover:border-gray-300 hover:bg-gray-50 hover:shadow-md ${disabled ? 'pointer-events-none opacity-60' : ''}`, onClick: () => onSelect(template), children: [_jsx(CardHeader, { className: "px-4 py-3", children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: `rounded-md p-1.5 ${ICON_COLOR_CLASSES[color]}`, children: _jsx(BookOpen, { className: "h-4 w-4" }) }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx(CardTitle, { className: "truncate text-sm font-semibold", children: template.title }), template.subTitle && _jsx(CardDescription, { className: "truncate text-[11px]", children: template.subTitle })] })] }) }), _jsx(CardContent, { className: "space-y-2 px-4 pb-3 pt-0", children: _jsxs("div", { className: "grid grid-cols-2 gap-x-3 gap-y-1 text-xs", children: [_jsxs("div", { className: "flex items-center gap-1.5", children: [_jsx(BookOpen, { className: "h-3 w-3 text-gray-500" }), _jsxs("span", { className: "text-gray-600", children: [template.totalQuestions, " c\u00E2u h\u1ECFi"] })] }), _jsxs("div", { className: "flex items-center gap-1.5", children: [_jsx("div", { className: "h-3 w-3 rounded-full bg-gray-300" }), _jsxs("span", { className: "text-gray-600", children: [template.totalParts, " ph\u1EA7n"] })] }), template.examLevel && _jsxs("div", { className: "flex items-center gap-1.5", children: [_jsx(Users, { className: "h-3 w-3 text-gray-500" }), _jsxs("span", { className: "text-gray-600", children: ["C\u1EA5p \u0111\u1ED9 ", template.examLevel] })] }), template.createdAt && _jsxs("div", { className: "flex items-center gap-1.5", children: [_jsx(Clock, { className: "h-3 w-3 text-gray-500" }), _jsx("span", { className: "text-gray-600", children: new Date(template.createdAt).toLocaleDateString('vi-VN') })] })] }) }), isLoading ? _jsx("div", { className: "absolute inset-0 flex items-center justify-center rounded-xl bg-white/60", children: _jsx(Loader2, { className: "h-5 w-5 animate-spin text-blue-600" }) }) : null] }));
+}
+/** Unwrap the optional `{ data }` envelope returned by the detail endpoint. */
+function unwrapDetail(result) {
+    return 'data' in result ? result.data : result;
+}

package/dist/components/exams/UnsavedChangesDialog.js

@@ -1 +1,7 @@
-"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import{AlertDialog as n,AlertDialogAction as c,AlertDialogCancel as r,AlertDialogContent as l,AlertDialogDescription as s,AlertDialogFooter as t,AlertDialogHeader as i,AlertDialogTitle as h}from"../../components/ui/alert-dialog";import{AlertTriangle as m,Save as o,X as d}from"lucide-react";export function UnsavedChangesDialog({open:g,onOpenChange:x,onConfirm:p,onCancel:u,questionNumber:b}){return e(n,{open:g,onOpenChange:x,children:a(l,{className:"max-w-md",children:[a("div",{className:"flex flex-col items-center pt-2 pb-4",children:[e("div",{className:"flex h-16 w-16 items-center justify-center rounded-full bg-amber-100 mb-4",children:e(m,{className:"h-8 w-8 text-amber-600"})}),a(i,{className:"text-center space-y-2",children:[e(h,{className:"text-xl font-semibold text-gray-900",children:"Xác nhận chuyển câu hỏi"}),e(s,{className:"text-center text-gray-600",children:b?a("span",{children:["Câu hỏi ",e("strong",{className:"text-gray-800",children:b})," có những thay đổi chưa được lưu."]}):e("span",{children:"Câu hỏi hiện tại có những thay đổi chưa được lưu."})})]})]}),e("div",{className:"rounded-lg border border-amber-200 bg-amber-50 p-4 mb-4",children:e("p",{className:"text-sm text-amber-800",children:"Nếu bạn tiếp tục mà không lưu, các thay đổi sẽ bị mất và không thể khôi phục."})}),a(t,{className:"flex flex-col-reverse sm:flex-row gap-2 sm:gap-3",children:[a(r,{onClick:u,className:"flex-1 gap-2 border-gray-300 hover:bg-gray-50",children:[e(o,{className:"h-4 w-4"}),"Quay lại chỉnh sửa"]}),a(c,{onClick:p,className:"flex-1 gap-2 bg-red-500 hover:bg-red-600 text-white",children:[e(d,{className:"h-4 w-4"}),"Hủy thay đổi"]})]})]})})}
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, } from '../../components/ui/alert-dialog';
+import { AlertTriangle, Save, X } from 'lucide-react';
+export function UnsavedChangesDialog({ open, onOpenChange, onConfirm, onCancel, questionNumber, }) {
+    return (_jsx(AlertDialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(AlertDialogContent, { className: "max-w-md", children: [_jsxs("div", { className: "flex flex-col items-center pt-2 pb-4", children: [_jsx("div", { className: "flex h-16 w-16 items-center justify-center rounded-full bg-amber-100 mb-4", children: _jsx(AlertTriangle, { className: "h-8 w-8 text-amber-600" }) }), _jsxs(AlertDialogHeader, { className: "text-center space-y-2", children: [_jsx(AlertDialogTitle, { className: "text-xl font-semibold text-gray-900", children: "X\u00E1c nh\u1EADn chuy\u1EC3n c\u00E2u h\u1ECFi" }), _jsx(AlertDialogDescription, { className: "text-center text-gray-600", children: questionNumber ? (_jsxs("span", { children: ["C\u00E2u h\u1ECFi ", _jsx("strong", { className: "text-gray-800", children: questionNumber }), " c\u00F3 nh\u1EEFng thay \u0111\u1ED5i ch\u01B0a \u0111\u01B0\u1EE3c l\u01B0u."] })) : (_jsx("span", { children: "C\u00E2u h\u1ECFi hi\u1EC7n t\u1EA1i c\u00F3 nh\u1EEFng thay \u0111\u1ED5i ch\u01B0a \u0111\u01B0\u1EE3c l\u01B0u." })) })] })] }), _jsx("div", { className: "rounded-lg border border-amber-200 bg-amber-50 p-4 mb-4", children: _jsx("p", { className: "text-sm text-amber-800", children: "N\u1EBFu b\u1EA1n ti\u1EBFp t\u1EE5c m\u00E0 kh\u00F4ng l\u01B0u, c\u00E1c thay \u0111\u1ED5i s\u1EBD b\u1ECB m\u1EA5t v\u00E0 kh\u00F4ng th\u1EC3 kh\u00F4i ph\u1EE5c." }) }), _jsxs(AlertDialogFooter, { className: "flex flex-col-reverse sm:flex-row gap-2 sm:gap-3", children: [_jsxs(AlertDialogCancel, { onClick: onCancel, className: "flex-1 gap-2 border-gray-300 hover:bg-gray-50", children: [_jsx(Save, { className: "h-4 w-4" }), "Quay l\u1EA1i ch\u1EC9nh s\u1EEDa"] }), _jsxs(AlertDialogAction, { onClick: onConfirm, className: "flex-1 gap-2 bg-red-500 hover:bg-red-600 text-white", children: [_jsx(X, { className: "h-4 w-4" }), "H\u1EE7y thay \u0111\u1ED5i"] })] })] }) }));
+}

package/dist/components/exams/api.js

@@ -1 +1,3 @@
-export{buildExamTemplatePayload,createExamCreateApi,createMockCreateExamApi}from"../../api/exam-create";export{createExamQuestionsApi,createExamQuestionsFetchApi,createMockExamQuestionsApi}from"../../api/exam-questions";export{createExamTakingApi,createMockExamTakingApi}from"../../api/exam-taking";
+export { buildExamTemplatePayload, createExamCreateApi, createMockCreateExamApi } from '../../api/exam-create';
+export { createExamQuestionsApi, createExamQuestionsFetchApi, createMockExamQuestionsApi } from '../../api/exam-questions';
+export { createExamTakingApi, createMockExamTakingApi } from '../../api/exam-taking';

package/dist/components/exams/create-exam.texts.js

@@ -1 +1 @@
-export{};
+export {};

package/dist/components/exams/create-exam.validation.js

@@ -1 +1,18 @@
-import{z as t}from"zod";export const examFormSchema=t.object({code:t.string().min(1,"Mã đề kiểm tra không được để trống").max(100,"Mã đề kiểm tra không được vượt quá 100 ký tự").regex(/^[a-zA-Z0-9_-]+$/,"Mã đề kiểm tra chỉ được chứa chữ cái, số, dấu gạch ngang (-) và gạch dưới (_)").trim(),name:t.string().min(3,"Tên đề kiểm tra phải có ít nhất 3 ký tự").max(255,"Tên đề kiểm tra không được vượt quá 255 ký tự").trim(),level:t.string(),difficulty:t.string(),duration:t.string().refine(t=>{if(!t)return!0;const n=Number.parseInt(t,10);return!Number.isNaN(n)&&n>=5&&n<=300},{message:"Thời gian kiểm tra phải từ 5 đến 300 phút"}),totalPoints:t.string().min(1,"Vui lòng nhập tổng điểm").refine(t=>/^[1-9]\d*$/.test(t.trim()),{message:"Tổng điểm phải là số nguyên dương"}).refine(t=>{const n=Number.parseInt(t,10);return n>=1&&n<=1e3},{message:"Tổng điểm phải từ 1 đến 1000"}),description:t.string().max(2e3,"Mô tả không được vượt quá 2000 ký tự").trim()});
+import { z } from 'zod';
+export const examFormSchema = z.object({
+    code: z.string().min(1, 'Mã đề kiểm tra không được để trống').max(100, 'Mã đề kiểm tra không được vượt quá 100 ký tự').regex(/^[a-zA-Z0-9_-]+$/, 'Mã đề kiểm tra chỉ được chứa chữ cái, số, dấu gạch ngang (-) và gạch dưới (_)').trim(),
+    name: z.string().min(3, 'Tên đề kiểm tra phải có ít nhất 3 ký tự').max(255, 'Tên đề kiểm tra không được vượt quá 255 ký tự').trim(),
+    level: z.string(),
+    difficulty: z.string(),
+    duration: z.string().refine((value) => {
+        if (!value)
+            return true;
+        const minutes = Number.parseInt(value, 10);
+        return !Number.isNaN(minutes) && minutes >= 5 && minutes <= 300;
+    }, { message: 'Thời gian kiểm tra phải từ 5 đến 300 phút' }),
+    totalPoints: z.string().min(1, 'Vui lòng nhập tổng điểm').refine((value) => /^[1-9]\d*$/.test(value.trim()), { message: 'Tổng điểm phải là số nguyên dương' }).refine((value) => {
+        const points = Number.parseInt(value, 10);
+        return points >= 1 && points <= 1000;
+    }, { message: 'Tổng điểm phải từ 1 đến 1000' }),
+    description: z.string().max(2000, 'Mô tả không được vượt quá 2000 ký tự').trim(),
+});

package/dist/components/exams/entry/EntryRestartDialog.js

@@ -1 +1,11 @@
-"use client";import{jsx as n,jsxs as i,Fragment as e}from"react/jsx-runtime";import{AlertDialog as t,AlertDialogAction as r,AlertDialogCancel as l,AlertDialogContent as a,AlertDialogDescription as c,AlertDialogFooter as o,AlertDialogHeader as m,AlertDialogTitle as s}from"../../../components/ui/alert-dialog";import{Loader2 as d}from"lucide-react";export function EntryRestartDialog({open:h,onOpenChange:p,isStarting:u,onContinue:g,onRestart:b}){return n(t,{open:h,onOpenChange:p,children:i(a,{children:[i(m,{children:[n(s,{children:"Bạn đang có bài thi dở"}),n(c,{children:"Bạn đã bắt đầu làm bài thi này trước đó. Bạn muốn tiếp tục làm bài hay bắt đầu lại từ đầu?"})]}),i(o,{children:[n(l,{disabled:u,onClick:g,children:"Làm tiếp"}),n(r,{disabled:u,onClick:b,children:u?i(e,{children:[n(d,{className:"mr-2 h-4 w-4 animate-spin"}),"Đang xử lý..."]}):"Làm lại từ đầu"})]})]})})}
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, } from '../../../components/ui/alert-dialog';
+import { Loader2 } from 'lucide-react';
+/**
+ * Shown when the student already has an IN_PROGRESS attempt for this room.
+ * Lets them resume the existing attempt or discard it and start fresh.
+ */
+export function EntryRestartDialog({ open, onOpenChange, isStarting, onContinue, onRestart, }) {
+    return (_jsx(AlertDialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(AlertDialogContent, { children: [_jsxs(AlertDialogHeader, { children: [_jsx(AlertDialogTitle, { children: "B\u1EA1n \u0111ang c\u00F3 b\u00E0i thi d\u1EDF" }), _jsx(AlertDialogDescription, { children: "B\u1EA1n \u0111\u00E3 b\u1EAFt \u0111\u1EA7u l\u00E0m b\u00E0i thi n\u00E0y tr\u01B0\u1EDBc \u0111\u00F3. B\u1EA1n mu\u1ED1n ti\u1EBFp t\u1EE5c l\u00E0m b\u00E0i hay b\u1EAFt \u0111\u1EA7u l\u1EA1i t\u1EEB \u0111\u1EA7u?" })] }), _jsxs(AlertDialogFooter, { children: [_jsx(AlertDialogCancel, { disabled: isStarting, onClick: onContinue, children: "L\u00E0m ti\u1EBFp" }), _jsx(AlertDialogAction, { disabled: isStarting, onClick: onRestart, children: isStarting ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), "\u0110ang x\u1EED l\u00FD..."] })) : ('Làm lại từ đầu') })] })] }) }));
+}

package/dist/components/exams/entry/StudentExamEntryPageContainer.js

@@ -1 +1,358 @@
-"use client";import{jsx as e,Fragment as t,jsxs as a}from"react/jsx-runtime";import{useState as r,useEffect as n,useCallback as i,useMemo as o}from"react";import{Dialog as s,DialogContent as l,DialogDescription as d,DialogTitle as c}from"../../../components/ui/dialog";import{t as m}from"../../../shared/lib/i18n";import{ROUTES as h}from"../../../shared/constants/routes";import{normalizeExamTheme as x,resolveThemeConfig as u}from"../../../shared/lib/themes";import{unwrap as p}from"../take/exam-taking.utils";import{toast as g}from"sonner";import{Loader2 as b,Clock as f,Trophy as v,ArrowLeft as w}from"lucide-react";import y from"next/image";import{BeforeStartCard as N,ExpiredCard as _,AlreadySubmittedCard as k}from"../../../components/features/exam-entry";import{CloseButton as T}from"../../../components/features/exam-entry/themed/components";import{ToeicWaitingRoom as E}from"../../../components/features/exam-entry/themed/ToeicWaitingRoom";import{CambridgeYleWaitingRoom as D}from"../../../components/features/exam-entry/themed/CambridgeYleWaitingRoom";import{SummerSkyWaitingRoom as S}from"../../../components/themes/summer-sky/SummerSkyWaitingRoom";import{FullscreenLoading as R}from"./fullscreen-loading";export function StudentExamEntryPageContainer({roomId:I,inviteToken:A=null,api:O,onNavigate:M,takePath:C=e=>`/student/exams/${e}/take`,closePath:B,renderRegistrationForm:W}){const L=i((e,t=!1)=>{M?M(e,{replace:t}):"undefined"!=typeof window&&(t?window.location.replace(e):window.location.href=e)},[M]),[j,F]=r(null),[z,U]=r(null),[$,P]=r("LOADING"),[X,Y]=r(0),[H,V]=r(5),[G,K]=r(!1),[Q,q]=r(!1),[J,Z]=r(null),[ee,te]=r(!1),[ae,re]=r(!1),[ne,ie]=r(!1),oe=o(()=>{const e=j?.exam?.theme,t=j?.exam?.template?.theme;return u({examTheme:e,templateTheme:t,level:j?.exam?.level})},[j?.exam,I,j]),se=o(()=>B?B(j):j?.contest?.id?h.STUDENT.CONTEST_ROOMS(j.contest.id):h.STUDENT.CONTESTS_DISCOVER,[B,j]),le=i((e,t)=>{const a=!0===e.allowMultipleSubmissions;if(t){const e=t.status;if("SUBMITTED"===e||"GRADED"===e||"PUBLISHED"===e)return a?"WITHIN_WINDOW":"ALREADY_SUBMITTED";if("IN_PROGRESS"===e)return"WITHIN_WINDOW"}const r=(new Date).getTime(),n=e.startDatetime?new Date(e.startDatetime).getTime():null,i=e.endDatetime?new Date(e.endDatetime).getTime():null;return!a&&i&&r>i?"EXPIRED":n&&r<n?"BEFORE_START":"WITHIN_WINDOW"},[]);n(()=>{(async()=>{try{if(A)try{await(O.joinViaInvite?.(I,A))}catch{}const e=await O.getRoom(I),t=p(e);if(F(t),!t.canAccess&&!A)return void P("NO_ACCESS");if(t.registrationFormConfig?.enabled&&t.registrationFormConfig.fields?.length>0&&!t.hasSubmittedFormData)return void re(!0);if(!t.exam)return void P("NO_EXAM");const a=await O.getActiveAttemptByRoom(I),r=p(a);r&&(Z(r),U(r));const n=!0===t.allowMultipleSubmissions;if(t.hasJoined&&!r&&!n)return void P("ALREADY_SUBMITTED");const i=le(t,r??null);if(P(i),"BEFORE_START"===i&&t.startDatetime){const e=new Date(t.startDatetime).getTime(),a=(new Date).getTime();Y(Math.max(0,Math.floor((e-a)/1e3)))}}catch(e){console.error("Failed to load room data:",e),g.error(m("student.exam.entry.loadError"))}})()},[I,A,le]),n(()=>{if("BEFORE_START"!==$||X<=0)return;const e=setInterval(()=>{Y(e=>e<=1?(P("WITHIN_WINDOW"),0):e-1)},1e3);return()=>clearInterval(e)},[$,X]);const de=i(async()=>{try{K(!0),await O.startAttempt(I),L(C(I),!0)}catch(e){const t=e,a=t.response?.data?.errorCode;"ROOM_NO_EXAM"===a?P("NO_EXAM"):"ROOM_NOT_STARTED"===a?(g.error(m("student.exam.entry.notStarted")),P("BEFORE_START"),q(!1),V(5)):"ROOM_ENDED"===a?(g.error(m("student.exam.entry.expired")),P("EXPIRED")):"ATTEMPT_ALREADY_SUBMITTED"===a?(g.error("Bạn đã hoàn thành bài thi này rồi."),P("ALREADY_SUBMITTED")):g.error(m("student.exam.entry.startError")),K(!1)}},[I]),ce=i(()=>{J?te(!0):de()},[J,de]),me=i(()=>{te(!1),g.success(m("student.exam.entry.continue")),L(C(I),!0)},[I]),he=i(async()=>{if(J)try{te(!1),K(!0),await O.deleteAttempt(J.id),Z(null),await de()}catch(e){console.error("Failed to restart attempt:",e),g.error(m("student.exam.entry.restartError")),K(!1)}},[J,de]);n(()=>{if(!Q||H<=0)return;const e=setInterval(()=>{V(e=>e<=1?(L(C(I),!0),0):e-1)},1e3);return()=>clearInterval(e)},[Q,H,I]);const xe=i(async e=>{if(j?.contest?.id){ie(!0);try{await(O.registerContest?.(j.contest.id,e)),re(!1);const t=await O.getRoom(I),a=p(t);if(F(a),!a.exam)return void P("NO_EXAM");const r=await O.getActiveAttemptByRoom(I),n=p(r);n&&(Z(n),U(n));const i=!0===a.allowMultipleSubmissions;if(a.hasJoined&&!n&&!i)return void P("ALREADY_SUBMITTED");const o=le(a,n??null);if(P(o),"BEFORE_START"===o&&a.startDatetime){const e=new Date(a.startDatetime).getTime(),t=(new Date).getTime();Y(Math.max(0,Math.floor((e-t)/1e3)))}}catch{g.error("Không thể gửi thông tin đăng ký. Vui lòng thử lại.")}finally{ie(!1)}}},[j?.contest?.id,I,le]);if(ae&&j?.registrationFormConfig&&W)return a(t,{children:[e(R,{}),W({room:j,onSubmit:xe,isSubmitting:ne})]});if("LOADING"===$)return e(R,{});if("NO_EXAM"===$)return e("div",{className:"fixed inset-0 z-50 flex items-center justify-center overflow-hidden bg-gradient-to-b from-sky-100 via-blue-50 to-indigo-100",children:a("div",{className:"mx-auto max-w-md p-4 text-center",children:[e("div",{className:"mb-6 text-7xl",children:"📝✨"}),e("h2",{className:"mb-3 text-2xl font-bold text-sky-700",children:"Bài thi đang được chuẩn bị"}),j&&a("div",{className:"mb-4 rounded-xl bg-white/60 px-5 py-3 text-left text-sm text-sky-700 shadow-sm backdrop-blur-sm",children:[e("p",{className:"font-semibold text-base",children:j.name}),j.code&&a("p",{className:"mt-1 text-sky-500",children:["Mã phòng: ",e("span",{className:"font-mono font-medium",children:j.code})]}),(j.startDatetime||j.endDatetime)&&a("p",{className:"mt-1 text-sky-500",children:["Thời gian thi:"," ",j.startDatetime?new Date(j.startDatetime).toLocaleString("vi-VN"):"—"," → ",j.endDatetime?new Date(j.endDatetime).toLocaleString("vi-VN"):"—"]})]}),e("p",{className:"mb-6 text-base text-sky-600",children:"Thầy cô đang chuẩn bị đề thi cho phòng này. Bạn quay lại sau nhé! 😊"}),e("button",{className:"mx-auto inline-flex items-center gap-2 rounded-2xl border-b-4 border-sky-600 bg-sky-500 px-8 py-3 text-lg font-bold text-white shadow-md transition-all hover:brightness-110 active:translate-y-0.5 active:border-b-2 active:shadow-sm",onClick:()=>window.history.back(),children:"← Quay lại"})]})});if("NO_ACCESS"===$)return e("div",{className:"fixed inset-0 z-50 flex items-center justify-center overflow-hidden bg-gradient-to-b from-red-50 via-orange-50 to-amber-50",children:a("div",{className:"mx-auto max-w-md p-4 text-center",children:[e("div",{className:"mb-6 text-7xl",children:"🔒"}),e("h2",{className:"mb-3 text-2xl font-bold text-red-600",children:"Không có quyền truy cập"}),e("p",{className:"mb-6 text-base text-red-500",children:"Bạn chưa được đăng ký vào phòng thi này. Hãy liên hệ thầy cô để được thêm vào phòng thi nhé!"}),e("button",{className:"mx-auto inline-flex items-center gap-2 rounded-2xl border-b-4 border-red-600 bg-red-500 px-8 py-3 text-lg font-bold text-white shadow-md transition-all hover:brightness-110 active:translate-y-0.5 active:border-b-2 active:shadow-sm",onClick:()=>window.history.back(),children:"← Quay lại"})]})});const ue="TOEIC"===j?.exam?.template?.subTitle,pe="SUMMER_SKY"===x(j?.exam?.theme||j?.exam?.template?.theme);if("WITHIN_WINDOW"===$&&j)return a(t,{children:[ue?e(E,{room:j,onStart:ce,isStarting:G,showCountdown:Q,autoStartCountdown:H,closeRedirectUrl:se,onClose:()=>{L(se)}}):pe?e(S,{room:j,onStart:ce,isStarting:G,onExit:()=>{L(se)}}):e(D,{room:j,onStart:ce,isStarting:G,showCountdown:Q,autoStartCountdown:H,closeRedirectUrl:se,onClose:()=>{L(se)}}),e(s,{open:ee,onOpenChange:te,children:e(l,{className:"overflow-visible border-0 bg-transparent p-0 shadow-none sm:max-w-md",children:a("div",{className:"relative overflow-visible rounded-[28px] bg-gradient-to-br from-cyan-300/25 via-white/5 to-white/0 p-px shadow-[0_30px_80px_-20px_rgba(10,75,140,0.85)] backdrop-blur-xl",children:[e("div",{className:"pointer-events-none absolute -left-16 -top-16 h-48 w-48 rounded-full bg-cyan-400/35 blur-3xl"}),e("div",{className:"pointer-events-none absolute -right-16 -bottom-16 h-48 w-48 rounded-full bg-sky-500/30 blur-3xl"}),e("div",{className:"pointer-events-none absolute left-1/2 top-0 h-24 w-1/2 -translate-x-1/2 rounded-full bg-cyan-300/15 blur-2xl"}),a("div",{className:"relative overflow-hidden rounded-[calc(28px-1px)] bg-gradient-to-b from-[#0e3d70]/97 via-[#0a4b8c]/97 to-[#072d54]/97 ring-1 ring-cyan-300/25",children:[e("div",{className:"pointer-events-none absolute inset-0 opacity-[0.04]",style:{backgroundImage:"radial-gradient(circle at 1px 1px, white 1px, transparent 0)",backgroundSize:"24px 24px"}}),e("div",{className:"pointer-events-none absolute inset-x-0 top-0 h-px bg-gradient-to-r from-transparent via-cyan-300/40 to-transparent"}),a("div",{className:"relative flex flex-col items-center gap-4 px-8 pt-10 pb-6",children:[a("div",{className:"relative",children:[e("div",{className:"absolute inset-0 animate-ping rounded-full bg-cyan-300/30",style:{animationDuration:"2.8s"}}),e("div",{className:"absolute -inset-3 rounded-full bg-gradient-to-br from-cyan-300/15 to-sky-500/10 blur-md"}),e("div",{className:"absolute -inset-1.5 rounded-full bg-gradient-to-br from-cyan-200/30 to-sky-400/20"}),e("div",{className:"relative flex h-16 w-16 items-center justify-center rounded-full bg-gradient-to-br from-cyan-300 via-sky-500 to-sky-700 shadow-[0_10px_30px_-6px_rgba(34,211,238,0.7),inset_0_2px_4px_rgba(255,255,255,0.4)] ring-[3px] ring-cyan-200/40",children:a("svg",{className:"h-8 w-8 text-white drop-shadow-[0_2px_3px_rgba(0,0,0,0.3)]",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:[e("path",{d:"M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"}),e("line",{x1:"12",y1:"9",x2:"12",y2:"13"}),e("line",{x1:"12",y1:"17",x2:"12.01",y2:"17"})]})})]}),a("div",{className:"flex flex-col items-center gap-2",children:[e(c,{className:"text-center text-xl font-black tracking-tight text-white drop-shadow-[0_2px_8px_rgba(34,211,238,0.4)]",children:"Bạn đang có bài thi dở"}),e(d,{className:"max-w-sm text-center text-[13px] font-medium leading-relaxed text-cyan-100/75",children:"Bạn đã bắt đầu làm bài thi này trước đó. Bạn muốn tiếp tục làm bài hay bắt đầu lại từ đầu?"})]})]}),e("div",{className:"mx-8 h-px bg-gradient-to-r from-transparent via-cyan-300/30 to-transparent"}),a("div",{className:"relative flex flex-col-reverse gap-3 px-8 py-6 sm:flex-row sm:justify-center",children:[a("button",{onClick:me,className:"group relative inline-flex min-w-[140px] cursor-pointer items-center justify-center gap-2 overflow-hidden rounded-full bg-white/[0.08] px-7 py-3 text-sm font-bold text-white ring-1 ring-cyan-200/30 backdrop-blur-md transition-all duration-200 hover:-translate-y-0.5 hover:bg-white/[0.14] hover:ring-cyan-200/60 hover:shadow-[0_8px_20px_-4px_rgba(34,211,238,0.3)] active:translate-y-0",children:[e("span",{className:"pointer-events-none absolute inset-0 -translate-x-full bg-gradient-to-r from-transparent via-white/20 to-transparent transition-transform duration-700 group-hover:translate-x-full"}),e("span",{className:"relative",children:"Làm tiếp"})]}),a("button",{onClick:he,disabled:G,className:"group relative inline-flex min-w-[160px] cursor-pointer items-center justify-center gap-2 overflow-hidden rounded-full bg-gradient-to-b from-[#ffd54a] via-[#ffb733] to-[#ff8a1f] px-7 py-3 text-sm font-black uppercase tracking-wide text-white shadow-[0_6px_0_0_#c46410,0_10px_22px_rgba(255,138,31,0.5)] ring-2 ring-orange-300/70 transition-all duration-150 hover:-translate-y-0.5 hover:brightness-110 hover:shadow-[0_8px_0_0_#c46410,0_14px_26px_rgba(255,138,31,0.55)] active:translate-y-1.5 active:shadow-[0_1px_0_0_#c46410,0_3px_8px_rgba(255,138,31,0.3)] disabled:cursor-not-allowed disabled:opacity-70",style:{textShadow:"0 2px 0 rgba(180,80,10,0.55)"},children:[e("span",{className:"pointer-events-none absolute inset-x-0 top-0 h-1/2 bg-gradient-to-b from-white/30 to-transparent"}),G?a(t,{children:[e(b,{className:"relative h-4 w-4 animate-spin"}),e("span",{className:"relative",children:"Đang xử lý..."})]}):e("span",{className:"relative",children:"Làm lại từ đầu"})]})]})]})]})})})]});const ge=oe.visuals?.backgroundFilter??"grayscale(1) blur(10px) saturate(0.85) brightness(0.9)",be=oe.visuals?.backgroundOverlay??"linear-gradient(to bottom, rgba(0, 0, 0, 0.2), transparent, rgba(0, 0, 0, 0.3))",fe=oe.visuals?.cardBackground??"radial-gradient(60% 60% at 50% 40%, rgba(184, 229, 157, 0.85) 0%, rgba(115, 213, 133, 0.85) 100%)";return a("div",{className:"fixed inset-0 z-50 flex items-center justify-center overflow-hidden",children:[e("div",{className:"absolute inset-0 scale-110 bg-cover bg-center",style:{backgroundImage:`url(${oe.assets.background})`,filter:ge}}),e("div",{className:"absolute inset-0",style:{background:be}}),a("div",{className:"relative z-10 w-[88%] max-w-2xl sm:w-[70%] md:w-[50%] lg:w-[42%]",children:[e(T,{imageSrc:oe.assets.closeButton,onClick:()=>L(se),className:"absolute -right-3 -top-7 z-30",size:72}),a("div",{className:"absolute left-1/2 top-0 z-10 -translate-x-1/2 -translate-y-1/2",children:[e(y,{src:oe.assets.titleBar,alt:"",width:260,height:56,className:"drop-shadow-lg",priority:!0,unoptimized:!0}),e("span",{className:"absolute inset-0 mt-2.5 flex items-center justify-center pb-1 text-sm font-extrabold tracking-wider text-white drop-shadow",children:oe.displayName})]}),a("div",{className:"relative overflow-hidden rounded-3xl shadow-2xl ring-1 ring-white/20",children:[e("div",{className:"h-2 w-full",style:{backgroundImage:`url(${oe.assets.cardFrame})`,backgroundSize:"100% 100%"}}),a("div",{className:"relative p-6 pt-12 md:p-8 md:pt-14",style:{background:fe},children:[a("div",{className:"mb-4 rounded-2xl bg-black/20 px-4 py-3.5 text-center ring-1 ring-white/10 backdrop-blur-sm",children:[e("h2",{className:"text-base font-extrabold tracking-wide text-white drop-shadow-sm",children:j?.name}),j?.exam?.name&&e("p",{className:"mt-0.5 text-xs font-medium text-white/80",children:j.exam.name})]}),(j?.exam?.durationMinutes||j?.exam?.totalScore)&&a("div",{className:"mb-4 grid grid-cols-2 gap-3",children:[j?.exam?.durationMinutes&&a("div",{className:"flex flex-col items-center rounded-2xl bg-black/20 px-2 py-4 ring-1 ring-white/10 backdrop-blur-sm",children:[e("div",{className:"mb-2 flex h-8 w-8 items-center justify-center rounded-full bg-white/10",children:e(f,{className:"h-4 w-4 text-white"})}),e("span",{className:"text-2xl font-extrabold text-white",children:j.exam.durationMinutes}),e("span",{className:"text-xs font-semibold text-white/80",children:"Phút"})]}),j?.exam?.totalScore&&a("div",{className:"flex flex-col items-center rounded-2xl bg-black/20 px-2 py-4 ring-1 ring-white/10 backdrop-blur-sm",children:[e("div",{className:"mb-2 flex h-8 w-8 items-center justify-center rounded-full bg-white/10",children:e(v,{className:"h-4 w-4 text-white"})}),e("span",{className:"text-2xl font-extrabold text-white",children:j.exam.totalScore}),e("span",{className:"text-xs font-semibold text-white/80",children:"Thang điểm"})]})]}),"BEFORE_START"===$&&e(N,{countdown:X,formatCountdown:e=>{const t=Math.floor(e/86400),a=Math.floor(e%86400/3600),r=Math.floor(e%3600/60),n=e%60;return t>0?`${t} ngày ${a} giờ ${r} phút`:a>0?`${a} giờ ${r} phút ${n} giây`:r>0?`${r} phút ${n} giây`:`${n} giây`}}),"EXPIRED"===$&&e(_,{}),"ALREADY_SUBMITTED"===$&&e(k,{attempt:z}),e("div",{className:"mt-5 flex justify-center",children:a("button",{className:"group relative inline-flex cursor-pointer items-center gap-2 rounded-full bg-[#0473f9] px-8 py-3 shadow-[0_4px_0_0_#1d4ed8] transition-all duration-150 hover:brightness-110 active:translate-y-[2px] active:shadow-[0_2px_0_0_#1d4ed8]",onClick:()=>L(se),children:[e(w,{className:"h-5 w-5 text-white transition-transform group-hover:-translate-x-0.5"}),e("span",{className:"text-sm font-extrabold uppercase tracking-wider text-white",children:"Quay lại"})]})}),e("div",{className:"pointer-events-none absolute -bottom-1 -left-1 opacity-60",children:e(y,{src:oe.assets.bottomLeft,alt:"",width:80,height:80,unoptimized:!0})}),e("div",{className:"pointer-events-none absolute -bottom-1 -right-1 opacity-60",children:e(y,{src:oe.assets.bottomRight,alt:"",width:80,height:80,unoptimized:!0})})]})]})]})]})}
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect, useCallback, useMemo } from 'react';
+import { Dialog, DialogContent, DialogDescription, DialogTitle, } from '../../../components/ui/dialog';
+import { t } from '../../../shared/lib/i18n';
+import { ROUTES } from '../../../shared/constants/routes';
+import { normalizeExamTheme, resolveThemeConfig } from '../../../shared/lib/themes';
+import { unwrap } from '../take/exam-taking.utils';
+import { toast } from 'sonner';
+import { Loader2, Clock, Trophy, ArrowLeft } from 'lucide-react';
+import Image from 'next/image';
+import { BeforeStartCard, ExpiredCard, AlreadySubmittedCard, } from '../../../components/features/exam-entry';
+import { CloseButton } from '../../../components/features/exam-entry/themed/components';
+import { ToeicWaitingRoom } from '../../../components/features/exam-entry/themed/ToeicWaitingRoom';
+import { CambridgeYleWaitingRoom } from '../../../components/features/exam-entry/themed/CambridgeYleWaitingRoom';
+import { SummerSkyWaitingRoom } from '../../../components/themes/summer-sky/SummerSkyWaitingRoom';
+import { FullscreenLoading } from './fullscreen-loading';
+/**
+ * SDK container for the fullscreen student exam entry screen. Ports the host
+ * app's `/student/exams/:roomId/enter` flow: invite join, access/exam/
+ * registration gating, room-window state machine, active-attempt resume, the
+ * restart-or-continue dialog, and the themed waiting rooms (TOEIC / Cambridge
+ * YLE / Summer Sky). Infrastructure is injected via {@link ExamEntrySdkApi},
+ * `onNavigate`, and `renderRegistrationForm`.
+ */
+export function StudentExamEntryPageContainer({ roomId, inviteToken = null, api, onNavigate, takePath = (id) => `/student/exams/${id}/take`, closePath, renderRegistrationForm, }) {
+    const navigate = useCallback((href, replace = false) => {
+        if (onNavigate)
+            onNavigate(href, { replace });
+        else if (typeof window !== 'undefined') {
+            if (replace)
+                window.location.replace(href);
+            else
+                window.location.href = href;
+        }
+    }, [onNavigate]);
+    const [room, setRoom] = useState(null);
+    const [attempt, setAttempt] = useState(null);
+    const [entryState, setEntryState] = useState('LOADING');
+    const [countdown, setCountdown] = useState(0);
+    const [autoStartCountdown, setAutoStartCountdown] = useState(5);
+    const [isStarting, setIsStarting] = useState(false);
+    const [showCountdown, setShowCountdown] = useState(false);
+    // States for active attempt handling
+    const [activeAttempt, setActiveAttempt] = useState(null);
+    const [showRestartDialog, setShowRestartDialog] = useState(false);
+    // Registration form states
+    const [showRegistrationForm, setShowRegistrationForm] = useState(false);
+    const [isSubmittingForm, setIsSubmittingForm] = useState(false);
+    const theme = useMemo(() => {
+        const examTheme = room?.exam?.theme;
+        const templateTheme = room?.exam?.template?.theme;
+        const resolved = resolveThemeConfig({
+            examTheme,
+            templateTheme,
+            level: room?.exam?.level,
+        });
+        return resolved;
+    }, [room?.exam, roomId, room]);
+    // Compute the close/back URL: go to the contest rooms page if contest exists, otherwise discover page
+    const closeUrl = useMemo(() => closePath
+        ? closePath(room)
+        : room?.contest?.id
+            ? ROUTES.STUDENT.CONTEST_ROOMS(room.contest.id)
+            : ROUTES.STUDENT.CONTESTS_DISCOVER, [closePath, room]);
+    // Determine entry state based on room and attempt data
+    const determineState = useCallback((roomData, attemptData) => {
+        const canMultipleSubmit = roomData.allowMultipleSubmissions === true;
+        if (attemptData) {
+            const status = attemptData.status;
+            if (status === 'SUBMITTED' || status === 'GRADED' || status === 'PUBLISHED') {
+                // If multiple submissions allowed, treat as WITHIN_WINDOW so student can start a new attempt
+                if (canMultipleSubmit) {
+                    return 'WITHIN_WINDOW';
+                }
+                return 'ALREADY_SUBMITTED';
+            }
+            if (status === 'IN_PROGRESS')
+                return 'WITHIN_WINDOW';
+        }
+        const now = new Date().getTime();
+        const start = roomData.startDatetime ? new Date(roomData.startDatetime).getTime() : null;
+        const end = roomData.endDatetime ? new Date(roomData.endDatetime).getTime() : null;
+        // Skip end-time check if multiple submissions allowed
+        if (!canMultipleSubmit && end && now > end)
+            return 'EXPIRED';
+        if (start && now < start)
+            return 'BEFORE_START';
+        return 'WITHIN_WINDOW';
+    }, []);
+    // Load room and check active attempt on page load
+    useEffect(() => {
+        const loadData = async () => {
+            try {
+                // If invite token present, join via invite first (silently)
+                if (inviteToken) {
+                    try {
+                        await api.joinViaInvite?.(roomId, inviteToken);
+                    }
+                    catch {
+                        // Ignore - student may already be a member
+                    }
+                }
+                const roomResponse = await api.getRoom(roomId);
+                const roomData = unwrap(roomResponse);
+                setRoom(roomData);
+                // Check if student has access to this room
+                if (!roomData.canAccess && !inviteToken) {
+                    setEntryState('NO_ACCESS');
+                    return;
+                }
+                // Check if registration form is required but not yet submitted
+                if (roomData.registrationFormConfig?.enabled &&
+                    roomData.registrationFormConfig.fields?.length > 0 &&
+                    !roomData.hasSubmittedFormData) {
+                    setShowRegistrationForm(true);
+                    return;
+                }
+                // Check if room has an exam assigned
+                if (!roomData.exam) {
+                    setEntryState('NO_EXAM');
+                    return;
+                }
+                // Check active attempt specifically for THIS room
+                // (not the global getActive which may return an attempt from another room)
+                const attemptResponse = await api.getActiveAttemptByRoom(roomId);
+                const activeForRoom = unwrap(attemptResponse);
+                if (activeForRoom) {
+                    // Student has an IN_PROGRESS attempt for this room - allow continuing
+                    setActiveAttempt(activeForRoom);
+                    setAttempt(activeForRoom);
+                }
+                // If student already joined (has attempt) but no active IN_PROGRESS attempt for this room,
+                // and multiple submissions not allowed → already submitted
+                const canMultipleSubmit = roomData.allowMultipleSubmissions === true;
+                if (roomData.hasJoined && !activeForRoom && !canMultipleSubmit) {
+                    setEntryState('ALREADY_SUBMITTED');
+                    return;
+                }
+                const state = determineState(roomData, activeForRoom ?? null);
+                setEntryState(state);
+                if (state === 'BEFORE_START' && roomData.startDatetime) {
+                    const start = new Date(roomData.startDatetime).getTime();
+                    const now = new Date().getTime();
+                    setCountdown(Math.max(0, Math.floor((start - now) / 1000)));
+                }
+            }
+            catch (error) {
+                console.error('Failed to load room data:', error);
+                toast.error(t('student.exam.entry.loadError'));
+            }
+        };
+        loadData();
+    }, [roomId, inviteToken, determineState]);
+    // Countdown for BEFORE_START state
+    useEffect(() => {
+        if (entryState !== 'BEFORE_START' || countdown <= 0)
+            return;
+        const timer = setInterval(() => {
+            setCountdown((prev) => {
+                if (prev <= 1) {
+                    setEntryState('WITHIN_WINDOW');
+                    return 0;
+                }
+                return prev - 1;
+            });
+        }, 1000);
+        return () => clearInterval(timer);
+    }, [entryState, countdown]);
+    // Start a new attempt and navigate
+    const startNewAttempt = useCallback(async () => {
+        try {
+            setIsStarting(true);
+            await api.startAttempt(roomId);
+            // Skip countdown and navigate immediately, replacing history so back button bypasses enter page
+            navigate(takePath(roomId), true);
+        }
+        catch (error) {
+            const err = error;
+            const errorCode = err.response?.data?.errorCode;
+            if (errorCode === 'ROOM_NO_EXAM') {
+                setEntryState('NO_EXAM');
+            }
+            else if (errorCode === 'ROOM_NOT_STARTED') {
+                toast.error(t('student.exam.entry.notStarted'));
+                setEntryState('BEFORE_START');
+                setShowCountdown(false);
+                setAutoStartCountdown(5);
+            }
+            else if (errorCode === 'ROOM_ENDED') {
+                toast.error(t('student.exam.entry.expired'));
+                setEntryState('EXPIRED');
+            }
+            else if (errorCode === 'ATTEMPT_ALREADY_SUBMITTED') {
+                toast.error('Bạn đã hoàn thành bài thi này rồi.');
+                setEntryState('ALREADY_SUBMITTED');
+            }
+            else {
+                toast.error(t('student.exam.entry.startError'));
+            }
+            setIsStarting(false);
+        }
+    }, [roomId]);
+    // Handle start button click
+    const handleStartClick = useCallback(() => {
+        if (activeAttempt) {
+            // Show dialog to choose continue or restart
+            setShowRestartDialog(true);
+        }
+        else {
+            // No active attempt - start new
+            startNewAttempt();
+        }
+    }, [activeAttempt, startNewAttempt]);
+    // Continue with existing attempt
+    const handleContinue = useCallback(() => {
+        setShowRestartDialog(false);
+        toast.success(t('student.exam.entry.continue'));
+        navigate(takePath(roomId), true);
+    }, [roomId]);
+    // Restart - delete old attempt and start new
+    const handleRestart = useCallback(async () => {
+        if (!activeAttempt)
+            return;
+        try {
+            setShowRestartDialog(false);
+            setIsStarting(true);
+            await api.deleteAttempt(activeAttempt.id);
+            setActiveAttempt(null);
+            await startNewAttempt();
+        }
+        catch (error) {
+            console.error('Failed to restart attempt:', error);
+            toast.error(t('student.exam.entry.restartError'));
+            setIsStarting(false);
+        }
+    }, [activeAttempt, startNewAttempt]);
+    // 5-sec countdown then navigate
+    useEffect(() => {
+        if (!showCountdown || autoStartCountdown <= 0)
+            return;
+        const timer = setInterval(() => {
+            setAutoStartCountdown((prev) => {
+                if (prev <= 1) {
+                    navigate(takePath(roomId), true);
+                    return 0;
+                }
+                return prev - 1;
+            });
+        }, 1000);
+        return () => clearInterval(timer);
+    }, [showCountdown, autoStartCountdown, roomId]);
+    const formatCountdown = (seconds) => {
+        const days = Math.floor(seconds / 86400);
+        const hours = Math.floor((seconds % 86400) / 3600);
+        const mins = Math.floor((seconds % 3600) / 60);
+        const secs = seconds % 60;
+        if (days > 0)
+            return `${days} ngày ${hours} giờ ${mins} phút`;
+        if (hours > 0)
+            return `${hours} giờ ${mins} phút ${secs} giây`;
+        if (mins > 0)
+            return `${mins} phút ${secs} giây`;
+        return `${secs} giây`;
+    };
+    // Handle registration form submission
+    const handleRegistrationFormSubmit = useCallback(async (formData) => {
+        if (!room?.contest?.id)
+            return;
+        setIsSubmittingForm(true);
+        try {
+            await api.registerContest?.(room.contest.id, formData);
+            setShowRegistrationForm(false);
+            // Reload room data to continue the flow
+            const roomResponse = await api.getRoom(roomId);
+            const roomData = unwrap(roomResponse);
+            setRoom(roomData);
+            if (!roomData.exam) {
+                setEntryState('NO_EXAM');
+                return;
+            }
+            const attemptResponse = await api.getActiveAttemptByRoom(roomId);
+            const activeForRoom = unwrap(attemptResponse);
+            if (activeForRoom) {
+                setActiveAttempt(activeForRoom);
+                setAttempt(activeForRoom);
+            }
+            const canMultipleSubmit = roomData.allowMultipleSubmissions === true;
+            if (roomData.hasJoined && !activeForRoom && !canMultipleSubmit) {
+                setEntryState('ALREADY_SUBMITTED');
+                return;
+            }
+            const state = determineState(roomData, activeForRoom ?? null);
+            setEntryState(state);
+            if (state === 'BEFORE_START' && roomData.startDatetime) {
+                const start = new Date(roomData.startDatetime).getTime();
+                const now = new Date().getTime();
+                setCountdown(Math.max(0, Math.floor((start - now) / 1000)));
+            }
+        }
+        catch {
+            toast.error('Không thể gửi thông tin đăng ký. Vui lòng thử lại.');
+        }
+        finally {
+            setIsSubmittingForm(false);
+        }
+    }, [room?.contest?.id, roomId, determineState]);
+    // Show registration form via the host-provided slot
+    if (showRegistrationForm && room?.registrationFormConfig && renderRegistrationForm) {
+        return (_jsxs(_Fragment, { children: [_jsx(FullscreenLoading, {}), renderRegistrationForm({
+                    room: room,
+                    onSubmit: handleRegistrationFormSubmit,
+                    isSubmitting: isSubmittingForm,
+                })] }));
+    }
+    // Loading state - fullscreen themed loader
+    if (entryState === 'LOADING') {
+        return _jsx(FullscreenLoading, {});
+    }
+    // NO_EXAM state - room has no exam assigned (fullscreen, child-friendly)
+    if (entryState === 'NO_EXAM') {
+        return (_jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center overflow-hidden bg-gradient-to-b from-sky-100 via-blue-50 to-indigo-100", children: _jsxs("div", { className: "mx-auto max-w-md p-4 text-center", children: [_jsx("div", { className: "mb-6 text-7xl", children: "\uD83D\uDCDD\u2728" }), _jsx("h2", { className: "mb-3 text-2xl font-bold text-sky-700", children: "B\u00E0i thi \u0111ang \u0111\u01B0\u1EE3c chu\u1EA9n b\u1ECB" }), room && (_jsxs("div", { className: "mb-4 rounded-xl bg-white/60 px-5 py-3 text-left text-sm text-sky-700 shadow-sm backdrop-blur-sm", children: [_jsx("p", { className: "font-semibold text-base", children: room.name }), room.code && (_jsxs("p", { className: "mt-1 text-sky-500", children: ["M\u00E3 ph\u00F2ng: ", _jsx("span", { className: "font-mono font-medium", children: room.code })] })), (room.startDatetime || room.endDatetime) && (_jsxs("p", { className: "mt-1 text-sky-500", children: ["Th\u1EDDi gian thi:", ' ', room.startDatetime
+                                        ? new Date(room.startDatetime).toLocaleString('vi-VN')
+                                        : '—', ' → ', room.endDatetime
+                                        ? new Date(room.endDatetime).toLocaleString('vi-VN')
+                                        : '—'] }))] })), _jsx("p", { className: "mb-6 text-base text-sky-600", children: "Th\u1EA7y c\u00F4 \u0111ang chu\u1EA9n b\u1ECB \u0111\u1EC1 thi cho ph\u00F2ng n\u00E0y. B\u1EA1n quay l\u1EA1i sau nh\u00E9! \uD83D\uDE0A" }), _jsx("button", { className: "mx-auto inline-flex items-center gap-2 rounded-2xl border-b-4 border-sky-600 bg-sky-500 px-8 py-3 text-lg font-bold text-white shadow-md transition-all hover:brightness-110 active:translate-y-0.5 active:border-b-2 active:shadow-sm", onClick: () => window.history.back(), children: "\u2190 Quay l\u1EA1i" })] }) }));
+    }
+    // NO_ACCESS state - student doesn't have permission to access this room
+    if (entryState === 'NO_ACCESS') {
+        return (_jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center overflow-hidden bg-gradient-to-b from-red-50 via-orange-50 to-amber-50", children: _jsxs("div", { className: "mx-auto max-w-md p-4 text-center", children: [_jsx("div", { className: "mb-6 text-7xl", children: "\uD83D\uDD12" }), _jsx("h2", { className: "mb-3 text-2xl font-bold text-red-600", children: "Kh\u00F4ng c\u00F3 quy\u1EC1n truy c\u1EADp" }), _jsx("p", { className: "mb-6 text-base text-red-500", children: "B\u1EA1n ch\u01B0a \u0111\u01B0\u1EE3c \u0111\u0103ng k\u00FD v\u00E0o ph\u00F2ng thi n\u00E0y. H\u00E3y li\u00EAn h\u1EC7 th\u1EA7y c\u00F4 \u0111\u1EC3 \u0111\u01B0\u1EE3c th\u00EAm v\u00E0o ph\u00F2ng thi nh\u00E9!" }), _jsx("button", { className: "mx-auto inline-flex items-center gap-2 rounded-2xl border-b-4 border-red-600 bg-red-500 px-8 py-3 text-lg font-bold text-white shadow-md transition-all hover:brightness-110 active:translate-y-0.5 active:border-b-2 active:shadow-sm", onClick: () => window.history.back(), children: "\u2190 Quay l\u1EA1i" })] }) }));
+    }
+    // Detect special exams and themes
+    const isToeicExam = room?.exam?.template?.subTitle === 'TOEIC';
+    const examThemeStr = normalizeExamTheme(room?.exam?.theme || room?.exam?.template?.theme);
+    const isSummerSkyTheme = examThemeStr === 'SUMMER_SKY';
+    // WITHIN_WINDOW state - Show themed waiting room (fullscreen)
+    if (entryState === 'WITHIN_WINDOW' && room) {
+        return (_jsxs(_Fragment, { children: [isToeicExam ? (_jsx(ToeicWaitingRoom, { room: room, onStart: handleStartClick, isStarting: isStarting, showCountdown: showCountdown, autoStartCountdown: autoStartCountdown, closeRedirectUrl: closeUrl, onClose: () => { navigate(closeUrl); } })) : isSummerSkyTheme ? (_jsx(SummerSkyWaitingRoom, { room: room, onStart: handleStartClick, isStarting: isStarting, onExit: () => { navigate(closeUrl); } })) : (_jsx(CambridgeYleWaitingRoom, { room: room, onStart: handleStartClick, isStarting: isStarting, showCountdown: showCountdown, autoStartCountdown: autoStartCountdown, closeRedirectUrl: closeUrl, onClose: () => { navigate(closeUrl); } })), _jsx(Dialog, { open: showRestartDialog, onOpenChange: setShowRestartDialog, children: _jsx(DialogContent, { className: "overflow-visible border-0 bg-transparent p-0 shadow-none sm:max-w-md", children: _jsxs("div", { className: "relative overflow-visible rounded-[28px] bg-gradient-to-br from-cyan-300/25 via-white/5 to-white/0 p-px shadow-[0_30px_80px_-20px_rgba(10,75,140,0.85)] backdrop-blur-xl", children: [_jsx("div", { className: "pointer-events-none absolute -left-16 -top-16 h-48 w-48 rounded-full bg-cyan-400/35 blur-3xl" }), _jsx("div", { className: "pointer-events-none absolute -right-16 -bottom-16 h-48 w-48 rounded-full bg-sky-500/30 blur-3xl" }), _jsx("div", { className: "pointer-events-none absolute left-1/2 top-0 h-24 w-1/2 -translate-x-1/2 rounded-full bg-cyan-300/15 blur-2xl" }), _jsxs("div", { className: "relative overflow-hidden rounded-[calc(28px-1px)] bg-gradient-to-b from-[#0e3d70]/97 via-[#0a4b8c]/97 to-[#072d54]/97 ring-1 ring-cyan-300/25", children: [_jsx("div", { className: "pointer-events-none absolute inset-0 opacity-[0.04]", style: {
+                                                backgroundImage: 'radial-gradient(circle at 1px 1px, white 1px, transparent 0)',
+                                                backgroundSize: '24px 24px',
+                                            } }), _jsx("div", { className: "pointer-events-none absolute inset-x-0 top-0 h-px bg-gradient-to-r from-transparent via-cyan-300/40 to-transparent" }), _jsxs("div", { className: "relative flex flex-col items-center gap-4 px-8 pt-10 pb-6", children: [_jsxs("div", { className: "relative", children: [_jsx("div", { className: "absolute inset-0 animate-ping rounded-full bg-cyan-300/30", style: { animationDuration: '2.8s' } }), _jsx("div", { className: "absolute -inset-3 rounded-full bg-gradient-to-br from-cyan-300/15 to-sky-500/10 blur-md" }), _jsx("div", { className: "absolute -inset-1.5 rounded-full bg-gradient-to-br from-cyan-200/30 to-sky-400/20" }), _jsx("div", { className: "relative flex h-16 w-16 items-center justify-center rounded-full bg-gradient-to-br from-cyan-300 via-sky-500 to-sky-700 shadow-[0_10px_30px_-6px_rgba(34,211,238,0.7),inset_0_2px_4px_rgba(255,255,255,0.4)] ring-[3px] ring-cyan-200/40", children: _jsxs("svg", { className: "h-8 w-8 text-white drop-shadow-[0_2px_3px_rgba(0,0,0,0.3)]", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("path", { d: "M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z" }), _jsx("line", { x1: "12", y1: "9", x2: "12", y2: "13" }), _jsx("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })] }) })] }), _jsxs("div", { className: "flex flex-col items-center gap-2", children: [_jsx(DialogTitle, { className: "text-center text-xl font-black tracking-tight text-white drop-shadow-[0_2px_8px_rgba(34,211,238,0.4)]", children: "B\u1EA1n \u0111ang c\u00F3 b\u00E0i thi d\u1EDF" }), _jsx(DialogDescription, { className: "max-w-sm text-center text-[13px] font-medium leading-relaxed text-cyan-100/75", children: "B\u1EA1n \u0111\u00E3 b\u1EAFt \u0111\u1EA7u l\u00E0m b\u00E0i thi n\u00E0y tr\u01B0\u1EDBc \u0111\u00F3. B\u1EA1n mu\u1ED1n ti\u1EBFp t\u1EE5c l\u00E0m b\u00E0i hay b\u1EAFt \u0111\u1EA7u l\u1EA1i t\u1EEB \u0111\u1EA7u?" })] })] }), _jsx("div", { className: "mx-8 h-px bg-gradient-to-r from-transparent via-cyan-300/30 to-transparent" }), _jsxs("div", { className: "relative flex flex-col-reverse gap-3 px-8 py-6 sm:flex-row sm:justify-center", children: [_jsxs("button", { onClick: handleContinue, className: "group relative inline-flex min-w-[140px] cursor-pointer items-center justify-center gap-2 overflow-hidden rounded-full bg-white/[0.08] px-7 py-3 text-sm font-bold text-white ring-1 ring-cyan-200/30 backdrop-blur-md transition-all duration-200 hover:-translate-y-0.5 hover:bg-white/[0.14] hover:ring-cyan-200/60 hover:shadow-[0_8px_20px_-4px_rgba(34,211,238,0.3)] active:translate-y-0", children: [_jsx("span", { className: "pointer-events-none absolute inset-0 -translate-x-full bg-gradient-to-r from-transparent via-white/20 to-transparent transition-transform duration-700 group-hover:translate-x-full" }), _jsx("span", { className: "relative", children: "L\u00E0m ti\u1EBFp" })] }), _jsxs("button", { onClick: handleRestart, disabled: isStarting, className: "group relative inline-flex min-w-[160px] cursor-pointer items-center justify-center gap-2 overflow-hidden rounded-full bg-gradient-to-b from-[#ffd54a] via-[#ffb733] to-[#ff8a1f] px-7 py-3 text-sm font-black uppercase tracking-wide text-white shadow-[0_6px_0_0_#c46410,0_10px_22px_rgba(255,138,31,0.5)] ring-2 ring-orange-300/70 transition-all duration-150 hover:-translate-y-0.5 hover:brightness-110 hover:shadow-[0_8px_0_0_#c46410,0_14px_26px_rgba(255,138,31,0.55)] active:translate-y-1.5 active:shadow-[0_1px_0_0_#c46410,0_3px_8px_rgba(255,138,31,0.3)] disabled:cursor-not-allowed disabled:opacity-70", style: { textShadow: '0 2px 0 rgba(180,80,10,0.55)' }, children: [_jsx("span", { className: "pointer-events-none absolute inset-x-0 top-0 h-1/2 bg-gradient-to-b from-white/30 to-transparent" }), isStarting ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { className: "relative h-4 w-4 animate-spin" }), _jsx("span", { className: "relative", children: "\u0110ang x\u1EED l\u00FD..." })] })) : (_jsx("span", { className: "relative", children: "L\u00E0m l\u1EA1i t\u1EEB \u0111\u1EA7u" }))] })] })] })] }) }) })] }));
+    }
+    const backgroundFilter = theme.visuals?.backgroundFilter ?? 'grayscale(1) blur(10px) saturate(0.85) brightness(0.9)';
+    const backgroundOverlay = theme.visuals?.backgroundOverlay ??
+        'linear-gradient(to bottom, rgba(0, 0, 0, 0.2), transparent, rgba(0, 0, 0, 0.3))';
+    const cardBackground = theme.visuals?.cardBackground ??
+        'radial-gradient(60% 60% at 50% 40%, rgba(184, 229, 157, 0.85) 0%, rgba(115, 213, 133, 0.85) 100%)';
+    // Other states - Show fullscreen themed UI matching ThemedWaitingRoom style
+    return (_jsxs("div", { className: "fixed inset-0 z-50 flex items-center justify-center overflow-hidden", children: [_jsx("div", { className: "absolute inset-0 scale-110 bg-cover bg-center", style: {
+                    backgroundImage: `url(${theme.assets.background})`,
+                    filter: backgroundFilter,
+                } }), _jsx("div", { className: "absolute inset-0", style: { background: backgroundOverlay } }), _jsxs("div", { className: "relative z-10 w-[88%] max-w-2xl sm:w-[70%] md:w-[50%] lg:w-[42%]", children: [_jsx(CloseButton, { imageSrc: theme.assets.closeButton, onClick: () => (navigate(closeUrl)), className: "absolute -right-3 -top-7 z-30", size: 72 }), _jsxs("div", { className: "absolute left-1/2 top-0 z-10 -translate-x-1/2 -translate-y-1/2", children: [_jsx(Image, { src: theme.assets.titleBar, alt: "", width: 260, height: 56, className: "drop-shadow-lg", priority: true, unoptimized: true }), _jsx("span", { className: "absolute inset-0 mt-2.5 flex items-center justify-center pb-1 text-sm font-extrabold tracking-wider text-white drop-shadow", children: theme.displayName })] }), _jsxs("div", { className: "relative overflow-hidden rounded-3xl shadow-2xl ring-1 ring-white/20", children: [_jsx("div", { className: "h-2 w-full", style: {
+                                    backgroundImage: `url(${theme.assets.cardFrame})`,
+                                    backgroundSize: '100% 100%',
+                                } }), _jsxs("div", { className: "relative p-6 pt-12 md:p-8 md:pt-14", style: {
+                                    background: cardBackground,
+                                }, children: [_jsxs("div", { className: "mb-4 rounded-2xl bg-black/20 px-4 py-3.5 text-center ring-1 ring-white/10 backdrop-blur-sm", children: [_jsx("h2", { className: "text-base font-extrabold tracking-wide text-white drop-shadow-sm", children: room?.name }), room?.exam?.name && (_jsx("p", { className: "mt-0.5 text-xs font-medium text-white/80", children: room.exam.name }))] }), (room?.exam?.durationMinutes || room?.exam?.totalScore) && (_jsxs("div", { className: "mb-4 grid grid-cols-2 gap-3", children: [room?.exam?.durationMinutes && (_jsxs("div", { className: "flex flex-col items-center rounded-2xl bg-black/20 px-2 py-4 ring-1 ring-white/10 backdrop-blur-sm", children: [_jsx("div", { className: "mb-2 flex h-8 w-8 items-center justify-center rounded-full bg-white/10", children: _jsx(Clock, { className: "h-4 w-4 text-white" }) }), _jsx("span", { className: "text-2xl font-extrabold text-white", children: room.exam.durationMinutes }), _jsx("span", { className: "text-xs font-semibold text-white/80", children: "Ph\u00FAt" })] })), room?.exam?.totalScore && (_jsxs("div", { className: "flex flex-col items-center rounded-2xl bg-black/20 px-2 py-4 ring-1 ring-white/10 backdrop-blur-sm", children: [_jsx("div", { className: "mb-2 flex h-8 w-8 items-center justify-center rounded-full bg-white/10", children: _jsx(Trophy, { className: "h-4 w-4 text-white" }) }), _jsx("span", { className: "text-2xl font-extrabold text-white", children: room.exam.totalScore }), _jsx("span", { className: "text-xs font-semibold text-white/80", children: "Thang \u0111i\u1EC3m" })] }))] })), entryState === 'BEFORE_START' && (_jsx(BeforeStartCard, { countdown: countdown, formatCountdown: formatCountdown })), entryState === 'EXPIRED' && _jsx(ExpiredCard, {}), entryState === 'ALREADY_SUBMITTED' && _jsx(AlreadySubmittedCard, { attempt: attempt }), _jsx("div", { className: "mt-5 flex justify-center", children: _jsxs("button", { className: "group relative inline-flex cursor-pointer items-center gap-2 rounded-full bg-[#0473f9] px-8 py-3 shadow-[0_4px_0_0_#1d4ed8] transition-all duration-150 hover:brightness-110 active:translate-y-[2px] active:shadow-[0_2px_0_0_#1d4ed8]", onClick: () => (navigate(closeUrl)), children: [_jsx(ArrowLeft, { className: "h-5 w-5 text-white transition-transform group-hover:-translate-x-0.5" }), _jsx("span", { className: "text-sm font-extrabold uppercase tracking-wider text-white", children: "Quay l\u1EA1i" })] }) }), _jsx("div", { className: "pointer-events-none absolute -bottom-1 -left-1 opacity-60", children: _jsx(Image, { src: theme.assets.bottomLeft, alt: "", width: 80, height: 80, unoptimized: true }) }), _jsx("div", { className: "pointer-events-none absolute -bottom-1 -right-1 opacity-60", children: _jsx(Image, { src: theme.assets.bottomRight, alt: "", width: 80, height: 80, unoptimized: true }) })] })] })] })] }));
+}