LiquidCode/LiquidCode_Frontend
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: LiquidCode:dev
Branches Tags
LiquidCode:main LiquidCode:dev
..
compare: LiquidCode:c55f7a972c6d2b3d650b553f2fe2f3afec4c3f88
Branches Tags
LiquidCode:main LiquidCode:dev

7 Commits
dev ... c55f7a972c

Author SHA1 Message Date
Roman Pytkov
c55f7a972c Merge remote-tracking branch 'origin/dev'
All checks were successful
Build and Push Docker Image / build (push) Successful in 59s
Details
2025-12-14 16:47:12 +03:00
Roman Pytkov
5693701aa5 Merge remote-tracking branch 'origin/dev'
All checks were successful
Build and Push Docker Image / build (push) Successful in 44s
Details
2025-11-19 22:00:26 +03:00
Roman Pytkov
d9f449f0b8 Merge remote-tracking branch 'origin/dev'
Some checks failed
Build and Push Docker Image / build (push) Failing after 48s
Details
2025-11-19 21:10:58 +03:00
Roman Pytkov
04da2b565a Merge remote-tracking branch 'origin/dev'
All checks were successful
Build and Push Docker Image / build (push) Successful in 1m14s
Details
2025-11-05 20:56:37 +03:00
Роман Пытков
070edbfc42 Merge pull request 'dev' (#1) from dev into main
All checks were successful
Build and Push Docker Image / build (push) Successful in 33s
Details 
Reviewed-on: #1
 2025-11-02 22:02:11 +00:00
Виталий Лавшонок
a4480db444 Merge branch 'dev'
All checks were successful
Build and Push Docker Image / build (push) Successful in 46s
Details
2025-10-27 18:01:55 +03:00
Roman Pytkov
f2baf189e4 Добавлен CI
Some checks failed
Build and Push Docker Image / build (push) Failing after 39s
Details
2025-10-27 17:45:16 +03:00
18 changed files with 177 additions and 277 deletions
Expand all files Collapse all files

35
.gitea/workflows/build-and-push.yaml Normal file
View File

@@ -0,0 +1,35 @@
name: Build and Push Docker Image
on:
push:
branches: [ main ]
env:
REGISTRY: git.nullptr.top
IMAGE_NAME: git.nullptr.top/liquidcode/liquidcode-frontend
jobs:
build:
runs-on: ubuntu-latest
steps:
- name: Checkout repository
uses: actions/checkout@v4
- name: Set up Docker Buildx
uses: docker/setup-buildx-action@v3
- name: Log in to Container Registry
uses: docker/login-action@v3
with:
registry: ${{ env.REGISTRY }}
username: liquidcode-ci-service
password: ${{ secrets.SERVICE_ACCOUNT_TOKEN }}
- name: Build and Push Docker image
uses: docker/build-push-action@v6
with:
context: .
push: true
tags: ${{ env.IMAGE_NAME }}:latest,${{ env.IMAGE_NAME }}:${{ gitea.sha }}
cache-from: type=registry,ref=${{ env.IMAGE_NAME }}:buildcache
cache-to: type=registry,ref=${{ env.IMAGE_NAME }}:buildcache,mode=max

29
Dockerfile Normal file
View File

@@ -0,0 +1,29 @@
# Build stage
FROM node:20-alpine AS build
WORKDIR /app
# Copy package files
COPY package.json package-lock.json ./
# Install dependencies
RUN npm ci
# Copy source code
COPY . .
# Build the application
RUN npm run build
# Production stage
FROM node:20-alpine AS runtime
WORKDIR /app
# Install a simple HTTP server to serve static files
RUN npm install -g serve
# Copy built application from build stage
COPY --from=build /app/dist ./dist
EXPOSE 3000
CMD ["serve", "-s", "dist", "-l", "3000"]

4
index.html
View File

@@ -2,9 +2,9 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/logo.svg" /> <link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>LiquidCode</title> <title>Vite + React + TS</title>
<link href="https://fonts.googleapis.com/css2?family=Source+Code+Pro&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Source+Code+Pro&display=swap" rel="stylesheet">

5
public/logo.svg
View File

@@ -1,5 +0,0 @@
<svg width="62" height="56" viewBox="0 0 62 56" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M16.7765 44.9299V16.6675C16.7765 7.46416 9.26353 0 0 0V44.9299C0.00729412 45.9589 0.153177 50.4447 3.64706 53.626C4.92353 54.7927 6.27294 55.4377 7.29412 55.8H23.3412C22.4221 55.4377 21.2113 54.7927 20.0588 53.626C16.9151 50.4447 16.7838 45.9589 16.7765 44.9299Z" fill="#0C8092"/>
<path d="M35.7412 44.9299V27.5377C35.7412 18.3343 28.2282 10.8701 18.9647 10.8701V44.9299C18.972 45.9589 19.1179 50.4447 22.6118 53.626C23.8882 54.7927 25.2376 55.4377 26.2588 55.8H42.3059C41.3868 55.4377 40.176 54.7927 39.0235 53.626C35.8798 50.4447 35.7485 45.9589 35.7412 44.9299Z" fill="#16A7C6"/>
<path d="M58.3529 53.626C54.8591 50.4447 54.7132 45.9589 54.7059 44.9299V39.1325C54.7059 29.9291 47.1929 22.4649 37.9294 22.4649V44.9299C37.9367 45.9589 38.0826 50.4447 41.5765 53.626C42.8529 54.7927 44.2024 55.4377 45.2235 55.8H62C60.9788 55.4377 59.6294 54.7927 58.3529 53.626Z" fill="#00DBD9"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 993 B

1
public/vite.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

39
src/api/missionsUpload.ts
View File

@@ -1,39 +0,0 @@
export interface UploadMissionRequest {
missionFile: File;
difficulty: number;
tags?: string[] | null;
}
export const buildUploadMissionFormData = (
request: UploadMissionRequest,
): FormData => {
const formData = new FormData();
formData.append('missionFile', request.missionFile);
formData.append('difficulty', request.difficulty.toString());
// tags:
// - undefined => fromArchive (do not include tags key at all)
// - [] => empty list (not reliably representable via multipart without backend support)
// - [..] => custom tags, repeated keys
if (Array.isArray(request.tags)) {
request.tags.forEach((tag) => formData.append('tags', tag));
}
return formData;
};
export const getProblemXmlMissingNameMessage = (responseData: unknown) => {
const asText =
typeof responseData === 'string'
? responseData
: responseData == null
? ''
: JSON.stringify(responseData);
if (/problem\.xml/i.test(asText) || /Mission name was not found/i.test(asText)) {
return 'В архиве отсутствует имя в problem.xml';
}
return null;
};

18
src/components/modal/Modal.tsx
View File

@@ -15,8 +15,8 @@ interface ModalProps {
} }
const modalbgVariants = { const modalbgVariants = {
closed: { opacity: 0, backdropFilter: 'blur(0px)' }, closed: { opacity: 0 },
open: { opacity: 1, backdropFilter: 'blur(6px)' }, open: { opacity: 1 },
}; };
const modalVariants = { const modalVariants = {
@@ -47,15 +47,13 @@ export const Modal: React.FC<ModalProps> = ({
exit={modalbgVariants.closed} exit={modalbgVariants.closed}
transition={{ duration: 0.15 }} transition={{ duration: 0.15 }}
className={cn( className={cn(
'fixed top-0 left-0 h-svh w-svw z-50', ' fixed top-0 left-0 h-svh w-svw backdrop-filter transition-[background-color,backdrop-filter,opacity] z-50',
backdrop === 'opaque' && 'bg-[#00000055]', backdrop == 'blur' && open && 'backdrop-blur-sm',
backdrop == 'opaque' &&
open &&
'bg-[#00000055] pointer-events-none',
)} )}
style={ ></motion.div>
backdrop === 'blur'
? undefined
: { backdropFilter: 'none' }
}
/>
)} )}
</AnimatePresence> </AnimatePresence>
<div className="fixed top-0 left-0 h-svh w-svw flex items-center justify-center pointer-events-none z-50"> <div className="fixed top-0 left-0 h-svh w-svw flex items-center justify-center pointer-events-none z-50">

4
src/pages/Article.tsx
View File

@@ -50,7 +50,7 @@ const Article = () => {
#{article.id} #{article.id}
</div> </div>
</div> </div>
{ {article.tags.length && (
<div className="flex gap-[10px]"> <div className="flex gap-[10px]">
{article.tags.map((v, i) => ( {article.tags.map((v, i) => (
<div <div
@@ -61,7 +61,7 @@ const Article = () => {
</div> </div>
))} ))}
</div> </div>
} )}
<MarkdownPreview <MarkdownPreview
content={article!.content} content={article!.content}
className="bg-transparent" className="bg-transparent"

8
src/redux/slices/auth.ts
View File

@@ -1,6 +1,5 @@
import { createSlice, createAsyncThunk, PayloadAction } from '@reduxjs/toolkit'; import { createSlice, createAsyncThunk, PayloadAction } from '@reduxjs/toolkit';
import axios from '../../axios'; import axios from '../../axios';
import { toastError } from '../../lib/toastNotification';
type Status = 'idle' | 'loading' | 'successful' | 'failed'; type Status = 'idle' | 'loading' | 'successful' | 'failed';
@@ -86,7 +85,7 @@ export const registerUser = createAsyncThunk(
}); });
return response.data; return response.data;
} catch (err: any) { } catch (err: any) {
return rejectWithValue(err.response?.data?.errors ? err.response?.data?.errors : {"error" : [err.response?.data]}); return rejectWithValue(err.response?.data?.errors);
} }
}, },
); );
@@ -217,11 +216,6 @@ const authSlice = createSlice({
builder.addCase(registerUser.rejected, (state, action) => { builder.addCase(registerUser.rejected, (state, action) => {
state.status = 'failed'; state.status = 'failed';
state.register.errors = action.payload as Record<string, string[]>; state.register.errors = action.payload as Record<string, string[]>;
Object.values(state.register.errors).forEach((messages) => {
messages.forEach((msg) => {
toastError(msg);
});
});
}); });
// ----------------- Login ----------------- // ----------------- Login -----------------

59
src/redux/slices/missions.ts
View File

@@ -1,11 +1,6 @@
import { createSlice, createAsyncThunk, PayloadAction } from '@reduxjs/toolkit'; import { createSlice, createAsyncThunk, PayloadAction } from '@reduxjs/toolkit';
import axios from '../../axios'; import axios from '../../axios';
import { toastError } from '../../lib/toastNotification'; import { toastError } from '../../lib/toastNotification';
import {
buildUploadMissionFormData,
getProblemXmlMissingNameMessage,
UploadMissionRequest,
} from '../../api/missionsUpload';
// ─── Типы ──────────────────────────────────────────── // ─── Типы ────────────────────────────────────────────
@@ -153,45 +148,27 @@ export const fetchMyMissions = createAsyncThunk(
export const uploadMission = createAsyncThunk( export const uploadMission = createAsyncThunk(
'missions/uploadMission', 'missions/uploadMission',
async ( async (
request: UploadMissionRequest, {
file,
name,
difficulty,
tags,
}: { file: File; name: string; difficulty: number; tags: string[] },
{ rejectWithValue }, { rejectWithValue },
) => { ) => {
try { try {
const formData = buildUploadMissionFormData(request); const formData = new FormData();
formData.append('MissionFile', file);
formData.append('Name', name);
formData.append('Difficulty', difficulty.toString());
tags.forEach((tag) => formData.append('Tags', tag));
const response = await axios.post('/missions/upload', formData, { const response = await axios.post('/missions/upload', formData, {
headers: { 'Content-Type': 'multipart/form-data' }, headers: { 'Content-Type': 'multipart/form-data' },
}); });
return response.data; // Mission return response.data; // Mission
} catch (err: any) { } catch (err: any) {
const status = err?.response?.status; return rejectWithValue(err.response?.data);
const responseData = err?.response?.data;
if (status === 400) {
const msg = getProblemXmlMissingNameMessage(responseData);
if (msg) {
return rejectWithValue({
errors: {
missionFile: [msg],
},
});
}
}
if (responseData?.errors) {
return rejectWithValue(responseData);
}
const fallback =
typeof responseData === 'string'
? responseData
: 'Не удалось загрузить миссию';
return rejectWithValue({
errors: {
general: [fallback],
},
});
} }
}, },
); );
@@ -374,19 +351,17 @@ const missionsSlice = createSlice({
(state, action: PayloadAction<any>) => { (state, action: PayloadAction<any>) => {
state.statuses.upload = 'failed'; state.statuses.upload = 'failed';
const errors = action.payload?.errors as const errors = action.payload.errors as Record<
| Record<string, string[]> string,
| undefined; string[]
if (errors) { >;
Object.values(errors).forEach((messages) => { Object.values(errors).forEach((messages) => {
messages.forEach((msg) => { messages.forEach((msg) => {
toastError(msg); toastError(msg);
}); });
}); });
state.create.errors = errors; state.create.errors = errors;
} else {
toastError('Не удалось загрузить миссию');
}
}, },
); );

13
src/views/home/auth/Login.tsx
View File

@@ -67,7 +67,7 @@ const Login = () => {
</div> </div>
<div className=" relative pointer-events-auto"> <div className=" relative pointer-events-auto">
<div> <div>
<div className="text-[35px] text-liquid-white font-bold h-[50px]"> <div className="text-[40px] text-liquid-white font-bold h-[50px]">
С возвращением С возвращением
</div> </div>
<div className="text-[18px] text-liquid-light font-bold h-[23px]"> <div className="text-[18px] text-liquid-light font-bold h-[23px]">
@@ -100,8 +100,15 @@ const Login = () => {
error={getErrorPasswordMessage()} error={getErrorPasswordMessage()}
/> />
<div className="flex justify-end mt-[10px] h-[20px]"> <div className="flex justify-end mt-[10px]">
<Link
to={''}
className={
'text-liquid-brightmain text-[16px] h-[20px] transition-all hover:underline '
}
>
Забыли пароль?
</Link>
</div> </div>
<div className="mt-[10px]"> <div className="mt-[10px]">

15
src/views/home/auth/Register.tsx
View File

@@ -9,7 +9,7 @@ import { registerUser } from '../../../redux/slices/auth';
import { setMenuActivePage } from '../../../redux/slices/store'; import { setMenuActivePage } from '../../../redux/slices/store';
import { Balloon } from '../../../assets/icons/auth'; import { Balloon } from '../../../assets/icons/auth';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
// import { Checkbox } from '../../../components/checkbox/Checkbox'; import { Checkbox } from '../../../components/checkbox/Checkbox';
function isValidEmail(email: string): boolean { function isValidEmail(email: string): boolean {
const pattern = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/; const pattern = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
@@ -52,13 +52,12 @@ const Register = () => {
const [password, setPassword] = useState<string>(''); const [password, setPassword] = useState<string>('');
const [confirmPassword, setConfirmPassword] = useState<string>(''); const [confirmPassword, setConfirmPassword] = useState<string>('');
const [submitClicked, setSubmitClicked] = useState<boolean>(false); const [submitClicked, setSubmitClicked] = useState<boolean>(false);
const [politicChecked, setPoliticChecked] = useState<boolean>(true); const [politicChecked, setPoliticChecked] = useState<boolean>(false);
const { status, jwt } = useAppSelector((state) => state.auth); const { status, jwt } = useAppSelector((state) => state.auth);
// const { errors } = useAppSelector((state) => state.auth.register); // const { errors } = useAppSelector((state) => state.auth.register);
useEffect(() => { useEffect(() => {
setPoliticChecked(true);
dispatch(setMenuActivePage('account')); dispatch(setMenuActivePage('account'));
}, []); }, []);
@@ -143,7 +142,7 @@ const Register = () => {
</div> </div>
<div className=" relative pointer-events-auto"> <div className=" relative pointer-events-auto">
<div> <div>
<div className="text-[35px] text-liquid-white font-bold h-[50px]"> <div className="text-[40px] text-liquid-white font-bold h-[50px]">
Добро пожаловать Добро пожаловать
</div> </div>
<div className="text-[18px] text-liquid-light font-bold h-[23px]"> <div className="text-[18px] text-liquid-light font-bold h-[23px]">
@@ -201,7 +200,7 @@ const Register = () => {
/> />
<div className=" flex items-center mt-[10px] h-[24px]"> <div className=" flex items-center mt-[10px] h-[24px]">
{/* <Checkbox <Checkbox
onChange={(value: boolean) => { onChange={(value: boolean) => {
setPoliticChecked(value); setPoliticChecked(value);
}} }}
@@ -216,13 +215,13 @@ const Register = () => {
/> />
<span className="text-[14px] font-medium text-liquid-light h-[18px] ml-[10px]"> <span className="text-[14px] font-medium text-liquid-light h-[18px] ml-[10px]">
Я принимаю{' '} Я принимаю{' '}
<Link to={'/home'} className={' underline'}> {/* <Link to={'/home'} className={' underline'}>
политику конфиденциальности политику конфиденциальности
</Link> </Link> */}
<span className={' underline cursor-pointer'}> <span className={' underline cursor-pointer'}>
политику конфиденциальности политику конфиденциальности
</span> </span>
</span> */} </span>
</div> </div>
<div className="mt-[10px]"> <div className="mt-[10px]">

7
src/views/home/contests/Contests.tsx
View File

@@ -14,15 +14,12 @@ import {
} from '../../../redux/slices/contests'; } from '../../../redux/slices/contests';
import ModalCreateContest from './ModalCreate'; import ModalCreateContest from './ModalCreate';
import Filters from './Filter'; import Filters from './Filter';
import { toastWarning } from '../../../lib/toastNotification';
const Contests = () => { const Contests = () => {
const dispatch = useAppDispatch(); const dispatch = useAppDispatch();
const [modalActive, setModalActive] = useState<boolean>(false); const [modalActive, setModalActive] = useState<boolean>(false);
const jwt = useAppSelector((state) => state.auth.jwt);
const { contests, status } = useAppSelector( const { contests, status } = useAppSelector(
(state) => state.contests.fetchContests, (state) => state.contests.fetchContests,
); );
@@ -52,10 +49,6 @@ const Contests = () => {
</div> </div>
<SecondaryButton <SecondaryButton
onClick={() => { onClick={() => {
if (!jwt){
toastWarning("Для создания контеста необходимо авторизоваться")
return;
}
setModalActive(true); setModalActive(true);
}} }}
text="Создать контест" text="Создать контест"

7
src/views/home/missions/Missions.tsx
View File

@@ -10,7 +10,6 @@ import {
import { fetchMissions } from '../../../redux/slices/missions'; import { fetchMissions } from '../../../redux/slices/missions';
import ModalCreate from './ModalCreate'; import ModalCreate from './ModalCreate';
import Filters from './Filter'; import Filters from './Filter';
import { toastWarning } from '../../../lib/toastNotification';
export interface Mission { export interface Mission {
id: number; id: number;
@@ -30,7 +29,6 @@ const Missions = () => {
const missions = useAppSelector((state) => state.missions.missions); const missions = useAppSelector((state) => state.missions.missions);
const jwt = useAppSelector((state) => state.auth.jwt);
const nameFilter = useAppSelector( const nameFilter = useAppSelector(
(state) => state.store.missions.filterName, (state) => state.store.missions.filterName,
); );
@@ -62,11 +60,6 @@ const Missions = () => {
</div> </div>
<SecondaryButton <SecondaryButton
onClick={() => { onClick={() => {
if (!jwt){
toastWarning("Для загрузки задачи необходимо авторизоваться")
return;
}
setModalActive(true); setModalActive(true);
}} }}
text="Добавить задачу" text="Добавить задачу"

109
src/views/home/missions/ModalCreate.tsx
View File

@@ -12,7 +12,6 @@ import { toastSuccess } from '../../../lib/toastNotification';
import { cn } from '../../../lib/cn'; import { cn } from '../../../lib/cn';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import { NumberInput } from '../../../components/input/NumberInput'; import { NumberInput } from '../../../components/input/NumberInput';
import { DropDownList, DropDownListItem } from '../../../components/input/DropDownList';
interface ModalCreateProps { interface ModalCreateProps {
active: boolean; active: boolean;
@@ -20,37 +19,23 @@ interface ModalCreateProps {
} }
const ModalCreate: FC<ModalCreateProps> = ({ active, setActive }) => { const ModalCreate: FC<ModalCreateProps> = ({ active, setActive }) => {
type TagsMode = 'fromArchive' | 'none' | 'custom'; const [name, setName] = useState<string>('');
const [difficulty, setDifficulty] = useState<number>(1); const [difficulty, setDifficulty] = useState<number>(1);
const [file, setFile] = useState<File | null>(null); const [file, setFile] = useState<File | null>(null);
const [tagInput, setTagInput] = useState<string>(''); const [tagInput, setTagInput] = useState<string>('');
const [tags, setTags] = useState<string[]>([]); const [tags, setTags] = useState<string[]>([]);
const [tagsMode, setTagsMode] = useState<TagsMode>('fromArchive');
const status = useAppSelector((state) => state.missions.statuses.upload); const status = useAppSelector((state) => state.missions.statuses.upload);
const dispatch = useAppDispatch(); const dispatch = useAppDispatch();
const [clickSubmit, setClickSubmit] = useState<boolean>(false); const [clickSubmit, setClickSubmit] = useState<boolean>(false);
const normalizeTags = (raw: string[]): string[] => {
const result: string[] = [];
const seen = new Set<string>();
for (const t of raw) {
const trimmed = t.trim();
if (!trimmed) continue;
const key = trimmed.toLowerCase();
if (seen.has(key)) continue;
seen.add(key);
result.push(trimmed);
}
return result;
};
const addTag = () => { const addTag = () => {
const parts = tagInput.split(',').map((v) => v.trim()); const newTag = tagInput.trim();
const next = normalizeTags([...tags, ...parts]); if (newTag && !tags.includes(newTag)) {
setTags(next); setTags([...tags, newTag]);
setTagInput(''); setTagInput('');
}
}; };
const removeTag = (tagToRemove: string) => { const removeTag = (tagToRemove: string) => {
@@ -66,27 +51,16 @@ const ModalCreate: FC<ModalCreateProps> = ({ active, setActive }) => {
const handleSubmit = async () => { const handleSubmit = async () => {
setClickSubmit(true); setClickSubmit(true);
if (!file) return; if (!file) return;
dispatch(uploadMission({ file, name, difficulty, tags }));
const payloadTags =
tagsMode === 'custom' ? normalizeTags(tags) : undefined;
dispatch(
uploadMission({
missionFile: file,
difficulty,
tags: payloadTags,
}),
);
}; };
useEffect(() => { useEffect(() => {
if (status === 'successful') { if (status === 'successful') {
toastSuccess('Миссия создана!'); toastSuccess('Миссия создана!');
setName('');
setDifficulty(1); setDifficulty(1);
setTags([]); setTags([]);
setFile(null); setFile(null);
setTagInput('');
setTagsMode('fromArchive');
dispatch(setMissionsStatus({ key: 'upload', status: 'idle' })); dispatch(setMissionsStatus({ key: 'upload', status: 'idle' }));
setActive(false); setActive(false);
} }
@@ -99,32 +73,12 @@ const ModalCreate: FC<ModalCreateProps> = ({ active, setActive }) => {
dispatch(setMissionsStatus({ key: 'upload', status: 'idle' })); dispatch(setMissionsStatus({ key: 'upload', status: 'idle' }));
}, [active]); }, [active]);
const getDifficultyErrorMessage = (): string => { const getNameErrorMessage = (): string => {
if (!clickSubmit) return ''; if (!clickSubmit) return '';
if (!Number.isFinite(difficulty) || difficulty < 1) if (name == '') return 'Поле не может быть пустым';
return 'Укажите сложность (минимум 1)';
return ''; return '';
}; };
const tagsModeItems: DropDownListItem[] = [
{ text: 'Теги: из архива', value: 'fromArchive' },
{ text: 'Теги: без тегов', value: 'none' },
{ text: 'Теги: свои', value: 'custom' },
];
const isTagsMode = (v: string): v is TagsMode =>
v === 'fromArchive' || v === 'none' || v === 'custom';
const currentTagsModeItem =
tagsModeItems.find((i) => i.value === tagsMode) ?? tagsModeItems[0];
useEffect(() => {
if (tagsMode === 'none') {
setTags([]);
setTagInput('');
}
}, [tagsMode]);
return ( return (
<Modal <Modal
className="bg-liquid-background border-liquid-lighter border-[2px] p-[25px] rounded-[20px] text-liquid-white" className="bg-liquid-background border-liquid-lighter border-[2px] p-[25px] rounded-[20px] text-liquid-white"
@@ -135,6 +89,18 @@ const ModalCreate: FC<ModalCreateProps> = ({ active, setActive }) => {
<div className="w-[500px]"> <div className="w-[500px]">
<div className="font-bold text-[30px]">Добавить задачу</div> <div className="font-bold text-[30px]">Добавить задачу</div>
<Input
name="name"
autocomplete="name"
className="mt-[10px]"
type="text"
label="Название"
defaultState={name}
onChange={setName}
placeholder="В яблочко"
error={getNameErrorMessage()}
/>
<NumberInput <NumberInput
name="difficulty" name="difficulty"
className="mt-[10px]" className="mt-[10px]"
@@ -144,7 +110,6 @@ const ModalCreate: FC<ModalCreateProps> = ({ active, setActive }) => {
maxValue={3500} maxValue={3500}
onChange={(v) => setDifficulty(v)} onChange={(v) => setDifficulty(v)}
placeholder="1" placeholder="1"
error={getDifficultyErrorMessage()}
/> />
<div className="mt-4"> <div className="mt-4">
@@ -172,38 +137,16 @@ const ModalCreate: FC<ModalCreateProps> = ({ active, setActive }) => {
{/* Теги */} {/* Теги */}
<div className="mb-[50px] max-w-[600px]"> <div className="mb-[50px] max-w-[600px]">
<div className="mt-[20px]">
<div className="text-[18px] text-liquid-white font-medium h-[23px] mb-[10px]">
Режим тегов
</div>
<DropDownList
items={tagsModeItems}
defaultState={currentTagsModeItem}
onChange={(v) => {
if (isTagsMode(v)) setTagsMode(v);
}}
weight="w-full"
/>
{tagsMode === 'none' && (
<div className="text-liquid-red text-[14px] mt-[8px] whitespace-pre-line">
Пустой список тегов сейчас не поддерживается в multipart.
Будет использован режим “из архива”.
</div>
)}
</div>
{tagsMode === 'custom' && (
<>
<div className="grid grid-cols-[1fr,140px] items-end gap-2"> <div className="grid grid-cols-[1fr,140px] items-end gap-2">
<Input <Input
name="missionTags" name="articleTag"
autocomplete="missionTags" autocomplete="articleTag"
className="mt-[20px] max-w-[600px]" className="mt-[20px] max-w-[600px]"
type="text" type="text"
label="Теги (через запятую)" label="Теги"
onChange={(v) => setTagInput(v)} onChange={(v) => setTagInput(v)}
defaultState={tagInput} defaultState={tagInput}
placeholder="arrays, dp" placeholder="arrays"
onKeyDown={(e) => { onKeyDown={(e) => {
if (e.key === 'Enter') addTag(); if (e.key === 'Enter') addTag();
}} }}
@@ -230,8 +173,6 @@ const ModalCreate: FC<ModalCreateProps> = ({ active, setActive }) => {
</div> </div>
))} ))}
</div> </div>
</>
)}
</div> </div>
<div> <div>

28
src/views/mission/codeeditor/CodeEditor.tsx
View File

@@ -3,7 +3,6 @@ import Editor from '@monaco-editor/react';
import { upload } from '../../../assets/icons/input'; import { upload } from '../../../assets/icons/input';
import { cn } from '../../../lib/cn'; import { cn } from '../../../lib/cn';
import { DropDownList } from '../../../components/input/DropDownList'; import { DropDownList } from '../../../components/input/DropDownList';
import { useParams } from 'react-router-dom';
const languageMap: Record<string, string> = { const languageMap: Record<string, string> = {
c: 'cpp', c: 'cpp',
@@ -24,21 +23,19 @@ const CodeEditor: React.FC<CodeEditorProps> = ({
onChange, onChange,
onChangeLanguage, onChangeLanguage,
}) => { }) => {
const { missionId } = useParams<{ missionId: string }>(); const [language, setLanguage] = useState<string>('C++');
const [code, setCode] = useState<string>(''); const [code, setCode] = useState<string>('');
const [isDragging, setIsDragging] = useState<boolean>(false); const [isDragging, setIsDragging] = useState<boolean>(false);
const items = [ const items = [
{ value: 'c', text: 'C' },
{ value: 'C++', text: 'C++' }, { value: 'C++', text: 'C++' },
{ value: 'java', text: 'Java' }, { value: 'java', text: 'Java' },
{ value: 'python', text: 'Python' }, { value: 'python', text: 'Python' },
{ value: 'pascal', text: 'Pascal' },
{ value: 'kotlin', text: 'Kotlin' }, { value: 'kotlin', text: 'Kotlin' },
{ value: 'csharp', text: 'C#' }, { value: 'csharp', text: 'C#' },
]; ];
const [language, setLanguage] = useState<string>('C++');
const getCodeKey = (missionId?: string) => `mission_${missionId}_code`;
useEffect(() => { useEffect(() => {
onChange(code); onChange(code);
@@ -47,24 +44,6 @@ const CodeEditor: React.FC<CodeEditorProps> = ({
onChangeLanguage(language); onChangeLanguage(language);
}, [language]); }, [language]);
useEffect(() => {
if (!missionId || !code) return;
localStorage.setItem(getCodeKey(missionId), code);
}, [code, missionId]);
useEffect(() => {
if (!missionId) return;
const savedCode = localStorage.getItem(getCodeKey(missionId));
if (savedCode !== null) {
setCode(savedCode);
} else {
setCode('');
}
}, [missionId]);
const handleFileUpload = (e: React.ChangeEvent<HTMLInputElement>) => { const handleFileUpload = (e: React.ChangeEvent<HTMLInputElement>) => {
const file = e.target.files?.[0]; const file = e.target.files?.[0];
if (!file) return; if (!file) return;
@@ -116,6 +95,7 @@ const CodeEditor: React.FC<CodeEditorProps> = ({
onChange={(v) => { onChange={(v) => {
setLanguage(v); setLanguage(v);
}} }}
defaultState={{ value: 'C++', text: 'C++' }}
/> />
<label <label

2
src/views/mission/statement/LaTextContainer.tsx
View File

@@ -78,7 +78,7 @@ const replaceImages = (
const doc = parser.parseFromString(html, 'text/html'); const doc = parser.parseFromString(html, 'text/html');
const latexImageNames = Array.from( const latexImageNames = Array.from(
latex.matchAll(/\\includegraphics(?:\[[^\]]*\])?\{(.+?)\}/g), latex.matchAll(/\\includegraphics\{(.+?)\}/g),
).map((match) => match[1]); ).map((match) => match[1]);
const imgs = doc.querySelectorAll<HTMLImageElement>('img.tex-graphics'); const imgs = doc.querySelectorAll<HTMLImageElement>('img.tex-graphics');

3
src/views/mission/statement/Statement.tsx
View File

@@ -5,7 +5,6 @@ import { CopyIcon } from '../../../assets/icons/missions';
// import FullLatexRenderer from "./FullLatexRenderer"; // import FullLatexRenderer from "./FullLatexRenderer";
import { useState } from 'react'; import { useState } from 'react';
import { toastSuccess } from '../../../lib/toastNotification';
interface CopyableDivPropd { interface CopyableDivPropd {
content: string; content: string;
@@ -17,7 +16,7 @@ const CopyableDiv: FC<CopyableDivPropd> = ({ content }) => {
const handleCopy = async () => { const handleCopy = async () => {
try { try {
await navigator.clipboard.writeText(content); await navigator.clipboard.writeText(content);
toastSuccess('Скопировано!'); alert('Скопировано!');
} catch (err) {} } catch (err) {}
}; };