add filters

src/views/home/contests/Contests.tsx

@@ -3,7 +3,10 @@ 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 {
+    setContestsNameFilter,
+    setMenuActivePage,
+} from '../../../redux/slices/store';
 import {
     fetchContests,
     fetchMyContests,
@@ -21,6 +24,10 @@ const Contests = () => {
         (state) => state.contests.fetchContests,
     );
 
+    const nameFilter = useAppSelector(
+        (state) => state.store.contests.filterName,
+    );
+
     // При загрузке страницы — выставляем активную вкладку и подгружаем контесты
     useEffect(() => {
         dispatch(setMenuActivePage('contests'));
@@ -49,7 +56,11 @@ const Contests = () => {
                     />
                 </div>
 
-                <Filters />
+                <Filters
+                    onChangeName={(v: string) => {
+                        dispatch(setContestsNameFilter(v));
+                    }}
+                />
                 {status == 'loading' && (
                     <div className="text-liquid-white p-4">
                         Загрузка контестов...
@@ -60,18 +71,30 @@ const Contests = () => {
                         <ContestsBlock
                             className="mb-[20px]"
                             title="Текущие"
-                            contests={contests.filter(
-                                (c) => c.scheduleType != 'AlwaysOpen',
-                            )}
+                            contests={contests
+                                .filter((v) =>
+                                    v.name
+                                        .toLocaleLowerCase()
+                                        .includes(
+                                            nameFilter.toLocaleLowerCase(),
+                                        ),
+                                )
+                                .filter((c) => c.scheduleType != 'AlwaysOpen')}
                             type="upcoming"
                         />
 
                         <ContestsBlock
                             className="mb-[20px]"
                             title="Постоянные"
-                            contests={contests.filter(
-                                (c) => c.scheduleType == 'AlwaysOpen',
-                            )}
+                            contests={contests
+                                .filter((v) =>
+                                    v.name
+                                        .toLocaleLowerCase()
+                                        .includes(
+                                            nameFilter.toLocaleLowerCase(),
+                                        ),
+                                )
+                                .filter((c) => c.scheduleType == 'AlwaysOpen')}
                             type="past"
                         />
                     </>