status alert done state (#145)

* chore: update messages

* chore: small styling

Author: leangseu-edx

src/components/ModalContainer.jsx

@@ -39,7 +39,6 @@ const ModalContainer = ({ children }) => {
           }}
         >
           <Button
-            variant="primary"
             className="text-white"
             onClick={onClose.action.onClick}
           >

src/components/StatusAlert/hooks/simpleAlerts.js

@@ -31,6 +31,7 @@ export const useStaffAlerts = ({ step }) => ([
   useCreateAlert({ step })({
     message: messages.alerts[stepNames.staff][stepNames.staff],
     heading: messages.headings[stepNames.staff][stepNames.staff],
+    variant: 'warning',
   }),
 ]);
 

src/components/StatusAlert/index.jsx

@@ -25,7 +25,10 @@ const StatusAlert = ({
   );
 
   React.useEffect(() => {
-    document.querySelector('html').scrollTo(0, 0);
+    document.querySelector('html').scrollTo({
+      top: 0,
+      behavior: 'smooth',
+    });
   }, [hasSubmitted, step]);
 
   if (isPageDataLoading) {

src/components/StatusAlert/messages.js

@@ -196,7 +196,7 @@ const doneAlerts = defineMessages({
 const doneHeadings = defineMessages({
   status: {
     id: 'frontend-app-ora.StatusAlert.Heading.status',
-    defaultMessage: 'You have successfully submitted your self assessment',
+    defaultMessage: 'Great work! All assignment steps are completed.',
     description: 'Done status alert heading',
   },
 });
@@ -210,7 +210,7 @@ const staffAlerts = defineMessages({
 const staffHeadings = defineMessages({
   staff: {
     id: 'ora-mfe.StatusAlert.Heading.xblock.staffAssessment',
-    defaultMessage: 'Great work! All assignment steps are completed.',
+    defaultMessage: 'All assignment steps are completed. Your final grade is not ready yet.',
     description: 'Status alert message heading for staff assessment step',
   },
 });