From 787db24b16e3944a34b00264d851375d71f127a9 Mon Sep 17 00:00:00 2001 From: CD Cabrera Date: Thu, 3 Oct 2024 11:21:50 -0400 Subject: [PATCH] fix(authentication): consistent locale keys (#1434) * locale, auth keys * authentication, updated auth keys, test snapshots * messageView, allow component or func ref --- public/locales/en-US.json | 6 +- .../__snapshots__/authentication.test.js.snap | 432 +++--------------- .../__tests__/authentication.test.js | 18 +- .../authentication/authentication.js | 10 +- .../__tests__/__snapshots__/i18n.test.js.snap | 6 +- src/components/messageView/messageView.js | 4 +- 6 files changed, 97 insertions(+), 379 deletions(-) diff --git a/public/locales/en-US.json b/public/locales/en-US.json index d289ddbc3..c10fdc458 100644 --- a/public/locales/en-US.json +++ b/public/locales/en-US.json @@ -1,7 +1,9 @@ { "curiosity-auth": { - "pending": "Authenticating...", - "maintenanceCopy": "We are currently undergoing scheduled maintenance and will be back shortly. Thank you for your patience." + "pending": "...", + "pending_description": "Authenticating...", + "maintenance": "...", + "maintenance_description": "We are currently undergoing scheduled maintenance and will be back shortly. Thank you for your patience." }, "curiosity-banner": {}, "curiosity-graph": { diff --git a/src/components/authentication/__tests__/__snapshots__/authentication.test.js.snap b/src/components/authentication/__tests__/__snapshots__/authentication.test.js.snap index a448a3d5a..e07aa3e92 100644 --- a/src/components/authentication/__tests__/__snapshots__/authentication.test.js.snap +++ b/src/components/authentication/__tests__/__snapshots__/authentication.test.js.snap @@ -19,7 +19,7 @@ exports[`Authentication Component should allow being disabled: disabled 1`] = ` title={null} > @@ -49,11 +49,23 @@ exports[`Authentication Component should render a basic component: basic 1`] = ` `; exports[`Authentication Component should render a component authorized: authorized 1`] = ` - - lorem - + + lorem + + `; exports[`Authentication Component should render a component error: error 1`] = ` @@ -90,8 +102,8 @@ exports[`Authentication Component should render a component pending: pending 1`] } > } + message="t(curiosity-auth.pending, {"context":"description"})" pageTitle=" " title={null} /> @@ -99,11 +111,26 @@ exports[`Authentication Component should render a component pending: pending 1`] `; exports[`Authentication Component should return a message on 401 error: 401 error 1`] = ` -
- You do not have access to Subscriptions -
+ + + + `; exports[`Authentication Component should return a redirect on 418 error: 418 error 1`] = ` @@ -127,365 +154,46 @@ exports[`Authentication Component should return a redirect on 418 error: 418 err `; exports[`Authentication Component should return a redirect on a specific 403 error and error code: 403 error 1`] = ` - -
-
-
-
-
-

- Subscriptions -

-
-
-
-
-
-
-
- -
-
-
-
- -
-
-
- You do not have access to Subscriptions -
-
-
-
- Contact your organization administrator(s) for more information or visit  - - My User Access - -  to learn more about your permissions. -
- -
- -
-
-
+ +
+ `; exports[`Authentication Component should return a redirect on a specific 403 error and error code: 403 redirect error 1`] = ` - -
-
-
-
-
-
-
-

- t(curiosity-optin.cardTitle, {"appName":"Subscriptions"}) -

-
-
-
- t(curiosity-optin.cardDescription, {"appName":"Subscriptions"}) -
-
-
-

- t(curiosity-optin.cardSeeTitle) -

-
-
-
- t(curiosity-optin.cardSeeDescription) -
-
-
-

- t(curiosity-optin.cardReportTitle) -

-
-
-
- t(curiosity-optin.cardReportDescription) -
-
-
-

- t(curiosity-optin.cardFilterTitle) -

-
-
-
- t(curiosity-optin.cardFilterDescription) -
- -
-
-
-
-
-
-
-
- -
-
-
-
-

- t(curiosity-optin.tourTitle) -

-
-
-
- t(curiosity-optin.tourDescription) -
- -
-
-
-
-
-
-
-
+ + `; diff --git a/src/components/authentication/__tests__/authentication.test.js b/src/components/authentication/__tests__/authentication.test.js index 0989b298a..12576fde7 100644 --- a/src/components/authentication/__tests__/authentication.test.js +++ b/src/components/authentication/__tests__/authentication.test.js @@ -92,7 +92,7 @@ describe('Authentication Component', () => { expect(component).toMatchSnapshot('418 error'); }); - it('should return a redirect on a specific 403 error and error code', () => { + it('should return a redirect on a specific 403 error and error code', async () => { const props = { useGetAuthorization: () => ({ error: true, @@ -104,7 +104,7 @@ describe('Authentication Component', () => { } }) }; - const component = renderComponent( + const component = await shallowComponent( lorem @@ -112,7 +112,7 @@ describe('Authentication Component', () => { expect(component).toMatchSnapshot('403 redirect error'); - const propsUpdated = component.setProps({ + const propsUpdated = await component.setProps({ useGetAuthorization: () => ({ error: true, pending: false, @@ -127,7 +127,7 @@ describe('Authentication Component', () => { expect(propsUpdated).toMatchSnapshot('403 error'); }); - it('should return a message on 401 error', () => { + it('should return a message on 401 error', async () => { const props = { useGetAuthorization: () => ({ error: true, @@ -139,13 +139,13 @@ describe('Authentication Component', () => { } }) }; - const component = renderComponent( + const component = await shallowComponent( lorem ); - expect(component.getByText('You do not have access to Subscriptions')).toMatchSnapshot('401 error'); + expect(component).toMatchSnapshot('401 error'); }); it('should render a component pending', async () => { @@ -169,7 +169,7 @@ describe('Authentication Component', () => { expect(component).toMatchSnapshot('pending'); }); - it('should render a component authorized', () => { + it('should render a component authorized', async () => { const props = { useGetAuthorization: () => ({ error: false, @@ -183,12 +183,12 @@ describe('Authentication Component', () => { } }) }; - const component = renderComponent( + const component = await shallowComponent( lorem ); - expect(component.find('span')).toMatchSnapshot('authorized'); + expect(component).toMatchSnapshot('authorized'); }); }); diff --git a/src/components/authentication/authentication.js b/src/components/authentication/authentication.js index 092042d8d..134fa854e 100644 --- a/src/components/authentication/authentication.js +++ b/src/components/authentication/authentication.js @@ -39,7 +39,7 @@ const Authentication = ({ appName, children, isDisabled, t, useGetAuthorization: if (isDisabled) { return ( - + ); } @@ -49,7 +49,13 @@ const Authentication = ({ appName, children, isDisabled, t, useGetAuthorization: } if (pending) { - return ; + return ( + } + /> + ); } if ( diff --git a/src/components/i18n/__tests__/__snapshots__/i18n.test.js.snap b/src/components/i18n/__tests__/__snapshots__/i18n.test.js.snap index 86fc3afc6..452e594fd 100644 --- a/src/components/i18n/__tests__/__snapshots__/i18n.test.js.snap +++ b/src/components/i18n/__tests__/__snapshots__/i18n.test.js.snap @@ -19,12 +19,12 @@ exports[`I18n Component should generate a predictable locale key output snapshot "file": "src/components/authentication/authentication.js", "keys": [ { - "key": "curiosity-auth.maintenanceCopy", - "match": "t('curiosity-auth.maintenanceCopy', '...')", + "key": "curiosity-auth.maintenance", + "match": "t('curiosity-auth.maintenance', { context: 'description' })", }, { "key": "curiosity-auth.pending", - "match": "t('curiosity-auth.pending', '...')", + "match": "t('curiosity-auth.pending', { context: 'description' })", }, ], }, diff --git a/src/components/messageView/messageView.js b/src/components/messageView/messageView.js index 5e9d1fb4a..38d873f95 100644 --- a/src/components/messageView/messageView.js +++ b/src/components/messageView/messageView.js @@ -31,7 +31,9 @@ const MessageView = ({ children, icon, message, pageTitle, title }) => ( {children ?? ( - {icon && } + {(typeof icon === 'function' && ) || + (icon && icon} />) || + null} {title && ( {title}