diff --git a/libs/i18n/locales/en/translation.json b/libs/i18n/locales/en/translation.json index 2e6cc3115..e2eb74ddf 100644 --- a/libs/i18n/locales/en/translation.json +++ b/libs/i18n/locales/en/translation.json @@ -247,13 +247,13 @@ "You are about to resume device <1>{deviceNameOrAlias}": "You are about to resume device <1>{deviceNameOrAlias}", "Actions dropdown": "Actions dropdown", "Actions": "Actions", + "No applications found": "No applications found", "Device applications table": "Device applications table", "Ready": "Ready", "Restarts": "Restarts", "Embedded": "Embedded", "Yes": "Yes", "No": "No", - "No applications found": "No applications found", "Reason": "Reason", "Message": "Message", "No conditions found": "No conditions found", diff --git a/libs/ui-components/src/components/DetailsPage/Tables/ApplicationsTable.tsx b/libs/ui-components/src/components/DetailsPage/Tables/ApplicationsTable.tsx index ad9bee661..1076584ee 100644 --- a/libs/ui-components/src/components/DetailsPage/Tables/ApplicationsTable.tsx +++ b/libs/ui-components/src/components/DetailsPage/Tables/ApplicationsTable.tsx @@ -7,34 +7,17 @@ import { useTranslation } from '../../../hooks/useTranslation'; import ApplicationStatus from '../../Status/ApplicationStatus'; type ApplicationsTableProps = { - // Contains the statuses of all detected applications appsStatus: DeviceApplicationStatus[]; - // List of apps as defined the device / fleet spec - specApps: string[]; }; -const emptyAppDetails: Partial = { - name: '', - ready: '-', - restarts: 0, - embedded: false, -}; - -const ApplicationsTable = ({ appsStatus, specApps }: ApplicationsTableProps) => { +const ApplicationsTable = ({ appsStatus }: ApplicationsTableProps) => { const { t } = useTranslation(); - // Includes applications already reported in status as well as those that are only in the spec yet - const allAppNames: string[] = []; - specApps.forEach((app) => { - allAppNames.push(app); - }); - appsStatus.forEach((appStatus) => { - if (!allAppNames.includes(appStatus.name)) { - allAppNames.push(appStatus.name); - } - }); + if (appsStatus.length === 0) { + return {t('No applications found')}; + } - return allAppNames.length ? ( + return ( @@ -47,34 +30,22 @@ const ApplicationsTable = ({ appsStatus, specApps }: ApplicationsTableProps) => - {allAppNames.map((appName) => { - const appDetails = appsStatus.find((app) => app.name === appName) || emptyAppDetails; - let embedded = '-'; - if (appDetails.embedded === true) { - embedded = t('Yes'); - } else if (appDetails.embedded === false) { - embedded = t('No'); - } - + {appsStatus.map((app) => { return ( - - + + - - - - + + + + ); })}
{appName}
{app.name} - {appDetails.status ? : '-'} - {appDetails.ready}{appDetails.restarts} - {appDetails.appType ? : '-'} + {embedded}{app.ready}{app.restarts}{app.appType ? : '-'}{app.embedded ? t('Yes') : t('No')}
- ) : ( - {t('No applications found')} ); }; diff --git a/libs/ui-components/src/components/Device/DeviceDetails/DeviceApplications.tsx b/libs/ui-components/src/components/Device/DeviceDetails/DeviceApplications.tsx index e54c4220b..adbd0e686 100644 --- a/libs/ui-components/src/components/Device/DeviceDetails/DeviceApplications.tsx +++ b/libs/ui-components/src/components/Device/DeviceDetails/DeviceApplications.tsx @@ -5,7 +5,6 @@ import { Device } from '@flightctl/types'; import { useTranslation } from '../../../hooks/useTranslation'; import ApplicationsTable from '../../DetailsPage/Tables/ApplicationsTable'; import DetailsPageCard, { DetailsPageCardBody } from '../../DetailsPage/DetailsPageCard'; -import { isImageAppProvider } from '../../../types/deviceSpec'; type DeviceDetailsTabProps = { device: Required; @@ -14,14 +13,6 @@ type DeviceDetailsTabProps = { const DeviceApplications = ({ device }: DeviceDetailsTabProps) => { const { t } = useTranslation(); - const specApps = - device.spec?.applications?.map((app) => { - if (isImageAppProvider(app)) { - return app.name || app.image; - } - return app.name as string; - }) || []; - return ( @@ -30,7 +21,7 @@ const DeviceApplications = ({ device }: DeviceDetailsTabProps) => { - + );