refactor; improve on-page search

Author: YuriUfimtsev

HwProj.APIGateway/HwProj.APIGateway.API/TableGenerators/ExcelGenerator.cs

@@ -139,7 +139,7 @@ private static void AddTasksHeaders(ExcelWorksheet worksheet, CourseDTO course,
                     }
 
                     worksheet.Cells[position.Row, position.Column].Value
-                        = $"{taskNumber.ToString()} {course.Homeworks[i].Tasks[j].Title}";
+                        = $"{taskNumber.ToString()}. {course.Homeworks[i].Tasks[j].Title}";
                     worksheet.Cells[position.Row, position.Column, position.Row, position.Column + 2].Merge = true;
                     position.Column += 3;
                     ++taskNumber;
@@ -209,8 +209,7 @@ private static void AddCourseMatesInfo(
                         var solutions = allSolutions
                             .Where(solution =>
                                 solution.State == SolutionState.Rated || solution.State == SolutionState.Final);
-                        var min = solutions
-                            .Where(solution => solution.State == SolutionState.Final);
+                        var min = solutions.Any() ? solutions.Last().Rating : 0;
                         var cnt = solutions.Count();
                         worksheet.Cells[position.Row, position.Column].Value = min;
                         worksheet.Cells[position.Row, position.Column + 2].Value = cnt;

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

@@ -59,10 +59,10 @@ const updatedLastViewedCourseId = (courseId : string) =>
 }
 
 const Course: React.FC = () => {
-    const {initialCourseId, tab} = useParams()
+    const {courseId, tab} = useParams()
 
-    const isFromYandex = initialCourseId === undefined
-    const courseId = isFromYandex ? getLastViewedCourseId() : initialCourseId
+    const isFromYandex = courseId === undefined
+    const validatedCourseId = isFromYandex ? getLastViewedCourseId() : courseId
 
 
     const navigate = useNavigate()
@@ -111,20 +111,22 @@ const Course: React.FC = () => {
     const showApplicationsTab = isCourseMentor
 
     const changeTab = (newTab: string) => {
-        if (isAcceptableTabValue(newTab) && newTab !== pageState.tabValue) {
-            if (newTab === "stats" && !showStatsTab) return;
-            if (newTab === "applications" && !showApplicationsTab) return;
-
-            setPageState(prevState => ({
-                ...prevState,
-                tabValue: newTab
-            }));
+        if (!isFromYandex) {
+            if (isAcceptableTabValue(newTab) && newTab !== pageState.tabValue) {
+                if (newTab === "stats" && !showStatsTab) return;
+                if (newTab === "applications" && !showApplicationsTab) return;
+
+                setPageState(prevState => ({
+                    ...prevState,
+                    tabValue: newTab
+                }));
+            }
         }
     }
 
     const setCurrentState = async () => {
-        updatedLastViewedCourseId(courseId)
-        const course = await ApiSingleton.coursesApi.apiCoursesByCourseIdGet(+courseId!)
+        updatedLastViewedCourseId(validatedCourseId)
+        const course = await ApiSingleton.coursesApi.apiCoursesByCourseIdGet(+validatedCourseId!)
 
         // У пользователя изменилась роль (иначе он не может стать лектором в курсе),
         // однако он все ещё использует токен с прежней ролью
@@ -138,7 +140,7 @@ const Course: React.FC = () => {
             return
         }
 
-        const solutions = await ApiSingleton.statisticsApi.apiStatisticsByCourseIdGet(+courseId!)
+        const solutions = await ApiSingleton.statisticsApi.apiStatisticsByCourseIdGet(+validatedCourseId!)
 
         setCourseState(prevState => ({
             ...prevState,
@@ -152,23 +154,22 @@ const Course: React.FC = () => {
             studentSolutions: solutions,
             tabValue: isFromYandex ? "stats" : "homeworks"
         }))
-        if (isFromYandex)
-        {
-            window.history.replaceState(null, "", `/courses/${courseId}`)
+        if (isFromYandex) {
+            window.history.replaceState(null, "", `/courses/${validatedCourseId}/stats`)
         }
     }
 
     useEffect(() => {
         setCurrentState()
     }, [])
 
-    useEffect(() => changeTab(tab || "homeworks"), [tab, courseId, isFound])
+    useEffect(() => changeTab(tab || "homeworks"), [tab, validatedCourseId, isFound])
 
     const yandexCode = new URLSearchParams(window.location.search).get("code")
 
     const joinCourse = async () => {
         await ApiSingleton.coursesApi
-            .apiCoursesSignInCourseByCourseIdPost(+courseId!)
+            .apiCoursesSignInCourseByCourseIdPost(+validatedCourseId!)
             .then(() => setCurrentState());
     }
 
@@ -216,7 +217,7 @@ const Course: React.FC = () => {
                                         </IconButton>
                                     }
                                     {isCourseMentor && !isReadingMode! && (
-                                        <RouterLink to={`/courses/${courseId}/edit`}>
+                                        <RouterLink to={`/courses/${validatedCourseId}/edit`}>
                                             <EditIcon fontSize="small"/>
                                         </RouterLink>
                                     )}
@@ -259,9 +260,9 @@ const Course: React.FC = () => {
                         style={{marginTop: 15}}
                         indicatorColor="primary"
                         onChange={(event, value) => {
-                            if (value === 0) navigate(`/courses/${courseId}/homeworks`)
-                            if (value === 1) navigate(`/courses/${courseId}/stats`)
-                            if (value === 2) navigate(`/courses/${courseId}/applications`)
+                            if (value === 0) navigate(`/courses/${validatedCourseId}/homeworks`)
+                            if (value === 1) navigate(`/courses/${validatedCourseId}/stats`)
+                            if (value === 2) navigate(`/courses/${validatedCourseId}/applications`)
                         }}
                     >
                         <Tab label="Домашние задания"/>
@@ -293,7 +294,7 @@ const Course: React.FC = () => {
                                             <Grid container>
                                                 <Grid item xs={12}>
                                                     <AddHomework
-                                                        id={+courseId!}
+                                                        id={+validatedCourseId!}
                                                         onCancel={() => setCurrentState()}
                                                         onSubmit={() => setCurrentState()}
                                                     />
@@ -369,7 +370,7 @@ const Course: React.FC = () => {
                             onUpdate={() => setCurrentState()}
                             course={courseState.course}
                             students={courseState.newStudents}
-                            courseId={courseId!}
+                            courseId={validatedCourseId!}
                         />
                     }
                 </Grid>

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

@@ -16,31 +16,34 @@ interface IStudentStatsProps {
 
 interface IStudentStatsState {
     searched: string
+    isSaveStatsActionOpened: boolean
 }
 
 const StudentStats:  React.FC<IStudentStatsProps> = (props) => {
     const [state, setSearched] = useState<IStudentStatsState>({
-        searched: ""
+        searched: "",
+        isSaveStatsActionOpened: false
     });
 
-    const {searched} = state
+    const {searched, isSaveStatsActionOpened} = state
 
     useEffect(() => {
         const keyDownHandler = (event: KeyboardEvent) => {
+            if (isSaveStatsActionOpened) return
             if (event.ctrlKey || event.altKey) return
             if (searched && event.key === "Escape") {
-                setSearched({searched: ""});
+                setSearched({...state, searched: ""});
             } else if (searched && event.key === "Backspace") {
-                setSearched({searched: searched.slice(0, -1)})
+                setSearched({...state, searched: searched.slice(0, -1)})
             } else if (event.key.length === 1 && event.key.match(/[a-zA-Zа-яА-Я\s]/i)
             ) {
-                setSearched({searched: searched + event.key})
+                setSearched({...state, searched: searched + event.key})
             }
         };
 
         document.addEventListener('keydown', keyDownHandler);
         return () => document.removeEventListener('keydown', keyDownHandler);
-    }, [searched]);
+    }, [searched, isSaveStatsActionOpened]);
 
     const homeworks = props.homeworks.filter(h => h.tasks && h.tasks.length > 0)
     const solutions = searched
@@ -127,6 +130,8 @@ const StudentStats:  React.FC<IStudentStatsProps> = (props) => {
                     courseId={props.course.id}
                     userId={props.userId}
                     yandexCode={props.yandexCode}
+                    onActionOpening={() => setSearched({searched, isSaveStatsActionOpened: true})}
+                    onActionClosing={() => setSearched({searched, isSaveStatsActionOpened: false})}
                 />
             </div>
         </div>

hwproj.front/src/components/Solutions/ExportToYandex.tsx

@@ -1,7 +1,6 @@
 import React, { FC, useState } from "react";
 import { useEffect } from 'react';
 import { ResultString } from "../../api";
-import { ResultExternalService } from "../../api";
 import { Alert, Box, Button, CircularProgress, Grid, Link, MenuItem, Select, TextField } from "@mui/material";
 import apiSingleton from "../../api/ApiSingleton";
 import { green, red } from "@material-ui/core/colors";

hwproj.front/src/components/Solutions/SaveStats.tsx

@@ -1,4 +1,4 @@
-import React, {FC, useState} from "react";
+import React, {FC, useState, useEffect} from "react";
 import {Alert, Box, Button, CircularProgress, Grid, MenuItem, Select, TextField} from "@mui/material";
 import SpeedDialIcon from '@mui/material/SpeedDialIcon';
 import GetAppIcon from '@material-ui/icons/GetApp';
@@ -19,61 +19,62 @@ interface SaveStatsProps {
     courseId : number | undefined;
     userId : string;
     yandexCode: string | null;
+    onActionOpening: () => void;
+    onActionClosing: () => void;
+
 }
 
-enum SpeedDialActions {
-    None,
+enum SpeedDialView {
+    Collapsed,
+    Expanded,
     Download,
     ShareWithGoogle,
     ShareWithYandex
 }
 
-enum SpeedDialView {
-    Opened,
-    Expanded
-}
-
 interface SaveStatsState {
-    selectedAction: SpeedDialActions;
-    speedDialView : SpeedDialView;
+    selectedView : SpeedDialView;
 }
 
 const SaveStats: FC<SaveStatsProps> = (props : SaveStatsProps) => {
-    const [state, setState] = useState<SaveStatsState>({
-        selectedAction: props.yandexCode === null ? SpeedDialActions.None : SpeedDialActions.ShareWithYandex,
-        speedDialView: SpeedDialView.Opened
+    const [state, setSelectedView] = useState<SaveStatsState>({
+        selectedView: props.yandexCode === null ? SpeedDialView.Collapsed : SpeedDialView.ShareWithYandex,
     })
 
-    const {selectedAction, speedDialView} = state
+    const {selectedView} = state
 
-    const handleCancellation = () => {
-        setState(prevState => ({...prevState, speedDialView: SpeedDialView.Opened, selectedAction: SpeedDialActions.None}));
-    }
+    useEffect(() => {
+        if (selectedView === SpeedDialView.Download ||
+            selectedView === SpeedDialView.ShareWithGoogle ||
+            selectedView === SpeedDialView.ShareWithYandex) {
+            props.onActionOpening()
+            return
+        }
+        props.onActionClosing()
+    }, [selectedView]);
 
     const handleSpeedDialItemClick = (operation : string) => {
         switch ( operation ) {
             case 'download':
-                setState(prevState =>
-                    ({...prevState, selectedAction: SpeedDialActions.Download}));
+                setSelectedView({selectedView: SpeedDialView.Download});
                 break;
             case 'shareWithGoogle':
-                setState(prevState =>
-                    ({...prevState, selectedAction: SpeedDialActions.ShareWithGoogle}));
+                setSelectedView({selectedView: SpeedDialView.ShareWithGoogle});
                 break;
             case 'shareWithYandex':
-                setState(prevState =>
-                    ({...prevState, selectedAction: SpeedDialActions.ShareWithYandex}));
+                setSelectedView({selectedView: SpeedDialView.ShareWithYandex});
                 break;
             default:
                 break;
         }
     }
 
-    const handleChangeSpeedDialView = () =>
-        setState(prevState => ({
-        ...prevState,
-        speedDialView: speedDialView === SpeedDialView.Opened ? SpeedDialView.Expanded : SpeedDialView.Opened
-        }))
+    const handleCancellation = () => setSelectedView({selectedView: SpeedDialView.Collapsed});
+
+    const handleChangingView = () =>
+        setSelectedView({selectedView: selectedView === SpeedDialView.Collapsed ?
+                SpeedDialView.Expanded : SpeedDialView.Collapsed
+        })
 
     const actions = [
         { icon: <SaveIcon sx={{ fontSize: 30 }} />, name: 'Сохранить', operation: 'download' },
@@ -84,15 +85,15 @@ const SaveStats: FC<SaveStatsProps> = (props : SaveStatsProps) => {
 
     return (
         <div>
-        {selectedAction === SpeedDialActions.None &&
+        {(selectedView === SpeedDialView.Collapsed || selectedView === SpeedDialView.Expanded) &&
             <Box sx={{ fontSize: 100 }}>
                 <SpeedDial
                     ariaLabel="SpeedDial basic example"
                     icon={<GetAppIcon/>}
                     direction="right"
-                    onClick={handleChangeSpeedDialView}
+                    onClickCapture={handleChangingView}
                     sx={{ '& .MuiFab-primary': { width: 45, height: 45 } }}
-                    open={speedDialView === SpeedDialView.Expanded}
+                    open={selectedView !== SpeedDialView.Collapsed}
                 >
                     {actions.map((action) => (
                         <SpeedDialAction
@@ -107,21 +108,21 @@ const SaveStats: FC<SaveStatsProps> = (props : SaveStatsProps) => {
                 </SpeedDial>
             </Box>
         }
-        {selectedAction === SpeedDialActions.Download &&
+        {selectedView === SpeedDialView.Download &&
             <DownloadStats
                 courseId={props.courseId}
                 userId={props.userId}
                 onCancellation={() => handleCancellation()}
             />
         }
-        {selectedAction === SpeedDialActions.ShareWithGoogle &&
+        {selectedView === SpeedDialView.ShareWithGoogle &&
             <ExportToGoogle
                 courseId={props.courseId}
                 userId={props.userId}
                 onCancellation={() => handleCancellation()}
             />
         }
-        {selectedAction === SpeedDialActions.ShareWithYandex &&
+        {selectedView === SpeedDialView.ShareWithYandex &&
             <ExportToYandex
                 courseId={props.courseId}
                 userId={props.userId}