Assign entries for voting

src/commons/assessment/AssessmentTypes.ts

@@ -64,6 +64,7 @@ export type AssessmentOverview = {
   isPublished?: boolean;
   hasVotingFeatures: boolean;
   hasTokenCounter?: boolean;
+  isVotingPublished?: boolean;
   maxXp: number;
   earlySubmissionXp: number;
   number?: string; // For mission control

src/commons/sagas/BackendSaga.ts

@@ -16,6 +16,7 @@ import {
   GradingQuestion
 } from '../../features/grading/GradingTypes';
 import {
+  ASSIGN_ENTRIES_FOR_VOTING,
   CHANGE_DATE_ASSESSMENT,
   CHANGE_TEAM_SIZE_ASSESSMENT,
   CONFIGURE_ASSESSMENT,
@@ -1385,6 +1386,28 @@ function* BackendSaga(): SagaIterator {
       yield call(showSuccessMessage, 'Updated successfully!', 1000);
     }
   );
+
+  yield takeEvery(
+    ASSIGN_ENTRIES_FOR_VOTING,
+    function* (action: ReturnType<typeof actions.assignEntriesForVoting>): any {
+      const tokens: Tokens = yield selectTokens();
+      const id = action.payload.id;
+
+      const resp: Response | null = yield updateAssessment(
+        id,
+        {
+          assignEntriesForVoting: true
+        },
+        tokens
+      );
+      if (!resp || !resp.ok) {
+        return yield handleResponseError(resp);
+      }
+
+      yield put(actions.fetchAssessmentOverviews());
+      yield call(showSuccessMessage, 'Updated successfully!', 1000);
+    }
+  );
 }
 
 function* handleReautogradeResponse(resp: Response | null): any {

src/commons/sagas/RequestsSaga.ts

@@ -1140,6 +1140,7 @@ export const updateAssessment = async (
     maxTeamSize?: number;
     hasTokenCounter?: boolean;
     hasVotingFeatures?: boolean;
+    assignEntriesForVoting?: boolean;
   },
   tokens: Tokens
 ): Promise<Response | null> => {

src/features/groundControl/GroundControlActions.ts

@@ -1,6 +1,7 @@
 import { createAction } from '@reduxjs/toolkit';
 
 import {
+  ASSIGN_ENTRIES_FOR_VOTING,
   CHANGE_DATE_ASSESSMENT,
   CHANGE_TEAM_SIZE_ASSESSMENT,
   CONFIGURE_ASSESSMENT,
@@ -39,3 +40,7 @@ export const configureAssessment = createAction(
     payload: { id, hasVotingFeatures, hasTokenCounter }
   })
 );
+
+export const assignEntriesForVoting = createAction(ASSIGN_ENTRIES_FOR_VOTING, (id: number) => ({
+  payload: { id }
+}));

src/features/groundControl/GroundControlTypes.ts

@@ -4,3 +4,4 @@ export const DELETE_ASSESSMENT = 'DELETE_ASSESSMENT';
 export const PUBLISH_ASSESSMENT = 'PUBLISH_ASSESSMENT';
 export const UPLOAD_ASSESSMENT = 'UPLOAD_ASSESSMENT';
 export const CONFIGURE_ASSESSMENT = 'CONFIGURE_ASSESSMENT';
+export const ASSIGN_ENTRIES_FOR_VOTING = 'ASSIGN_ENTRIES_FOR_VOTING';

src/pages/academy/groundControl/GroundControl.tsx

@@ -40,6 +40,7 @@ export type DispatchProps = {
     hasVotingFeatures: boolean,
     hasTokenCounter: boolean
   ) => void;
+  handleAssignEntriesForVoting: (id: number) => void;
   handleFetchCourseConfigs: () => void;
 };
 
@@ -163,7 +164,8 @@ const GroundControl: React.FC<Props> = props => {
       field: 'placeholderConfigure' as any,
       cellRenderer: ConfigureCell,
       cellRendererParams: {
-        handleConfigureAssessment: props.handleConfigureAssessment
+        handleConfigureAssessment: props.handleConfigureAssessment,
+        handleAssignEntriesForVoting: props.handleAssignEntriesForVoting
       },
       width: 80,
       filter: false,

src/pages/academy/groundControl/GroundControlContainer.ts

@@ -7,6 +7,7 @@ import {
 } from '../../../commons/application/actions/SessionActions';
 import { OverallState } from '../../../commons/application/ApplicationTypes';
 import {
+  assignEntriesForVoting,
   changeDateAssessment,
   changeTeamSizeAssessment,
   configureAssessment,
@@ -28,7 +29,8 @@ const mapDispatchToProps: MapDispatchToProps<DispatchProps, {}> = (dispatch: Dis
       handleUploadAssessment: uploadAssessment,
       handlePublishAssessment: publishAssessment,
       handleFetchCourseConfigs: fetchCourseConfig,
-      handleConfigureAssessment: configureAssessment
+      handleConfigureAssessment: configureAssessment,
+      handleAssignEntriesForVoting: assignEntriesForVoting
     },
     dispatch
   );

src/pages/academy/groundControl/subcomponents/GroundControlConfigureCell.tsx

@@ -1,14 +1,17 @@
 import {
+  Button,
+  ButtonGroup,
   Collapse,
   Dialog,
   DialogBody,
   DialogFooter,
   Divider,
+  Icon,
   Intent,
   NumericInput,
   Switch
 } from '@blueprintjs/core';
-import { IconNames, Team } from '@blueprintjs/icons';
+import { IconNames, InfoSign, Team } from '@blueprintjs/icons';
 import React, { useCallback, useState } from 'react';
 
 import { AssessmentOverview } from '../../../../commons/assessment/AssessmentTypes';
@@ -20,28 +23,45 @@ type Props = {
     hasVotingFeatures: boolean,
     hasTokenCounter: boolean
   ) => void;
+  handleAssignEntriesForVoting: (id: number) => void;
   data: AssessmentOverview;
 };
 
-const ConfigureCell: React.FC<Props> = ({ handleConfigureAssessment, data }) => {
+const ConfigureCell: React.FC<Props> = ({
+  handleConfigureAssessment,
+  handleAssignEntriesForVoting,
+  data
+}) => {
   const [isDialogOpen, setDialogState] = useState(false);
   const [hasVotingFeatures, setHasVotingFeatures] = useState(!!data.hasVotingFeatures);
   const [hasTokenCounter, setHasTokenCounter] = useState(!!data.hasTokenCounter);
   const [isTeamAssessment, setIsTeamAssessment] = useState(false);
+  const [isVotingPublished] = useState(!!data.isVotingPublished);
+  const [confirmAssignEntries, setConfirmAssignEntries] = useState(false);
 
   const handleOpenDialog = useCallback(() => setDialogState(true), []);
   const handleCloseDialog = useCallback(() => setDialogState(false), []);
 
+  // Updates assessment overview with changes to hasVotingFeatures and hasTokenCounter
   const handleConfigure = useCallback(() => {
     const { id } = data;
     handleConfigureAssessment(id, hasVotingFeatures, hasTokenCounter);
     handleCloseDialog();
   }, [data, handleCloseDialog, handleConfigureAssessment, hasTokenCounter, hasVotingFeatures]);
 
+  // Toggles in configuration pannel
   const toggleHasTokenCounter = useCallback(() => setHasTokenCounter(prev => !prev), []);
   const toggleVotingFeatures = useCallback(() => setHasVotingFeatures(prev => !prev), []);
   const toggleIsTeamAssessment = useCallback(() => setIsTeamAssessment(prev => !prev), []);
 
+  // OnClick and Handler functions for confirmation warnings when assigning entries for voting
+  const onAssignClick = useCallback(() => setConfirmAssignEntries(true), []);
+  const handleConfirmAssign = useCallback(() => {
+    const { id } = data;
+    handleAssignEntriesForVoting(id);
+  }, [data, handleAssignEntriesForVoting]);
+  const handleCancelAssign = useCallback(() => setConfirmAssignEntries(false), []);
+
   return (
     <>
       <ControlButton icon={IconNames.COG} onClick={handleOpenDialog} />
@@ -117,12 +137,43 @@ const ConfigureCell: React.FC<Props> = ({ handleConfigureAssessment, data }) =>
                     label="Export Score Leaderboard (Coming soon!)"
                   />
                 </div>
-                <Switch
-                  className="publish-voting"
-                  disabled={true}
-                  inline
-                  label="Publish Voting (Coming soon!)"
-                />
+                <div className="current-voting-status">
+                  <InfoSign />
+                  <p className="voting-status-text">
+                    Current Voting Status: Entries have {!isVotingPublished && <b>not </b>} been
+                    assigned
+                  </p>
+                </div>
+                {!confirmAssignEntries ? (
+                  <div className="control-button-container">
+                    <ControlButton
+                      icon={IconNames.RESET}
+                      onClick={onAssignClick}
+                      label={`${!isVotingPublished ? 'Assign' : 'Reassign'} entries for voting`}
+                    />
+                  </div>
+                ) : (
+                  <div className="confirm-assign-voting">
+                    <Icon icon="reset" />
+                    <p className="confirm-assign-text">
+                      Are you sure you want to{' '}
+                      <b>{isVotingPublished ? 're-assign' : 'assign'} entries?</b>
+                    </p>
+                    <ButtonGroup>
+                      <Button small intent="success" onClick={handleConfirmAssign}>
+                        Assign
+                      </Button>
+                      <Button small intent="danger" onClick={handleCancelAssign}>
+                        Cancel
+                      </Button>
+                    </ButtonGroup>
+                  </div>
+                )}
+                {isVotingPublished && (
+                  <p className="reassign-voting-warning">
+                    <b>All existing votes</b> will be <b>deleted</b> upon reassigning entries!
+                  </p>
+                )}
               </div>
             </Collapse>
           </div>

src/styles/_groundcontrol.scss

@@ -85,6 +85,28 @@
     .publish-voting {
       margin-top: 5px;
     }
+
+    .reassign-voting-warning {
+      font-size: 11px;
+      margin-left: 38px;
+    }
+
+    .confirm-assign-voting,
+    .current-voting-status {
+      max-height: 30px;
+      display: flex;
+      align-items: center;
+      gap: 6px;
+      margin-left: 15px;
+
+      .confirm-assign-text {
+        margin-top: 9px;
+      }
+
+      .voting-status-text {
+        margin-top: 10px;
+      }
+    }
   }
 
   .numeric-input-container {