upload mission

src/views/home/auth/Login.tsx

@@ -4,7 +4,7 @@ import { Input } from "../../../components/input/Input";
 import { useAppDispatch, useAppSelector } from "../../../redux/hooks";
 import { Link, useNavigate } from "react-router-dom";
 import { loginUser } from "../../../redux/slices/auth";
-import { cn } from "../../../lib/cn";
+// import { cn } from "../../../lib/cn";
 import { setMenuActivePage } from "../../../redux/slices/store";
 import { Balloon } from "../../../assets/icons/auth";
 import { SecondaryButton } from "../../../components/button/SecondaryButton";
@@ -18,13 +18,14 @@ const Login = () => {
   const [password, setPassword] = useState<string>("");
   const [submitClicked, setSubmitClicked] = useState<boolean>(false);
 
-  const { status, error, jwt } = useAppSelector((state) => state.auth);
+  const { status, jwt } = useAppSelector((state) => state.auth);
 
 
-  const [err, setErr] = useState<string>("");
+  // const [err, setErr] = useState<string>("");
 
   // После успешного логина
   useEffect(() => {
+    console.log(submitClicked);
     dispatch(setMenuActivePage("account"))
   }, []);
 

src/views/home/auth/Register.tsx

@@ -4,7 +4,7 @@ import { Input } from "../../../components/input/Input";
 import { useAppDispatch, useAppSelector } from "../../../redux/hooks";
 import { useNavigate } from "react-router-dom";
 import { registerUser } from "../../../redux/slices/auth";
-import { cn } from "../../../lib/cn";
+// import { cn } from "../../../lib/cn";
 import { setMenuActivePage } from "../../../redux/slices/store";
 import { Balloon } from "../../../assets/icons/auth";
 import { Link } from "react-router-dom";
@@ -23,11 +23,12 @@ const Register = () => {
   const [confirmPassword, setConfirmPassword] = useState<string>("");
   const [submitClicked, setSubmitClicked] = useState<boolean>(false);
 
-  const { status, error, jwt } = useAppSelector((state) => state.auth);
+  const { status, jwt } = useAppSelector((state) => state.auth);
 
   // После успешной регистрации — переход в систему
 
   useEffect(() => {
+    console.log(submitClicked);
     dispatch(setMenuActivePage("account"))
   }, []);
 

src/views/home/menu/Menu.tsx

@@ -6,11 +6,12 @@ import { useAppSelector } from "../../../redux/hooks";
 const Menu = () => {
   const menuItems = [
     {text: "Главная", href: "/home", icon: Home, page: "home" },
-    {text: "Задачи", href: "/home/problems", icon: Clipboard, page: "problems" },
+    {text: "Задачи", href: "/home/missions", icon: Clipboard, page: "missions" },
     {text: "Статьи", href: "/home/articles", icon: Openbook, page: "articles" },
     {text: "Группы", href: "/home/groups", icon: Users, page: "groups" },
     {text: "Контесты", href: "/home/contests", icon: Cup, page: "contests" },
     {text: "Аккаунт", href: "/home/account", icon: Account, page: "account" },
+    {text: "Загрузка", href: "/upload", icon: Account, page: "p" },
   ];
   const activePage = useAppSelector((state) => state.store.menu.activePage);
 

src/views/home/missions/MissionItem.tsx

@@ -1,7 +1,7 @@
 import { cn } from "../../../lib/cn";
-import { IconError, IconSuccess } from "../../../assets/icons/problems";
+import { IconError, IconSuccess } from "../../../assets/icons/missions";
 
-export interface ProblemItemProps {
+export interface MissionItemProps {
     id: number;
     authorId: number;
     name: string;
@@ -26,7 +26,7 @@ export function formatBytesToMB(bytes: number): string {
   return `${megabytes} МБ`;
 }
 
-const ProblemItem: React.FC<ProblemItemProps> = ({
+const MissionItem: React.FC<MissionItemProps> = ({
     id, name, difficulty, timeLimit, memoryLimit, type, status
 }) => {
     console.log(id);
@@ -66,4 +66,4 @@ const ProblemItem: React.FC<ProblemItemProps> = ({
     );
 };
 
-export default ProblemItem;
+export default MissionItem;

src/views/home/missions/Missions.tsx

@@ -1,11 +1,11 @@
-import ProblemItem from "./ProblemItem";
+import MissionItem from "./MissionItem";
 import { SecondaryButton } from "../../../components/button/SecondaryButton";
 import { useAppDispatch } from "../../../redux/hooks";
 import { useEffect } from "react";
 import { setMenuActivePage } from "../../../redux/slices/store";
 
 
-export interface Problem {
+export interface Mission {
     id: number;
     authorId: number;
     name: string;
@@ -18,11 +18,11 @@ export interface Problem {
 }
 
 
-const Problems = () => {
+const Missions = () => {
 
     const dispatch = useAppDispatch();
 
-    const problems: Problem[] = [
+    const missions: Mission[] = [
         {
             "id": 1,
             "authorId": 1,
@@ -466,7 +466,7 @@ const Problems = () => {
     ];
 
       useEffect(() => {
-        dispatch(setMenuActivePage("problems"))
+        dispatch(setMenuActivePage("missions"))
       }, []);
 
     return (
@@ -490,8 +490,8 @@ const Problems = () => {
 
                 <div>
 
-                {problems.map((v, i) => (
-                    <ProblemItem key={i} {...v} type={i % 2 == 0 ? "first" : "second"} status={i == 0 || i == 3 || i == 7 ? "success" : (i == 2 || i == 4 || i == 9 ? "error" : "empty")}/>
+                {missions.map((v, i) => (
+                    <MissionItem key={i} {...v} type={i % 2 == 0 ? "first" : "second"} status={i == 0 || i == 3 || i == 7 ? "success" : (i == 2 || i == 4 || i == 9 ? "error" : "empty")}/>
                 ))}
                 </div>
 
@@ -504,4 +504,4 @@ const Problems = () => {
     );
 };
 
-export default Problems;
+export default Missions;

src/views/mission/UploadMissionForm.tsx

@@ -0,0 +1,101 @@
+import React, { useState } from "react";
+import { useAppDispatch, useAppSelector } from "../../redux/hooks";
+import { uploadMission } from "../../redux/slices/missions";
+
+const UploadMissionForm: React.FC = () => {
+  const dispatch = useAppDispatch();
+  const { status, error } = useAppSelector(state => state.missions);
+
+  // Локальные состояния формы
+  const [name, setName] = useState("");
+  const [difficulty, setDifficulty] = useState(1);
+  const [tags, setTags] = useState<string[]>([]);
+  const [tagsValue, setTagsValue] = useState<string>("");
+  const [file, setFile] = useState<File | null>(null);
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    if (!file) return alert("Выберите файл миссии!");
+
+    try {
+      dispatch(uploadMission({ file, name, difficulty, tags }));
+      
+      alert("Миссия успешно загружена!");
+      setName("");
+      setDifficulty(1);
+      setTags([]);
+      setFile(null);
+    } catch (err) {
+      console.error(err);
+      alert("Ошибка при загрузке миссии: " + err);
+    }
+  };
+
+  const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    if (e.target.files && e.target.files[0]) {
+      setFile(e.target.files[0]);
+    }
+  };
+
+  const handleTagsChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    setTagsValue(e.target.value);
+    const value = e.target.value;
+    const tagsArray = value.split(",").map(tag => tag.trim()).filter(tag => tag);
+    setTags(tagsArray);
+  };
+
+  return (
+    <form onSubmit={handleSubmit} className="max-w-md mx-auto p-4 border rounded">
+      <div className="mb-4">
+        <label className="block mb-1">Название миссии</label>
+        <input
+          type="text"
+          value={name}
+          onChange={e => setName(e.target.value)}
+          className="w-full border px-2 py-1"
+          required
+        />
+      </div>
+
+      <div className="mb-4">
+        <label className="block mb-1">Сложность</label>
+        <input
+          type="number"
+          value={difficulty}
+          min={1}
+          max={5}
+          onChange={e => setDifficulty(Number(e.target.value))}
+          className="w-full border px-2 py-1"
+          required
+        />
+      </div>
+
+      <div className="mb-4">
+        <label className="block mb-1">Теги (через запятую)</label>
+        <input
+          type="text"
+          value={tagsValue}
+          onChange={handleTagsChange}
+          className="w-full border px-2 py-1"
+        />
+      </div>
+
+      <div className="mb-4">
+        <label className="block mb-1">Файл миссии</label>
+        <input type="file" onChange={handleFileChange} accept=".zip" required />
+      </div>
+
+      <button
+        type="submit"
+        disabled={status === "loading"}
+        className="bg-blue-500 text-white px-4 py-2 rounded disabled:opacity-50"
+      >
+        {status === "loading" ? "Загрузка..." : "Загрузить миссию"}
+      </button>
+
+      {status === "failed" && error && <p className="text-red-500 mt-2">{error}</p>}
+    </form>
+  );
+};
+
+export default UploadMissionForm;

src/views/mission/statement/Mission.tsx

@@ -10,7 +10,7 @@ declare global {
   }
 }
 
-export default function ProblemStatement() {
+export default function MissionStatement() {
   const containerRef = useRef<HTMLDivElement>(null);
 const legend = "В честь юбилея ректорат ЮФУ решил запустить акцию <<Сто и десять кексов>>. \r\n\r\n $x$, $a_i^2 + b_i^2 \le a_{i+1}^2$ В каждом корпусе университета открылась лавка с кексами, в которой каждый студент может получить бесплатные кексы.\r\n\r\nНе прошло и пары минут после открытия, как к лавкам набежали студенты и образовалось много очередей. Но самая большая очередь образовалась в главном корпусе ЮФУ. Изначально в этой очереди стояло $n$ студентов, но потом в течение следующих $m$ минут какие-то студенты приходили и вставали в очередь, а какие-то уходили.\r\n\r\nЗа каждым студентом закреплен номер его зачетной книжки, будем называть это число номером студента. У каждого студента будет уникальный номер, по которому можно однозначно его идентифицировать. Будем считать, что каждую минуту происходило одно из следующих событий:\r\n\r\n\\begin{enumerate}\r\n  \\item Студент с номером $x$ пришел и встал перед студентом с номером $y$;\r\n  \\item Студент с номером $x$ пришел и встал в конец очереди;\r\n  \\item Студент с номером $x$ ушел из очереди; возможно, он потом вернется.\r\n\\end{enumerate}\r\n\r\nАналитикам стало интересно, а какой будет очередь после $m$ минут? \r\n\r\nПомогите им и сообщите конечное состояние очереди.\r\n\r\n";
   const htmlContent = `