statement

src/pages/Mission.tsx

@@ -1,24 +1,93 @@
 import { useParams, Navigate } from 'react-router-dom';
-
-
+import CodeEditor from '../views/mission/codeeditor/CodeEditor';
+import Statement, { StatementData } from '../views/mission/statement/Statement';
+import { PrimaryButton } from '../components/button/PrimaryButton';
+import { useEffect, useState } from 'react';
+import { useAppDispatch, useAppSelector } from '../redux/hooks';
+import { submitMission } from '../redux/slices/submit';
+import { fetchMissionById } from '../redux/slices/missions';
 
 const Mission = () => {
 
+  const dispatch = useAppDispatch();
+
   // Получаем параметры из URL
   const { missionId } = useParams<{ missionId: string }>();
+  const mission = useAppSelector((state) => state.missions.currentMission);
+  const missionIdNumber = Number(missionId);
+
+  const [code, setCode] = useState<string>("");
+  const [language, setLanguage] = useState<string>("");
 
   // Если missionId нет, редиректим на /home
-  if (!missionId) {
+
+  // Если missionId нет или не число — редиректим
+  if (!missionId || isNaN(missionIdNumber)) {
     return <Navigate to="/home" replace />;
   }
 
+  useEffect(() => {
+    dispatch(fetchMissionById(missionIdNumber));
+  }, []);
+
+if (!mission || !mission.statements || mission.statements.length === 0) {
+  return <div>Загрузка или миссия не найдена...</div>;
+}
+
+
+
+const statementRaw = mission.statements[0];
+  let statementData: StatementData = { id: mission.id };
+
+  try {
+    const statementTexts = JSON.parse(statementRaw.statementTexts["problem-properties.json"]);
+    // console.log(mission);
+    statementData = {
+      id: statementRaw.id,
+      legend: statementTexts.legend,
+      timeLimit: statementTexts.timeLimit,
+      output: statementTexts.output,
+      input: statementTexts.input,
+      sampleTests: statementTexts.sampleTests,
+      name: statementTexts.name,
+      memoryLimit: statementTexts.memoryLimit,
+      tags: mission.tags,
+      notes: statementTexts.notes,
+    };
+  } catch (err) {
+    console.error("Ошибка парсинга statementTexts:", err);
+  }
+  
 
   return (
-    <div className="w-full bg-liquid-background grid grid-cols-[250px,1fr,250px] divide-x-[1px] divide-liquid-lighter">
+    <div className="w-full bg-liquid-background grid grid-cols-[minmax(0,1fr),minmax(0,1fr)] h-full gap-[20px] relative">
+      <div><Statement 
+        id={missionIdNumber} 
+        {...statementData}
 
-      <div className="bg-red-300 w-full h-full">
-        {missionId}
+      />
       </div>
+      <div className=' grid grid-rows-[1fr,200px] grid-flow-row h-full w-full gap-[20px]'>
+        <div className='w-full relative'>
+          <CodeEditor
+            onChange={(value: string) => { setCode(value); }}
+            onChangeLanguage={((value: string) => { setLanguage(value); })}
+          />
+        </div>
+        <div>
+          <PrimaryButton text='Отправить' onClick={() => {
+            dispatch(submitMission({
+              missionId: missionIdNumber,
+              language: language,
+              languageVersion: "latest",
+              sourceCode: code,
+              contestId: null,
+
+            }))
+          }} />
+        </div>
+      </div>
+      <div className="absolute top-0 bottom-0 left-1/2 w-[1px] bg-liquid-lighter transform -translate-x-1/2"></div>
     </div>
   );
 };