contests

src/views/home/contest/Contest.tsx

@@ -0,0 +1,45 @@
+import { useEffect } from 'react';
+import { useAppDispatch, useAppSelector } from '../../../redux/hooks';
+import { setMenuActivePage } from '../../../redux/slices/store';
+import { Navigate, Route, Routes, useParams } from 'react-router-dom';
+import { fetchContestById } from '../../../redux/slices/contests';
+import ContestMissions from './Missions';
+
+export interface Article {
+    id: number;
+    name: string;
+    tags: string[];
+}
+
+const Contest = () => {
+    const { contestId } = useParams<{ contestId: string }>();
+    const contestIdNumber =
+        contestId && /^\d+$/.test(contestId) ? parseInt(contestId, 10) : null;
+    if (contestIdNumber === null) {
+        return <Navigate to="/home/contests" replace />;
+    }
+
+    const dispatch = useAppDispatch();
+    const contest = useAppSelector((state) => state.contests.selectedContest);
+
+    useEffect(() => {
+        dispatch(setMenuActivePage('contest'));
+    }, []);
+
+    useEffect(() => {
+        dispatch(fetchContestById(contestIdNumber));
+    }, [contestIdNumber]);
+
+    return (
+        <div>
+            <Routes>
+                <Route
+                    path="*"
+                    element={<ContestMissions contest={contest} />}
+                />
+            </Routes>
+        </div>
+    );
+};
+
+export default Contest;