Merge pull request #5 from InfinityTwo/grading-filterable-columns

Merge changes cause I forgot to switch branch and this is easier

Author: InfinityTwo

src/commons/application/ApplicationTypes.ts

@@ -415,7 +415,8 @@ export const defaultWorkspaceManager: WorkspaceManagerState = {
     },
     currentSubmission: undefined,
     currentQuestion: undefined,
-    hasUnsavedChanges: false
+    hasUnsavedChanges: false,
+    requestCounter: 0
   },
   playground: {
     ...createDefaultWorkspace('playground'),

src/commons/workspace/WorkspaceActions.ts

@@ -67,6 +67,7 @@ import {
   UPDATE_GRADING_COLUMN_VISIBILITY,
   UPDATE_HAS_UNSAVED_CHANGES,
   UPDATE_REPL_VALUE,
+  UPDATE_REQUEST_COUNTER,
   UPDATE_STEPSTOTAL,
   UPDATE_SUBLANGUAGE,
   UPDATE_SUBMISSIONS_TABLE_FILTERS,
@@ -395,6 +396,11 @@ export const setIsEditorReadonly = createAction(
   })
 );
 
+export const updateRequestCounter = createAction(
+  UPDATE_REQUEST_COUNTER,
+  (requestCount: number) => ({ payload: { requestCount } })
+);
+
 export const updateSubmissionsTableFilters = createAction(
   UPDATE_SUBMISSIONS_TABLE_FILTERS,
   (filters: SubmissionsTableFilters) => ({ payload: { filters } })

src/commons/workspace/WorkspaceReducer.ts

@@ -79,6 +79,7 @@ import {
   UPDATE_GRADING_COLUMN_VISIBILITY,
   UPDATE_HAS_UNSAVED_CHANGES,
   UPDATE_REPL_VALUE,
+  UPDATE_REQUEST_COUNTER,
   UPDATE_STEPSTOTAL,
   UPDATE_SUBLANGUAGE,
   UPDATE_SUBMISSIONS_TABLE_FILTERS,
@@ -658,6 +659,14 @@ const oldWorkspaceReducer: Reducer<WorkspaceManagerState> = (
           currentQuestion: action.payload.questionId
         }
       };
+    case UPDATE_REQUEST_COUNTER:
+      return {
+        ...state,
+        grading: {
+          ...state.grading,
+          requestCounter: action.payload.requestCount
+        }
+      };
     case SET_FOLDER_MODE:
       return {
         ...state,

src/commons/workspace/WorkspaceTypes.ts

@@ -40,6 +40,7 @@ export const TOGGLE_EDITOR_AUTORUN = 'TOGGLE_EDITOR_AUTORUN';
 export const TOGGLE_USING_SUBST = 'TOGGLE_USING_SUBST';
 export const TOGGLE_USING_CSE = 'TOGGLE_USING_CSE';
 export const TOGGLE_UPDATE_CSE = 'TOGGLE_UPDATE_CSE';
+export const UPDATE_REQUEST_COUNTER = 'UPDATE_REQUEST_COUNTER';
 export const UPDATE_SUBMISSIONS_TABLE_FILTERS = 'UPDATE_SUBMISSIONS_TABLE_FILTERS';
 export const UPDATE_GRADING_COLUMN_VISIBILITY = 'UPDATE_GRADING_COLUMN_VISIBILITY';
 export const UPDATE_CURRENT_ASSESSMENT_ID = 'UPDATE_CURRENT_ASSESSMENT_ID';
@@ -82,6 +83,7 @@ type GradingWorkspaceAttr = {
   readonly currentSubmission?: number;
   readonly currentQuestion?: number;
   readonly hasUnsavedChanges: boolean;
+  readonly requestCounter: number;
 };
 type GradingWorkspaceState = GradingWorkspaceAttr & WorkspaceState;
 

src/pages/academy/grading/Grading.tsx

@@ -3,13 +3,14 @@ import '@tremor/react/dist/esm/tremor.css';
 import { Icon as BpIcon, NonIdealState, Position, Spinner, SpinnerSize } from '@blueprintjs/core';
 import { IconNames } from '@blueprintjs/icons';
 import { Button, Card, Flex, Text, Title } from '@tremor/react';
-import React, { useCallback, useState } from 'react';
+import React, { useCallback, useEffect, useState } from 'react';
 import { useDispatch } from 'react-redux';
 import { Navigate, useParams } from 'react-router';
 import { fetchGradingOverviews } from 'src/commons/application/actions/SessionActions';
 import { Role } from 'src/commons/application/ApplicationTypes';
 import SimpleDropdown from 'src/commons/SimpleDropdown';
-import { useSession } from 'src/commons/utils/Hooks';
+import { useSession, useTypedSelector } from 'src/commons/utils/Hooks';
+import { updateRequestCounter } from 'src/commons/workspace/WorkspaceActions';
 import { numberRegExp } from 'src/features/academy/AcademyTypes';
 import {
   exportGradingCSV,
@@ -50,8 +51,12 @@ const Grading: React.FC = () => {
   const [showAllSubmissions, setShowAllSubmissions] = useState(false);
 
   const dispatch = useDispatch();
+  const requestCounter = useTypedSelector(state => state.workspaces.grading.requestCounter);
+
   const updateGradingOverviewsCallback = useCallback(
     (page: number, filterParams: Object) => {
+      console.log("+1 parent");
+      dispatch(updateRequestCounter(requestCounter + 1));
       dispatch(
         fetchGradingOverviews(
           showAllGroups,
@@ -64,6 +69,10 @@ const Grading: React.FC = () => {
     [dispatch, showAllGroups, showAllSubmissions, pageSize]
   );
 
+  useEffect(() => {
+    dispatch(updateRequestCounter(Math.max(0, requestCounter - 1)));
+  }, [gradingOverviews]);
+
   // If submissionId or questionId is defined but not numeric, redirect back to the Grading overviews page
   if (
     (params.submissionId && !params.submissionId?.match(numberRegExp)) ||