fix(company data): handle empty sharing state response (#1300)

eclipse-tractusx · Nov 11, 2024 · edf8d66 · edf8d66
1 parent ef525e9
commit edf8d66
Show file tree

Hide file tree

Showing 2 changed files with 121 additions and 107 deletions.
diff --git a/src/components/overlays/CSVUploadOverlay/index.tsx b/src/components/overlays/CSVUploadOverlay/index.tsx
@@ -51,6 +51,7 @@ export default function CSVUploadOverlay(): JSX.Element {
   const [success, setSuccess] = useState<boolean>(false)
   const [error, setError] = useState<boolean>(false)
   const [errorResponse, setErrorResponse] = useState<string[]>([])
+  const [errorStatus, setErrorStatus] = useState<number>(0)
 
   const renderDropArea = (props: DropAreaProps): JSX.Element => {
     return <DropArea {...props} size="small" />
@@ -76,6 +77,7 @@ export default function CSVUploadOverlay(): JSX.Element {
       // eslint-disable-next-line
     } catch (err: any) {
       setLoading(false)
+      setErrorStatus(err?.status)
       setErrorResponse(err?.data?.error ?? [])
       setError(true)
     }
@@ -161,22 +163,30 @@ export default function CSVUploadOverlay(): JSX.Element {
                 textAlign: 'center',
               }}
             >
-              {errorResponse?.length > 0 ? (
+              {errorStatus !== 500 ? (
                 <>
-                  {errorResponse.map((text, i) => (
-                    <Typography
-                      sx={{ marginBottom: '10px', display: 'block' }}
-                      id={text + i}
-                      variant="label1"
-                      className="title"
-                    >
-                      {text}
+                  {errorResponse?.length > 0 ? (
+                    <>
+                      {errorResponse.map((text, i) => (
+                        <Typography
+                          sx={{ marginBottom: '10px', display: 'block' }}
+                          id={text + i}
+                          variant="label1"
+                          className="title"
+                        >
+                          {text}
+                        </Typography>
+                      ))}
+                    </>
+                  ) : (
+                    <Typography variant="label1" className="title">
+                      {t('content.companyData.upload.emptyError')}
                     </Typography>
-                  ))}
+                  )}
                 </>
               ) : (
                 <Typography variant="label1" className="title">
-                  {t('content.companyData.upload.emptyError')}
+                  {errorResponse}
                 </Typography>
               )}
             </div>
@@ -193,7 +203,7 @@ export default function CSVUploadOverlay(): JSX.Element {
                 variant="outlined"
                 startIcon={<WarningAmberOutlinedIcon />}
                 sx={{ marginRight: '8px' }}
-                disabled={errorResponse.length === 0}
+                disabled={errorResponse.length === 0 || errorStatus === 500}
               >
                 {t('content.companyData.upload.copy')}
               </Button>

diff --git a/src/components/pages/CompanyData/components/CompanyAddressList.tsx b/src/components/pages/CompanyData/components/CompanyAddressList.tsx
@@ -182,80 +182,84 @@ export const CompanyAddressList = ({
 
   return (
     <>
-      {sharingStates.length > 0 && (
-        <Table
-          loading={isFetching || isOutputLoading || isInputLoading}
-          hasMore={data && data.totalPages > page + 1}
-          nextPage={() => {
-            setPage((i) => i + 1)
-          }}
-          hideFooterPagination={true}
-          buttons={[
-            {
-              title: t('content.companyData.table.buttonSite'),
-              click: () => {
-                handleSecondButtonClick()
-              },
-              icon: <AddCircleOutlineIcon />,
-            },
-            {
-              title: t('content.companyData.csvUploadBtn'),
-              click: () => dispatch(show(OVERLAYS.CSV_UPLOAD_OVERLAY)),
-              icon: <UploadIcon />,
-            },
-          ]}
-          autoFocus={false}
-          onButtonClick={handleButtonClick}
-          rowsCount={inputs.length + outputs.length}
-          buttonLabel={t('content.companyData.table.buttonAddress')}
-          toolbarVariant="premium"
-          searchPlaceholder={t('content.companyData.table.search')}
-          columnHeadersBackgroundColor={'#FFFFFF'}
-          searchDebounce={1000}
-          noRowsMsg={t('content.companyData.table.noRowsMsg')}
-          title={t('content.companyData.table.title')}
-          getRowId={(row: { [key: string]: string }) => row.createdAt}
-          rows={inputs.concat(outputs)}
-          onCellClick={onRowClick}
-          error={errorObj.status === 0 ? null : errorObj}
-          columns={[
-            {
-              field: 'site',
-              headerAlign: 'left',
-              align: 'left',
-              headerName: t('content.companyData.table.site'),
-              flex: 1.5,
-              valueGetter: ({ row }: { row: CompanyDataType }) =>
-                row.site?.name ?? '',
+      <Table
+        loading={isFetching || isOutputLoading || isInputLoading}
+        hasMore={data && data.totalPages > page + 1}
+        nextPage={() => {
+          setPage((i) => i + 1)
+        }}
+        hideFooterPagination={true}
+        buttons={[
+          {
+            title: t('content.companyData.table.buttonSite'),
+            click: () => {
+              handleSecondButtonClick()
             },
-            {
-              field: 'address',
-              headerAlign: 'left',
-              align: 'left',
-              headerName: t('content.companyData.table.location'),
-              flex: 2,
-              valueGetter: ({ row }: { row: CompanyDataType }) =>
-                row.address
-                  ? `${row.address.name ?? ''} ${row.address.physicalPostalAddress.street?.name ?? ''} ${row.address.physicalPostalAddress.street?.houseNumber ?? ''} ${row.address.physicalPostalAddress.city ?? ''} ${row.address.physicalPostalAddress.postalCode ?? ''} ${row.address.physicalPostalAddress.country ?? ''}`
-                  : '',
-            },
-            {
-              field: 'type',
-              headerAlign: 'left',
-              align: 'left',
-              headerName: t('content.companyData.table.type'),
-              flex: 1,
-              valueGetter: ({ row }: { row: CompanyDataType }) =>
-                row.address.addressType === AddressType.SiteMainAddress
-                  ? 'S'
-                  : 'A',
-            },
-            {
-              field: 'status',
-              headerName: t('content.companyData.table.status'),
-              align: 'left',
-              flex: 1,
-              renderCell: ({ row }: { row: CompanyDataType }) => {
+            icon: <AddCircleOutlineIcon />,
+          },
+          {
+            title: t('content.companyData.csvUploadBtn'),
+            click: () => dispatch(show(OVERLAYS.CSV_UPLOAD_OVERLAY)),
+            icon: <UploadIcon />,
+          },
+        ]}
+        autoFocus={false}
+        onButtonClick={handleButtonClick}
+        rowsCount={inputs.length + outputs.length}
+        buttonLabel={t('content.companyData.table.buttonAddress')}
+        toolbarVariant="premium"
+        searchPlaceholder={t('content.companyData.table.search')}
+        columnHeadersBackgroundColor={'#FFFFFF'}
+        searchDebounce={1000}
+        noRowsMsg={
+          !isFetching && !isOutputLoading && !isInputLoading
+            ? t('content.companyData.table.noRowsMsg')
+            : ''
+        }
+        title={t('content.companyData.table.title')}
+        getRowId={(row: { [key: string]: string }) => row.createdAt}
+        rows={inputs.concat(outputs)}
+        onCellClick={onRowClick}
+        error={errorObj.status === 0 ? null : errorObj}
+        columns={[
+          {
+            field: 'site',
+            headerAlign: 'left',
+            align: 'left',
+            headerName: t('content.companyData.table.site'),
+            flex: 1.5,
+            valueGetter: ({ row }: { row: CompanyDataType }) =>
+              row.site?.name ?? '',
+          },
+          {
+            field: 'address',
+            headerAlign: 'left',
+            align: 'left',
+            headerName: t('content.companyData.table.location'),
+            flex: 2,
+            valueGetter: ({ row }: { row: CompanyDataType }) =>
+              row.address
+                ? `${row.address.name ?? ''} ${row.address.physicalPostalAddress.street?.name ?? ''} ${row.address.physicalPostalAddress.street?.houseNumber ?? ''} ${row.address.physicalPostalAddress.city ?? ''} ${row.address.physicalPostalAddress.postalCode ?? ''} ${row.address.physicalPostalAddress.country ?? ''}`
+                : '',
+          },
+          {
+            field: 'type',
+            headerAlign: 'left',
+            align: 'left',
+            headerName: t('content.companyData.table.type'),
+            flex: 1,
+            valueGetter: ({ row }: { row: CompanyDataType }) =>
+              row.address.addressType === AddressType.SiteMainAddress
+                ? 'S'
+                : 'A',
+          },
+          {
+            field: 'status',
+            headerName: t('content.companyData.table.status'),
+            align: 'left',
+            flex: 1,
+            renderCell: ({ row }: { row: CompanyDataType }) => {
+              if (sharingStates.length > 0) {
                 const status = getStatus(row.externalId)
                 return (
                   <Box
@@ -284,30 +288,30 @@ export const CompanyAddressList = ({
                     />
                   </Box>
                 )
-              },
+              }
             },
-            {
-              field: 'details',
-              headerName: t('content.companyData.table.details'),
-              align: 'left',
-              flex: 1,
-              renderCell: () => {
-                return (
-                  <IconButton
-                    color="secondary"
-                    onClick={() => {
-                      // do nothing
-                    }}
-                  >
-                    <ArrowForwardIcon />
-                  </IconButton>
-                )
-              },
+          },
+          {
+            field: 'details',
+            headerName: t('content.companyData.table.details'),
+            align: 'left',
+            flex: 1,
+            renderCell: () => {
+              return (
+                <IconButton
+                  color="secondary"
+                  onClick={() => {
+                    // do nothing
+                  }}
+                >
+                  <ArrowForwardIcon />
+                </IconButton>
+              )
             },
-          ]}
-          disableColumnMenu
-        />
-      )}
+          },
+        ]}
+        disableColumnMenu
+      />
       {details && (
         <DetailsOverlay
           title={t('content.companyData.label')}