initial

src/pages/MainPage.tsx

@@ -0,0 +1,41 @@
+import React from 'react';
+import { Link } from 'react-router-dom';
+import '../css/MainPage.css';
+import {useDataPage} from "../API/common.ts";
+import {Survey} from "../types/survey.ts";
+import {LoadingList} from "../components/LoadingList.tsx";
+
+export function MainPage() {
+
+    const surveys = useDataPage<Survey>("surveys", "surveys")
+
+
+
+    return (
+        <div className="main-page">
+            {/* Header */}
+            <div className="header">
+                <Link to="/dashboard" className="menu-button">☰</Link>
+                <h1 className="logo">Pro-Fi Test</h1>
+            </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>
+        </div>
+    );
+}