From f5cd3a773513bbe5498c08cea1fc40702b1d7cce Mon Sep 17 00:00:00 2001 From: CD Cabrera Date: Sat, 10 Jul 2021 15:42:34 -0400 Subject: [PATCH] fix(locale): ent-4045 threshold graph legend strings (#733) * locale, threshold strings * graphCardChartLegend, context, string refs * graphCardChartTooltip, context, string refs * productViewOpenShiftContainer, productLabel to product group --- public/locales/en-US.json | 10 +++++----- .../graphCardChartLegend.test.js.snap | 8 ++++---- .../__tests__/graphCardChartLegend.test.js | 3 +++ src/components/graphCard/graphCardChartLegend.js | 15 ++++++++------- .../graphCard/graphCardChartTooltip.js | 2 +- .../__tests__/__snapshots__/i18n.test.js.snap | 16 ++++++++++------ .../productViewOpenShiftContainer.test.js.snap | 4 ++-- .../productView/productViewOpenShiftContainer.js | 4 ++-- 8 files changed, 35 insertions(+), 27 deletions(-) diff --git a/public/locales/en-US.json b/public/locales/en-US.json index de21779b8..6cbdebc5e 100644 --- a/public/locales/en-US.json +++ b/public/locales/en-US.json @@ -55,11 +55,11 @@ "physicalSocketsLabel": "Physical {{product}}", "physicalSocketsLegendTooltip": "{{product}} CPU socket usage, per socket pair.", "physicalSocketsLegendTooltip_RHEL": "Physical {{product}} CPU usage, per socket pair. Each system's socket count is rounded upwards to the next even number.", - "thresholdLabel": "Subscription threshold", - "thresholdLegendTooltip": "Maximum capacity, based on total {{product}} subscriptions in this account.", - "thresholdLegendTooltip_RHEL": "Maximum capacity, as CPU sockets, based on total {{product}} subscriptions in this account.", - "thresholdCoresLegendTooltip_OpenShift Container Platform": "Maximum capacity, as CPU cores, based on total {{product}} subscriptions in this account.", - "thresholdSocketsLegendTooltip_OpenShift Container Platform": "Maximum capacity, as CPU sockets, based on total {{product}} subscriptions in this account.", + "label_threshold": "Subscription threshold", + "legendTooltip_threshold": "Maximum capacity, based on total {{product}} subscriptions in this account.", + "legendTooltip_threshold_thresholdSockets_RHEL": "Maximum capacity, as CPU sockets, based on total {{product}} subscriptions in this account.", + "legendTooltip_threshold_thresholdCores_OpenShift Container Platform": "Maximum capacity, as CPU cores, based on total {{product}} Annual subscriptions in this account.", + "legendTooltip_threshold_thresholdSockets_OpenShift Container Platform": "Maximum capacity, as CPU sockets, based on total {{product}} Annual subscriptions in this account.", "tooltipSummary": "Your subscription data facets. With one level of column and row headers." }, "curiosity-inventory": { diff --git a/src/components/graphCard/__tests__/__snapshots__/graphCardChartLegend.test.js.snap b/src/components/graphCard/__tests__/__snapshots__/graphCardChartLegend.test.js.snap index c8327a86c..127d46f2b 100644 --- a/src/components/graphCard/__tests__/__snapshots__/graphCardChartLegend.test.js.snap +++ b/src/components/graphCard/__tests__/__snapshots__/graphCardChartLegend.test.js.snap @@ -282,7 +282,7 @@ exports[`GraphCardChartLegend Component should render basic data: data 1`] = ` - t(curiosity-graph.dolorSitLegendTooltip,curiosity-graph.thresholdLegendTooltip, {"product":"test","context":"test"}) + t(curiosity-graph.legendTooltip_threshold, {"product":"test","context":"dolorSit_test"})

} distance={5} @@ -313,13 +313,13 @@ exports[`GraphCardChartLegend Component should render basic data: data 1`] = ` tabIndex={0} variant="link" > - t(curiosity-graph.dolorSitLabel,curiosity-graph.thresholdLabel, {"product":"test","context":"test"}) + t(curiosity-graph.label_threshold, {"product":"test","context":"dolorSit_test"}) - t(curiosity-graph.nonCursusLegendTooltip,curiosity-graph.thresholdLegendTooltip, {"product":"test","context":"test"}) + t(curiosity-graph.legendTooltip_threshold, {"product":"test","context":"nonCursus_test"})

} distance={5} @@ -350,7 +350,7 @@ exports[`GraphCardChartLegend Component should render basic data: data 1`] = ` tabIndex={0} variant="link" > - t(curiosity-graph.nonCursusLabel,curiosity-graph.thresholdLabel, {"product":"test","context":"test"}) + t(curiosity-graph.label_threshold, {"product":"test","context":"nonCursus_test"}) diff --git a/src/components/graphCard/__tests__/graphCardChartLegend.test.js b/src/components/graphCard/__tests__/graphCardChartLegend.test.js index e9c96918c..c7de1aaee 100644 --- a/src/components/graphCard/__tests__/graphCardChartLegend.test.js +++ b/src/components/graphCard/__tests__/graphCardChartLegend.test.js @@ -51,6 +51,7 @@ describe('GraphCardChartLegend Component', () => { } ] }, + productId: 'test id', productLabel: 'test' }; @@ -79,6 +80,7 @@ describe('GraphCardChartLegend Component', () => { legend: { 'test-dolorSit': true }, + productId: 'test id', productLabel: 'test', viewId: 'test' }; @@ -119,6 +121,7 @@ describe('GraphCardChartLegend Component', () => { } ] }, + productId: 'test id', productLabel: 'test' }; diff --git a/src/components/graphCard/graphCardChartLegend.js b/src/components/graphCard/graphCardChartLegend.js index 6e93d8e4a..88333a6db 100644 --- a/src/components/graphCard/graphCardChartLegend.js +++ b/src/components/graphCard/graphCardChartLegend.js @@ -115,9 +115,9 @@ class GraphCardChartLegend extends React.Component { const labelContent = (isThreshold && - t([`curiosity-graph.${id}Label`, `curiosity-graph.thresholdLabel`], { + t('curiosity-graph.label_threshold', { product: productLabel, - context: productLabel + context: [id, productLabel] })) || t([`curiosity-graph.${id}Label`, `curiosity-graph.noLabel`], { product: productLabel, @@ -126,9 +126,9 @@ class GraphCardChartLegend extends React.Component { const tooltipContent = (isThreshold && - t([`curiosity-graph.${id}LegendTooltip`, `curiosity-graph.thresholdLegendTooltip`], { + t('curiosity-graph.legendTooltip_threshold', { product: productLabel, - context: productLabel + context: [id, productLabel] })) || t(`curiosity-graph.${id}LegendTooltip`, { product: productLabel, context: productLabel }); @@ -149,7 +149,8 @@ class GraphCardChartLegend extends React.Component { /** * Prop types. * - * @type {{datum, productLabel: string, t: Function, legend: object, chart: object}} + * @type {{datum: object, productLabel: string, viewId: string, t: Function, legend: object, + * chart: object}} */ GraphCardChartLegend.propTypes = { chart: PropTypes.shape({ @@ -175,8 +176,8 @@ GraphCardChartLegend.propTypes = { /** * Default props. * - * @type {{datum: {dataSets: Array}, productLabel: string, viewId: string, t: translate, legend: object, - * chart: {hide: Function, toggle: Function, isToggled: Function}}} + * @type {{datum: object, productLabel: string, viewId: string, t: translate, legend: object, + * chart: object}} */ GraphCardChartLegend.defaultProps = { chart: { diff --git a/src/components/graphCard/graphCardChartTooltip.js b/src/components/graphCard/graphCardChartTooltip.js index f848a798e..d93e1d8d1 100644 --- a/src/components/graphCard/graphCardChartTooltip.js +++ b/src/components/graphCard/graphCardChartTooltip.js @@ -46,7 +46,7 @@ const GraphCardChartTooltip = ({ datum, granularity, productLabel, t }) => { } } - tempDataFacet.label = t(`curiosity-graph.thresholdLabel`); + tempDataFacet.label = t('curiosity-graph.label', { context: 'threshold' }); tempDataFacet.value = thresholdStringValue; } else { const dataFactsValue = diff --git a/src/components/i18n/__tests__/__snapshots__/i18n.test.js.snap b/src/components/i18n/__tests__/__snapshots__/i18n.test.js.snap index fe4a7e762..aebacdf24 100644 --- a/src/components/i18n/__tests__/__snapshots__/i18n.test.js.snap +++ b/src/components/i18n/__tests__/__snapshots__/i18n.test.js.snap @@ -57,16 +57,16 @@ Array [ "file": "./src/components/graphCard/graphCardChartLegend.js", "keys": Array [ Object { - "key": "", - "match": "t([\`curiosity-graph.\${id}Label\`, \`curiosity-graph.thresholdLabel\`], { product: productLabel, context: productLabel })", + "key": "curiosity-graph.label_threshold", + "match": "t('curiosity-graph.label_threshold', { product: productLabel, context: [id, productLabel] })", }, Object { "key": "", "match": "t([\`curiosity-graph.\${id}Label\`, \`curiosity-graph.noLabel\`], { product: productLabel, context: productLabel })", }, Object { - "key": "", - "match": "t([\`curiosity-graph.\${id}LegendTooltip\`, \`curiosity-graph.thresholdLegendTooltip\`], { product: productLabel, context: productLabel })", + "key": "curiosity-graph.legendTooltip_threshold", + "match": "t('curiosity-graph.legendTooltip_threshold', { product: productLabel, context: [id, productLabel] })", }, Object { "key": "", @@ -90,8 +90,8 @@ Array [ "match": "t('curiosity-graph.infiniteThresholdLabel')", }, Object { - "key": "curiosity-graph.thresholdLabel", - "match": "t(\`curiosity-graph.thresholdLabel\`)", + "key": "curiosity-graph.label", + "match": "t('curiosity-graph.label', { context: 'threshold' })", }, Object { "key": "curiosity-graph.noDataLabel", @@ -585,6 +585,10 @@ Array [ exports[`I18n Component should have locale keys that exist in the default language JSON: missing locale keys 1`] = ` Array [ + Object { + "file": "./src/components/graphCard/graphCardChartTooltip.js", + "key": "curiosity-graph.label", + }, Object { "file": "./src/components/inventoryList/inventoryList.js", "key": "curiosity-inventory.tab", diff --git a/src/components/productView/__tests__/__snapshots__/productViewOpenShiftContainer.test.js.snap b/src/components/productView/__tests__/__snapshots__/productViewOpenShiftContainer.test.js.snap index f398e4f7e..60887435d 100644 --- a/src/components/productView/__tests__/__snapshots__/productViewOpenShiftContainer.test.js.snap +++ b/src/components/productView/__tests__/__snapshots__/productViewOpenShiftContainer.test.js.snap @@ -85,7 +85,7 @@ exports[`ProductViewOpenShiftContainer Component should render a non-connected c } key="graph_OpenShift Container Platform" productId="OpenShift Container Platform" - productLabel="OpenShift" + productLabel="OpenShift Container Platform" query={ Object { "beginning": "2019-06-20T00:00:00.000Z", @@ -306,7 +306,7 @@ exports[`ProductViewOpenShiftContainer Component should render a non-connected c } key="graph_OpenShift-metrics" productId="OpenShift-metrics" - productLabel="OpenShift Metric" + productLabel="OpenShift-metrics" query={ Object { "beginning": "2019-07-01T00:00:00.000Z", diff --git a/src/components/productView/productViewOpenShiftContainer.js b/src/components/productView/productViewOpenShiftContainer.js index ea2d9bb4f..128d60ad3 100644 --- a/src/components/productView/productViewOpenShiftContainer.js +++ b/src/components/productView/productViewOpenShiftContainer.js @@ -413,7 +413,7 @@ ProductViewOpenShiftContainer.defaultProps = { id: RHSM_API_QUERY_TYPES.SLA } ], - productLabel: 'OpenShift', + productLabel: RHSM_API_PATH_ID_TYPES.OPENSHIFT, productId: RHSM_API_PATH_ID_TYPES.OPENSHIFT, viewId: 'viewOpenShift' }, @@ -501,7 +501,7 @@ ProductViewOpenShiftContainer.defaultProps = { } ], initialToolbarFilters: undefined, - productLabel: 'OpenShift Metric', + productLabel: RHSM_API_PATH_ID_TYPES.OPENSHIFT_METRICS, productId: RHSM_API_PATH_ID_TYPES.OPENSHIFT_METRICS, viewId: 'viewOpenShiftMetric' }