feat: informative errors on failure to download or create shared reco…

…rd (#472) * feat: informative errors on failure to download or create shared record Adds user-facing errors if errors appear on download or creation of shared program record. FIXES: APER-3170
openedx · Jan 13, 2025 · 1c30beb · 1c30beb
1 parent 5db9cfc
commit 1c30beb
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 4 deletions.
diff --git a/src/components/ProgramRecord/ProgramRecordActions.jsx b/src/components/ProgramRecord/ProgramRecordActions.jsx
@@ -20,6 +20,7 @@ function ProgramRecordActions({
 }) {
   const [programRecordUrl, setProgramRecordUrl] = useState(sharedRecordUUID && `${getConfig().CREDENTIALS_BASE_URL}/records/programs/shared/${sharedRecordUUID}`);
   const [showCopyTooltip, setShowCopyTooltip] = useState(false);
+  const [showCreateLinkAlert, setShowCreateLinkAlert] = useState(false);
   const [showDownloadToast, setShowDownloadToast] = useState(false);
   const [downloadRecord, setDownloadRecord] = useState('default');
 
@@ -46,6 +47,13 @@ function ProgramRecordActions({
           description="Completed state for the download program record button"
         />
       ),
+      error: (
+        <FormattedMessage
+          id="download.button.error"
+          defaultMessage="Download program record failed"
+          description="Error state for the download program record button"
+        />
+      ),
     },
     icons: {
       default: <Icon src={Download} />,
@@ -97,7 +105,7 @@ function ProgramRecordActions({
       })
       .catch((error) => {
         logError(error);
-        throw new Error(error);
+        setShowCreateLinkAlert(true);
       });
     handleCopyEvent();
   };
@@ -112,8 +120,8 @@ function ProgramRecordActions({
         }
       })
       .catch((error) => {
+        setDownloadRecord('error');
         logError(error);
-        throw new Error(error);
       });
   };
 
@@ -177,6 +185,16 @@ function ProgramRecordActions({
                     defaultMessage="Create program record link"
                     description="Button text for creating a link to the program record"
                   />
+                  <Toast
+                    onClose={() => setShowCreateLinkAlert(false)}
+                    show={showCreateLinkAlert}
+                  >
+                    <FormattedMessage
+                      id="create.link.error"
+                      defaultMessage="Program record link creation failed. Please log out, log back in, and try again."
+                      description="A message to briefly display when the  creation of a shared program record link fails"
+                    />
+                  </Toast>
                 </Button>
               )}
             </OverlayTrigger>
@@ -251,7 +269,7 @@ function ProgramRecordActions({
           >
             <FormattedMessage
               id="successful.record.download.toast.message"
-              defaultMessage="Program record sucessfullly downloaded"
+              defaultMessage="Program record sucessfully downloaded"
               description="A message to briefly display when the user successfully downloads a program record"
             />
           </Toast>
@@ -268,7 +286,11 @@ ProgramRecordActions.propTypes = {
   renderBackButton: PropTypes.func.isRequired,
   username: PropTypes.string.isRequired,
   programUUID: PropTypes.string.isRequired,
-  sharedRecordUUID: PropTypes.string.isRequired,
+  sharedRecordUUID: PropTypes.string,
+};
+
+ProgramRecordActions.defaultProps = {
+  sharedRecordUUID: '',
 };
 
 export default ProgramRecordActions;
diff --git a/src/components/ProgramRecord/test/DownloadCsv.test.jsx b/src/components/ProgramRecord/test/DownloadCsv.test.jsx
@@ -58,4 +58,19 @@ describe('program-record', () => {
     expect(await screen.findByText(`Last Updated ${new Date(responseMock.record.program.last_updated).toLocaleDateString()}`)).toBeTruthy();
     expect(screen.getByRole('link', { name: 'read more in our records help area.' })).toBeTruthy();
   });
+  it('renders an alert when CSV download is unsuccessful', async () => {
+    const responseMock = programRecordFactory.build();
+    await act(async () => {
+      const axiosMock = new MockAdapter(getAuthenticatedHttpClient());
+      axiosMock
+        .onGet(`${getConfig().CREDENTIALS_BASE_URL}/records/api/v1/program_records/test-id/?is_public=true`)
+        .reply(200, responseMock);
+      axiosMock
+        .onGet(`${getConfig().CREDENTIALS_BASE_URL}/records/programs/shared/test-id/csv`)
+        .reply(404, {});
+      render(<ProgramRecord isPublic />);
+    });
+    fireEvent.click(await screen.findByRole('button', { name: 'Download program record' }));
+    waitFor(() => expect(screen.getByRole('button', { name: 'Download program record failed' })).toBeTruthy());
+  });
 });