From 4decccbbdf3649d393c4037cc0984e94edb4e77e Mon Sep 17 00:00:00 2001
From: Ben Warzeski <bwarzeski@edx.org>
Date: Tue, 28 Sep 2021 17:47:54 -0400
Subject: [PATCH] update ReviewActions to use gradingStatus and let button
 handle its props

---
 src/containers/ReviewModal/ReviewActions.jsx | 16 ++++++----------
 1 file changed, 6 insertions(+), 10 deletions(-)

diff --git a/src/containers/ReviewModal/ReviewActions.jsx b/src/containers/ReviewModal/ReviewActions.jsx
index f6d758b..de2317a 100644
--- a/src/containers/ReviewModal/ReviewActions.jsx
+++ b/src/containers/ReviewModal/ReviewActions.jsx
@@ -6,56 +6,52 @@ import {
   ActionRow,
   Button,
 } from '@edx/paragon';
-import { Edit } from '@edx/paragon/icons';
 
 import actions from 'data/actions';
 import selectors from 'data/selectors';
-import thunkActions from 'data/thunkActions';
 
 import StatusBadge from 'components/StatusBadge';
+import StartGradingButton from './StartGradingButton';
 import SubmissionNavigation from './SubmissionNavigation';
 import './ReviewModal.scss';
 
 export const ReviewActions = ({
-  gradeStatus,
+  gradingStatus,
   toggleShowRubric,
   showRubric,
   username,
-  startGrading,
 }) => (
   <div>
     <ActionRow className="review-actions">
       <span className="review-actions-username">
         {username}
-        <StatusBadge className="review-actions-status" status={gradeStatus} />
+        <StatusBadge className="review-actions-status" status={gradingStatus} />
       </span>
       <div className="review-actions-group">
         <Button variant="outline-primary" onClick={toggleShowRubric}>
           {showRubric ? 'Hide' : 'Show'} Rubric
         </Button>
-        <Button variant="primary" iconAfter={Edit} onClick={startGrading}>Start Grading</Button>
+        <StartGradingButton />
         <SubmissionNavigation />
       </div>
     </ActionRow>
   </div>
 );
 ReviewActions.propTypes = {
-  gradeStatus: PropTypes.string.isRequired,
+  gradingStatus: PropTypes.string.isRequired,
   username: PropTypes.string.isRequired,
   showRubric: PropTypes.bool.isRequired,
   toggleShowRubric: PropTypes.func.isRequired,
-  startGrading: PropTypes.func.isRequired,
 };
 
 export const mapStateToProps = (state) => ({
   username: selectors.grading.selected.username(state),
-  gradeStatus: selectors.grading.selected.gradeStatus(state),
+  gradingStatus: selectors.grading.selected.gradingStatus(state),
   showRubric: selectors.app.showRubric(state),
 });
 
 export const mapDispatchToProps = {
   toggleShowRubric: actions.app.toggleShowRubric,
-  startGrading: thunkActions.grading.startGrading,
 };
 
 export default connect(mapStateToProps, mapDispatchToProps)(ReviewActions);