fix(company data): address review comments

eclipse-tractusx · May 8, 2024 · 8d66661 · 8d66661
1 parent 6070f22
commit 8d66661
Show file tree

Hide file tree

Showing 4 changed files with 114 additions and 99 deletions.
diff --git a/src/components/pages/CompanyData/components/CompanyAddressList.tsx b/src/components/pages/CompanyData/components/CompanyAddressList.tsx
@@ -40,6 +40,7 @@ import {
   setSelectedCompanyData,
   setSelectedCompanyStatus,
 } from 'features/companyData/slice'
+import LoadingProgress from 'components/shared/basic/LoadingProgress'
 
 export const CompanyAddressList = ({
   handleButtonClick,
@@ -94,10 +95,9 @@ export const CompanyAddressList = ({
     getOutputItems()
   }, [sharingStates])
 
-  const getStatus = (id: string) => {
-    return sharingStates?.filter((state) => id === state.externalId)[0]
+  const getStatus = (id: string) =>
+    sharingStates?.filter((state) => id === state.externalId)[0]
       .sharingStateType
-  }
 
   const onRowClick = (params: GridCellParams) => {
     const status = getStatus(params.row.externalId)
@@ -108,98 +108,109 @@ export const CompanyAddressList = ({
 
   return (
     <>
-      <Table
-        autoFocus={false}
-        onButtonClick={handleButtonClick}
-        rowsCount={inputs.length + outputs.length}
-        buttonLabel={t('content.companyData.table.buttonAddress')}
-        secondButtonLabel={t('content.companyData.table.buttonSite')}
-        onSecondButtonClick={handleSecondButtonClick}
-        toolbarVariant="premium"
-        searchPlaceholder={t('content.companyData.table.search')}
-        columnHeadersBackgroundColor={'#FFFFFF'}
-        searchInputData={searchInputData}
-        searchExpr={searchExpr}
-        onSearch={(expr: string) => {
-          setSearchExpr(expr)
-        }}
-        searchDebounce={1000}
-        noRowsMsg={t('content.companyData.table.noRowsMsg')}
-        title={t('content.companyData.table.title')}
-        getRowId={(row: { [key: string]: string }) => row.externalId}
-        rows={inputs.concat(outputs)}
-        onCellClick={onRowClick}
-        columns={[
-          {
-            field: 'site',
-            headerAlign: 'center',
-            align: 'center',
-            headerName: t('content.companyData.table.site'),
-            flex: 1,
-            valueGetter: ({ row }: { row: CompanyDataType }) => row.site.name,
-          },
-          {
-            field: 'address',
-            headerAlign: 'center',
-            align: 'center',
-            headerName: t('content.companyData.table.location'),
-            flex: 2,
-            valueGetter: ({ row }: { row: CompanyDataType }) =>
-              `${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: 'status',
-            headerName: '',
-            align: 'center',
-            flex: 1,
-            renderCell: ({ row }: { row: CompanyDataType }) => {
-              const status = getStatus(row.externalId)
-              return (
-                <Box
-                  sx={{
-                    display: 'flex',
-                    alignItems: 'center',
-                  }}
-                >
-                  {status === SharingStateStatusType.Success && (
-                    <CheckCircleIcon />
-                  )}
-                  {status === SharingStateStatusType.Pending && (
-                    <HourglassBottomIcon />
-                  )}
-                  {status === SharingStateStatusType.Ready && (
-                    <WarningAmberIcon />
-                  )}
-                  <Typography
+      {inputs.length > 0 || outputs.length > 0 ? (
+        <Table
+          autoFocus={false}
+          onButtonClick={handleButtonClick}
+          rowsCount={inputs.length + outputs.length}
+          buttonLabel={t('content.companyData.table.buttonAddress')}
+          secondButtonLabel={t('content.companyData.table.buttonSite')}
+          onSecondButtonClick={handleSecondButtonClick}
+          toolbarVariant="premium"
+          searchPlaceholder={t('content.companyData.table.search')}
+          columnHeadersBackgroundColor={'#FFFFFF'}
+          searchInputData={searchInputData}
+          searchExpr={searchExpr}
+          onSearch={(expr: string) => {
+            setSearchExpr(expr)
+          }}
+          searchDebounce={1000}
+          noRowsMsg={t('content.companyData.table.noRowsMsg')}
+          title={t('content.companyData.table.title')}
+          getRowId={(row: { [key: string]: string }) => row.externalId}
+          rows={inputs.concat(outputs)}
+          onCellClick={onRowClick}
+          columns={[
+            {
+              field: 'site',
+              headerAlign: 'center',
+              align: 'center',
+              headerName: t('content.companyData.table.site'),
+              flex: 1,
+              valueGetter: ({ row }: { row: CompanyDataType }) => row.site.name,
+            },
+            {
+              field: 'address',
+              headerAlign: 'center',
+              align: 'center',
+              headerName: t('content.companyData.table.location'),
+              flex: 2,
+              valueGetter: ({ row }: { row: CompanyDataType }) =>
+                `${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: 'status',
+              headerName: '',
+              align: 'center',
+              flex: 1,
+              renderCell: ({ row }: { row: CompanyDataType }) => {
+                const status = getStatus(row.externalId)
+                return (
+                  <Box
                     sx={{
-                      marginLeft: '10px',
+                      display: 'flex',
+                      alignItems: 'center',
                     }}
-                    variant="body3"
                   >
-                    {status}
-                  </Typography>
-                </Box>
-              )
+                    {status === SharingStateStatusType.Success && (
+                      <CheckCircleIcon />
+                    )}
+                    {status === SharingStateStatusType.Pending && (
+                      <HourglassBottomIcon />
+                    )}
+                    {status === SharingStateStatusType.Ready && (
+                      <WarningAmberIcon />
+                    )}
+                    <Typography
+                      sx={{
+                        marginLeft: '10px',
+                      }}
+                      variant="body3"
+                    >
+                      {status}
+                    </Typography>
+                  </Box>
+                )
+              },
             },
-          },
-          {
-            field: 'details',
-            headerName: '',
-            align: 'center',
-            flex: 0.5,
-            renderCell: () => {
-              return (
-                <ArrowForwardIcon
-                  sx={{
-                    cursor: 'pointer',
-                  }}
-                />
-              )
+            {
+              field: 'details',
+              headerName: '',
+              align: 'center',
+              flex: 0.5,
+              renderCell: () => {
+                return (
+                  <ArrowForwardIcon
+                    sx={{
+                      cursor: 'pointer',
+                    }}
+                  />
+                )
+              },
             },
-          },
-        ]}
-        disableColumnMenu
-      />
+          ]}
+          disableColumnMenu
+        />
+      ) : (
+        <Box
+          sx={{
+            display: 'flex',
+            justifyContent: 'center',
+          }}
+        >
+          <LoadingProgress />
+        </Box>
+      )}
       {details && (
         <DetailsOverlay
           title={t('content.companyData.label')}

diff --git a/src/components/pages/CompanyData/components/CreateAddress/AddressForm.tsx b/src/components/pages/CompanyData/components/CreateAddress/AddressForm.tsx
@@ -63,7 +63,6 @@ const UpdateForm = ({
           validate={(expr) => isName(expr)}
           hint={t('content.companyData.address.form.companySite.hint')}
           errorMessage={t('content.companyData.address.form.companySite.hint')}
-          debounceTime={0}
           onValid={onChange}
           onInvalid={onChange}
         />

diff --git a/src/components/pages/CompanyData/components/StatusInformation.tsx b/src/components/pages/CompanyData/components/StatusInformation.tsx
@@ -25,12 +25,19 @@ import { useSelector } from 'react-redux'
 import HourglassBottomIcon from '@mui/icons-material/HourglassBottom'
 import WarningAmberIcon from '@mui/icons-material/WarningAmber'
 import CheckCircleIcon from '@mui/icons-material/CheckCircle'
-import { SharingStateStatusType } from 'features/companyData/companyDataApiSlice'
 
 export default function StatusInformation() {
   const { t } = useTranslation()
   const status = useSelector(statusSelector)
 
+  const statusIcon: Record<string, JSX.Element> = {
+    Success: <CheckCircleIcon />,
+    Pending: <HourglassBottomIcon />,
+    Ready: <WarningAmberIcon />,
+    Initial: <WarningAmberIcon />,
+    Error: <WarningAmberIcon />,
+  }
+
   return (
     <Box
       sx={{
@@ -57,9 +64,7 @@ export default function StatusInformation() {
           marginLeft: '20%',
         }}
       >
-        {status === SharingStateStatusType.Success && <CheckCircleIcon />}
-        {status === SharingStateStatusType.Pending && <HourglassBottomIcon />}
-        {status === SharingStateStatusType.Ready && <WarningAmberIcon />}
+        {statusIcon[status]}
         <Typography
           sx={{
             marginLeft: '10px',

diff --git a/src/features/newPartnerNetwork/partnerNetworkApiSlice.ts b/src/features/newPartnerNetwork/partnerNetworkApiSlice.ts
@@ -45,7 +45,7 @@ export const apiSlice = createApi({
       BusinessPartnerRequest
     >({
       query: (body) => ({
-        url: '/pool/api/catena/legal-entities/legal-addresses/search',
+        url: '/pool/v6/legal-entities/search?page=0&size=30',
         method: 'POST',
         body,
       }),
@@ -56,13 +56,13 @@ export const apiSlice = createApi({
     >({
       query: (fetchArgs) => {
         if (fetchArgs.args.expr && !checkIfBPNLNumber(fetchArgs.args.expr)) {
-          return `/pool/api/catena/legal-entities?page=${
+          return `/pool/v6/legal-entities?page=${
             fetchArgs.page
           }&size=10&legalName=${fetchArgs.args!.expr}`
         } else if (checkIfBPNLNumber(fetchArgs.args.expr)) {
-          return `/pool/api/catena/legal-entities/${fetchArgs.args!.expr}`
+          return `/pool/v6/legal-entities/${fetchArgs.args!.expr}`
         } else {
-          return `/pool/api/catena/legal-entities?page=${fetchArgs.page}&size=10`
+          return `/pool/v6/legal-entities?page=${fetchArgs.page}&size=10`
         }
       },
       // Add an ESLint exception until there is a solution