reload and redirect exposed from errorScreenManager

Author: vivek-devtron

package-lock.json

@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "0.0.81-beta-7",
+    "version": "0.0.81-beta-8",
     "description": "Supporting common component library",
     "type": "module",
     "main": "dist/index.js",

package.json

@@ -4,10 +4,18 @@ import GenericEmptyState from './EmptyState/GenericEmptyState'
 import { ErrorPageType } from './Types'
 import { noop, refresh, reportIssue } from './Helper'
 
-const ErrorPage = ({ code, image, title, subTitle, imageType, heightToDeduct }: ErrorPageType) => {
+const ErrorPage = ({ code, image, title, subTitle, imageType, heightToDeduct, redirectURL, reload }: ErrorPageType) => {
     const { push } = useHistory()
     const redirectToHome = () => {
-        push(`/${ROUTES.APP_LIST}`)
+        push(redirectURL || `/${ROUTES.APP_LIST}`)
+    }
+
+    const handleRefresh = () => {
+        if (reload) {
+            reload()
+        } else {
+            refresh()
+        }
     }
 
     const getErrorPageProps = (
@@ -29,7 +37,11 @@ const ErrorPage = ({ code, image, title, subTitle, imageType, heightToDeduct }:
             case ERROR_STATUS_CODE.BAD_REQUEST:
             case ERROR_STATUS_CODE.BAD_GATEWAY:
             case ERROR_STATUS_CODE.SERVICE_TEMPORARY_UNAVAILABLE:
-                return { onClick: refresh, renderButtonText: ERROR_EMPTY_SCREEN.TRY_AGAIN, isButtonAvailable: true }
+                return {
+                    onClick: handleRefresh,
+                    renderButtonText: ERROR_EMPTY_SCREEN.TRY_AGAIN,
+                    isButtonAvailable: true,
+                }
             default:
                 return { onClick: noop, renderButtonText: '', isButtonAvailable: false }
         }

src/Assets/Icon/ic-open-in-new.svg

@@ -6,7 +6,14 @@ import Reload from './Reload'
 import ErrorPage from './ErrorPage'
 import { ErrorScreenManagerProps, ImageType } from './Types'
 
-const ErrorScreenManager = ({ code, reload, subtitle, reloadClass, heightToDeduct }: ErrorScreenManagerProps) => {
+const ErrorScreenManager = ({
+    code,
+    reload,
+    subtitle,
+    reloadClass,
+    heightToDeduct,
+    redirectURL,
+}: ErrorScreenManagerProps) => {
     const getMessage = () => {
         switch (code) {
             case ERROR_STATUS_CODE.BAD_REQUEST:
@@ -18,6 +25,7 @@ const ErrorScreenManager = ({ code, reload, subtitle, reloadClass, heightToDeduc
                         image={badRequest}
                         imageType={ImageType.Large}
                         heightToDeduct={heightToDeduct}
+                        reload={reload}
                     />
                 )
             case ERROR_STATUS_CODE.UNAUTHORIZED:
@@ -51,6 +59,7 @@ const ErrorScreenManager = ({ code, reload, subtitle, reloadClass, heightToDeduc
                         image={notFound}
                         imageType={ImageType.Large}
                         heightToDeduct={heightToDeduct}
+                        redirectURL={redirectURL}
                     />
                 )
             case ERROR_STATUS_CODE.INTERNAL_SERVER_ERROR:
@@ -73,6 +82,7 @@ const ErrorScreenManager = ({ code, reload, subtitle, reloadClass, heightToDeduc
                         image={badRequest}
                         imageType={ImageType.Large}
                         heightToDeduct={heightToDeduct}
+                        reload={reload}
                     />
                 )
             case ERROR_STATUS_CODE.SERVICE_TEMPORARY_UNAVAILABLE:
@@ -84,6 +94,7 @@ const ErrorScreenManager = ({ code, reload, subtitle, reloadClass, heightToDeduc
                         image={badRequest}
                         imageType={ImageType.Large}
                         heightToDeduct={heightToDeduct}
+                        reload={reload}
                     />
                 )
             default:

src/Common/ErrorPage.tsx

@@ -3,6 +3,7 @@ import Tippy from '@tippyjs/react'
 import { ReactComponent as CloseIcon } from '../Assets/Icon/ic-cross.svg'
 import { ReactComponent as Help } from '../Assets/Icon/ic-help.svg'
 import { ReactComponent as ICHelpOutline } from '../Assets/Icon/ic-help-outline.svg'
+import { ReactComponent as ICOpenInNew } from '../Assets/Icon/ic-open-in-new.svg'
 import 'tippy.js/animations/shift-toward-subtle.css'
 import { TippyCustomizedProps, TippyTheme } from './Types'
 import { not, stopPropagation } from './Helper'
@@ -140,10 +141,11 @@ export const TippyCustomized = (props: TippyCustomizedProps) => {
                             href={documentationLink}
                             target="_blank"
                             rel="noreferrer noopener"
-                            className="fs-13 cb-5"
+                            className="fs-13 cb-5 flex left"
                             onClick={closeTippy}
                         >
                             {documentationLinkText || 'Learn more'}
+                            <ICOpenInNew className="icon-dim-14 ml-4" />
                         </a>
                     </div>
                 )}

src/Common/ErrorScreenManager.tsx

@@ -142,6 +142,8 @@ export interface ErrorPageType
     extends Pick<GenericEmptyStateType, 'image' | 'title' | 'subTitle' | 'renderButton' | 'imageType'> {
     code: number
     heightToDeduct?: number
+    redirectURL?: string
+    reload?: () => void
 }
 
 export interface ErrorScreenManagerProps {
@@ -150,6 +152,7 @@ export interface ErrorScreenManagerProps {
     subtitle?: React.ReactChild
     reloadClass?: string
     heightToDeduct?: number
+    redirectURL?: string
 }
 
 export interface ErrorScreenNotAuthorizedProps {
@@ -869,18 +872,18 @@ export interface DeploymentWindowProfileMetaData {
 }
 
 export interface EnvironmentListHelmResult {
-  clusterId: number
-  clusterName: string
-  environments: EnvironmentHelmResult[]
+    clusterId: number
+    clusterName: string
+    environments: EnvironmentHelmResult[]
 }
 
 export interface EnvironmentHelmResult {
-  environmentId: number
-  environmentName: string
-  namespace: string
-  environmentIdentifier: string
-  isVirtualEnvironment?: boolean // Need to confirm for not full mode
-  allowedDeploymentTypes?: DeploymentAppTypes[]
+    environmentId: number
+    environmentName: string
+    namespace: string
+    environmentIdentifier: string
+    isVirtualEnvironment?: boolean // Need to confirm for not full mode
+    allowedDeploymentTypes?: DeploymentAppTypes[]
 }
 
-export type EnvironmentListHelmResponse = ResponseType<EnvironmentListHelmResult[]>
+export type EnvironmentListHelmResponse = ResponseType<EnvironmentListHelmResult[]>