Browse Source
feat: implement test questions flow component and question detail client handler
front-test-2
feat: implement test questions flow component and question detail client handler
front-test-2
7 changed files with 2270 additions and 158 deletions
-
296src/app/questions-list/[slug]/question-detail-client.tsx
-
20src/app/questions-list/page.tsx
-
3src/components/questions/progress-helper.ts
-
149src/components/questions/test-loading-screen.tsx
-
10src/components/questions/test-questions-flow.tsx
-
1691src/data/cattell-fallback.ts
-
183src/data/glasser-fallback.ts
@ -0,0 +1,149 @@ |
|||
"use client"; |
|||
|
|||
import { PageBackground } from "@/components/utils/page-background"; |
|||
|
|||
export function AnalyzingIllustration({ className = "w-44 h-44" }: { className?: string }) { |
|||
return ( |
|||
<svg |
|||
viewBox="0 0 160 160" |
|||
fill="none" |
|||
xmlns="http://www.w3.org/2000/svg" |
|||
className={className} |
|||
> |
|||
{/* Base shadow oval */} |
|||
<ellipse cx="80" cy="144" rx="55" ry="6" fill="#FCE7F3" opacity="0.8" /> |
|||
<ellipse cx="80" cy="144" rx="35" ry="3.5" fill="#FDA4AF" opacity="0.4" /> |
|||
|
|||
{/* Main Document Paper */} |
|||
<g filter="drop-shadow(0px 8px 20px rgba(242, 70, 95, 0.12))"> |
|||
{/* Paper body */} |
|||
<rect x="42" y="30" width="76" height="96" rx="10" fill="#FFFFFF" /> |
|||
|
|||
{/* Header bar inside paper */} |
|||
<rect x="50" y="38" width="60" height="26" rx="6" fill="#FFF1F2" /> |
|||
|
|||
{/* Small text lines in header */} |
|||
<line x1="56" y1="46" x2="76" y2="46" stroke="#FDA4AF" strokeWidth="2.5" strokeLinecap="round" /> |
|||
<line x1="56" y1="53" x2="70" y2="53" stroke="#FECDD3" strokeWidth="2" strokeLinecap="round" /> |
|||
|
|||
{/* Donut chart in header */} |
|||
<circle cx="97" cy="51" r="7.5" stroke="#F2465F" strokeWidth="3" fill="none" strokeDasharray="32 10" /> |
|||
<circle cx="97" cy="51" r="3.5" fill="#E03950" /> |
|||
|
|||
{/* Bar chart bars */} |
|||
<rect x="54" y="86" width="6" height="26" rx="3" fill="#F2465F" /> |
|||
<rect x="64" y="74" width="6" height="38" rx="3" fill="#FF6B81" /> |
|||
<rect x="74" y="92" width="6" height="20" rx="3" fill="#FDA4AF" /> |
|||
<rect x="84" y="80" width="6" height="32" rx="3" fill="#F2465F" /> |
|||
<rect x="94" y="88" width="6" height="24" rx="3" fill="#FF8093" /> |
|||
|
|||
{/* Pie Chart on right */} |
|||
<circle cx="97" cy="73" r="8.5" fill="#FDA4AF" /> |
|||
<path d="M97 73 L97 64.5 A8.5 8.5 0 0 1 105.5 73 Z" fill="#F2465F" /> |
|||
</g> |
|||
|
|||
{/* Rolled bottom paper edge effect */} |
|||
<path |
|||
d="M42 120 C 42 128, 54 128, 54 120 C 54 128, 118 128, 118 120" |
|||
fill="#FFFFFF" |
|||
stroke="#FFE4E6" |
|||
strokeWidth="1.5" |
|||
/> |
|||
|
|||
{/* Magnifying Glass */} |
|||
<g filter="drop-shadow(2px 8px 14px rgba(242, 70, 95, 0.25))"> |
|||
{/* Handle */} |
|||
<rect |
|||
x="28" |
|||
y="88" |
|||
width="8" |
|||
height="36" |
|||
rx="4" |
|||
transform="rotate(38 28 88)" |
|||
fill="#F2465F" |
|||
/> |
|||
{/* Handle Accent Connection */} |
|||
<rect |
|||
x="28" |
|||
y="88" |
|||
width="8" |
|||
height="9" |
|||
rx="2" |
|||
transform="rotate(38 28 88)" |
|||
fill="#E03950" |
|||
/> |
|||
|
|||
{/* Glass Ring */} |
|||
<circle |
|||
cx="62" |
|||
cy="58" |
|||
r="21" |
|||
fill="#FFFFFF" |
|||
fillOpacity="0.65" |
|||
stroke="#F2465F" |
|||
strokeWidth="5" |
|||
/> |
|||
{/* Lens Inner Reflection */} |
|||
<path |
|||
d="M49 50 A 16 16 0 0 1 71 46" |
|||
stroke="#FFD1D7" |
|||
strokeWidth="3.5" |
|||
strokeLinecap="round" |
|||
fill="none" |
|||
/> |
|||
</g> |
|||
</svg> |
|||
); |
|||
} |
|||
|
|||
type TestLoadingScreenProps = { |
|||
title?: string; |
|||
subtitle?: string; |
|||
locale?: string; |
|||
}; |
|||
|
|||
export default function TestLoadingScreen({ |
|||
title, |
|||
subtitle, |
|||
locale = "fa", |
|||
}: TestLoadingScreenProps) { |
|||
const defaultTitle = |
|||
locale === "fa" ? "در حال تحلیل و دریافت اطلاعات" : "Analyzing responses"; |
|||
const defaultSubtitle = |
|||
locale === "fa" |
|||
? "لطفاً چند لحظه شکیبا باشید تا اطلاعات مورد نظر بارگذاری و آماده شوند." |
|||
: "Please wait while we review your submission and generate results."; |
|||
|
|||
return ( |
|||
<> |
|||
<PageBackground disabled /> |
|||
<main className="-mx-[17px] flex h-svh flex-col items-center justify-between bg-[#F7F1F0] py-16 px-6 text-center select-none"> |
|||
{/* Top spacer to balance layout */} |
|||
<div className="w-full shrink-0" /> |
|||
|
|||
{/* Center Content Block */} |
|||
<div className="flex flex-col items-center max-w-xs mx-auto my-auto"> |
|||
{/* Brand Illustrated Icon */} |
|||
<div className="mb-6 flex justify-center"> |
|||
<AnalyzingIllustration className="w-44 h-44 drop-shadow-sm" /> |
|||
</div> |
|||
|
|||
{/* Title */} |
|||
<h2 className="text-xl font-extrabold text-[#2C2C2E] tracking-tight mb-2.5 leading-snug"> |
|||
{title ?? defaultTitle} |
|||
</h2> |
|||
|
|||
{/* Subtitle */} |
|||
<p className="text-sm font-medium text-[#6C6C70] leading-relaxed max-w-[270px] mx-auto"> |
|||
{subtitle ?? defaultSubtitle} |
|||
</p> |
|||
</div> |
|||
|
|||
{/* Bottom Circular Loading Spinner */} |
|||
<div className="shrink-0 mb-4 flex justify-center items-center"> |
|||
<div className="size-11 rounded-full border-[3.5px] border-[#DCDCE0] border-t-[#F2465F] border-r-[#F2465F] animate-spin transition-all" /> |
|||
</div> |
|||
</main> |
|||
</> |
|||
); |
|||
} |
|||
1691
src/data/cattell-fallback.ts
File diff suppressed because it is too large
View File
File diff suppressed because it is too large
View File
@ -0,0 +1,183 @@ |
|||
export type GlasserFallbackQuestion = { |
|||
question_number: number; |
|||
factor_code: string; |
|||
text: string; |
|||
}; |
|||
|
|||
export const glasserFallbackQuestions: GlasserFallbackQuestion[] = [ |
|||
{ |
|||
question_number: 1, |
|||
factor_code: "S", |
|||
text: "مسایلی مثل پس انداز، مخارج زندگی، مسکن، آینده شغلی و.. تا چه اندازه ذهن شما را به خود مشغول می دارد؟" |
|||
}, |
|||
{ |
|||
question_number: 2, |
|||
factor_code: "S", |
|||
text: "تا چه اندازه به سلامت جسمانی، بهداشت و احتمال ابتلا به بیماری فکر میکنید؟" |
|||
}, |
|||
{ |
|||
question_number: 3, |
|||
factor_code: "S", |
|||
text: "شدت میل جنسی خود را چگونه ارزیابی میکنید؟" |
|||
}, |
|||
{ |
|||
question_number: 4, |
|||
factor_code: "S", |
|||
text: "در انجام کارها و اقدامات مخاطره انگیز تا چه اندازه محتاطانه عمل میکنید؟" |
|||
}, |
|||
{ |
|||
question_number: 5, |
|||
factor_code: "S", |
|||
text: "از روبه رویی با تجارب جدید و شروع راه های ناشناخته تا چه اندازه اجتناب میکنید؟" |
|||
}, |
|||
{ |
|||
question_number: 6, |
|||
factor_code: "S", |
|||
text: "از نظر دوستان و همکاران خود چقدر وقت شناس با نظم و ترتیب و دقیق هستید؟" |
|||
}, |
|||
{ |
|||
question_number: 7, |
|||
factor_code: "S", |
|||
text: "تا چه اندازه امنیت شغلی و درآمد ثابت برایتان اهمیت دارد؟" |
|||
}, |
|||
{ |
|||
question_number: 8, |
|||
factor_code: "L", |
|||
text: "احساس می کنید به چه میزان عشق، صمیمیت و مهرورزی نیاز دارید؟" |
|||
}, |
|||
{ |
|||
question_number: 9, |
|||
factor_code: "L", |
|||
text: "تا چه اندازه رفاه و سعادت انسان های دیگر برایتان مهم است؟" |
|||
}, |
|||
{ |
|||
question_number: 10, |
|||
factor_code: "L", |
|||
text: "تا چه اندازه تمایل دارید تجارب شخصی، احساسات عمیق و اسرار خود را با دیگران در میان بگذارید؟" |
|||
}, |
|||
{ |
|||
question_number: 11, |
|||
factor_code: "L", |
|||
text: "در ایجاد صمیمیت و برقراری ارتباط عاطفی با دیگران چقدر پیش قدم می شوید؟" |
|||
}, |
|||
{ |
|||
question_number: 12, |
|||
factor_code: "L", |
|||
text: "تا چه اندازه از دیدن، وقت گذراندن و گفتگو با دوستان و آشنایان خود لذت می برید؟" |
|||
}, |
|||
{ |
|||
question_number: 13, |
|||
factor_code: "L", |
|||
text: "میزان بخشندگی، گذشت و فراموش کردن خطای دیگران را در خود چگونه ارزیابی می کنید؟" |
|||
}, |
|||
{ |
|||
question_number: 14, |
|||
factor_code: "L", |
|||
text: "تا چه اندازه به ایجاد و حفظ روابط دوستانه، صمیمی و پایدار با دیگران علاقه مند هستید؟" |
|||
}, |
|||
{ |
|||
question_number: 15, |
|||
factor_code: "P", |
|||
text: "تا چه اندازه تمایل دارید رهبری گروهها، هدایت پروژهها یا مدیریت امور را بر عهده بگیرید؟" |
|||
}, |
|||
{ |
|||
question_number: 16, |
|||
factor_code: "P", |
|||
text: "رسیدن به موفقیت، موقعیت اجتماعی ممتاز و جایگاه برتر تا چه حد برایتان اهمیت دارد؟" |
|||
}, |
|||
{ |
|||
question_number: 17, |
|||
factor_code: "P", |
|||
text: "در صورت بروز نقد، مخالفت یا اشتباه از سوی دیگران، تا چه حد رفتار تند، قاطع یا اصلاحی نشان میدهید؟" |
|||
}, |
|||
{ |
|||
question_number: 18, |
|||
factor_code: "P", |
|||
text: "تا چه اندازه تمایل دارید کارها دقیقاً طبق نظرات، استانداردها و روشهای شما انجام شوند؟" |
|||
}, |
|||
{ |
|||
question_number: 19, |
|||
factor_code: "P", |
|||
text: "در بحثها و گفتگوها تا چه حد اصرار دارید حرف و نظر خود را به عنوان نظر درست به اثبات برسانید؟" |
|||
}, |
|||
{ |
|||
question_number: 20, |
|||
factor_code: "P", |
|||
text: "وقتی احساس میکنید حق با شماست، تا چه اندازه حاضر به رقابت یا پافشاری بر روی خواستههایتان هستید؟" |
|||
}, |
|||
{ |
|||
question_number: 21, |
|||
factor_code: "P", |
|||
text: "دیدگاه شما نسبت به یادگیری، کسب دانش و بالا بردن اطلاعات تخصصی چیست؟" |
|||
}, |
|||
{ |
|||
question_number: 22, |
|||
factor_code: "Fr", |
|||
text: "تا چه اندازه تمایل دارید بدون دخالت، نظارت یا دستور دیگران اهداف شخصی خود را دنبال کنید؟" |
|||
}, |
|||
{ |
|||
question_number: 23, |
|||
factor_code: "Fr", |
|||
text: "در برابر احساس محدودیت، اجبار یا رعایت قوانین دست و پا گیر تا چه حد واکنش نشان میدهید؟" |
|||
}, |
|||
{ |
|||
question_number: 24, |
|||
factor_code: "Fr", |
|||
text: "میزان تمایل شما به داشتن حریم خصوصی، زمان تنهایی و استقلال در تصمیمگیریها چقدر است؟" |
|||
}, |
|||
{ |
|||
question_number: 25, |
|||
factor_code: "Fr", |
|||
text: "تا چه اندازه رهایی از قید و بندها و برنامههای فشرده را ترجیح میدهید؟" |
|||
}, |
|||
{ |
|||
question_number: 26, |
|||
factor_code: "Fr", |
|||
text: "در مواجهه با فشار روانی یا استرس، تا چه حد نیاز دارید فضا و وقت مستقل داشته باشید؟" |
|||
}, |
|||
{ |
|||
question_number: 27, |
|||
factor_code: "Fr", |
|||
text: "تا چه اندازه تمایل دارید مسیر زندگی، سبک پوشش یا رفتارهای خود را بر اساس معیارهای فردی انتخاب کنید؟" |
|||
}, |
|||
{ |
|||
question_number: 28, |
|||
factor_code: "Fr", |
|||
text: "چقدر برای آزادی اندیشه و ابراز دیدگاههای غیرمعمول اهمیت قائل هستید؟" |
|||
}, |
|||
{ |
|||
question_number: 29, |
|||
factor_code: "Fu", |
|||
text: "تا چه اندازه اهل شوخطبعی، خنده، لطیفهگویی و ایجاد فضای شاد هستید؟" |
|||
}, |
|||
{ |
|||
question_number: 30, |
|||
factor_code: "Fu", |
|||
text: "چقدر زمان و هزینه برای سرگرمی، تفریحات بیدغدغه و فعالیتهای مفرح اختصاص میدهید؟" |
|||
}, |
|||
{ |
|||
question_number: 31, |
|||
factor_code: "Fu", |
|||
text: "تا چه اندازه از کارهای خلاقانه، هنری، بازی و سرگرمی لذت میبرید؟" |
|||
}, |
|||
{ |
|||
question_number: 32, |
|||
factor_code: "Fu", |
|||
text: "چقدر قادر هستید لحظات سخت و جدیت زندگی را با نگاهی سبک، طنزآمیز و مثبت سپری کنید؟" |
|||
}, |
|||
{ |
|||
question_number: 33, |
|||
factor_code: "Fu", |
|||
text: "تمایل شما به شرکت در دورهمیها، برنامههای تفریحی و سفر با دوستان چقدر است؟" |
|||
}, |
|||
{ |
|||
question_number: 34, |
|||
factor_code: "Fu", |
|||
text: "چقدر برای داشتن سرگرمیها (هابی) و فعالیتهای غیرکاری وقت میگذارید؟" |
|||
}, |
|||
{ |
|||
question_number: 35, |
|||
factor_code: "Fu", |
|||
text: "از یادگیری چیزهای جدید همراه با بازی، هیجان و نشاط چقدر استقبال میکنید؟" |
|||
} |
|||
]; |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue