Поддержка системы состояний для работы с данными на фронтенде

hwproj.front/package.json

@@ -16,6 +16,7 @@
     "@mui/lab": "^5.0.0-alpha.99",
     "@mui/material": "^5.16.11",
     "@mui/x-charts": "^8.2.0",
+    "@reduxjs/toolkit": "^2.11.2",
     "@storybook/addon-knobs": "^6.3.0",
     "@types/bluebird": "^3.5.36",
     "@types/classnames": "^2.3.1",
@@ -48,6 +49,7 @@
     "react-drag-drop-files": "^3.1.0",
     "react-markdown": "^5.0.0",
     "react-query": "^3.21.1",
+    "react-redux": "^9.2.0",
     "react-router-dom": "^6.5.0",
     "react-social-login-buttons": "^3.5.1",
     "react-syntax-highlighter": "^15.5.0",

hwproj.front/src/components/Courses/NewCourseStudents.tsx

@@ -1,29 +1,26 @@
 import * as React from 'react';
-import {AccountDataDto, CourseViewModel} from '../../api/';
 import ApiSingleton from "../../api/ApiSingleton";
 import {FC} from "react";
 import {Card, CardContent, CardActions, Grid, Button, Typography, Alert, AlertTitle} from '@mui/material';
+import {useCourseState} from "@/store/hooks";
+import {useRefreshCourse} from "@/store/storeHooks/courseHooks";
 
-interface INewCourseStudentsProps {
-    course: CourseViewModel,
-    students: AccountDataDto[],
-    onUpdate: () => void,
-    courseId: string,
-}
-
-const NewCourseStudents: FC<INewCourseStudentsProps> = (props) => {
+const NewCourseStudents: FC = () => {
+    const course = useCourseState(state => state.course.currentCourseMeta);
+    const students = useCourseState(state => state.course.newStudents);
+    const refreshCourse = useRefreshCourse();
 
     const acceptStudent = async (studentId: string) => {
-        await ApiSingleton.coursesApi.coursesAcceptStudent(props.course.id!, studentId)
-        props.onUpdate()
-    }
+        await ApiSingleton.coursesApi.coursesAcceptStudent(course?.id!, studentId);
+        refreshCourse(course?.id!);
+    };
 
     const rejectStudent = async (studentId: string) => {
-        await ApiSingleton.coursesApi.coursesRejectStudent(props.course.id!, studentId)
-        props.onUpdate()
-    }
+        await ApiSingleton.coursesApi.coursesRejectStudent(course?.id!, studentId);
+        refreshCourse(course?.id!);
+    };
 
-    const studentsLength = props.students.length
+    const studentsLength = students.length
 
     if (studentsLength === 0) {
         return (
@@ -36,7 +33,7 @@ const NewCourseStudents: FC<INewCourseStudentsProps> = (props) => {
         )
     }
     return <Grid item container spacing={1} direction={"row"} xs={"auto"}>
-        {props.students.map((cm, i) => (
+        {students.map((cm, i) => (
             <Grid item>
                 <Card variant="elevation" style={{backgroundColor: "ghostwhite"}}>
                     <CardContent>

hwproj.front/src/components/Courses/StudentStats.tsx

@@ -1,5 +1,5 @@
 import React, {useEffect, useState, useRef} from "react";
-import {CourseViewModel, HomeworkViewModel, StatisticsCourseMatesModel} from "@/api";
+import {HomeworkViewModel, StatisticsCourseMatesModel} from "@/api";
 import {useNavigate, useParams} from 'react-router-dom';
 import {LinearProgress, Table, TableBody, TableCell, TableContainer, TableHead, TableRow} from "@material-ui/core";
 import StudentStatsCell from "../Tasks/StudentStatsCell";
@@ -9,12 +9,12 @@ import StudentStatsUtils from "../../services/StudentStatsUtils";
 import ShowChartIcon from "@mui/icons-material/ShowChart";
 import {BonusTag, DefaultTags, TestTag} from "../Common/HomeworkTags";
 import Lodash from "lodash"
-import ApiSingleton from "@/api/ApiSingleton";
 import FullscreenIcon from '@mui/icons-material/Fullscreen';
 import FullscreenExitIcon from '@mui/icons-material/FullscreenExit';
+import {CurrentCourseMeta} from "@/store/slices/courseSlice";
 
 interface IStudentStatsProps {
-    course: CourseViewModel;
+    course: CurrentCourseMeta;
     homeworks: HomeworkViewModel[];
     isMentor: boolean;
     userId: string;
@@ -62,7 +62,7 @@ const StudentStats: React.FC<IStudentStatsProps> = (props) => {
     }, [])
 
     const {searched} = state
-    const isMentor = ApiSingleton.authService.isMentor()
+    const isMentor = props.isMentor
 
     useEffect(() => {
         const keyDownHandler = (event: KeyboardEvent) => {