diff --git a/client/src/components/J40Footer.tsx b/client/src/components/J40Footer.tsx
index 5029375b..2dbd595a 100644
--- a/client/src/components/J40Footer.tsx
+++ b/client/src/components/J40Footer.tsx
@@ -1,9 +1,56 @@
import React from 'react';
import {Footer, Logo, FooterNav, Address} from '@trussworks/react-uswds';
+import {useIntl} from 'gatsby-plugin-intl';
+import {defineMessages} from 'react-intl';
+
// @ts-ignore
import whitehouseIcon from '../images/eop-seal.svg';
const J40Footer = () => {
+ const intl = useIntl();
+ const messages = defineMessages({
+ arialabelfooter: {
+ id: 'footer.arialabel',
+ defaultMessage: 'Footer navigation',
+ description: 'aria-label text for whole footer',
+ },
+ logotitle: {
+ id: 'footer.logo.title',
+ defaultMessage: 'Council on Environmental Quality',
+ description: 'Footer under logo',
+ },
+ moreinfoheader: {
+ id: 'footer.moreinfoheader',
+ defaultMessage: 'More Information',
+ description: 'Footer column header',
+ },
+ foia: {
+ id: 'footer.foialink',
+ defaultMessage: 'Freedom of Information Act (FOIA)',
+ description: 'Footer FOIA link text',
+ },
+ privacy: {
+ id: 'footer.privacylink',
+ defaultMessage: 'Privacy Policy',
+ description: 'Footer privacy policy link text',
+ },
+ whitehouselogoalt: {
+ id: 'footer.whitehouselogoalt',
+ defaultMessage: 'Whitehouse logo',
+ description: 'Footer Whitehouse logo alt text',
+ },
+ questionsheader: {
+ id: 'footer.questionsheader',
+ defaultMessage: 'Have a question about government services?',
+ description: 'Footer column header',
+ },
+ contactlink: {
+ id: 'footer.findcontactlink',
+ defaultMessage: 'Find a contact at USA.gov',
+ description: 'Footer find contact link text',
+ },
+ });
+
return (
<>
}
/>
>,
<>
@@ -82,6 +89,26 @@ const J40Footer = () => {
/>
>,
],
+ [
+ intl.formatMessage(messages.moreinfoheader),
+ Whitehouse.gov,
+
+ {intl.formatMessage(messages.foia)}
+ ,
+
+ {intl.formatMessage(messages.privacy)}
+ ,
+ ],
+ [
+ intl.formatMessage(messages.questionsheader),
+
+ {intl.formatMessage(messages.contactlink)}
+ ,
+ ],
]}
/>}
/>
diff --git a/client/src/components/__snapshots__/J40Footer.spec.tsx.snap b/client/src/components/__snapshots__/J40Footer.spec.tsx.snap
index 81fedc54..24434550 100644
--- a/client/src/components/__snapshots__/J40Footer.spec.tsx.snap
+++ b/client/src/components/__snapshots__/J40Footer.spec.tsx.snap
@@ -21,139 +21,6 @@ exports[`J40Footer renders correctly 1`] = `
-
-
-
-
-
-
-
-
-
@@ -220,6 +87,78 @@ exports[`J40Footer renders correctly 1`] = `
+
+
+
+
+
+
diff --git a/client/src/intl/en.json b/client/src/intl/en.json
index d1e862a0..603b1bac 100644
--- a/client/src/intl/en.json
+++ b/client/src/intl/en.json
@@ -27,6 +27,38 @@
"defaultMessage": "Clean water infrastructure",
"description": "item in areasOfInterest list"
},
+ "footer.arialabel": {
+ "defaultMessage": "Footer navigation",
+ "description": "aria-label text for whole footer"
+ },
+ "footer.findcontactlink": {
+ "defaultMessage": "Find a contact at USA.gov",
+ "description": "Footer find contact link text"
+ },
+ "footer.foialink": {
+ "defaultMessage": "Freedom of Information Act (FOIA)",
+ "description": "Footer FOIA link text"
+ },
+ "footer.logo.title": {
+ "defaultMessage": "Council on Environmental Quality",
+ "description": "Footer under logo"
+ },
+ "footer.moreinfoheader": {
+ "defaultMessage": "More Information",
+ "description": "Footer column header"
+ },
+ "footer.privacylink": {
+ "defaultMessage": "Privacy Policy",
+ "description": "Footer privacy policy link text"
+ },
+ "footer.questionsheader": {
+ "defaultMessage": "Have a question about government services?",
+ "description": "Footer column header"
+ },
+ "footer.whitehouselogoalt": {
+ "defaultMessage": "Whitehouse logo",
+ "description": "Footer Whitehouse logo alt text"
+ },
"header.about": {
"defaultMessage": "About",
"description": "Navigate to the about page"
diff --git a/client/src/test/testHelpers.tsx b/client/src/test/testHelpers.tsx
index 781ad97b..6578f909 100644
--- a/client/src/test/testHelpers.tsx
+++ b/client/src/test/testHelpers.tsx
@@ -1,6 +1,15 @@
import React, {ReactNode} from 'react';
-import {IntlContextProvider} from 'gatsby-plugin-intl';
+import {IntlProvider, IntlContextProvider} from 'gatsby-plugin-intl';
+import messages from '../intl/en.json'; // this is updated by `formatjs extract`
+const intlConfig = {
+ language: 'en',
+ languages: ['en', 'es'],
+ messages,
+ originalPath: '/',
+ redirect: true,
+ routed: true,
+};
interface ILocalizedComponentProps {
children: ReactNode
}
@@ -8,8 +17,10 @@ interface ILocalizedComponentProps {
export const LocalizedComponent = ({children}: ILocalizedComponentProps) => {
return (
<>
-
- {children}
+
+
+ {children}
+
,
>
);