Fixing the shown errors

Author: cniackz

portal-ui/src/screens/Console/Buckets/BucketDetails/AccessDetailsPanel.tsx

@@ -33,7 +33,7 @@ import { encodeURLString } from "../../../../common/utils";
 import { setErrorSnackMessage, setHelpName } from "../../../../systemSlice";
 import { selBucketDetailsLoading } from "./bucketDetailsSlice";
 import { useAppDispatch } from "../../../../store";
-import { Policy } from "../../../../api/consoleApi";
+import { ApiError, Policy } from "../../../../api/consoleApi";
 
 const AccessDetails = () => {
   const dispatch = useAppDispatch();
@@ -109,7 +109,8 @@ const AccessDetails = () => {
             setBucketUsers(res.data);
             setLoadingUsers(false);
           })
-          .catch((err) => {
+          .catch(async (res) => {
+            const err = (await res.json()) as ApiError;
             dispatch(setErrorSnackMessage(errorToHandler(err)));
             setLoadingUsers(false);
           });
@@ -133,7 +134,8 @@ const AccessDetails = () => {
             setBucketPolicy(res.data.policies);
             setLoadingPolicies(false);
           })
-          .catch((err) => {
+          .catch(async (res) => {
+            const err = (await res.json()) as ApiError;
             dispatch(setErrorSnackMessage(errorToHandler(err)));
             setLoadingPolicies(false);
           });

portal-ui/src/screens/Console/Buckets/BucketDetails/AccessRulePanel.tsx

@@ -19,7 +19,7 @@ import { AddIcon, Button, DataTable, SectionTitle } from "mds";
 import { useSelector } from "react-redux";
 import { useParams } from "react-router-dom";
 import { api } from "api";
-import { AccessRule as IAccessRule } from "api/consoleApi";
+import { AccessRule as IAccessRule, ApiError } from "api/consoleApi";
 import { errorToHandler } from "api/errors";
 import { IAM_SCOPES } from "../../../../common/SecureComponent/permissions";
 import {
@@ -114,7 +114,8 @@ const AccessRule = () => {
             setAccessRules(res.data.accessRules);
             setLoadingAccessRules(false);
           })
-          .catch((err) => {
+          .catch(async (res) => {
+            const err = (await res.json()) as ApiError;
             dispatch(setErrorSnackMessage(errorToHandler(err)));
             setLoadingAccessRules(false);
           });

portal-ui/src/screens/Console/Buckets/BucketDetails/AddAccessRule.tsx

@@ -32,6 +32,7 @@ import {
   setSnackBarMessage,
 } from "../../../../systemSlice";
 import { useAppDispatch } from "../../../../store";
+import { ApiError } from "../../../../api/consoleApi";
 
 interface IAddAccessRule {
   modalOpen: boolean;
@@ -78,8 +79,8 @@ const AddAccessRule = ({
         dispatch(setSnackBarMessage("Access Rule added successfully"));
         onClose();
       })
-      .catch((err) => {
-        dispatch(setErrorSnackMessage(errorToHandler(err)));
+      .catch((res) => {
+        dispatch(setErrorSnackMessage(errorToHandler(res.error)));
         onClose();
       });
   };

portal-ui/src/screens/Console/Buckets/ListBuckets/AddBucket/AddBucket.tsx

@@ -71,7 +71,7 @@ import { hasPermission } from "../../../../../common/SecureComponent";
 import BucketNamingRules from "./BucketNamingRules";
 import PageHeaderWrapper from "../../../Common/PageHeaderWrapper/PageHeaderWrapper";
 import { api } from "../../../../../api";
-import { ObjectRetentionMode } from "../../../../../api/consoleApi";
+import { ApiError, ObjectRetentionMode } from "../../../../../api/consoleApi";
 import { errorToHandler } from "../../../../../api/errors";
 import HelpMenu from "../../../HelpMenu";
 import CSVMultiSelector from "../../../Common/FormComponents/CSVMultiSelector/CSVMultiSelector";
@@ -191,7 +191,8 @@ const AddBucket = () => {
             dispatch(setErrorSnackMessage(errorToHandler(res.error)));
           }
         })
-        .catch((err) => {
+        .catch(async (res) => {
+          const err = (await res.json()) as ApiError;
           dispatch(setErrorSnackMessage(errorToHandler(err)));
         });
     };

portal-ui/src/screens/Console/Configurations/ConfigurationPanels/ConfigurationOptions.tsx

@@ -46,6 +46,7 @@ import { useAppDispatch } from "../../../../store";
 import { api } from "../../../../api";
 import { IElement } from "../types";
 import { errorToHandler } from "../../../../api/errors";
+import { ApiError } from "../../../../api/consoleApi";
 
 const getRoutePath = (path: string) => {
   return `${IAM_PAGES.SETTINGS}/${path}`;
@@ -79,7 +80,8 @@ const ConfigurationOptions = () => {
           setConfigSubSysList(confSubSysList);
         }
       })
-      .catch((err) => {
+      .catch(async (res) => {
+        const err = (await res.json()) as ApiError;
         dispatch(setErrorSnackMessage(errorToHandler(err)));
       });
   }, [dispatch]);