before show

src/pages/DashboardPage.tsx

@@ -0,0 +1,3 @@
+export function DashboardPage() {
+    return null;
+}

src/pages/MainPage.tsx

@@ -13,29 +13,20 @@ export function MainPage() {
 
     return (
         <div className="main-page">
-            {/* Header */}
-            <div className="header">
-                <Link to="/dashboard" className="menu-button">☰</Link>
-                <h1 className="logo">Pro-Fi Test</h1>
+            <h2 className="title">Тесты для школьников и абитуриентов</h2>
+
+            <div className={"surveys-list"}>
+                <LoadingList data={surveys.items} listElement={(s: Survey)=>(
+                    <Link key={s.id} to={`surveys/${s.id}/`}>{s.title}</Link>
+                )}/>
             </div>
 
-            {/* Main Content */}
-            <div className="content">
-                <h2 className="title">Тесты для школьников и абитуриентов</h2>
-
-                <div className={"surveys-list"}>
-                    <LoadingList data={surveys.items} listElement={(s: Survey)=>(
-                        <Link key={s.id} to={`surveys/${s.id}/`}>{s.title}</Link>
-                    )}/>
-                </div>
-
-                <p className="description">
-                    Добро пожаловать на Pro-Fi Test — ваш надежный помощник в мире профессий!
-                    Мы понимаем, что выбор будущей профессии — это одно из самых важных решений
-                    в жизни каждого школьника. Наша миссия — помочь молодым людям найти свой путь,
-                    раскрыть таланты и понять, какие профессии соответствуют их интересам и способностям.
-                </p>
-            </div>
+            <p className="description">
+                Добро пожаловать на Pro-Fi Test — ваш надежный помощник в мире профессий!
+                Мы понимаем, что выбор будущей профессии — это одно из самых важных решений
+                в жизни каждого школьника. Наша миссия — помочь молодым людям найти свой путь,
+                раскрыть таланты и понять, какие профессии соответствуют их интересам и способностям.
+            </p>
         </div>
     );
 }

src/pages/SurveyPage.tsx

@@ -0,0 +1,53 @@
+import {LoadingList} from "../components/LoadingList.tsx";
+import {Survey} from "../types/survey.ts";
+import {Link, useParams} from "react-router-dom";
+import React from "react";
+import {useData, useDataPage} from "../API/common.ts";
+import {LoadingData} from "../components/LoadingData.tsx";
+
+
+
+export function SurveyPage() {
+
+    const {surveyId} = useParams();
+
+    const survey = useData<Survey>("surveys", "surveys", surveyId);
+
+    return (
+        <div className="survey-page">
+            <LoadingData data={survey}>
+                <h1>
+                    {survey?.title}
+                </h1>
+                <div>
+                    {survey?.description}
+                </div>
+
+                <SurveyQuestions survey={survey}/>
+
+            </LoadingData>
+
+        </div>
+    );
+}
+
+
+function SurveyQuestions({survey}: { survey: Survey | null | undefined }) {
+
+    const _survey = survey as Survey;
+
+    const questionsPairs = useDataPage("surveys", "question-pairs", {survey:_survey.id});
+    const questionsAgreement = useDataPage("surveys", "question-pairs", {survey:_survey.id});
+
+    //const questions =
+
+
+    return (
+        <>
+
+
+        </>
+    );
+}
+
+