Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(pageHeader): issues/305 apply locale product context #371

Merged
merged 1 commit into from
Aug 6, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 7 additions & 5 deletions public/locales/en-US.json
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@
"tooltipSummary": "Your subscription data facets. With one level of column and row headers."
},
"curiosity-inventory": {
"tableAriaLabel": "Subscription Watch systems inventory table.",
"tableAriaLabel": "{{appName}} systems inventory table.",
"tableSummary": "A generated table with one level of column headers.",
"tableEmptyInventoryTitle": "No results found",
"tableEmptyInventoryMessage": "No results match the filter criteria. Remove filters or clear all filters to show results.",
Expand Down Expand Up @@ -87,9 +87,11 @@
"tourDescription": "We'll walk you through each step, and include insight into how Red Hat collects and uses subscription data."
},
"curiosity-view": {
"OpenShiftTitle": "Red Hat OpenShift",
"OpenShiftSubtitle": "Monitor your Red Hat OpenShift usage by socket or core usage, based on your subscription terms. <0>Learn more about Subscription Watch reporting</0>",
"RHELTitle": "Red Hat Enterprise Linux",
"RHELSubtitle": "Monitor your Red Hat Enterprise Linux usage by physical, virtual, and public cloud sockets. <0>Learn more about Subscription Watch reporting</0>"
"title": "{{appName}}",
"subtitle": "Monitor your usage based on your subscription terms. <0>Learn more about {{appName}} reporting</0>",
"title_OpenShift": "Red Hat OpenShift",
"subtitle_OpenShift": "Monitor your Red Hat OpenShift usage by socket or core usage, based on your subscription terms. <0>Learn more about {{appName}} reporting</0>",
"title_RHEL": "Red Hat Enterprise Linux",
"subtitle_RHEL": "Monitor your Red Hat Enterprise Linux usage by physical, virtual, and public cloud sockets. <0>Learn more about {{appName}} reporting</0>"
}
}
14 changes: 7 additions & 7 deletions src/components/i18n/__tests__/__snapshots__/i18n.test.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -185,8 +185,8 @@ Array [
"file": "./src/components/openshiftView/openshiftView.js",
"keys": Array [
Object {
"key": "",
"match": "t(\`curiosity-view.\${viewId}Title\`, helpers.UI_DISPLAY_CONFIG_NAME)",
"key": "curiosity-view.title",
"match": "t(\`curiosity-view.title\`, { appName: helpers.UI_DISPLAY_NAME, context: viewId })",
},
Object {
"key": "curiosity-graph.cardHeading",
Expand Down Expand Up @@ -275,17 +275,17 @@ Array [
"file": "./src/components/pageLayout/pageHeader.js",
"keys": Array [
Object {
"key": "",
"match": "t(\`curiosity-view.\${viewId}Subtitle\`, {}, [ <Button isInline component=\\"a\\" variant=\\"link\\" icon={<ExternalLinkAltIcon />} iconPosition=\\"right\\" target=\\"_blank\\" href=\\"https://access.redhat.com/documentation/en-us/subscription_central/2020-04/html/getting_started_with_subscription_watch/con-how-does-subscriptionwatch-show-data_assembly-opening-subscriptionwatch-ctxt/\\" /> ])",
"key": "curiosity-view.subtitle",
"match": "t(\`curiosity-view.subtitle\`, { appName: helpers.UI_DISPLAY_NAME, context: viewId }, [ <Button isInline component=\\"a\\" variant=\\"link\\" icon={<ExternalLinkAltIcon />} iconPosition=\\"right\\" target=\\"_blank\\" href=\\"https://access.redhat.com/documentation/en-us/subscription_central/2020-04/html/getting_started_with_subscription_watch/con-how-does-subscriptionwatch-show-data_assembly-opening-subscriptionwatch-ctxt/\\" /> ])",
},
],
},
Object {
"file": "./src/components/rhelView/rhelView.js",
"keys": Array [
Object {
"key": "",
"match": "t(\`curiosity-view.\${viewId}Title\`, helpers.UI_DISPLAY_CONFIG_NAME)",
"key": "curiosity-view.title",
"match": "t(\`curiosity-view.title\`, { appName: helpers.UI_DISPLAY_NAME, context: viewId })",
},
Object {
"key": "curiosity-graph.socketsHeading",
Expand All @@ -310,7 +310,7 @@ Array [
},
Object {
"key": "curiosity-inventory.tableAriaLabel",
"match": "t('curiosity-inventory.tableAriaLabel')",
"match": "t('curiosity-inventory.tableAriaLabel', { appName: helpers.UI_DISPLAY_NAME })",
},
Object {
"key": "curiosity-inventory.tableSummary",
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ exports[`OpenshiftView Component should display an alternate graph on query-stri
t={[Function]}
viewId="OpenShift"
>
t(curiosity-view.OpenShiftTitle, Subscription Watch)
t(curiosity-view.title, [object Object])
</PageHeader>
<PageToolbar>
<Connect(Toolbar)
Expand Down Expand Up @@ -80,7 +80,7 @@ exports[`OpenshiftView Component should have a fallback title: title 1`] = `
t={[Function]}
viewId="OpenShift"
>
t(curiosity-view.OpenShiftTitle, Subscription Watch)
t(curiosity-view.title, [object Object])
</PageHeader>
<PageToolbar>
<Connect(Toolbar)
Expand Down Expand Up @@ -154,7 +154,7 @@ exports[`OpenshiftView Component should render a non-connected component: non-co
t={[Function]}
viewId="OpenShift"
>
t(curiosity-view.OpenShiftTitle, Subscription Watch)
t(curiosity-view.title, [object Object])
</PageHeader>
<PageToolbar>
<Connect(Toolbar)
Expand Down
4 changes: 3 additions & 1 deletion src/components/openshiftView/openshiftView.js
Original file line number Diff line number Diff line change
Expand Up @@ -79,7 +79,9 @@ class OpenshiftView extends React.Component {

return (
<PageLayout>
<PageHeader viewId={viewId}>{t(`curiosity-view.${viewId}Title`, helpers.UI_DISPLAY_CONFIG_NAME)}</PageHeader>
<PageHeader viewId={viewId}>
{t(`curiosity-view.title`, { appName: helpers.UI_DISPLAY_NAME, context: viewId })}
</PageHeader>
<PageToolbar>
<Toolbar query={query} viewId={viewId} />
</PageToolbar>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -111,7 +111,7 @@ exports[`PageHeader Component should render the subtitle when viewId is provided
</Title>
</PageHeaderTitle>
<p>
t(curiosity-view.RHELSubtitle, [object Object], [object Object])
t(curiosity-view.subtitle, [object Object], [object Object])
</p>
</section>
</PageHeader>
Expand Down
3 changes: 2 additions & 1 deletion src/components/pageLayout/pageHeader.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import {
} from '@redhat-cloud-services/frontend-components/components/cjs/PageHeader';
import { Button } from '@patternfly/react-core';
import { ExternalLinkAltIcon } from '@patternfly/react-icons';
import { helpers } from '../../common';
import { translate } from '../i18n/i18n';

/**
Expand All @@ -22,7 +23,7 @@ const PageHeader = ({ children, t, viewId }) => (
<PageHeaderTitle title={children} className="pf-u-mb-sm" />
{viewId && (
<p>
{t(`curiosity-view.${viewId}Subtitle`, {}, [
{t(`curiosity-view.subtitle`, { appName: helpers.UI_DISPLAY_NAME, context: viewId }, [
<Button
isInline
component="a"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ exports[`RhelView Component should display an alternate graph on query-string up
t={[Function]}
viewId="RHEL"
>
t(curiosity-view.RHELTitle, Subscription Watch)
t(curiosity-view.title, [object Object])
</PageHeader>
<PageToolbar>
<Connect(Toolbar)
Expand Down Expand Up @@ -66,7 +66,7 @@ exports[`RhelView Component should have a fallback title: title 1`] = `
t={[Function]}
viewId="RHEL"
>
t(curiosity-view.RHELTitle, Subscription Watch)
t(curiosity-view.title, [object Object])
</PageHeader>
<PageToolbar>
<Connect(Toolbar)
Expand Down Expand Up @@ -126,7 +126,7 @@ exports[`RhelView Component should render a non-connected component: non-connect
t={[Function]}
viewId="RHEL"
>
t(curiosity-view.RHELTitle, Subscription Watch)
t(curiosity-view.title, [object Object])
</PageHeader>
<PageToolbar>
<Connect(Toolbar)
Expand Down
4 changes: 3 additions & 1 deletion src/components/rhelView/rhelView.js
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,9 @@ class RhelView extends React.Component {

return (
<PageLayout>
<PageHeader viewId={viewId}>{t(`curiosity-view.${viewId}Title`, helpers.UI_DISPLAY_CONFIG_NAME)}</PageHeader>
<PageHeader viewId={viewId}>
{t(`curiosity-view.title`, { appName: helpers.UI_DISPLAY_NAME, context: viewId })}
</PageHeader>
<PageToolbar>
<Toolbar query={query} viewId={viewId} />
</PageToolbar>
Expand Down
12 changes: 6 additions & 6 deletions src/components/table/__tests__/__snapshots__/table.test.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ exports[`Table Component should allow expandable content: expandable content 1`]
span={12}
>
<Table
aria-label="t(curiosity-inventory.tableAriaLabel)"
aria-label="t(curiosity-inventory.tableAriaLabel, [object Object])"
borders={true}
canSelectAll={true}
cells={
Expand Down Expand Up @@ -76,7 +76,7 @@ exports[`Table Component should allow expandable content: expanded row 1`] = `
span={12}
>
<Table
aria-label="t(curiosity-inventory.tableAriaLabel)"
aria-label="t(curiosity-inventory.tableAriaLabel, [object Object])"
borders={true}
canSelectAll={true}
cells={
Expand Down Expand Up @@ -198,7 +198,7 @@ exports[`Table Component should allow variations in table layout: borders and ta
span={12}
>
<Table
aria-label="t(curiosity-inventory.tableAriaLabel)"
aria-label="t(curiosity-inventory.tableAriaLabel, [object Object])"
borders={false}
canSelectAll={true}
cells={
Expand Down Expand Up @@ -308,7 +308,7 @@ exports[`Table Component should allow variations in table layout: generated rows
span={12}
>
<Table
aria-label="t(curiosity-inventory.tableAriaLabel)"
aria-label="t(curiosity-inventory.tableAriaLabel, [object Object])"
borders={true}
canSelectAll={true}
cells={
Expand Down Expand Up @@ -364,7 +364,7 @@ exports[`Table Component should pass child components, nodes when there are no r
span={12}
>
<Table
aria-label="t(curiosity-inventory.tableAriaLabel)"
aria-label="t(curiosity-inventory.tableAriaLabel, [object Object])"
borders={true}
canSelectAll={true}
cells={
Expand Down Expand Up @@ -404,7 +404,7 @@ exports[`Table Component should render a non-connected component: non-connected
span={12}
>
<Table
aria-label="t(curiosity-inventory.tableAriaLabel)"
aria-label="t(curiosity-inventory.tableAriaLabel, [object Object])"
borders={true}
canSelectAll={true}
cells={
Expand Down
3 changes: 2 additions & 1 deletion src/components/table/table.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import SearchIcon from '@patternfly/react-icons/dist/js/icons/search-icon';
import { Table as PfTable, TableBody, TableHeader, TableVariant } from '@patternfly/react-table';
import _isEqual from 'lodash/isEqual';
import { TableEmpty } from './tableEmpty';
import { helpers } from '../../common';
import { translate } from '../i18n/i18n';

/**
Expand Down Expand Up @@ -129,7 +130,7 @@ class Table extends React.Component {
<PfTable
className={`curiosity-table${(!borders && '-no-border') || ''} ${className || ''}`}
borders={borders}
aria-label={ariaLabel || t('curiosity-inventory.tableAriaLabel')}
aria-label={ariaLabel || t('curiosity-inventory.tableAriaLabel', { appName: helpers.UI_DISPLAY_NAME })}
summary={summary || t('curiosity-inventory.tableSummary')}
variant={variant}
onCollapse={(event, index, isOpen, data) => this.onCollapse({ event, index, isOpen, data })}
Expand Down