Merge pull request #2915 from Hyperkid123/account-on-hold-error-screen

Catch on hold account error globally.

cypress/component/GatewayErrors.cy.tsx

@@ -7,6 +7,7 @@ import { removeScalprum } from '@scalprum/core';
 import type { AuthContextProps } from 'react-oidc-context';
 import { ChromeUser } from '@redhat-cloud-services/types';
 import { Provider as JotaiProvider, createStore, useAtomValue } from 'jotai';
+import { AxiosError, AxiosResponse } from 'axios';
 
 import qe from '../../src/utils/iqeEnablement';
 import { COMPLIACE_ERROR_CODES } from '../../src/utils/responseInterceptors';
@@ -16,6 +17,7 @@ import { initializeVisibilityFunctions } from '../../src/utils/VisibilitySinglet
 import GatewayErrorComponent from '../../src/components/ErrorComponents/GatewayErrorComponent';
 import { activeModuleAtom } from '../../src/state/atoms/activeModuleAtom';
 import { gatewayErrorAtom } from '../../src/state/atoms/gatewayErrorAtom';
+import ErrorBoundary from '../../src/components/ErrorComponents/ErrorBoundary';
 
 const testUser: ChromeUser = testUserJson as unknown as ChromeUser;
 
@@ -243,4 +245,46 @@ describe('Gateway errors', () => {
     cy.contains(`Normal render`).should('not.exist');
     cy.contains(`Component error handler`).should('exist');
   });
+
+  describe('Global error boundary', () => {
+    const resp = {
+      errors: [
+        {
+          detail:
+            "Insights authorization failed - ERROR_EXPORT_CONTROL: Your account appears to be on Export Hold. Please review the information at the following link for more detail: <a href='https://access.redhat.com/articles/1340183'>https://access.redhat.com/articles/1340183</a>. (SS v3)",
+          meta: {
+            response_by: 'gateway',
+          },
+          status: 403,
+        },
+      ],
+    };
+    const axiosResp: AxiosResponse<typeof resp> = {
+      config: {},
+      data: resp,
+      status: 403,
+      statusText: 'Forbidden',
+      headers: {},
+    };
+    const onHoldError = new AxiosError<typeof resp>('Insights authorization failed', 'resp', {}, null, axiosResp);
+
+    const ThrowComponent = () => {
+      throw onHoldError;
+    };
+    it('handles account on hold error', () => {
+      cy.on('uncaught:exception', () => {
+        // ignore exception, they are expected in this test case
+        return false;
+      });
+      cy.mount(
+        <IntlProvider locale="en">
+          <ErrorBoundary>
+            <ThrowComponent />
+          </ErrorBoundary>
+        </IntlProvider>
+      );
+
+      cy.contains('Your account appears to be on Export Hold').should('exist');
+    });
+  });
 });

src/components/ErrorComponents/AccountOnHoldError.tsx

@@ -0,0 +1,17 @@
+import React from 'react';
+import { AxiosError } from 'axios';
+import NotAuthorized from '@redhat-cloud-services/frontend-components/NotAuthorized';
+
+const ON_HOLD_MARK = 'Insights authorization failed - ERROR_EXPORT_CONTROL:';
+
+export const checkAccountOnHold = (error: any) => {
+  return error?.response?.data?.errors?.[0]?.detail.includes(ON_HOLD_MARK);
+};
+
+const AccountOnHoldError = ({ error }: { error: AxiosError<{ errors: { detail: string }[] }> }) => {
+  const data = error.response?.data.errors[0].detail;
+  const description = <div dangerouslySetInnerHTML={{ __html: data! }}></div>;
+  return <NotAuthorized description={description} serviceName="Hybrid Cloud Console" />;
+};
+
+export default AccountOnHoldError;

src/components/ErrorComponents/ErrorBoundary.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 
 import ErrorComponent from './DefaultErrorComponent';
+import AccountOnHoldError, { checkAccountOnHold } from './AccountOnHoldError';
 
 type ErrorBoundaryState = {
   hasError: boolean;
@@ -50,6 +51,9 @@ class ErrorBoundary extends React.Component<
 
   render() {
     if (this.state.hasError) {
+      if (checkAccountOnHold(this.state.error)) {
+        return <AccountOnHoldError error={this.state.error} />;
+      }
       return <ErrorComponent error={this.state.error} errorInfo={this.state.errorInfo} signIn={this.props.singIn} />;
     }