fix(connector): show appropriate error component based on response st…

…atus
eclipse-tractusx · Jul 3, 2024 · 4eb610f · 4eb610f
1 parent f9da8e1
commit 4eb610f
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 2 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -34,6 +34,8 @@
 - Page headers
   - harmonization and standardization of page headers, added consistent headers and removed unused code
 - Use scroll to top button from shared components
+- Connect management details overlay
+  - Show appropriate error information to the user along with refetch button
 
 ## 2.0.0
 

diff --git a/src/components/pages/EdcConnector/ConfigurationDetailsOverlay.tsx b/src/components/pages/EdcConnector/ConfigurationDetailsOverlay.tsx
@@ -29,6 +29,7 @@ import {
   type TableType,
   Typography,
   CircleProgress,
+  ErrorBar,
 } from '@catena-x/portal-shared-components'
 import { useFetchDecentralIdentityUrlsQuery } from 'features/connector/connectorApiSlice'
 import './EdcConnector.scss'
@@ -45,7 +46,12 @@ const ConfigurationDetailsOverlay = ({
   handleOverlayClose,
 }: ConfigurationDetailsOverlayProps) => {
   const { t } = useTranslation()
-  const { data, isFetching } = useFetchDecentralIdentityUrlsQuery()
+  const { data, isFetching, error, isError, refetch } =
+    useFetchDecentralIdentityUrlsQuery()
+
+  // To-Do fix the type issue with status and data from FetchBaseQueryError
+  // eslint-disable-next-line
+  const decentralIdentityUrlsError = error as any
 
   const handleIconDisplay = (value: string | undefined) => {
     if (value) return true
@@ -177,7 +183,22 @@ const ConfigurationDetailsOverlay = ({
             </div>
           ) : (
             <>
-              <StaticTable data={tableData} horizontal={true} />
+              {!isError ? (
+                <StaticTable data={tableData} horizontal={true} />
+              ) : (
+                <ErrorBar
+                  errorText={
+                    decentralIdentityUrlsError.code !== 500
+                      ? t('error.description') +
+                        ' ' +
+                        t('error.additionalDescription')
+                      : t('error.errorBar')
+                  }
+                  showButton={decentralIdentityUrlsError.code === 500}
+                  buttonText={t('error.tryAgain')}
+                  handleButton={refetch}
+                />
+              )}
               <Typography
                 variant="label3"
                 sx={{