+
{
- {
(state) => state.store.menu.activeProfilePage,
);
- console.log('active', [activeProfilePage]);
-
return (
{menuItems.map((v, i) => (
diff --git a/src/views/home/account/ContestsBlock.tsx b/src/views/home/account/ContestsBlock.tsx
deleted file mode 100644
index 91b13ac..0000000
--- a/src/views/home/account/ContestsBlock.tsx
+++ /dev/null
@@ -1,18 +0,0 @@
-import { useEffect } from 'react';
-import { useAppDispatch } from '../../../redux/hooks';
-import { setMenuActiveProfilePage } from '../../../redux/slices/store';
-
-const ContestsBlock = () => {
- const dispatch = useAppDispatch();
-
- useEffect(() => {
- dispatch(setMenuActiveProfilePage('contests'));
- }, []);
- return (
- = ({ id, name, tags }) => {
+const ArticleItem: FC = ({ id, name, tags }) => {
const navigate = useNavigate();
+
return (
- Пока пусто :(
-
- );
-};
-
-export default ContestsBlock;
diff --git a/src/views/home/account/MissionsBlock.tsx b/src/views/home/account/MissionsBlock.tsx
deleted file mode 100644
index 1fce2a8..0000000
--- a/src/views/home/account/MissionsBlock.tsx
+++ /dev/null
@@ -1,19 +0,0 @@
-import { useEffect } from 'react';
-import { useAppDispatch } from '../../../redux/hooks';
-import { setMenuActiveProfilePage } from '../../../redux/slices/store';
-
-const MissionsBlock = () => {
- const dispatch = useAppDispatch();
-
- useEffect(() => {
- dispatch(setMenuActiveProfilePage('missions'));
- }, []);
-
- return (
-
- Пока пусто :(
-
- );
-};
-
-export default MissionsBlock;
diff --git a/src/views/home/account/ArticlesBlock.tsx b/src/views/home/account/articles/ArticlesBlock.tsx
similarity index 51%
rename from src/views/home/account/ArticlesBlock.tsx
rename to src/views/home/account/articles/ArticlesBlock.tsx
index 1d4f141..eb91f9b 100644
--- a/src/views/home/account/ArticlesBlock.tsx
+++ b/src/views/home/account/articles/ArticlesBlock.tsx
@@ -1,10 +1,9 @@
import { FC, useEffect, useState } from 'react';
-import { useAppDispatch, useAppSelector } from '../../../redux/hooks';
-import { setMenuActiveProfilePage } from '../../../redux/slices/store';
-import { cn } from '../../../lib/cn';
-import { ChevroneDown, Edit } from '../../../assets/icons/groups';
-import { fetchArticles } from '../../../redux/slices/articles';
-
+import { useAppDispatch, useAppSelector } from '../../../../redux/hooks';
+import { setMenuActiveProfilePage } from '../../../../redux/slices/store';
+import { cn } from '../../../../lib/cn';
+import { ChevroneDown, Edit } from '../../../../assets/icons/groups';
+import { fetchMyArticles } from '../../../../redux/slices/articles';
import { useNavigate } from 'react-router-dom';
export interface ArticleItemProps {
@@ -13,21 +12,21 @@ export interface ArticleItemProps {
tags: string[];
}
-const ArticleItem: React.FC {
- navigate(`/article/${id}?back=/home/account/articles`);
- }}
+ onClick={() =>
+ navigate(`/article/${id}?back=/home/account/articles`)
+ }
>
-
+
= ({ id, name, tags }) => {
{name}
+
#{id}
@@ -35,13 +34,14 @@ const ArticleItem: React.FC
{tags.map((v, i) => (
{
e.stopPropagation();
navigate(
@@ -69,49 +70,79 @@ interface ArticlesBlockProps {
const ArticlesBlock: FC = ({ className = '' }) => {
const dispatch = useAppDispatch();
- const articles = useAppSelector((state) => state.articles.articles);
const [active, setActive] = useState(true);
+ // ✅ Берём только "мои статьи"
+ const articles = useAppSelector(
+ (state) => state.articles.fetchMyArticles.articles,
+ );
+ const status = useAppSelector(
+ (state) => state.articles.fetchMyArticles.status,
+ );
+ const error = useAppSelector(
+ (state) => state.articles.fetchMyArticles.error,
+ );
+
useEffect(() => {
dispatch(setMenuActiveProfilePage('articles'));
- dispatch(fetchArticles({}));
- }, []);
+ dispatch(fetchMyArticles());
+ }, [dispatch]);
+
return (
{v}
@@ -50,8 +50,9 @@ const ArticleItem: React.FC = ({ id, name, tags }) => {
+ {/* Заголовок */}
diff --git a/src/views/home/account/contests/Contests.tsx b/src/views/home/account/contests/Contests.tsx
new file mode 100644
index 0000000..0c62c1a
--- /dev/null
+++ b/src/views/home/account/contests/Contests.tsx
@@ -0,0 +1,61 @@
+import { useEffect } from 'react';
+import { useAppDispatch, useAppSelector } from '../../../../redux/hooks';
+import { setMenuActiveProfilePage } from '../../../../redux/slices/store';
+import {
+ fetchMyContests,
+ fetchRegisteredContests,
+} from '../../../../redux/slices/contests';
+import ContestsBlock from './ContestsBlock';
+
+const Contests = () => {
+ const dispatch = useAppDispatch();
+
+ // Redux-состояния
+ const myContestsState = useAppSelector(
+ (state) => state.contests.fetchMyContests,
+ );
+
+ // При загрузке страницы — выставляем вкладку и подгружаем контесты
+ useEffect(() => {
+ dispatch(setMenuActiveProfilePage('contests'));
+ dispatch(fetchMyContests());
+ dispatch(fetchRegisteredContests({}));
+ }, []);
+
+ return (
+ = ({
+ contests,
+ title,
+ className,
+ type = 'my',
+}) => {
+ const [active, setActive] = useState(title != 'Скрытые');
+
+ return (
+ = ({
+ id,
+ name,
+ startAt,
+ duration,
+ members,
+ type,
+}) => {
+ const navigate = useNavigate();
+
+ return (
+ = ({
+ id,
+ name,
+ startAt,
+ duration,
+ members,
+ statusRegister,
+ type,
+}) => {
+ const navigate = useNavigate();
+
+ const now = new Date();
+
+ const waitTime = new Date(startAt).getTime() - now.getTime();
+
+ return (
+ = ({
+ count,
+ totalCount,
+ title,
+ color = 'default',
+}) => {
+ return (
+ = ({
+ missions,
+ title,
+ className,
+}) => {
+ const [active, setActive] = useState(true);
+
+ return (
+ = ({
+ id,
+ name,
+ difficulty,
+ timeLimit = 1000,
+ memoryLimit = 256 * 1024 * 1024,
+ type,
+ status,
+}) => {
+ const navigate = useNavigate();
+ const difficultyItems = ['Easy', 'Medium', 'Hard'];
+ const difficultyString =
+ difficultyItems[Math.min(Math.max(0, difficulty - 1), 2)];
+
+ return (
+
{
- setActive(!active);
- }}
+ onClick={() => setActive(!active)}
>
Мои статьи
+
+ {/* Контент */}
- {articles.map((v, i) => (
-
+ Загрузка статей...
+
+ )}
+ {status === 'failed' && (
+
+ Ошибка:{' '}
+ {error || 'Не удалось загрузить статьи'}
+
+ )}
+ {status === 'successful' &&
+ articles.length === 0 && (
+
+ У вас пока нет статей
+
+ )}
+ {articles.map((v) => (
+
+ {/* Контесты, в которых я участвую */}
+
+ );
+};
+
+export default Contests;
diff --git a/src/views/home/account/contests/ContestsBlock.tsx b/src/views/home/account/contests/ContestsBlock.tsx
new file mode 100644
index 0000000..f732ffe
--- /dev/null
+++ b/src/views/home/account/contests/ContestsBlock.tsx
@@ -0,0 +1,93 @@
+import { useState, FC } from 'react';
+import { cn } from '../../../../lib/cn';
+import { ChevroneDown } from '../../../../assets/icons/groups';
+import MyContestItem from './MyContestItem';
+import RegisterContestItem from './RegisterContestItem';
+import { Contest } from '../../../../redux/slices/contests';
+
+interface ContestsBlockProps {
+ contests: Contest[];
+ title: string;
+ className?: string;
+ type?: 'my' | 'reg';
+}
+
+const ContestsBlock: FC
+
+
+ {/* Контесты, которые я создал */}
+
+ {myContestsState.status === 'loading' ? (
+
+
+ Загрузка ваших контестов...
+
+ ) : myContestsState.error ? (
+
+ Ошибка: {myContestsState.error}
+
+ ) : (
+
+
+ );
+};
+
+export default ContestsBlock;
diff --git a/src/views/home/account/contests/MyContestItem.tsx b/src/views/home/account/contests/MyContestItem.tsx
new file mode 100644
index 0000000..eef1bf4
--- /dev/null
+++ b/src/views/home/account/contests/MyContestItem.tsx
@@ -0,0 +1,98 @@
+import { cn } from '../../../../lib/cn';
+import { Account } from '../../../../assets/icons/auth';
+import { useNavigate } from 'react-router-dom';
+import { Edit } from '../../../../assets/icons/input';
+
+export interface ContestItemProps {
+ id: number;
+ name: string;
+ startAt: string;
+ duration: number;
+ members: number;
+ type: 'first' | 'second';
+}
+
+function formatDate(dateString: string): string {
+ const date = new Date(dateString);
+
+ const day = date.getDate().toString().padStart(2, '0');
+ const month = (date.getMonth() + 1).toString().padStart(2, '0');
+ const year = date.getFullYear();
+
+ const hours = date.getHours().toString().padStart(2, '0');
+ const minutes = date.getMinutes().toString().padStart(2, '0');
+
+ return `${day}/${month}/${year}\n${hours}:${minutes}`;
+}
+
+function formatWaitTime(ms: number): string {
+ const minutes = Math.floor(ms / 60000);
+ const hours = Math.floor(minutes / 60);
+ const days = Math.floor(hours / 24);
+
+ if (days > 0) {
+ const remainder = days % 10;
+ let suffix = 'дней';
+ if (remainder === 1 && days !== 11) suffix = 'день';
+ else if (remainder >= 2 && remainder <= 4 && (days < 10 || days > 20))
+ suffix = 'дня';
+ return `${days} ${suffix}`;
+ } else if (hours > 0) {
+ const mins = minutes % 60;
+ return mins > 0 ? `${hours} ч ${mins} мин` : `${hours} ч`;
+ } else {
+ return `${minutes} мин`;
+ }
+}
+
+const ContestItem: React.FC {
+ setActive(!active);
+ }}
+ >
+ {title}
+
+
+
+
+
+
+
+ {contests.map((v, i) => {
+ return type == 'my' ? (
+
+ {
+ navigate(`/contest/${id}`);
+ }}
+ >
+ {
+ e.stopPropagation();
+ navigate(
+ `/contest/create?back=/home/account/contests&contestId=${id}`,
+ );
+ }}
+ />
+
+ );
+};
+
+export default ContestItem;
diff --git a/src/views/home/account/contests/RegisterContestItem.tsx b/src/views/home/account/contests/RegisterContestItem.tsx
new file mode 100644
index 0000000..f8cbf6c
--- /dev/null
+++ b/src/views/home/account/contests/RegisterContestItem.tsx
@@ -0,0 +1,114 @@
+import { cn } from '../../../../lib/cn';
+import { Account } from '../../../../assets/icons/auth';
+import { PrimaryButton } from '../../../../components/button/PrimaryButton';
+import { ReverseButton } from '../../../../components/button/ReverseButton';
+import { useNavigate } from 'react-router-dom';
+
+export interface ContestItemProps {
+ id: number;
+ name: string;
+ startAt: string;
+ duration: number;
+ members: number;
+ statusRegister: 'reg' | 'nonreg';
+ type: 'first' | 'second';
+}
+
+function formatDate(dateString: string): string {
+ const date = new Date(dateString);
+
+ const day = date.getDate().toString().padStart(2, '0');
+ const month = (date.getMonth() + 1).toString().padStart(2, '0');
+ const year = date.getFullYear();
+
+ const hours = date.getHours().toString().padStart(2, '0');
+ const minutes = date.getMinutes().toString().padStart(2, '0');
+
+ return `${day}/${month}/${year}\n${hours}:${minutes}`;
+}
+
+function formatWaitTime(ms: number): string {
+ const minutes = Math.floor(ms / 60000);
+ const hours = Math.floor(minutes / 60);
+ const days = Math.floor(hours / 24);
+
+ if (days > 0) {
+ const remainder = days % 10;
+ let suffix = 'дней';
+ if (remainder === 1 && days !== 11) suffix = 'день';
+ else if (remainder >= 2 && remainder <= 4 && (days < 10 || days > 20))
+ suffix = 'дня';
+ return `${days} ${suffix}`;
+ } else if (hours > 0) {
+ const mins = minutes % 60;
+ return mins > 0 ? `${hours} ч ${mins} мин` : `${hours} ч`;
+ } else {
+ return `${minutes} мин`;
+ }
+}
+
+const ContestItem: React.FC{name}
+
+ {/* {authors.map((v, i) =>
+ {v}
)} */} + valavshonok +
+ {formatDate(startAt)}
+
+ {formatWaitTime(duration)}
+
+ 
+
+
+ {members}
+ {
+ navigate(`/contest/${id}`);
+ }}
+ >
+
+ );
+};
+
+export default ContestItem;
diff --git a/src/views/home/account/missions/Missions.tsx b/src/views/home/account/missions/Missions.tsx
new file mode 100644
index 0000000..1d8d2fb
--- /dev/null
+++ b/src/views/home/account/missions/Missions.tsx
@@ -0,0 +1,109 @@
+import { FC, useEffect } from 'react';
+import { useAppDispatch, useAppSelector } from '../../../../redux/hooks';
+import { setMenuActiveProfilePage } from '../../../../redux/slices/store';
+import { cn } from '../../../../lib/cn';
+import MissionsBlock from './MissionsBlock';
+import {
+ fetchMyMissions,
+ setMissionsStatus,
+} from '../../../../redux/slices/missions';
+
+interface ItemProps {
+ count: number;
+ totalCount: number;
+ title: string;
+ color?: 'default' | 'red' | 'green' | 'orange';
+}
+
+const Item: FC{name}
+
+ {/* {authors.map((v, i) =>
+ {v}
)} */} + valavshonok +
+ {formatDate(startAt)}
+
+ {formatWaitTime(duration)}
+ {waitTime > 0 && (
+
+ {'До начала\n' + formatWaitTime(waitTime)}
+
+ )}
+
+
+
+ {members}
+
+ {statusRegister == 'reg' ? (
+ <>
+ {' '}
+ {}} text="Регистрация" />
+
+ ) : (
+ <>
+ {' '}
+ {}} text="Вы записаны" />
+
+ )}
+
+
+
+ );
+};
+
+const Missions = () => {
+ const dispatch = useAppDispatch();
+ const missions = useAppSelector((state) => state.missions.missions);
+ const status = useAppSelector((state) => state.missions.statuses.fetchMy);
+
+ useEffect(() => {
+ dispatch(setMenuActiveProfilePage('missions'));
+ dispatch(fetchMyMissions());
+ }, []);
+
+ useEffect(() => {
+ dispatch(setMissionsStatus({ key: 'fetchMy', status: 'idle' }));
+ }, [status]);
+
+ return (
+
+ {count}/{totalCount}
+
+ {title}
+
+
+ );
+};
+
+export default Missions;
diff --git a/src/views/home/account/missions/MissionsBlock.tsx b/src/views/home/account/missions/MissionsBlock.tsx
new file mode 100644
index 0000000..b9b2efe
--- /dev/null
+++ b/src/views/home/account/missions/MissionsBlock.tsx
@@ -0,0 +1,71 @@
+import { useState, FC } from 'react';
+import { cn } from '../../../../lib/cn';
+import { ChevroneDown } from '../../../../assets/icons/groups';
+import MyMissionItem from './MyMissionItem';
+import { Mission } from '../../../../redux/slices/missions';
+
+interface MissionsBlockProps {
+ missions: Mission[];
+ title: string;
+ className?: string;
+}
+
+const MissionsBlock: FC
+
+
+
+
+ Решенные задачи
+
+
+
+
+
+
+
+
+ Компетенции
+
+
+
+
+
+
+
+
+ );
+};
+
+export default MissionsBlock;
diff --git a/src/views/home/account/missions/MyMissionItem.tsx b/src/views/home/account/missions/MyMissionItem.tsx
new file mode 100644
index 0000000..5fa27f0
--- /dev/null
+++ b/src/views/home/account/missions/MyMissionItem.tsx
@@ -0,0 +1,89 @@
+import { cn } from '../../../../lib/cn';
+import { useNavigate } from 'react-router-dom';
+import { Edit } from '../../../../assets/icons/input';
+
+export interface MissionItemProps {
+ id: number;
+ authorId?: number;
+ name: string;
+ difficulty: number;
+ tags?: string[];
+ timeLimit?: number;
+ memoryLimit?: number;
+ createdAt?: string;
+ updatedAt?: string;
+ type?: 'first' | 'second';
+ status?: 'empty' | 'success' | 'error';
+}
+
+export function formatMilliseconds(ms: number): string {
+ const rounded = Math.round(ms) / 1000;
+ const formatted = rounded.toString().replace(/\.?0+$/, '');
+ return `${formatted} c`;
+}
+
+export function formatBytesToMB(bytes: number): string {
+ const megabytes = Math.floor(bytes / (1024 * 1024));
+ return `${megabytes} МБ`;
+}
+
+const MissionItem: React.FC {
+ setActive(!active);
+ }}
+ >
+ {title}
+
+
+
+
+
+
+
+ {missions.map((v, i) => (
+
+ {
+ navigate(`/mission/${id}?back=/home/account/missions`);
+ }}
+ >
+
+ );
+};
+
+export default MissionItem;
diff --git a/src/views/home/articles/Articles.tsx b/src/views/home/articles/Articles.tsx
index 13519fd..5c3caad 100644
--- a/src/views/home/articles/Articles.tsx
+++ b/src/views/home/articles/Articles.tsx
@@ -5,52 +5,86 @@ import ArticleItem from './ArticleItem';
import { setMenuActivePage } from '../../../redux/slices/store';
import { useNavigate } from 'react-router-dom';
import { fetchArticles } from '../../../redux/slices/articles';
-
-export interface Article {
- id: number;
- name: string;
- tags: string[];
-}
+import Filters from './Filter';
const Articles = () => {
const dispatch = useAppDispatch();
const navigate = useNavigate();
- const articles = useAppSelector((state) => state.articles.articles);
- const status = useAppSelector((state) => state.articles.statuses.fetchAll);
+ // ✅ Берём данные из нового состояния
+ const articles = useAppSelector(
+ (state) => state.articles.fetchArticles.articles,
+ );
+ const status = useAppSelector(
+ (state) => state.articles.fetchArticles.status,
+ );
+ const error = useAppSelector((state) => state.articles.fetchArticles.error);
useEffect(() => {
dispatch(setMenuActivePage('articles'));
dispatch(fetchArticles({}));
- }, []);
+ }, [dispatch]);
- if (status == 'loading') return #{id}
+ {name}
+
+ стандартный ввод/вывод {formatMilliseconds(timeLimit)},{' '}
+ {formatBytesToMB(memoryLimit)}
+
+
+ {difficultyString}
+
+
+ {
+ e.stopPropagation();
+ }}
+ />
+
+ Загрузка...
;
+ // ========================
+ // Состояния загрузки / ошибки
+ // ========================
+ if (status === 'loading') {
+ return (
+
+ Загрузка статей...
+
+ );
+ }
+ if (status === 'failed') {
+ return (
+
+ Ошибка при загрузке статей
+ {error && (
+
+ );
+ }
+
+ // ========================
+ // Основной контент
+ // ========================
return (
-
+ {error}
+
+ )}
+
+
('');
const [password, setPassword] = useState('');
@@ -25,12 +27,14 @@ const Login = () => {
// После успешного логина
useEffect(() => {
dispatch(setMenuActivePage('account'));
- console.log(submitClicked);
+ submitClicked;
}, []);
useEffect(() => {
if (jwt) {
- navigate('/home/account'); // или другая страница после входа
+ const from = location.state?.from;
+ const path = from ? from.pathname + from.search : '/home/account';
+ navigate(path, { replace: true });
}
}, [jwt]);
diff --git a/src/views/home/auth/Register.tsx b/src/views/home/auth/Register.tsx
index d341b39..4eee15a 100644
--- a/src/views/home/auth/Register.tsx
+++ b/src/views/home/auth/Register.tsx
@@ -1,8 +1,9 @@
+// src/views/home/auth/Register.tsx
import { useState, useEffect } from 'react';
import { PrimaryButton } from '../../../components/button/PrimaryButton';
import { Input } from '../../../components/input/Input';
import { useAppDispatch, useAppSelector } from '../../../redux/hooks';
-import { useNavigate } from 'react-router-dom';
+import { useLocation, useNavigate } from 'react-router-dom';
import { registerUser } from '../../../redux/slices/auth';
// import { cn } from "../../../lib/cn";
import { setMenuActivePage } from '../../../redux/slices/store';
@@ -15,6 +16,7 @@ import { googleLogo } from '../../../assets/icons/input';
const Register = () => {
const dispatch = useAppDispatch();
const navigate = useNavigate();
+ const location = useLocation();
const [username, setUsername] = useState('');
const [email, setEmail] = useState('');
@@ -32,9 +34,11 @@ const Register = () => {
useEffect(() => {
if (jwt) {
- navigate('/home/account');
+ const from = location.state?.from;
+ const path = from ? from.pathname + from.search : '/home/account';
+ navigate(path, { replace: true });
}
- console.log(submitClicked);
+ submitClicked;
}, [jwt]);
const handleRegister = () => {
diff --git a/src/views/home/contest/Contest.tsx b/src/views/home/contest/Contest.tsx
index d184dd4..5a026bc 100644
--- a/src/views/home/contest/Contest.tsx
+++ b/src/views/home/contest/Contest.tsx
@@ -4,6 +4,7 @@ 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';
+import Submissions from './Submissions';
export interface Article {
id: number;
@@ -15,11 +16,13 @@ const Contest = () => {
const { contestId } = useParams<{ contestId: string }>();
const contestIdNumber =
contestId && /^\d+$/.test(contestId) ? parseInt(contestId, 10) : null;
- if (contestIdNumber === null) {
+ if (!contestIdNumber) {
return
+ {/* Заголовок */}
{
- navigate('/article/create');
- }}
+ onClick={() => navigate('/article/create')}
text="Создать статью"
className="absolute right-0"
/>
-
+ {/* Фильтры */}
+
);
diff --git a/src/views/home/articles/Filter.tsx b/src/views/home/articles/Filter.tsx
new file mode 100644
index 0000000..1d8a82f
--- /dev/null
+++ b/src/views/home/articles/Filter.tsx
@@ -0,0 +1,51 @@
+import {
+ FilterDropDown,
+ FilterItem,
+} from '../../../components/drop-down-list/Filter';
+import { SorterDropDown } from '../../../components/drop-down-list/Sorter';
+import { SearchInput } from '../../../components/input/SearchInput';
+
+const Filters = () => {
+ const items: FilterItem[] = [
+ { text: 'React', value: 'react' },
+ { text: 'Vue', value: 'vue' },
+ { text: 'Angular', value: 'angular' },
+ { text: 'Svelte', value: 'svelte' },
+ { text: 'Next.js', value: 'next' },
+ { text: 'Nuxt', value: 'nuxt' },
+ { text: 'Solid', value: 'solid' },
+ { text: 'Qwik', value: 'qwik' },
+ ];
+
+ return (
+
Статьи
- {articles.map((v, i) => (
-
+ {articles.length === 0 ? (
+
-
+ Пока нет статей
+
+ ) : (
+ articles.map((v) => pages
+ {/* Пагинация (пока заглушка) */}
+
+ pages
+
+ {}} placeholder="Поиск задачи" />
+
+ {}}
+ />
+
+ {}}
+ />
+
+ );
+};
+
+export default Filters;
diff --git a/src/views/home/auth/Login.tsx b/src/views/home/auth/Login.tsx
index 548be70..a660b35 100644
--- a/src/views/home/auth/Login.tsx
+++ b/src/views/home/auth/Login.tsx
@@ -1,8 +1,9 @@
+// src/views/home/auth/Login.tsx
import { useState, useEffect } from 'react';
import { PrimaryButton } from '../../../components/button/PrimaryButton';
import { Input } from '../../../components/input/Input';
import { useAppDispatch, useAppSelector } from '../../../redux/hooks';
-import { Link, useNavigate } from 'react-router-dom';
+import { Link, useLocation, useNavigate } from 'react-router-dom';
import { loginUser } from '../../../redux/slices/auth';
// import { cn } from "../../../lib/cn";
import { setMenuActivePage } from '../../../redux/slices/store';
@@ -13,6 +14,7 @@ import { googleLogo } from '../../../assets/icons/input';
const Login = () => {
const dispatch = useAppDispatch();
const navigate = useNavigate();
+ const location = useLocation();
const [username, setUsername] = useState
+
+ = ({
+ contestId,
id,
name,
timeLimit = 1000,
@@ -48,7 +50,7 @@ const MissionItem: React.FC = ({
'cursor-pointer brightness-100 hover:brightness-125 transition-all duration-300',
)}
onClick={() => {
- navigate(`/mission/${id}?back=${path}`);
+ navigate(`/mission/${id}?back=${path}&contestId=${contestId}`);
}}
>
= ({ contest }) => {
- if (!contest) {
- return <>;
- }
+ const navigate = useNavigate();
+ const dispatch = useAppDispatch();
+ const { submissions, status } = useAppSelector(
+ (state) => state.contests.fetchMySubmissions
+ );
- return (
- (false);
// Берём данные из Redux
- const contests = useAppSelector((state) => state.contests.contests);
- const status = useAppSelector((state) => state.contests.statuses.create);
- const error = useAppSelector((state) => state.contests.error);
+ const contests = useAppSelector(
+ (state) => state.contests.fetchContests.contests,
+ );
+ const status = useAppSelector(
+ (state) => state.contests.fetchContests.status,
+ );
+ const error = useAppSelector((state) => state.contests.fetchContests.error);
// При загрузке страницы — выставляем активную вкладку и подгружаем контесты
useEffect(() => {
@@ -24,16 +29,6 @@ const Contests = () => {
dispatch(fetchContests({}));
}, []);
- if (status == 'loading') {
- return (
-
{
+ const endTime = new Date(
+ contest.endsAt ?? new Date().toDateString(),
+ ).getTime();
+ return endTime >= now.getTime();
+ })}
+ />
- {
- const endTime = new Date(contest.endsAt).getTime();
- return endTime >= now.getTime();
- })}
- />
-
- {
- const endTime = new Date(contest.endsAt).getTime();
- return endTime < now.getTime();
- })}
- />
+ {
+ const endTime = new Date(
+ contest.endsAt ?? new Date().toDateString(),
+ ).getTime();
+ return endTime < now.getTime();
+ })}
+ />
+
+ )}
= ({
key={i}
id={v.id}
name={v.name}
- startAt={v.startsAt}
+ startAt={v.startsAt ?? new Date().toString()}
statusRegister={'reg'}
duration={
- new Date(v.endsAt).getTime() -
- new Date(v.startsAt).getTime()
+ new Date(v.endsAt ?? new Date().toString()).getTime() -
+ new Date(v.startsAt ?? new Date().toString()).getTime()
}
- members={v.members.length}
+ members={v.members?.length ?? 0}
type={i % 2 ? 'second' : 'first'}
/>
))}
diff --git a/src/views/home/contests/Filter.tsx b/src/views/home/contests/Filter.tsx
new file mode 100644
index 0000000..ca01a9d
--- /dev/null
+++ b/src/views/home/contests/Filter.tsx
@@ -0,0 +1,51 @@
+import {
+ FilterDropDown,
+ FilterItem,
+} from '../../../components/drop-down-list/Filter';
+import { SorterDropDown } from '../../../components/drop-down-list/Sorter';
+import { SearchInput } from '../../../components/input/SearchInput';
+
+const Filters = () => {
+ const items: FilterItem[] = [
+ { text: 'React', value: 'react' },
+ { text: 'Vue', value: 'vue' },
+ { text: 'Angular', value: 'angular' },
+ { text: 'Svelte', value: 'svelte' },
+ { text: 'Next.js', value: 'next' },
+ { text: 'Nuxt', value: 'nuxt' },
+ { text: 'Solid', value: 'solid' },
+ { text: 'Qwik', value: 'qwik' },
+ ];
+
+ return (
+ = ({
setActive,
}) => {
const dispatch = useAppDispatch();
- const status = useAppSelector((state) => state.contests.statuses.create);
+ const navigate = useNavigate();
+ const status = useAppSelector(
+ (state) => state.contests.createContest.status,
+ );
const [form, setForm] = useState({
name: '',
description: '',
scheduleType: 'AlwaysOpen',
visibility: 'Public',
- startsAt: null,
- endsAt: null,
- attemptDurationMinutes: null,
- maxAttempts: null,
+ startsAt: '',
+ endsAt: '',
+ attemptDurationMinutes: 0,
+ maxAttempts: 0,
allowEarlyFinish: false,
- groupId: null,
- missionIds: null,
- articleIds: null,
- participantIds: null,
- organizerIds: null,
+ missionIds: [],
+ articleIds: [],
});
+ const contest = useAppSelector(
+ (state) => state.contests.createContest.contest,
+ );
+
useEffect(() => {
if (status === 'successful') {
- setActive(false);
+ dispatch(
+ setContestStatus({ key: 'createContest', status: 'idle' }),
+ );
+ navigate(
+ `/contest/create?back=/home/account/contests&contestId=${contest.id}`,
+ );
}
}, [status]);
@@ -174,7 +187,9 @@ const ModalCreateContest: FC = ({
{/* Кнопки */}
{
+ handleSubmit();
+ }}
text="Создать"
disabled={status === 'loading'}
/>
diff --git a/src/views/home/group/Group.tsx b/src/views/home/group/Group.tsx
new file mode 100644
index 0000000..ef34d56
--- /dev/null
+++ b/src/views/home/group/Group.tsx
@@ -0,0 +1,52 @@
+import { FC, useEffect } from 'react';
+import { cn } from '../../../lib/cn';
+import { useParams, Navigate, Routes, Route } from 'react-router-dom';
+import { useAppDispatch, useAppSelector } from '../../../redux/hooks';
+import { fetchGroupById } from '../../../redux/slices/groups';
+import GroupMenu from './GroupMenu';
+import { Posts } from './posts/Posts';
+import { SearchInput } from '../../../components/input/SearchInput';
+import { Chat } from './chat/Chat';
+import { Contests } from './contests/Contests';
+
+interface GroupsBlockProps {}
+
+const Group: FC = () => {
+ const groupId = Number(useParams<{ groupId: string }>().groupId);
+ if (!groupId) {
+ return = ({
+ icon,
+ text = '',
+ href = '',
+ active = false,
+ page = '',
+ profilePage = '',
+}) => {
+ const dispatch = useAppDispatch();
+
+ return (
+ {
+ dispatch(setMenuActivePage(page));
+ dispatch(setMenuActiveProfilePage(profilePage));
+ }}
+ >
+ 
+ {text}
+
+ );
+};
+
+interface GroupMenuProps {
+ groupId: number;
+}
+
+const GroupMenu: FC = ({ groupId }) => {
+ const menuItems = [
+ {
+ text: 'Главная',
+ href: `/group/${groupId}/home`,
+ icon: Home,
+ page: 'group',
+ profilePage: 'home',
+ },
+ {
+ text: 'Чат',
+ href: `/group/${groupId}/chat`,
+ icon: MessageChat,
+ page: 'group',
+ profilePage: 'chat',
+ },
+ {
+ text: 'Контесты',
+ href: `/group/${groupId}/contests`,
+ icon: Cup,
+ page: 'group',
+ profilePage: 'contests',
+ },
+ ];
+
+ const activeGroupPage = useAppSelector(
+ (state) => state.store.menu.activeGroupPage,
+ );
+
+ return (
+ = ({ active, setActive, groupId }) => {
+ // const [name, setName] = useState('');
+ const [content, setContent] = useState('');
+ const status = useAppSelector((state) => state.groupfeed.createPost.status);
+ const dispatch = useAppDispatch();
+
+ useEffect(() => {
+ if (status == 'successful') {
+ setActive(false);
+ dispatch(setGroupFeedStatus({ key: 'createPost', status: 'idle' }));
+ }
+ }, [status]);
+
+ return (
+
+
+ );
+};
+
+export default ModalCreate;
diff --git a/src/views/home/group/posts/ModalUpdate.tsx b/src/views/home/group/posts/ModalUpdate.tsx
new file mode 100644
index 0000000..55ada02
--- /dev/null
+++ b/src/views/home/group/posts/ModalUpdate.tsx
@@ -0,0 +1,140 @@
+import { FC, useEffect, useState } from 'react';
+import { Modal } from '../../../../components/modal/Modal';
+import { PrimaryButton } from '../../../../components/button/PrimaryButton';
+import { SecondaryButton } from '../../../../components/button/SecondaryButton';
+import { Input } from '../../../../components/input/Input';
+import { useAppDispatch, useAppSelector } from '../../../../redux/hooks';
+import { createGroup } from '../../../../redux/slices/groups';
+import MarkdownEditor, { MarkDownPattern } from '../../../articleeditor/Editor';
+import {
+ createPost,
+ deletePost,
+ fetchPostById,
+ setGroupFeedStatus,
+ updatePost,
+} from '../../../../redux/slices/groupfeed';
+import { ReverseButton } from '../../../../components/button/ReverseButton';
+import { cn } from '../../../../lib/cn';
+
+interface ModalUpdateProps {
+ groupId: number;
+ postId: number;
+ active: boolean;
+ setActive: (value: boolean) => void;
+}
+
+const ModalUpdate: FC = ({
+ active,
+ setActive,
+ groupId,
+ postId,
+}) => {
+ // const [name, setName] = useState('');
+ const [content, setContent] = useState('');
+ const status = useAppSelector((state) => state.groupfeed.updatePost.status);
+ const statusDelete = useAppSelector(
+ (state) => state.groupfeed.deletePost.status,
+ );
+ const { post, status: statusPost } = useAppSelector(
+ (state) => state.groupfeed.fetchPostById,
+ );
+ const dispatch = useAppDispatch();
+
+ useEffect(() => {
+ if (status == 'successful') {
+ setActive(false);
+ dispatch(setGroupFeedStatus({ key: 'updatePost', status: 'idle' }));
+ }
+ }, [status]);
+
+ useEffect(() => {
+ if (statusDelete == 'successful') {
+ setActive(false);
+ dispatch(setGroupFeedStatus({ key: 'deletePost', status: 'idle' }));
+ }
+ }, [statusDelete]);
+
+ useEffect(() => {
+ dispatch(fetchPostById({ groupId, postId }));
+ }, [postId]);
+
+ return (
+
+
+ );
+};
+
+export default ModalUpdate;
diff --git a/src/views/home/group/posts/PostItem.tsx b/src/views/home/group/posts/PostItem.tsx
new file mode 100644
index 0000000..98e34d9
--- /dev/null
+++ b/src/views/home/group/posts/PostItem.tsx
@@ -0,0 +1,86 @@
+import { FC } from 'react';
+import { useAppSelector } from '../../../../redux/hooks';
+import MarkdownPreview from '../../../articleeditor/MarckDownPreview';
+import { Edit } from '../../../../assets/icons/input';
+
+function convertDate(isoString: string) {
+ const date = new Date(isoString);
+
+ const dd = String(date.getUTCDate()).padStart(2, '0');
+ const mm = String(date.getUTCMonth() + 1).padStart(2, '0');
+ const yyyy = date.getUTCFullYear();
+
+ const hh = String(date.getUTCHours()).padStart(2, '0');
+ const min = String(date.getUTCMinutes()).padStart(2, '0');
+
+ return `${dd}.${mm}.${yyyy} ${hh}:${min}`;
+}
+
+interface PostItemProps {
+ id: number;
+ groupId: number;
+ authorId: number;
+ authorUsername: string;
+ name: string;
+ content: string;
+ createdAt: string;
+ updatedAt: string;
+ isAdmin: boolean;
+ setModalUpdateActive: (v: boolean) => void;
+ setUpdatePostId: (v: number) => void;
+}
+
+export const PostItem: FC = ({
+ id,
+ groupId,
+ authorId,
+ authorUsername,
+ name,
+ content,
+ createdAt,
+ updatedAt,
+ isAdmin,
+ setModalUpdateActive,
+ setUpdatePostId,
+}) => {
+ const members = useAppSelector(
+ (state) => state.groups.fetchGroupById.group?.members,
+ );
+ const member = members?.find((m) => m.userId === authorId);
+
+ return (
+ = ({ groupId }) => {
+ const dispatch = useAppDispatch();
+
+ const [modalCreateActive, setModalCreateActive] = useState(false);
+ const [modalUpdateActive, setModalUpdateActive] = useState(false);
+ const [updatePostId, setUpdatePostId] = useState(0);
+ const [isAdmin, setIsAdmin] = useState(false);
+ const { pages, status } = useAppSelector(
+ (state) => state.groupfeed.fetchPosts,
+ );
+ const { id: userId } = useAppSelector((state) => state.auth);
+
+ const { group } = useAppSelector((state) => state.groups.fetchGroupById);
+
+ // Загружаем только первую страницу
+ useEffect(() => {
+ dispatch(fetchGroupPosts({ groupId, page: 0, pageSize: 20 }));
+ dispatch(fetchGroupById(groupId));
+ }, [groupId]);
+
+ useEffect(() => {
+ dispatch(setMenuActiveGroupPage('home'));
+ }, []);
+
+ useEffect(() => {
+ if (!group) return;
+
+ const isUserAdmin =
+ group.members?.some(
+ (m) =>
+ Number(m.userId) === Number(userId) &&
+ m.role.includes('Administrator'),
+ ) || false;
+
+ setIsAdmin(isUserAdmin);
+ }, [group, userId]);
+
+ const page0 = pages[0];
+
+ return (
+ = () => {
- const { groupId } = useParams<{ groupId: string }>();
- const groupIdNumber = Number(groupId);
-
- if (!groupId || isNaN(groupIdNumber) || !groupIdNumber) {
- return = ({
description,
setUpdateGroup,
setUpdateActive,
+ setInviteActive,
+ setInviteGroup,
+ type,
}) => {
const navigate = useNavigate();
@@ -63,10 +69,16 @@ const GroupItem: React.FC = ({
#{id}
diff --git a/src/views/home/contest/Missions.tsx b/src/views/home/contest/Missions.tsx
index 535cf05..1893df9 100644
--- a/src/views/home/contest/Missions.tsx
+++ b/src/views/home/contest/Missions.tsx
@@ -1,43 +1,124 @@
-import { FC } from 'react';
-import MissionItem from './MissionItem';
-import { Contest } from '../../../redux/slices/contests';
+import { FC, useEffect } from "react";
+import MissionItem from "./MissionItem";
+import {
+ Contest,
+ fetchMySubmissions,
+ setContestStatus,
+} from "../../../redux/slices/contests";
+import { useAppDispatch, useAppSelector } from "../../../redux/hooks";
+import { PrimaryButton } from "../../../components/button/PrimaryButton";
+import { useNavigate } from "react-router-dom";
+import { arrowLeft } from "../../../assets/icons/header";
export interface Article {
- id: number;
- name: string;
- tags: string[];
+ id: number;
+ name: string;
+ tags: string[];
}
interface ContestMissionsProps {
- contest: Contest | null;
+ contest?: Contest;
}
const ContestMissions: FC
-
- = ({
+ id,
+ datetime,
+ missionId,
+ language,
+ verdict,
+ duration,
+ memory,
+ type,
+ status
+}) => {
+ // const navigate = useNavigate();
+
+ return (
+ = ({ contest }) => {
+ const dispatch = useAppDispatch();
+ const navigate = useNavigate();
+
+ const { submissions, status } = useAppSelector(
+ (state) => state.contests.fetchMySubmissions
+ );
+
+ useEffect(() => {
+ if (contest && contest.id) dispatch(fetchMySubmissions(contest.id));
+ }, [contest]);
+
+ useEffect(() => {
+ if (status == "successful") {
+ dispatch(setContestStatus({ key: "fetchMySubmissions", status: "idle" }));
+ }
+ }, [status]);
+
+ const checkStatus = (status: string) => {
+ if (status == "IncorrectAnswer") return "wronganswer";
+ if (status == "TimeLimitError") return "timelimit";
+ return undefined;
+ };
+
+ const solvedCount = (contest.missions ?? []).filter((mission) =>
+ submissions.some(
+ (s) =>
+ s.solution.missionId === mission.id &&
+ s.solution.status === "Accepted: All tests passed"
+ )
+ ).length;
+
+ const totalCount = contest.missions?.length ?? 0;
+
+ return (
+ = ({
{statusRegister == 'reg' ? (
<>
{' '}
- {
- e.stopPropagation();
- }}
- text="Регистрация"
- />
+ {}} text="Регистрация" />
) : (
<>
{' '}
- {
- e.stopPropagation();
- }}
- text="Вы записаны"
- />
+ {}} text="Вы записаны" />
)}
diff --git a/src/views/home/contests/Contests.tsx b/src/views/home/contests/Contests.tsx
index d3ad1eb..7e33094 100644
--- a/src/views/home/contests/Contests.tsx
+++ b/src/views/home/contests/Contests.tsx
@@ -6,6 +6,7 @@ import ContestsBlock from './ContestsBlock';
import { setMenuActivePage } from '../../../redux/slices/store';
import { fetchContests } from '../../../redux/slices/contests';
import ModalCreateContest from './ModalCreate';
+import Filters from './Filter';
const Contests = () => {
const dispatch = useAppDispatch();
@@ -14,9 +15,13 @@ const Contests = () => {
const [modalActive, setModalActive] = useState
-
+ useEffect(() => {
+ if (contest) dispatch(fetchMySubmissions(contest.id));
+ }, [contest]);
+
+ useEffect(() => {
+ if (status == "successful") {
+ dispatch(setContestStatus({ key: "fetchMySubmissions", status: "idle" }));
+ }
+ }, [status]);
+
+ if (!contest) {
+ return <>;
+ }
+
+ const solvedCount = (contest.missions ?? []).filter((mission) =>
+ submissions.some(
+ (s) =>
+ s.solution.missionId === mission.id &&
+ s.solution.status === "Accepted: All tests passed"
+ )
+ ).length;
+
+ const totalCount = contest.missions?.length ?? 0;
+
+ return (
+
- {contest?.name} {contest.id}
-
-
- {contest.missions.map((v, i) => (
-
-
+
+ );
};
export default ContestMissions;
diff --git a/src/views/home/contest/SubmissionItem.tsx b/src/views/home/contest/SubmissionItem.tsx
new file mode 100644
index 0000000..6d90537
--- /dev/null
+++ b/src/views/home/contest/SubmissionItem.tsx
@@ -0,0 +1,94 @@
+import { cn } from '../../../lib/cn';
+// import { IconError, IconSuccess } from "../../../assets/icons/missions";
+// import { useNavigate } from "react-router-dom";
+
+export interface SubmissionItemProps {
+ id: number;
+ datetime: string;
+ missionId: number;
+ language: string;
+ verdict: string;
+ duration: number;
+ memory: number;
+ type: 'first' | 'second';
+ status?: 'success' | 'wronganswer' | 'timelimit';
+}
+
+export function formatMilliseconds(ms: number): string {
+ const rounded = Math.round(ms) / 1000;
+ const formatted = rounded.toString().replace(/\.?0+$/, '');
+ return `${formatted} c`;
+}
+
+export function formatBytesToMB(bytes: number): string {
+ const megabytes = Math.floor(bytes / (1024 * 1024));
+ return `${megabytes} МБ`;
+}
+
+function formatDate(dateString: string): string {
+ const date = new Date(dateString);
+
+ const day = date.getDate().toString().padStart(2, '0');
+ const month = (date.getMonth() + 1).toString().padStart(2, '0');
+ const year = date.getFullYear();
+
+ const hours = date.getHours().toString().padStart(2, '0');
+ const minutes = date.getMinutes().toString().padStart(2, '0');
+
+ return `${day}/${month}/${year}\n${hours}:${minutes}`;
+}
+
+const SubmissionItem: React.FC
+
+
+ {contest.name}
- );
+
+
+
+ 
{
+ navigate(`/home/contests`);
+ }}
+ />
+
+ Контест #{contest.id}
+
+
+ {contest.attemptDurationMinutes ?? 0} минут
+
+ {
+ navigate(`/contest/${contest.id}/submissions`);
+ }}
+ text="Мои посылки"
+ />
+
+
+ {`${solvedCount}/${totalCount} Решено`}
+
+
+
+ {(contest.missions ?? []).map((v, i) => {
+ const missionSubmissions = submissions.filter(
+ (s) => s.solution.missionId === v.id
+ );
+
+ const hasSuccess = missionSubmissions.some(
+ (s) => s.solution.status == "Accepted: All tests passed"
+ );
+
+ console.log(missionSubmissions);
+
+ const status = hasSuccess
+ ? "success"
+ : missionSubmissions.length > 0
+ ? "error"
+ : undefined;
+
+ return (
+
+ {}}
+ >
+
+ );
+};
+
+export default SubmissionItem;
diff --git a/src/views/home/contest/Submissions.tsx b/src/views/home/contest/Submissions.tsx
index e69de29..7143099 100644
--- a/src/views/home/contest/Submissions.tsx
+++ b/src/views/home/contest/Submissions.tsx
@@ -0,0 +1,129 @@
+import SubmissionItem from "./SubmissionItem";
+import { useAppDispatch, useAppSelector } from "../../../redux/hooks";
+import { FC, useEffect } from "react";
+import {
+ Contest,
+ fetchMySubmissions,
+ setContestStatus,
+} from "../../../redux/slices/contests";
+import { arrowLeft } from "../../../assets/icons/header";
+import { useNavigate } from "react-router-dom";
+
+export interface Mission {
+ id: number;
+ authorId: number;
+ name: string;
+ difficulty: "Easy" | "Medium" | "Hard";
+ tags: string[];
+ timeLimit: number;
+ memoryLimit: number;
+ createdAt: string;
+ updatedAt: string;
+}
+
+interface SubmissionsProps {
+ contest: Contest;
+}
+
+const Submissions: FC#{id}
+
+ {formatDate(datetime)}
+
+ {missionId}
+ {language}
+
+ {verdict}
+
+ {formatMilliseconds(duration)}
+
+ {formatBytesToMB(memory)}
+
+
+
+ );
+};
+
+export default Submissions;
diff --git a/src/views/home/contests/ContestItem.tsx b/src/views/home/contests/ContestItem.tsx
index c2fc6fd..1abbf4a 100644
--- a/src/views/home/contests/ContestItem.tsx
+++ b/src/views/home/contests/ContestItem.tsx
@@ -98,22 +98,12 @@ const ContestItem: React.FC
+
+
+
+ {contest.name}
+
+
+
+
+ {
+ navigate(`/contest/${contest.id}`);
+ }}
+ />
+
+ Контест #{contest.id}
+
+
+ {`${solvedCount}/${totalCount} Решено`}
+
+
+
+
+
+ {!submissions || submissions.length == 0 ? (
+ Посылка
+ Когда
+ Задача
+ Язык
+ Вердикт
+ Время
+ Память
+ Вы еще ничего не отсылали
+ ) : (
+ <>
+ {submissions.map((v, i) => (
+ Загрузка контестов...
- );
- }
-
- if (error) {
- return Ошибка: {error}
;
- }
-
return (
@@ -54,25 +49,40 @@ const Contests = () => {
/>
-
+
+ Загрузка контестов...
+
+ )}
+ {status == 'failed' && (
+ Ошибка: {error}
+ )}
+ {status == 'successful' && (
+ <>
+
+ {}} placeholder="Поиск задачи" />
+
+ console.log(v)}
+ />
+
+ console.log(values)}
+ />
+
+ );
+};
+
+export default Filters;
diff --git a/src/views/home/contests/ModalCreate.tsx b/src/views/home/contests/ModalCreate.tsx
index ac9cc1c..0c30465 100644
--- a/src/views/home/contests/ModalCreate.tsx
+++ b/src/views/home/contests/ModalCreate.tsx
@@ -4,9 +4,13 @@ import { PrimaryButton } from '../../../components/button/PrimaryButton';
import { SecondaryButton } from '../../../components/button/SecondaryButton';
import { Input } from '../../../components/input/Input';
import { useAppDispatch, useAppSelector } from '../../../redux/hooks';
-import { createContest } from '../../../redux/slices/contests';
+import {
+ createContest,
+ setContestStatus,
+} from '../../../redux/slices/contests';
import { CreateContestBody } from '../../../redux/slices/contests';
import DateRangeInput from '../../../components/input/DateRangeInput';
+import { useNavigate } from 'react-router-dom';
interface ModalCreateContestProps {
active: boolean;
@@ -18,28 +22,37 @@ const ModalCreateContest: FC
+
+
+
+ );
+};
+
+export default Group;
diff --git a/src/views/home/group/GroupMenu.tsx b/src/views/home/group/GroupMenu.tsx
new file mode 100644
index 0000000..081c9f2
--- /dev/null
+++ b/src/views/home/group/GroupMenu.tsx
@@ -0,0 +1,96 @@
+import { MessageChat, Home, Cup } from '../../../assets/icons/group';
+
+import React, { FC } from 'react';
+import { Link } from 'react-router-dom';
+import { useAppDispatch, useAppSelector } from '../../../redux/hooks';
+import {
+ setMenuActivePage,
+ setMenuActiveProfilePage,
+} from '../../../redux/slices/store';
+
+interface MenuItemProps {
+ icon: string;
+ text: string;
+ href: string;
+ page: string;
+ profilePage: string;
+ active?: boolean;
+}
+
+const MenuItem: React.FC{group?.name}
+
+
+ {menuItems.map((v, i) => (
+
+ ))}
+
+ );
+};
+
+export default GroupMenu;
diff --git a/src/views/home/group/chat/Chat.tsx b/src/views/home/group/chat/Chat.tsx
new file mode 100644
index 0000000..7464e22
--- /dev/null
+++ b/src/views/home/group/chat/Chat.tsx
@@ -0,0 +1,12 @@
+import { useEffect } from 'react';
+import { useAppDispatch } from '../../../../redux/hooks';
+import { setMenuActiveGroupPage } from '../../../../redux/slices/store';
+
+export const Chat = () => {
+ const dispatch = useAppDispatch();
+
+ useEffect(() => {
+ dispatch(setMenuActiveGroupPage('chat'));
+ }, []);
+ return <>;
+};
diff --git a/src/views/home/group/contests/Contests.tsx b/src/views/home/group/contests/Contests.tsx
new file mode 100644
index 0000000..39faea4
--- /dev/null
+++ b/src/views/home/group/contests/Contests.tsx
@@ -0,0 +1,12 @@
+import { useEffect } from 'react';
+import { useAppDispatch } from '../../../../redux/hooks';
+import { setMenuActiveGroupPage } from '../../../../redux/slices/store';
+
+export const Contests = () => {
+ const dispatch = useAppDispatch();
+
+ useEffect(() => {
+ dispatch(setMenuActiveGroupPage('contests'));
+ }, []);
+ return <>;
+};
diff --git a/src/views/home/group/posts/ModalCreate.tsx b/src/views/home/group/posts/ModalCreate.tsx
new file mode 100644
index 0000000..39882ae
--- /dev/null
+++ b/src/views/home/group/posts/ModalCreate.tsx
@@ -0,0 +1,72 @@
+import { FC, useEffect, useState } from 'react';
+import { Modal } from '../../../../components/modal/Modal';
+import { PrimaryButton } from '../../../../components/button/PrimaryButton';
+import { SecondaryButton } from '../../../../components/button/SecondaryButton';
+import { Input } from '../../../../components/input/Input';
+import { useAppDispatch, useAppSelector } from '../../../../redux/hooks';
+import { createGroup } from '../../../../redux/slices/groups';
+import MarkdownEditor from '../../../articleeditor/Editor';
+import {
+ createPost,
+ setGroupFeedStatus,
+} from '../../../../redux/slices/groupfeed';
+
+interface ModalCreateProps {
+ groupId: number;
+ active: boolean;
+ setActive: (value: boolean) => void;
+}
+
+const ModalCreate: FC
+
+ Создать пост
+
+
+ {
+ setContent(v);
+ }}
+ />
+
+
+ {
+ dispatch(
+ createPost({ name: '', content, groupId }),
+ );
+ }}
+ text={status == 'idle' ? 'Опубликовать' : 'Загрузка...'}
+ disabled={status == 'loading'}
+ />
+ {
+ setActive(false);
+ }}
+ text="Отмена"
+ />
+
+
+
+
+ Обновить пост #{post?.id}
+
+
+
+ Загрузка...
+
+ {
+ setContent(v);
+ }}
+ />
+
+
+ {
+ dispatch(
+ updatePost({
+ name: '',
+ content,
+ groupId,
+ postId,
+ }),
+ );
+ }}
+ text={status == 'idle' ? 'Сохранить' : 'Загрузка...'}
+ disabled={
+ status == 'loading' || statusPost != 'successful'
+ }
+ />
+ {
+ dispatch(deletePost({ groupId, postId }));
+ }}
+ color="error"
+ text={
+ statusDelete == 'idle' ? 'Удалить' : 'Загрузка...'
+ }
+ disabled={
+ statusDelete == 'loading' ||
+ statusPost != 'successful'
+ }
+ />
+ {
+ setActive(false);
+ }}
+ text="Отмена"
+ />
+
+
+
+ );
+};
diff --git a/src/views/home/group/posts/Posts.tsx b/src/views/home/group/posts/Posts.tsx
new file mode 100644
index 0000000..e5cc012
--- /dev/null
+++ b/src/views/home/group/posts/Posts.tsx
@@ -0,0 +1,111 @@
+import { FC, useEffect, useState } from 'react';
+
+import { useAppSelector, useAppDispatch } from '../../../../redux/hooks';
+import { fetchGroupPosts } from '../../../../redux/slices/groupfeed';
+import { SearchInput } from '../../../../components/input/SearchInput';
+import { setMenuActiveGroupPage } from '../../../../redux/slices/store';
+import { fetchGroupById } from '../../../../redux/slices/groups';
+import { SecondaryButton } from '../../../../components/button/SecondaryButton';
+import ModalCreate from './ModalCreate';
+import { PostItem } from './PostItem';
+import ModalUpdate from './ModalUpdate';
+
+interface PostsProps {
+ groupId: number;
+}
+
+export const Posts: FC
+
+
+
+
+
+ {authorUsername}
+
+ {member ? member.role : 'роль не найдена'}
+
+
+
+
+ {isAdmin && (
+
+ {convertDate(createdAt)}
+
+ {
+ setUpdatePostId(id);
+ setModalUpdateActive(true);
+ }}
+ >
+
+
+ )}
+
+
+
+
+ );
+};
diff --git a/src/views/home/groupinviter/GroupInvite.tsx b/src/views/home/groupinviter/GroupInvite.tsx
new file mode 100644
index 0000000..1b3cc7c
--- /dev/null
+++ b/src/views/home/groupinviter/GroupInvite.tsx
@@ -0,0 +1,109 @@
+import { useEffect } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useAppDispatch, useAppSelector } from '../../../redux/hooks';
+import { setMenuActivePage } from '../../../redux/slices/store';
+import { useQuery } from '../../../hooks/useQuery';
+import { PrimaryButton } from '../../../components/button/PrimaryButton';
+import { SecondaryButton } from '../../../components/button/SecondaryButton';
+import {
+ joinGroupByToken,
+ setGroupsStatus,
+} from '../../../redux/slices/groups';
+
+const GroupInvite = () => {
+ const dispatch = useAppDispatch();
+ const navigate = useNavigate();
+
+ const query = useQuery();
+ const token = query.get('token') ?? undefined;
+ const expiresAt = query.get('expiresAt') ?? undefined;
+ const groupName = query.get('groupName') ?? undefined;
+ const groupId = Number(query.get('groupId') ?? undefined);
+
+ const username = useAppSelector((state) => state.auth.username);
+ const joinStatus = useAppSelector(
+ (state) => state.groups.joinGroupByToken.status,
+ );
+ const joinError = useAppSelector(
+ (state) => state.groups.joinGroupByToken.error,
+ );
+
+ useEffect(() => {
+ dispatch(setMenuActivePage('groups'));
+ }, []);
+
+ useEffect(() => {
+ if (joinStatus == 'successful') {
+ dispatch(
+ setGroupsStatus({ key: 'joinGroupByToken', status: 'idle' }),
+ );
+ navigate(`/group/${groupId}`);
+ }
+ }, [joinStatus]);
+
+ if (!token || !expiresAt || !groupName || !groupId) {
+ return (
+
+ {}}
+ placeholder="Поиск сообщений"
+ />
+ {isAdmin && (
+
+
+ {status === 'loading' &&
+ {
+ setModalCreateActive(true);
+ }}
+ text="Создать пост"
+ />
+
+ )}
+ Загрузка...
}
+ {status === 'failed' && Ошибка загрузки постов
}
+
+ {status == 'successful' &&
+ page0?.items &&
+ page0.items.length > 0 ? (
+
+ {page0.items.map((post, i) => (
+
+ ) : status === 'successful' ? (
+ Постов пока нет
+ ) : null}
+
+
+ Приглашение признано недействительным.
+
+ );
+ }
+
+ const isExpired = new Date(expiresAt) < new Date();
+
+ if (isExpired) {
+ return (
+
+ Период действия приглашения истек.
+
+ );
+ }
+
+ const handleJoin = async () => {
+ if (!token) return;
+ try {
+ await dispatch(joinGroupByToken(token)).unwrap();
+ } catch (err) {}
+ };
+
+ const handleCancel = () => {
+ navigate('/home/account');
+ };
+
+ return (
+
+
+ );
+};
+
+export default GroupInvite;
diff --git a/src/views/home/groups/Filter.tsx b/src/views/home/groups/Filter.tsx
new file mode 100644
index 0000000..1d8a82f
--- /dev/null
+++ b/src/views/home/groups/Filter.tsx
@@ -0,0 +1,51 @@
+import {
+ FilterDropDown,
+ FilterItem,
+} from '../../../components/drop-down-list/Filter';
+import { SorterDropDown } from '../../../components/drop-down-list/Sorter';
+import { SearchInput } from '../../../components/input/SearchInput';
+
+const Filters = () => {
+ const items: FilterItem[] = [
+ { text: 'React', value: 'react' },
+ { text: 'Vue', value: 'vue' },
+ { text: 'Angular', value: 'angular' },
+ { text: 'Svelte', value: 'svelte' },
+ { text: 'Next.js', value: 'next' },
+ { text: 'Nuxt', value: 'nuxt' },
+ { text: 'Solid', value: 'solid' },
+ { text: 'Qwik', value: 'qwik' },
+ ];
+
+ return (
+
+
+
+ Привет, {username}!
+
+
+ Вы действительно хотите присоединиться к группе:
+
+
+ "{groupName}"
+
+
+ {joinError && (
+
+ Ошибка присоединения: {joinError}
+
+ )}
+
+
+
+
+ {}} placeholder="Поиск задачи" />
+
+ {}}
+ />
+
+ {}}
+ />
+
+ );
+};
+
+export default Filters;
diff --git a/src/views/home/groups/Group.tsx b/src/views/home/groups/Group.tsx
deleted file mode 100644
index cc6ad00..0000000
--- a/src/views/home/groups/Group.tsx
+++ /dev/null
@@ -1,26 +0,0 @@
-import { FC } from 'react';
-import { cn } from '../../../lib/cn';
-import { useParams, Navigate } from 'react-router-dom';
-
-interface GroupsBlockProps {}
-
-const Group: FC
- {groupIdNumber}
-
- );
-};
-
-export default Group;
diff --git a/src/views/home/groups/GroupItem.tsx b/src/views/home/groups/GroupItem.tsx
index d7f579f..4a979b0 100644
--- a/src/views/home/groups/GroupItem.tsx
+++ b/src/views/home/groups/GroupItem.tsx
@@ -7,7 +7,7 @@ import {
EyeOpen,
} from '../../../assets/icons/groups';
import { useNavigate } from 'react-router-dom';
-import { GroupUpdate } from './Groups';
+import { GroupInvite, GroupUpdate } from './Groups';
export interface GroupItemProps {
id: number;
@@ -17,6 +17,9 @@ export interface GroupItemProps {
description: string;
setUpdateActive: (value: any) => void;
setUpdateGroup: (value: GroupUpdate) => void;
+ setInviteActive: (value: any) => void;
+ setInviteGroup: (value: GroupInvite) => void;
+ type: 'manage' | 'member';
}
interface IconComponentProps {
@@ -45,6 +48,9 @@ const GroupItem: React.FC{name}
- {(role == 'menager' || role == 'owner') && (
- {
+ setInviteActive(true);
+ setInviteGroup({ id, name });
+ }}
+ />
)}
- {(role == 'menager' || role == 'owner') && (
+ {type == 'manage' && (
{
diff --git a/src/views/home/groups/Groups.tsx b/src/views/home/groups/Groups.tsx
index 64b3692..2752d3c 100644
--- a/src/views/home/groups/Groups.tsx
+++ b/src/views/home/groups/Groups.tsx
@@ -7,6 +7,8 @@ import { setMenuActivePage } from '../../../redux/slices/store';
import { fetchMyGroups } from '../../../redux/slices/groups';
import ModalCreate from './ModalCreate';
import ModalUpdate from './ModalUpdate';
+import Filters from './Filter';
+import ModalInvite from './ModalInvite';
export interface GroupUpdate {
id: number;
@@ -14,19 +16,35 @@ export interface GroupUpdate {
description: string;
}
+export interface GroupInvite {
+ id: number;
+ name: string;
+}
+
const Groups = () => {
- const [modalActive, setModalActive] = useState(false);
- const [modelUpdateActive, setModalUpdateActive] = useState(false);
+ const [modalActive, setModalActive] = useState(false);
+ const [modalUpdateActive, setModalUpdateActive] = useState(false);
const [updateGroup, setUpdateGroup] = useState({
id: 0,
name: '',
description: '',
});
+ const [modalInviteActive, setModalInviteActive] = useState(false);
+ const [inviteGroup, setInviteGroup] = useState({
+ id: 0,
+ name: '',
+ });
const dispatch = useAppDispatch();
- // Берём группы из стора
- const groups = useAppSelector((store) => store.groups.groups);
+ // ✅ Берём группы и статус из нового слайса
+ const groups = useAppSelector((store) => store.groups.fetchMyGroups.groups);
+ const groupsStatus = useAppSelector(
+ (store) => store.groups.fetchMyGroups.status,
+ );
+ const groupsError = useAppSelector(
+ (store) => store.groups.fetchMyGroups.error,
+ );
// Берём текущего пользователя
const currentUserName = useAppSelector((store) => store.auth.username);
@@ -51,8 +69,8 @@ const Groups = () => {
(m) => m.username === currentUserName,
);
if (!me) return;
-
- if (me.role === 'Administrator') {
+ const roles = me.role.split(',').map((r) => r.trim());
+ if (roles.includes('Administrator')) {
managed.push(group);
} else {
current.push(group);
@@ -67,7 +85,7 @@ const Groups = () => {
}, [groups, currentUserName]);
return (
- = ({ active, setActive }) => {
const [name, setName] = useState('');
const [description, setDescription] = useState('');
- const status = useAppSelector((state) => state.groups.statuses.create);
+ const status = useAppSelector((state) => state.groups.createGroup.status);
const dispatch = useAppDispatch();
useEffect(() => {
diff --git a/src/views/home/groups/ModalInvite.tsx b/src/views/home/groups/ModalInvite.tsx
new file mode 100644
index 0000000..a00cfec
--- /dev/null
+++ b/src/views/home/groups/ModalInvite.tsx
@@ -0,0 +1,102 @@
+import { FC, useEffect, useMemo } from 'react';
+import { useAppDispatch, useAppSelector } from '../../../redux/hooks';
+import { fetchGroupJoinLink } from '../../../redux/slices/groups';
+import { Modal } from '../../../components/modal/Modal';
+import { PrimaryButton } from '../../../components/button/PrimaryButton';
+import { SecondaryButton } from '../../../components/button/SecondaryButton';
+import { Input } from '../../../components/input/Input';
+
+interface ModalInviteProps {
+ active: boolean;
+ setActive: (value: boolean) => void;
+ groupId: number;
+ groupName: string;
+}
+
+const ModalInvite: FC = ({
+ active,
+ setActive,
+ groupId,
+ groupName,
+}) => {
+ const dispatch = useAppDispatch();
+ const baseUrl = window.location.origin;
+
+ // Получаем токен и дату из Redux
+ const { joinLink, status } = useAppSelector(
+ (state) => state.groups.fetchGroupJoinLink,
+ );
+
+ // При открытии модалки запрашиваем join link
+ useEffect(() => {
+ if (active) {
+ dispatch(fetchGroupJoinLink(groupId));
+ }
+ }, [active, groupId, dispatch]);
+
+ // Генерация полной ссылки с query параметрами
+ const inviteLink = useMemo(() => {
+ if (!joinLink) return '';
+ const params = new URLSearchParams({
+ token: joinLink.token,
+ expiresAt: joinLink.expiresAt,
+ groupName,
+ groupId: `${groupId}`,
+ });
+ return `${baseUrl}/home/group-invite?${params.toString()}`;
+ }, [joinLink, groupName, baseUrl, groupId]);
+
+ // Копирование и закрытие модалки
+ const handleCopy = async () => {
+ if (!inviteLink) return;
+ try {
+ await navigator.clipboard.writeText(inviteLink);
+ setActive(false);
+ } catch (err) {
+ console.error('Не удалось скопировать ссылку:', err);
+ }
+ };
+
+ return (
+
+
+ );
+};
+
+export default ModalInvite;
diff --git a/src/views/home/groups/ModalUpdate.tsx b/src/views/home/groups/ModalUpdate.tsx
index 9233c9f..5d4ec0a 100644
--- a/src/views/home/groups/ModalUpdate.tsx
+++ b/src/views/home/groups/ModalUpdate.tsx
@@ -24,10 +24,10 @@ const ModalUpdate: FC = ({
const [name, setName] = useState('');
const [description, setDescription] = useState('');
const statusUpdate = useAppSelector(
- (state) => state.groups.statuses.update,
+ (state) => state.groups.updateGroup.status,
);
const statusDelete = useAppSelector(
- (state) => state.groups.statuses.delete,
+ (state) => state.groups.deleteGroup.status,
);
const dispatch = useAppDispatch();
diff --git a/src/views/home/menu/Menu.tsx b/src/views/home/menu/Menu.tsx
index e7b6ce4..3329c04 100644
--- a/src/views/home/menu/Menu.tsx
+++ b/src/views/home/menu/Menu.tsx
@@ -1,4 +1,4 @@
-import { Logo } from '../../../assets/logos';
+import { Logo, LogoFASIE } from '../../../assets/logos';
import {
Account,
Clipboard,
@@ -42,7 +42,7 @@ const Menu = () => {
const activePage = useAppSelector((state) => state.store.menu.activePage);
return (
-
+
{
- setModalActive(true);
- }}
+ onClick={() => setModalActive(true)}
text="Создать группу"
className="absolute right-0"
/>
-
+ = ({
@@ -19,6 +22,9 @@ const GroupsBlock: FC = ({
className,
setUpdateActive,
setUpdateGroup,
+ setInviteActive,
+ setInviteGroup,
+ type,
}) => {
const [active, setActive] = useState(title != 'Скрытые');
@@ -63,8 +69,11 @@ const GroupsBlock: FC = ({
description={v.description}
setUpdateActive={setUpdateActive}
setUpdateGroup={setUpdateGroup}
+ setInviteActive={setInviteActive}
+ setInviteGroup={setInviteGroup}
role={'owner'}
name={v.name}
+ type={type}
/>
))}
diff --git a/src/views/home/groups/ModalCreate.tsx b/src/views/home/groups/ModalCreate.tsx
index 458c491..ecda215 100644
--- a/src/views/home/groups/ModalCreate.tsx
+++ b/src/views/home/groups/ModalCreate.tsx
@@ -14,7 +14,7 @@ interface ModalCreateProps {
const ModalCreate: FC {
Группы
+ Загрузка групп...
+
+ )}
+ {groupsStatus === 'failed' && (
+
+ Ошибка: {groupsError || 'Не удалось загрузить группы'}
+
+ )}
+
+ {groupsStatus === 'successful' && (
+ <>
+
+
+
+ Приглашение в группу "{groupName}"
+
+
+
+
+
+
+ Ссылка для приглашения
+
+
+ {inviteLink}
+
+
+ setActive(false)}
+ text="Отмена"
+ />
+
+
+
);
};
diff --git a/src/views/home/missions/Filter.tsx b/src/views/home/missions/Filter.tsx
new file mode 100644
index 0000000..ca01a9d
--- /dev/null
+++ b/src/views/home/missions/Filter.tsx
@@ -0,0 +1,51 @@
+import {
+ FilterDropDown,
+ FilterItem,
+} from '../../../components/drop-down-list/Filter';
+import { SorterDropDown } from '../../../components/drop-down-list/Sorter';
+import { SearchInput } from '../../../components/input/SearchInput';
+
+const Filters = () => {
+ const items: FilterItem[] = [
+ { text: 'React', value: 'react' },
+ { text: 'Vue', value: 'vue' },
+ { text: 'Angular', value: 'angular' },
+ { text: 'Svelte', value: 'svelte' },
+ { text: 'Next.js', value: 'next' },
+ { text: 'Nuxt', value: 'nuxt' },
+ { text: 'Solid', value: 'solid' },
+ { text: 'Qwik', value: 'qwik' },
+ ];
+
+ return (
+
-
+
{menuItems.map((v, i) => (
@@ -56,6 +56,15 @@ const Menu = () => {
/>
))}
+
+
+ 
+
+ {
+ 'Проект «LiquidCode» создан при поддержке Федерального государственного бюджетного учреждения «Фонд содействия развитию малых форм предприятий в научно-технической сфере» в рамках программы «Студенческий стартап» федерального проекта «Платформа университетского технологического предпринимательства»'
+ }
+
+
+ {}} placeholder="Поиск задачи" />
+
+ console.log(v)}
+ />
+
+ console.log(values)}
+ />
+
+ );
+};
+
+export default Filters;
diff --git a/src/views/home/missions/Missions.tsx b/src/views/home/missions/Missions.tsx
index 3b5203e..28d71b0 100644
--- a/src/views/home/missions/Missions.tsx
+++ b/src/views/home/missions/Missions.tsx
@@ -5,6 +5,7 @@ import { useEffect, useState } from 'react';
import { setMenuActivePage } from '../../../redux/slices/store';
import { fetchMissions } from '../../../redux/slices/missions';
import ModalCreate from './ModalCreate';
+import Filters from './Filter';
export interface Mission {
id: number;
@@ -45,7 +46,7 @@ const Missions = () => {
/>
{missions.map((v, i) => (
diff --git a/src/views/home/missions/ModalCreate.tsx b/src/views/home/missions/ModalCreate.tsx
index e93fce6..c36fa3a 100644
--- a/src/views/home/missions/ModalCreate.tsx
+++ b/src/views/home/missions/ModalCreate.tsx
@@ -97,7 +97,7 @@ const ModalCreate: FC = ({ active, setActive }) => {
-