diff --git a/public/locales/en-US.json b/public/locales/en-US.json index 772b1bab8..1a1030dc2 100644 --- a/public/locales/en-US.json +++ b/public/locales/en-US.json @@ -47,6 +47,14 @@ "tableEmptyInventoryTitle": "No results found", "tableEmptyInventoryMessage": "No results match the filter criteria. Remove filters or clear all filters to show results.", "tableSkeletonAriaLabel": "Loading", + "label_numberOfGuests": "<0>{{value}} VMs", + "cloudProvider": "{{context}}", + "cloudProvider_aws": "AWS", + "cloudProvider_azure": "Azure", + "cloudProvider_google": "Google", + "cloudProvider_ibm": "IBM", + "hardwareType": "{{context}}", + "hardwareType_cloud": "Public cloud", "hardwareType_hypervisor": "Hypervisor", "hardwareType_physical": "Physical", "hardwareType_virtualized": "Virtual", diff --git a/src/components/i18n/__tests__/__snapshots__/i18n.test.js.snap b/src/components/i18n/__tests__/__snapshots__/i18n.test.js.snap index 5e21cc8d8..f9341f1f3 100644 --- a/src/components/i18n/__tests__/__snapshots__/i18n.test.js.snap +++ b/src/components/i18n/__tests__/__snapshots__/i18n.test.js.snap @@ -213,10 +213,22 @@ Array [ "key": "curiosity-inventory.cardHeading", "match": "t('curiosity-inventory.cardHeading')", }, + Object { + "key": "curiosity-inventory.label", + "match": "translate('curiosity-inventory.label', { context: 'numberOfGuests', value: numberOfGuests.value }, [ ])", + }, + Object { + "key": "curiosity-inventory.label", + "match": "translate('curiosity-inventory.label', { context: 'numberOfGuests', value: numberOfGuests.value }, [ ])", + }, Object { "key": "curiosity-inventory.hardwareType", "match": "translate('curiosity-inventory.hardwareType', { context: hardwareType.value })", }, + Object { + "key": "curiosity-inventory.cloudProvider", + "match": "translate('curiosity-inventory.cloudProvider', { context: cloudProvider.value })", + }, ], }, Object { @@ -320,10 +332,22 @@ Array [ "key": "curiosity-inventory.cardHeading", "match": "t('curiosity-inventory.cardHeading')", }, + Object { + "key": "curiosity-inventory.label", + "match": "translate('curiosity-inventory.label', { context: 'numberOfGuests', value: numberOfGuests.value }, [ ])", + }, + Object { + "key": "curiosity-inventory.label", + "match": "translate('curiosity-inventory.label', { context: 'numberOfGuests', value: numberOfGuests.value }, [ ])", + }, Object { "key": "curiosity-inventory.hardwareType", "match": "translate('curiosity-inventory.hardwareType', { context: hardwareType.value })", }, + Object { + "key": "curiosity-inventory.cloudProvider", + "match": "translate('curiosity-inventory.cloudProvider', { context: cloudProvider.value })", + }, ], }, Object { @@ -462,11 +486,19 @@ Array [ }, Object { "file": "./src/components/openshiftView/openshiftView.js", - "key": "curiosity-inventory.hardwareType", + "key": "curiosity-inventory.label", + }, + Object { + "file": "./src/components/openshiftView/openshiftView.js", + "key": "curiosity-inventory.label", + }, + Object { + "file": "./src/components/rhelView/rhelView.js", + "key": "curiosity-inventory.label", }, Object { "file": "./src/components/rhelView/rhelView.js", - "key": "curiosity-inventory.hardwareType", + "key": "curiosity-inventory.label", }, ] `; diff --git a/src/components/openshiftView/__tests__/__snapshots__/openshiftView.test.js.snap b/src/components/openshiftView/__tests__/__snapshots__/openshiftView.test.js.snap index 010cf9ab0..320d054f3 100644 --- a/src/components/openshiftView/__tests__/__snapshots__/openshiftView.test.js.snap +++ b/src/components/openshiftView/__tests__/__snapshots__/openshiftView.test.js.snap @@ -379,15 +379,15 @@ Object { exports[`OpenshiftView Component should have default props that set product configuration: filteredInventoryData results 1`] = ` Object { "cells": Array [ - "lorem", + + lorem + + t(curiosity-inventory.label, [object Object], [object Object]) + , t(curiosity-inventory.hardwareType, [object Object]) - - 3 - + , 10, 12, @@ -450,15 +450,13 @@ Object { variant="link" > lorem + + t(curiosity-inventory.label, [object Object], [object Object]) , t(curiosity-inventory.hardwareType, [object Object]) - - 3 - + , 10, 12, diff --git a/src/components/openshiftView/openshiftView.js b/src/components/openshiftView/openshiftView.js index 1d676cffd..5b9031fde 100644 --- a/src/components/openshiftView/openshiftView.js +++ b/src/components/openshiftView/openshiftView.js @@ -4,7 +4,7 @@ import { chart_color_blue_100 as chartColorBlueLight, chart_color_blue_300 as chartColorBlueDark } from '@patternfly/react-tokens'; -import { Badge, Button } from '@patternfly/react-core'; +import { Button, Label as PfLabel } from '@patternfly/react-core'; import { DateFormat } from '@redhat-cloud-services/frontend-components/components/cjs/DateFormat'; import { PageLayout, PageHeader, PageSection, PageToolbar } from '../pageLayout/pageLayout'; import { @@ -286,14 +286,14 @@ OpenshiftView.defaultProps = { }, { id: 'lastSeen', - cell: obj => (obj?.lastSeen?.value && ) || '' + cell: data => (data?.lastSeen?.value && ) || '' } ], initialInventoryFilters: [ { id: 'displayName', cell: (data, session) => { - const { displayName, inventoryId } = data; + const { displayName, inventoryId, numberOfGuests } = data; const { inventory: authorized } = session?.authorized || {}; if (!inventoryId?.value) { @@ -301,7 +301,16 @@ OpenshiftView.defaultProps = { } if (!authorized) { - return displayName?.value || inventoryId?.value; + return ( + + {displayName?.value || inventoryId?.value}{' '} + {(numberOfGuests.value && + translate('curiosity-inventory.label', { context: 'numberOfGuests', value: numberOfGuests.value }, [ + + ])) || + ''} + + ); } return ( @@ -312,7 +321,12 @@ OpenshiftView.defaultProps = { target="_blank" href={`${helpers.UI_DEPLOY_PATH_PREFIX}/insights/inventory/${inventoryId.value}/`} > - {displayName.value || inventoryId.value} + {displayName.value || inventoryId.value}{' '} + {(numberOfGuests.value && + translate('curiosity-inventory.label', { context: 'numberOfGuests', value: numberOfGuests.value }, [ + + ])) || + ''} ); }, @@ -320,12 +334,17 @@ OpenshiftView.defaultProps = { }, { id: 'hardwareType', - cell: obj => { - const { hardwareType, numberOfGuests } = obj; + cell: data => { + const { cloudProvider, hardwareType } = data; return ( {translate('curiosity-inventory.hardwareType', { context: hardwareType.value })}{' '} - {(numberOfGuests.value && {numberOfGuests.value}) || ''} + {(cloudProvider?.value && ( + + {translate('curiosity-inventory.cloudProvider', { context: cloudProvider.value })} + + )) || + ''} ); }, @@ -343,7 +362,7 @@ OpenshiftView.defaultProps = { }, { id: 'lastSeen', - cell: obj => (obj?.lastSeen?.value && ) || '', + cell: data => (data?.lastSeen?.value && ) || '', isSortable: true } ], diff --git a/src/components/rhelView/__tests__/__snapshots__/rhelView.test.js.snap b/src/components/rhelView/__tests__/__snapshots__/rhelView.test.js.snap index c2fa766f2..1c7a8a092 100644 --- a/src/components/rhelView/__tests__/__snapshots__/rhelView.test.js.snap +++ b/src/components/rhelView/__tests__/__snapshots__/rhelView.test.js.snap @@ -349,15 +349,15 @@ Object { exports[`RhelView Component should have default props that set product configuration: filteredInventoryData results 1`] = ` Object { "cells": Array [ - "lorem", + + lorem + + t(curiosity-inventory.label, [object Object], [object Object]) + , t(curiosity-inventory.hardwareType, [object Object]) - - 3 - + , 10, lorem + + t(curiosity-inventory.label, [object Object], [object Object]) , t(curiosity-inventory.hardwareType, [object Object]) - - 3 - + , 10, (obj?.lastSeen?.value && ) || '' + cell: data => (data?.lastSeen?.value && ) || '' } ], initialInventoryFilters: [ { id: 'displayName', cell: (data, session) => { - const { displayName, inventoryId } = data; + const { displayName, inventoryId, numberOfGuests } = data; const { inventory: authorized } = session?.authorized || {}; if (!inventoryId?.value) { @@ -223,7 +223,16 @@ RhelView.defaultProps = { } if (!authorized) { - return displayName?.value || inventoryId?.value; + return ( + + {displayName?.value || inventoryId?.value}{' '} + {(numberOfGuests.value && + translate('curiosity-inventory.label', { context: 'numberOfGuests', value: numberOfGuests.value }, [ + + ])) || + ''} + + ); } return ( @@ -234,7 +243,12 @@ RhelView.defaultProps = { target="_blank" href={`${helpers.UI_DEPLOY_PATH_PREFIX}/insights/inventory/${inventoryId.value}/`} > - {displayName.value || inventoryId.value} + {displayName.value || inventoryId.value}{' '} + {(numberOfGuests.value && + translate('curiosity-inventory.label', { context: 'numberOfGuests', value: numberOfGuests.value }, [ + + ])) || + ''} ); }, @@ -242,12 +256,17 @@ RhelView.defaultProps = { }, { id: 'hardwareType', - cell: obj => { - const { hardwareType, numberOfGuests } = obj; + cell: data => { + const { cloudProvider, hardwareType } = data; return ( {translate('curiosity-inventory.hardwareType', { context: hardwareType.value })}{' '} - {(numberOfGuests.value && {numberOfGuests.value}) || ''} + {(cloudProvider?.value && ( + + {translate('curiosity-inventory.cloudProvider', { context: cloudProvider.value })} + + )) || + ''} ); }, @@ -259,7 +278,7 @@ RhelView.defaultProps = { }, { id: 'lastSeen', - cell: obj => (obj?.lastSeen?.value && ) || '', + cell: data => (data?.lastSeen?.value && ) || '', isSortable: true } ], diff --git a/src/redux/selectors/__tests__/__snapshots__/inventoryListSelectors.test.js.snap b/src/redux/selectors/__tests__/__snapshots__/inventoryListSelectors.test.js.snap index ba84a67f6..1c7d24df6 100644 --- a/src/redux/selectors/__tests__/__snapshots__/inventoryListSelectors.test.js.snap +++ b/src/redux/selectors/__tests__/__snapshots__/inventoryListSelectors.test.js.snap @@ -19,6 +19,7 @@ Object { "itemCount": 0, "listData": Array [ Object { + "cloudProvider": null, "cores": 2, "displayName": "db.lorem.com", "hardwareType": "physical", @@ -30,6 +31,7 @@ Object { "subscriptionManagerId": null, }, Object { + "cloudProvider": null, "cores": 2, "displayName": "db.ipsum.com", "hardwareType": "physical", @@ -80,6 +82,7 @@ Object { "itemCount": 0, "listData": Array [ Object { + "cloudProvider": null, "cores": 2, "displayName": "db.ipsum.com", "hardwareType": "physical", @@ -106,6 +109,7 @@ Object { "itemCount": 0, "listData": Array [ Object { + "cloudProvider": null, "cores": 2, "displayName": "db.lorem.com", "hardwareType": "physical", @@ -132,6 +136,7 @@ Object { "itemCount": 0, "listData": Array [ Object { + "cloudProvider": null, "cores": 2, "displayName": "db.lorem.com", "hardwareType": "physical", @@ -158,6 +163,7 @@ Object { "itemCount": 0, "listData": Array [ Object { + "cloudProvider": null, "cores": 2, "displayName": "db.ipsum.com", "hardwareType": "physical", @@ -184,6 +190,7 @@ Object { "itemCount": 0, "listData": Array [ Object { + "cloudProvider": null, "cores": 2, "displayName": null, "hardwareType": null, @@ -195,6 +202,7 @@ Object { "subscriptionManagerId": null, }, Object { + "cloudProvider": null, "cores": null, "displayName": "db.example.com", "hardwareType": "physical", diff --git a/src/redux/selectors/inventoryListSelectors.js b/src/redux/selectors/inventoryListSelectors.js index 243f05116..0a67b69a3 100644 --- a/src/redux/selectors/inventoryListSelectors.js +++ b/src/redux/selectors/inventoryListSelectors.js @@ -96,6 +96,7 @@ const selector = createDeepEqualSelector([statePropsFilter, queryFilter], (respo // Apply "display logic" then return a custom value for entries const customInventoryValue = ({ key, value }) => { switch (key) { + case rhsmApiTypes.RHSM_API_RESPONSE_INVENTORY_DATA_TYPES.CLOUD_PROVIDER: case rhsmApiTypes.RHSM_API_RESPONSE_INVENTORY_DATA_TYPES.HARDWARE: return value?.toLowerCase() || null; case rhsmApiTypes.RHSM_API_RESPONSE_INVENTORY_DATA_TYPES.LAST_SEEN: diff --git a/src/services/rhsmServices.js b/src/services/rhsmServices.js index b145d7279..079a19aad 100644 --- a/src/services/rhsmServices.js +++ b/src/services/rhsmServices.js @@ -951,7 +951,7 @@ const getGraphCapacity = (id, params = {}) => * "subscription_manager_id": "b6028fa4-cd26-449a-b122-123456789012", * "cores": 4, * "sockets": 2, - * "hardware_type": "VIRTUAL", + * "hardware_type": "VIRTUALIZED", * "number_of_guests": 70, * "last_seen": "2020-04-01T00:00:00Z" * }, @@ -959,9 +959,10 @@ const getGraphCapacity = (id, params = {}) => * "insights_id": "499cff02-8b4b-46f8-a6xx-56043FFF0d2e", * "inventory_id": "499cff02-8b4b-46f8-a6xx-56043FFF0d2e", * "subscription_manager_id": "b6028fa4-cd26-449a-b123-56043FFF0d2e", + * "cloud_provider": "AZURE", * "cores": 4, * "sockets": 6, - * "hardware_type": "PHYSICAL", + * "hardware_type": "CLOUD", * "number_of_guests": 0, * "last_seen": "2020-06-20T00:00:00Z" * }, @@ -972,7 +973,7 @@ const getGraphCapacity = (id, params = {}) => * "subscription_manager_id": "b6028fa4-cd26-449a-b122-abcdefghijklm", * "cores": 4, * "sockets": 2, - * "hardware_type": "VIRTUAL", + * "hardware_type": "VIRTUALIZED", * "number_of_guests": 10, * "last_seen": "2020-04-02T00:00:00Z" * }, @@ -983,7 +984,7 @@ const getGraphCapacity = (id, params = {}) => * "subscription_manager_id": "b6028fa4-cd26-449a-b122-nopqrstuvxyzab", * "cores": 4, * "sockets": 2, - * "hardware_type": "VIRTUAL", + * "hardware_type": "VIRTUALIZED", * "number_of_guests": 1, * "last_seen": "2020-04-02T00:00:00Z" * }, diff --git a/src/types/__tests__/__snapshots__/index.test.js.snap b/src/types/__tests__/__snapshots__/index.test.js.snap index 2b04a0204..159364386 100644 --- a/src/types/__tests__/__snapshots__/index.test.js.snap +++ b/src/types/__tests__/__snapshots__/index.test.js.snap @@ -144,6 +144,7 @@ Object { }, "RHSM_API_RESPONSE_INVENTORY_DATA": "data", "RHSM_API_RESPONSE_INVENTORY_DATA_TYPES": Object { + "CLOUD_PROVIDER": "cloud_provider", "CORES": "cores", "GUESTS": "number_of_guests", "HARDWARE": "hardware_type", @@ -329,6 +330,7 @@ Object { }, "RHSM_API_RESPONSE_INVENTORY_DATA": "data", "RHSM_API_RESPONSE_INVENTORY_DATA_TYPES": Object { + "CLOUD_PROVIDER": "cloud_provider", "CORES": "cores", "GUESTS": "number_of_guests", "HARDWARE": "hardware_type", @@ -513,6 +515,7 @@ Object { }, "RHSM_API_RESPONSE_INVENTORY_DATA": "data", "RHSM_API_RESPONSE_INVENTORY_DATA_TYPES": Object { + "CLOUD_PROVIDER": "cloud_provider", "CORES": "cores", "GUESTS": "number_of_guests", "HARDWARE": "hardware_type", @@ -701,6 +704,7 @@ Object { }, "RHSM_API_RESPONSE_INVENTORY_DATA": "data", "RHSM_API_RESPONSE_INVENTORY_DATA_TYPES": Object { + "CLOUD_PROVIDER": "cloud_provider", "CORES": "cores", "GUESTS": "number_of_guests", "HARDWARE": "hardware_type", diff --git a/src/types/rhsmApiTypes.js b/src/types/rhsmApiTypes.js index 966767271..982cc7886 100644 --- a/src/types/rhsmApiTypes.js +++ b/src/types/rhsmApiTypes.js @@ -102,9 +102,11 @@ const RHSM_API_RESPONSE_INVENTORY_DATA = 'data'; * RHSM response inventory DATA types. * Schema/map of expected inventory DATA response properties. * - * @type {{CORES: string, HARDWARE: string, SOCKETS: string, ID: string, NAME: string, LAST_SEEN: string}} + * @type {{CORES: string, HARDWARE: string, SOCKETS: string, SUBSCRIPTION_ID: string, INVENTORY_ID: string, + * ID: string, GUESTS: string, CLOUD_PROVIDER: string, LAST_SEEN: string, NAME: string}} */ const RHSM_API_RESPONSE_INVENTORY_DATA_TYPES = { + CLOUD_PROVIDER: 'cloud_provider', CORES: 'cores', GUESTS: 'number_of_guests', HARDWARE: 'hardware_type', @@ -325,22 +327,26 @@ const RHSM_API_QUERY_TYPES = { * RHSM_API_RESPONSE_PRODUCTS_DATA: string, RHSM_API_QUERY_TYPES: {GRANULARITY: string, TALLY_SYNC: string, * DIRECTION: string, END_DATE: string, SLA: string, START_DATE: string, LIMIT: string, UOM: string, * TALLY_REPORT: string, USAGE: string, SORT: string, OFFSET: string, CONDUIT_SYNC: string}, - * RHSM_API_RESPONSE_LINKS: string, RHSM_API_QUERY_SET_INVENTORY_GUESTS_TYPES: {OFFSET: string, LIMIT: string}, - * RHSM_API_PATH_ID_TYPES: {RHEL_ARM: string, RHEL_WORKSTATION: string, RHEL_DESKTOP: string, RHEL: string, - * RHEL_SERVER: string, RHEL_IBM_Z: string, RHEL_COMPUTE_NODE: string, RHEL_IBM_POWER: string, RHEL_X86: string, - * OPENSHIFT: string}, RHSM_API_QUERY_SET_OPTIN_TYPES: {TALLY_SYNC: string, TALLY_REPORT: string, - * CONDUIT_SYNC: string}, RHSM_API_QUERY_USAGE_TYPES: {UNSPECIFIED: string, DISASTER: string, DEVELOPMENT: string, - * PRODUCTION: string}, RHSM_API_QUERY_SLA_TYPES: {PREMIUM: string, SELF: string, NONE: string, STANDARD: string}, - * RHSM_API_QUERY_SET_INVENTORY_TYPES: {UOM: string, USAGE: string, DIRECTION: string, SORT: string, OFFSET: string, - * SLA: string, LIMIT: string}, RHSM_API_QUERY_SORT_TYPES: {CORES: string, DATE: string, HARDWARE: string, - * SOCKETS: string, NAME: string}, RHSM_API_RESPONSE_PRODUCTS_DATA_TYPES: {HYPERVISOR_SOCKETS: string, - * CORES: string, DATE: string, SOCKETS: string, HAS_DATA: string, PHYSICAL_SOCKETS: string, - * HYPERVISOR_CORES: string, PHYSICAL_CORES: string}, RHSM_API_QUERY_UOM_TYPES: {CORES: string, SOCKETS: string}, - * RHSM_API_RESPONSE_LINKS_TYPES: string, RHSM_API_RESPONSE_INVENTORY_GUESTS_DATA_TYPES: {SUBSCRIPTION_ID: string, - * ID: string, NAME: string, LAST_SEEN: string}, RHSM_API_RESPONSE_ERROR_DATA: string, RHSM_API_RESPONSE_META: string, - * RHSM_API_RESPONSE_INVENTORY_DATA_TYPES: {CORES: string, HARDWARE: string, SOCKETS: string, ID: string, NAME: string, - * LAST_SEEN: string}, RHSM_API_QUERY_SET_REPORT_CAPACITY_TYPES: {GRANULARITY: string, USAGE: string, END_DATE: string, - * SLA: string, START_DATE: string}}} + * RHSM_API_RESPONSE_LINKS: string, RHSM_API_QUERY_SET_INVENTORY_GUESTS_TYPES: {OFFSET: string, + * LIMIT: string}, RHSM_API_PATH_ID_TYPES: {RHEL_ARM: string, RHEL_WORKSTATION: string, + * RHEL_DESKTOP: string, RHEL: string, RHEL_SERVER: string, RHEL_IBM_Z: string, RHEL_COMPUTE_NODE: string, + * RHEL_IBM_POWER: string, RHEL_X86: string, OPENSHIFT: string}, + * RHSM_API_QUERY_SET_OPTIN_TYPES: {TALLY_SYNC: string, TALLY_REPORT: string, CONDUIT_SYNC: string}, + * RHSM_API_QUERY_USAGE_TYPES: {UNSPECIFIED: string, DISASTER: string, DEVELOPMENT: string, + * PRODUCTION: string}, RHSM_API_QUERY_SLA_TYPES: {PREMIUM: string, SELF: string, NONE: string, + * STANDARD: string}, RHSM_API_QUERY_SET_INVENTORY_TYPES: {UOM: string, USAGE: string, DIRECTION: string, + * SORT: string, OFFSET: string, SLA: string, LIMIT: string}, RHSM_API_QUERY_SORT_TYPES: {CORES: string, + * DATE: string, HARDWARE: string, SOCKETS: string, NAME: string}, + * RHSM_API_RESPONSE_PRODUCTS_DATA_TYPES: {HYPERVISOR_SOCKETS: string, CORES: string, DATE: string, + * SOCKETS: string, HAS_DATA: string, PHYSICAL_SOCKETS: string, HYPERVISOR_CORES: string, + * PHYSICAL_CORES: string}, RHSM_API_QUERY_UOM_TYPES: {CORES: string, SOCKETS: string}, + * RHSM_API_RESPONSE_LINKS_TYPES: string, + * RHSM_API_RESPONSE_INVENTORY_GUESTS_DATA_TYPES: {SUBSCRIPTION_ID: string, ID: string, NAME: string, + * LAST_SEEN: string}, RHSM_API_RESPONSE_ERROR_DATA: string, RHSM_API_RESPONSE_META: string, + * RHSM_API_RESPONSE_INVENTORY_DATA_TYPES: {CORES: string, HARDWARE: string, SOCKETS: string, + * SUBSCRIPTION_ID: string, INVENTORY_ID: string, ID: string, GUESTS: string, CLOUD_PROVIDER: string, + * LAST_SEEN: string, NAME: string}, RHSM_API_QUERY_SET_REPORT_CAPACITY_TYPES: {GRANULARITY: string, + * USAGE: string, END_DATE: string, SLA: string, START_DATE: string}}} */ const rhsmApiTypes = { RHSM_API_RESPONSE_ERROR_DATA,