feat: Adding human readable 403 error access restricted

Signed-off-by: Farhaan Bukhsh <[email protected]>
openedx · Dec 13, 2024 · e2c15fe · e2c15fe
1 parent b110b6b
commit e2c15fe
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 3 deletions.
diff --git a/src/course-outline/page-alerts/PageAlerts.jsx b/src/course-outline/page-alerts/PageAlerts.jsx
@@ -344,10 +344,18 @@ const PageAlerts = ({
     let errorList = Object.entries(errors).filter(obj => obj[1] !== null).map(([k, v]) => {
       switch (v.type) {
         case API_ERROR_TYPES.serverError:
+          let description = v.data || intl.formatMessage(messages.serverErrorAlertBody);
+          let alertTitle = intl.formatMessage(messages.serverErrorAlert);
+          if (v.status === 403) {
+            description = intl.formatMessage(messages.forbiddenAlertBody, {
+              LMS: <Hyperlink destination={`${getConfig().LMS_BASE_URL}`} target="_blank" showLaunchIcon={false}>{intl.formatMessage(messages.forbiddenAlertLmsUrl)}</Hyperlink>
+            });
+            alertTitle = intl.formatMessage(messages.forbiddenAlert);
+          }
           return {
             key: k,
-            desc: v.data || intl.formatMessage(messages.serverErrorAlertBody),
-            title: intl.formatMessage(messages.serverErrorAlert),
+            desc: description,
+            title: alertTitle,
             dismissible: v.dismissible,
           };
         case API_ERROR_TYPES.networkError:
@@ -378,7 +386,7 @@ const PageAlerts = ({
             dismissError={() => dispatch(dismissError(msgObj.key))}
           >
             <Alert.Heading>{msgObj.title}</Alert.Heading>
-            {msgObj.desc && <Truncate lines={2}>{msgObj.desc}</Truncate>}
+            {msgObj.desc}
           </ErrorAlert>
         ) : (
           <Alert

diff --git a/src/course-outline/page-alerts/messages.js b/src/course-outline/page-alerts/messages.js
@@ -121,6 +121,21 @@ const messages = defineMessages({
     defaultMessage: 'Network error',
     description: 'Generic network error alert.',
   },
+  forbiddenAlert: {
+    id: 'course-authoring.course-outline.page-alert.forbidden.title',
+    defaultMessage: 'Access Restricted',
+    description: 'Forbidden(403) alert title',
+  },
+  forbiddenAlertBody: {
+    id: 'course-authoring.course-outline.page-alert.forbidden.body',
+    defaultMessage: 'It looks like you’re trying to access a page you don’t have permission to view. Contact your admin if you think this is a mistake, or head back to the {LMS}.',
+    description: 'Forbidden(403) alert body',
+  },
+  forbiddenAlertLmsUrl: {
+    id: 'course-authoring.course-outline.page-alert.lms',
+    defaultMessage: 'LMS',
+    description: 'LMS base redirection url',
+  },
 });
 
 export default messages;