Изменена модалка добавления миссии

src/api/missionsUpload.ts

@@ -0,0 +1,39 @@
+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;
+};

src/redux/slices/missions.ts

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

src/views/home/missions/ModalCreate.tsx

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