contests

src/views/home/contests/Contests.tsx

@@ -1,18 +1,21 @@
-import { useEffect } from 'react';
+import { useEffect, useState } from 'react';
 import { SecondaryButton } from '../../../components/button/SecondaryButton';
 import { cn } from '../../../lib/cn';
 import { useAppDispatch, useAppSelector } from '../../../redux/hooks';
 import ContestsBlock from './ContestsBlock';
 import { setMenuActivePage } from '../../../redux/slices/store';
 import { fetchContests } from '../../../redux/slices/contests';
+import ModalCreateContest from './ModalCreate';
 
 const Contests = () => {
     const dispatch = useAppDispatch();
     const now = new Date();
 
+    const [modalActive, setModalActive] = useState<boolean>(false);
+
     // Берём данные из Redux
     const contests = useAppSelector((state) => state.contests.contests);
-    const loading = useAppSelector((state) => state.contests.status);
+    const status = useAppSelector((state) => state.contests.statuses.create);
     const error = useAppSelector((state) => state.contests.error);
 
     // При загрузке страницы — выставляем активную вкладку и подгружаем контесты
@@ -21,7 +24,7 @@ const Contests = () => {
         dispatch(fetchContests({}));
     }, []);
 
-    if (loading == 'loading') {
+    if (status == 'loading') {
         return (
             <div className="text-liquid-white p-4">Загрузка контестов...</div>
         );
@@ -43,8 +46,10 @@ const Contests = () => {
                         Контесты
                     </div>
                     <SecondaryButton
-                        onClick={() => {}}
-                        text="Создать группу"
+                        onClick={() => {
+                            setModalActive(true);
+                        }}
+                        text="Создать контест"
                         className="absolute right-0"
                     />
                 </div>
@@ -69,6 +74,11 @@ const Contests = () => {
                     })}
                 />
             </div>
+
+            <ModalCreateContest
+                active={modalActive}
+                setActive={setModalActive}
+            />
         </div>
     );
 };