fix: replace logs with appropriate handler

CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## Unreleased
+
+### Bugfixes
+
+- **Error Handling**
+  - Replaced logs with appropriate handler [#1072](https://github.com/eclipse-tractusx/portal-frontend/pull/1072)
+
 ## Unreleased 2.2.0-RC3
 
 ### Feature

src/components/overlays/ActivateServiceSubscription/index.tsx

@@ -40,6 +40,8 @@ import {
   useFetchServiceTechnicalUserProfilesQuery,
 } from 'features/serviceManagement/apiSlice'
 import { Link } from 'react-router-dom'
+import { type LogData } from 'services/LogService'
+import { error } from 'services/NotifyService'
 
 const ProfileHelpURL =
   '/documentation/?path=user%2F05.+Service%28s%29%2F03.+Service+Subscription%2F01.+Service+Subscription.md'
@@ -75,7 +77,7 @@ export default function ActivateserviceSubscription({
     [data]
   )
 
-  const handleConfrim = async () => {
+  const handleConfirm = async () => {
     setLoading(true)
     try {
       const result = await subscribe({
@@ -85,9 +87,9 @@ export default function ActivateserviceSubscription({
       setActivationResponse(true)
       setTechuserInfo(result)
       setLoading(false)
-    } catch (error) {
+    } catch (e) {
       setLoading(false)
-      console.log(error)
+      error('ERROR ON SERVICE SUBSCRIPTION', '', e as LogData)
     }
   }
 
@@ -296,7 +298,7 @@ export default function ActivateserviceSubscription({
                 sx={{ marginLeft: '10px' }}
               />
             ) : (
-              <Button variant="contained" onClick={() => handleConfrim()}>
+              <Button variant="contained" onClick={() => handleConfirm()}>
                 {t('serviceSubscription.register.confirm')}
               </Button>
             )}

src/components/overlays/AddMultipleUser/index.tsx

@@ -66,6 +66,7 @@ import Papa from 'papaparse'
 import { AddUserDeny } from '../AddUser/AddUserDeny'
 import { error } from 'services/NotifyService'
 import ArrowForwardIcon from '@mui/icons-material/ArrowForward'
+import LogService from 'services/LogService'
 
 const HelpPageURL =
   '/documentation/?path=user%2F03.+User+Management%2F01.+User+Account%2F04.+Create+new+user+account+%28bulk%29.md'
@@ -168,10 +169,10 @@ export default function AddMultipleUser() {
       }
       // Add an ESLint exception until there is a solution
       // eslint-disable-next-line
-    } catch (error: any) {
+    } catch (e: any) {
       setLoading(false)
-      setIsError(error.data.errors.document[0])
-      console.log(error)
+      setIsError(e.data.errors.document[0])
+      LogService.error(e as string)
     }
   }
 

src/components/overlays/AddTechnicalUser/index.tsx

@@ -44,6 +44,7 @@ import { ServerResponseOverlay } from '../ServerResponse'
 import ErrorOutlineIcon from '@mui/icons-material/ErrorOutline'
 import HelpOutlineIcon from '@mui/icons-material/HelpOutline'
 import './TechnicalUserAddForm.scss'
+import LogService from 'services/LogService'
 
 export const AddTechnicalUser = () => {
   const { t } = useTranslation()
@@ -63,13 +64,13 @@ export const AddTechnicalUser = () => {
         authenticationType: ServiceAccountType.SECRET,
         roleIds: [formValues.TechnicalUserService],
       }).unwrap()
-      console.log(result)
+      LogService.info('', result)
       setResponse(result)
       setLoading(false)
       setError(false)
       dispatch(updateData(UPDATES.TECHUSER_LIST))
     } catch (err) {
-      console.log(err)
+      LogService.error(err as string)
       setLoading(false)
       setError(true)
     }

src/components/overlays/AddusersIDP/index.tsx

@@ -50,6 +50,7 @@ import {
   FORMS,
   storeForm,
 } from 'features/control/form'
+import { info } from 'services/LogService'
 import { error, success } from 'services/NotifyService'
 import HelpOutlineIcon from '@mui/icons-material/HelpOutline'
 import DownloadIcon from '@mui/icons-material/Download'
@@ -433,10 +434,10 @@ export const AddusersIDP = ({ id }: { id: string }) => {
       }
       const reader = new FileReader()
       reader.onabort = () => {
-        console.log('file reading was aborted')
+        info('file reading was aborted')
       }
       reader.onerror = () => {
-        console.log('file reading has failed')
+        info('file reading has failed')
       }
       reader.onload = () => {
         if (!reader.result) return

src/components/overlays/DeleteTechnicalUser/index.tsx

@@ -32,6 +32,7 @@ import { updateData, UPDATES } from 'features/control/updates'
 import { closeOverlay } from 'features/control/overlay'
 import DeleteUserContent from 'components/shared/basic/DeleteObjectContent'
 import { SuccessErrorType } from 'features/admin/appuserApiSlice'
+import { error } from 'services/LogService'
 
 export const DeleteTechnicalUser = ({ id }: { id: string }) => {
   const { t } = useTranslation()
@@ -82,24 +83,23 @@ export const DeleteTechnicalUser = ({ id }: { id: string }) => {
         })
     } catch (err: unknown) {
       deleteUserError(err)
+      error(err as string)
     }
   }
   return data ? (
-    <>
-      <DeleteUserContent
-        header={`${t('global.actions.delete')} ${t(
-          'global.objects.techuser'
-        )} ${data.name}`}
-        subHeader={t('global.actions.confirmDelete', {
-          object: t('global.objects.techuser'),
-          name: data.name,
-        })}
-        subHeaderTitle={t('global.actions.noteDelete', {
-          object: t('global.objects.techuser'),
-        })}
-        handleConfirm={handleRemove}
-        confirmTitle={t('global.actions.delete')}
-      />
-    </>
+    <DeleteUserContent
+      header={`${t('global.actions.delete')} ${t(
+        'global.objects.techuser'
+      )} ${data.name}`}
+      subHeader={t('global.actions.confirmDelete', {
+        object: t('global.objects.techuser'),
+        name: data.name,
+      })}
+      subHeaderTitle={t('global.actions.noteDelete', {
+        object: t('global.objects.techuser'),
+      })}
+      handleConfirm={handleRemove}
+      confirmTitle={t('global.actions.delete')}
+    />
   ) : null
 }

src/components/overlays/EnableIDP/EnableIDPContent.tsx

@@ -28,6 +28,7 @@ import type { IHashMap } from 'types/MainTypes'
 import { useTranslation } from 'react-i18next'
 import ValidatingInput from 'components/shared/basic/Input/ValidatingInput'
 import { getApiBase } from 'services/EnvironmentService'
+import { error } from 'services/LogService'
 import UserService from 'services/UserService'
 
 const EnableIDPForm = ({
@@ -102,7 +103,7 @@ export const EnableIDPContent = ({
         setUserId(data.userId)
       })
       .catch((e) => {
-        console.log(e)
+        error(e as string)
       })
   }, [identityProviderId, companyUserId])
 

src/components/overlays/EnableIDP/index.tsx

@@ -43,6 +43,7 @@ import { EnableIDPContent } from './EnableIDPContent'
 import { useFetchOwnUserDetailsQuery } from 'features/admin/userApiSlice'
 import { OVERLAYS } from 'types/Constants'
 import { success } from 'services/NotifyService'
+import { error } from 'services/LogService'
 
 export const EnableIDP = ({ id }: { id: string }) => {
   const { t } = useTranslation('idp')
@@ -101,7 +102,7 @@ export const EnableIDP = ({ id }: { id: string }) => {
       }
       setLoading(false)
     } catch (err) {
-      console.log(err)
+      error(err as string)
     }
   }
 

src/components/overlays/UpdateCompanyRole/index.tsx

@@ -54,6 +54,8 @@ import {
 } from 'features/companyRoles/slice'
 import { useFetchFrameDocumentByIdMutation } from 'features/appManagement/apiSlice'
 import uniq from 'lodash.uniq'
+import LogService, { type LogData } from 'services/LogService'
+import { error } from 'services/NotifyService'
 
 export enum AgreementStatus {
   ACTIVE = 'ACTIVE',
@@ -139,8 +141,8 @@ export default function UpdateCompanyRole({ roles }: { roles: string[] }) {
       const fileType = response.headers.get('content-type')
       const file = response.data
       download(file, fileType, documentName)
-    } catch (error) {
-      console.error(error, 'ERROR WHILE FETCHING DOCUMENT')
+    } catch (e) {
+      error('ERROR WHILE FETCHING DOCUMENT', '', e as LogData)
     }
   }
 
@@ -208,8 +210,8 @@ export default function UpdateCompanyRole({ roles }: { roles: string[] }) {
       await updateCompanyRoles(filterRoles).unwrap()
       dispatch(setCompanyRoleSuccess(true))
       close()
-    } catch (error) {
-      console.log(error)
+    } catch (e) {
+      LogService.error(e as string)
       dispatch(setCompanyRoleError(true))
       close()
     }

src/components/pages/Admin/components/RegistrationRequests/CompanyDetailOverlay/index.tsx

@@ -48,6 +48,8 @@ import { getIntro, getTitle } from './CompanyDetailsHelper'
 import { useFetchNewDocumentByIdMutation } from 'features/appManagement/apiSlice'
 import { type UniqueIdType } from 'features/admin/registration/types'
 import { StatusProgress } from '../registrationTableColumns'
+import { type LogData } from 'services/LogService'
+import { error } from 'services/NotifyService'
 
 interface CompanyDetailOverlayProps {
   openDialog?: boolean
@@ -103,8 +105,8 @@ const CompanyDetailOverlay = ({
       const file = response.data
 
       download(file, fileType, documentType)
-    } catch (error) {
-      console.error(error, 'ERROR WHILE FETCHING DOCUMENT')
+    } catch (e) {
+      error('ERROR WHILE FETCHING DOCUMENT', '', e as LogData)
     }
   }
 

src/components/pages/Admin/components/RegistrationRequests/index.tsx

@@ -40,6 +40,7 @@ import ErrorOutlineIcon from '@mui/icons-material/ErrorOutline'
 import AddBpnOveraly from './ConfirmationOverlay/AddBpnOverlay'
 import ConfirmCancelOverlay from './ConfirmationOverlay/ConfirmCancelOverlay'
 import type { AppDispatch } from 'features/store'
+import { info } from 'services/LogService'
 
 enum TableField {
   DETAIL = 'detail',
@@ -104,7 +105,7 @@ export default function RegistrationRequests() {
       await approveRequest(selectedRequestId)
         .unwrap()
         .then((payload) => {
-          console.log('fulfilled', payload)
+          info('fulfilled', payload)
         })
         .catch((error) => {
           setShowErrorAlert(error.data.title)
@@ -116,7 +117,7 @@ export default function RegistrationRequests() {
       })
         .unwrap()
         .then((payload) => {
-          console.log('fulfilled', payload)
+          info('fulfilled', payload)
         })
         .catch((error) => {
           setShowErrorAlert(error.data.title)

src/components/pages/AdminBoardDetail/components/BoardDocuments/index.tsx

@@ -30,6 +30,8 @@ import {
 import { useFetchDocumentByIdMutation } from 'features/apps/apiSlice'
 import { download } from 'utils/downloadUtils'
 import { DocumentTypeId } from 'features/appManagement/apiSlice'
+import { type LogData } from 'services/LogService'
+import { error } from 'services/NotifyService'
 
 export default function BoardDocuments({
   type,
@@ -56,8 +58,8 @@ export default function BoardDocuments({
       const fileType = response.headers.get('content-type')
       const file = response.data
       download(file, fileType, documentName)
-    } catch (error) {
-      console.error(error, 'ERROR WHILE FETCHING DOCUMENT')
+    } catch (e) {
+      error('ERROR WHILE FETCHING DOCUMENT', '', e as LogData)
     }
   }
 

src/components/pages/AdminBoardDetail/components/BoardHeader/index.tsx

@@ -24,6 +24,7 @@ import { useTranslation } from 'react-i18next'
 import type { AppDetails } from 'features/apps/details/types'
 import { useFetchDocumentByIdMutation } from 'features/apps/apiSlice'
 import CommonService from 'services/CommonService'
+import { error } from 'services/LogService'
 import './BoardHeader.scss'
 import { Grid } from '@mui/material'
 
@@ -56,8 +57,8 @@ export default function BoardHeader({ item }: AppDetailHeaderProps) {
       }).unwrap()
       const file = response.data
       setImage(URL.createObjectURL(file))
-    } catch (error) {
-      console.log(error)
+    } catch (e) {
+      error(e as string)
     }
   }
 

src/components/pages/AppDetail/components/AppDetailDocuments/index.tsx

@@ -27,6 +27,8 @@ import { useFetchDocumentByIdMutation } from 'features/apps/apiSlice'
 import { download } from 'utils/downloadUtils'
 import '../../AppDetail.scss'
 import { DocumentTypeId } from 'features/appManagement/apiSlice'
+import { error } from 'services/NotifyService'
+import { type LogData } from 'services/LogService'
 
 export default function AppDetailDocuments({ item }: { item: AppDetails }) {
   const { t } = useTranslation()
@@ -45,8 +47,8 @@ export default function AppDetailDocuments({ item }: { item: AppDetails }) {
       const fileType = response.headers.get('content-type')
       const file = response.data
       download(file, fileType, documentName)
-    } catch (error) {
-      console.error(error, 'ERROR WHILE FETCHING DOCUMENT')
+    } catch (e) {
+      error('ERROR WHILE FETCHING DOCUMENT', '', e as LogData)
     }
   }
   return (

src/components/pages/AppDetail/components/AppDetailHeader/index.tsx

@@ -35,6 +35,7 @@ import { useEffect, useState } from 'react'
 import { SubscriptionStatus } from 'features/apps/types'
 import { useFetchDocumentByIdMutation } from 'features/apps/apiSlice'
 import CommonService from 'services/CommonService'
+import { error } from 'services/LogService'
 import type { UseCaseType } from 'features/appManagement/types'
 import type { RootState } from 'features/store'
 
@@ -181,8 +182,8 @@ export default function AppDetailHeader({ item }: AppDetailHeaderProps) {
       }).unwrap()
       const file = response.data
       setImage(URL.createObjectURL(file))
-    } catch (error) {
-      console.log(error)
+    } catch (e) {
+      error(e as string)
     }
   }
 

src/components/pages/AppMarketplace/components/FavoriteSection/FavoriteItem.tsx

@@ -27,6 +27,8 @@ import { useDispatch } from 'react-redux'
 import CommonService from 'services/CommonService'
 import type { AppDispatch } from 'features/store'
 import { useFetchDocumentByIdMutation } from 'features/apps/apiSlice'
+import { error } from 'services/LogService'
+
 interface FavoriteItemProps {
   // Add an ESLint exception until there is a solution
   // eslint-disable-next-line
@@ -65,8 +67,8 @@ export default function FavoriteItem({
         documentId: id,
       }).unwrap()
       setCardImage(URL.createObjectURL(result.data))
-    } catch (error) {
-      console.log(error)
+    } catch (e) {
+      error(e as string)
     }
   }
 

src/components/pages/AppOverview/AddRolesOverlay.tsx

@@ -41,6 +41,7 @@ import { useState } from 'react'
 import { useUpdateActiveAppMutation } from 'features/appManagement/apiSlice'
 import { useNavigate } from 'react-router-dom'
 import { error, success } from 'services/NotifyService'
+import { info } from 'services/LogService'
 
 interface AddRolesOverlayProps {
   openDialog: boolean
@@ -79,10 +80,10 @@ const AddRolesOverlay = ({
       .forEach((file: File) => {
         const reader = new FileReader()
         reader.onerror = () => {
-          console.log('file reading has failed')
+          info('file reading has failed')
         }
         reader.onabort = () => {
-          console.log('file reading was aborted')
+          info('file reading was aborted')
         }
         reader.onload = () => {
           const str = reader.result