Implement downloads page and May 25th timed copy changes (#1653)

* Add initial side nav

* Add Download page as a sub-page under Meth&Data

- udpate S3 file path in .envs
- remove the DownloadPacket component
- move download copy from methodology to download
- modify header to use two types of navs:
--  mobile (with sub-pages) and
-- desktop (without subpages)
- create a SubPageNav component
- add SubPagNav to Meth and Download page
- update snapshots
- add global CSS overide to remove minus sign on mobile nav link accordion as it's permanently open

* Remove the update tag above Public eng button

* Make the 3rd bullet on explore page update on 5/25

* Make the RFI box text change after 5/25/22

* Update site with RFI expired copy, remove Alerts

- add Spanish translations
- update snapshots

* Fix typo on XLS file path

* Refactor HowYouCanHelp to standard form

* Add custom download links with icons

- add new DownloadLink compnent
- add Spanish translations

* Update download file sizes

* Allow meth&data nav link to collapse on mobile
This commit is contained in:
Vim 2022-05-26 00:01:04 -04:00 committed by GitHub
commit 226017654a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
46 changed files with 966 additions and 1720 deletions

View file

@ -9,9 +9,12 @@ GATSBY_LOCAL_TILES_BASE_URL=http://localhost:5000/data/data-pipeline
GATSBY_DATA_PIPELINE_SCORE_PATH_LOCAL=data_pipeline/data/score
GATSBY_DATA_PIPELINE_SCORE_PATH=data-pipeline/data/score
GATSBY_SCORE_DOWNLOAD_FILE_PATH=downloadable/Screening_Tool_Data.zip
GATSBY_SHAPE_FILE_PATH=shapefile/usa.zip
GATSBY_TSD_DOWNLOAD_FILE_PATH=downloadable/cejst_technical_support_document.pdf
GATSBY_FILE_DL_PATH_SCREENING_TOOL_DATA_ZIP=downloadable/Screening_Tool_Data.zip
GATSBY_FILE_DL_PATH_SHAPE_FILE_ZIP=shapefile/usa.zip
GATSBY_FILE_DL_PATH_TSD_PDF=downloadable/cejst_technical_support_document.pdf
GATSBY_FILE_DL_PATH_COMMUNITIES_LIST_XLS=downloadable/communities-2022-05-12-1914GMT.xlsx
GATSBY_FILE_DL_PATH_COMMUNITIES_LIST_CSV=downloadable/communities-2022-05-12-1914GMT.csv
GATSBY_FILE_DL_PATH_HOW_TO_COMMUNITIES_PDF=downloadable/Draft_Communities_List.pdf
GATSBY_MAP_TILES_PATH=tiles

View file

@ -6,7 +6,12 @@
GATSBY_CDN_TILES_BASE_URL=https://static-data-screeningtool.geoplatform.gov
GATSBY_DATA_PIPELINE_SCORE_PATH=data-pipeline/data/score
GATSBY_SCORE_DOWNLOAD_FILE_PATH=downloadable/Screening_Tool_Data.zip
GATSBY_SHAPE_FILE_PATH=shapefile/usa.zip
GATSBY_TSD_DOWNLOAD_FILE_PATH=downloadable/cejst_technical_support_document.pdf
GATSBY_FILE_DL_PATH_SCREENING_TOOL_DATA_ZIP=downloadable/Screening_Tool_Data.zip
GATSBY_FILE_DL_PATH_SHAPE_FILE_ZIP=shapefile/usa.zip
GATSBY_FILE_DL_PATH_TSD_PDF=downloadable/cejst_technical_support_document.pdf
GATSBY_FILE_DL_PATH_COMMUNITIES_LIST_XLS=downloadable/communities-2022-05-12-1914GMT.csv
GATSBY_FILE_DL_PATH_COMMUNITIES_LIST_CSV=downloadable/communities-2022-05-12-1914GMT.xlsx
GATSBY_FILE_DL_PATH_HOW_TO_COMMUNITIES_PDF=downloadable/Draft_Communities_List.pdf
GATSBY_MAP_TILES_PATH=tiles

View file

@ -0,0 +1,7 @@
@use '../../styles/design-system.scss' as *;
.downloadIcon {
height: 1rem;
vertical-align: middle;
filter: invert(57%) sepia(6%) saturate(3932%) hue-rotate(163deg) brightness(86%) contrast(88%);
}

View file

@ -0,0 +1,13 @@
declare namespace DownloadLinkNamespace {
export interface IDownloadLink {
downloadIcon: string;
}
}
declare const DownloadLinkModule: DownloadLinkNamespace.IDownloadLink & {
/** WARNING: Only available when `css-loader` is used without `style-loader` or `mini-css-extract-plugin` */
locals: DownloadLinkNamespace.IDownloadLink;
};
export = DownloadLinkModule;

View file

@ -1,12 +1,12 @@
import * as React from 'react';
import {render} from '@testing-library/react';
import {LocalizedComponent} from '../../test/testHelpers';
import DownloadPacket from './DownloadPacket';
import DownloadLink from './DownloadLink';
describe('download packet component defined', () => {
describe('rendering of the DownloadLink disadvantaged', () => {
const {asFragment} = render(
<LocalizedComponent>
<DownloadPacket />
<DownloadLink href="https://google.com" linkText="Google"/>
</LocalizedComponent>,
);
@ -14,4 +14,3 @@ describe('download packet component defined', () => {
expect(asFragment()).toMatchSnapshot();
});
});

View file

@ -0,0 +1,40 @@
import React from 'react';
import {defineMessages, useIntl} from 'gatsby-plugin-intl';
import {IDefineMessage} from '../../data/copy/common';
// @ts-ignore
import fileDownloadIcon from '/node_modules/uswds/dist/img/usa-icons/file_download.svg';
import * as styles from './DownloadLink.module.scss';
export const DOWNLOAD_ICON = defineMessages({
ALT_TAG: {
id: 'downloads.page.download.icon.alt.tag',
defaultMessage: 'The icon used to indicate that the file is downloadable',
description: 'Navigate to the Downloads page, this is the icon used to indicate that the file is downloadable',
},
});
interface IDownloadLink {
href: string | IDefineMessage,
linkText: string | JSX.Element,
}
const DownloadLink = ({href, linkText}:IDownloadLink) => {
const intl = useIntl();
if (href && typeof href !== `string`) {
href = intl.formatMessage(href);
}
return (
<>
<a href={href} download>{linkText}</a>
<img
className={styles.downloadIcon}
src={fileDownloadIcon}
alt={intl.formatMessage(DOWNLOAD_ICON.ALT_TAG)}
/>
</>
);
};
export default DownloadLink;

View file

@ -0,0 +1,16 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`rendering of the DownloadLink disadvantaged checks if component renders 1`] = `
<DocumentFragment>
<a
download=""
href="https://google.com"
>
Google
</a>
<img
alt="The icon used to indicate that the file is downloadable"
src="test-file-stub"
/>
</DocumentFragment>
`;

View file

@ -0,0 +1,3 @@
import DownloadLink from './DownloadLink';
export default DownloadLink;

View file

@ -1,94 +0,0 @@
import React, {FC} from 'react';
import {Button, Grid, Tag} from '@trussworks/react-uswds';
import * as styles from './downloadPacket.module.scss';
import * as METHODOLOGY_COPY from '../../data/copy/methodology';
// @ts-ignore
import downloadIcon from '/node_modules/uswds/dist/img/usa-icons/file_download.svg';
const DownloadPacket = () => {
// inline components to make build layout below more readable
const UpdateTag = () => <div className={styles.tagContainer}><Tag
className={styles.updateTag}>{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.UPDATED_TAG}</Tag></div>;
const NewTag = () => <div className={styles.tagContainer}>
<Tag className={styles.newTag}>{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.NEW_TAG}</Tag></div>;
const DownloadButton: FC = ({children}) =>
<Button className={styles.downloadBoxButton} type="button">
<span className={styles.downloadButtonIconSpan}>
<img src={downloadIcon} className={styles.downloadButtonIcon}
alt={'download icon for download package'} />
</span>
<span className={styles.downloadButtonText} >
{children}
</span>
</Button>;
return (
<Grid>
<div className={styles.downloadBoxContainer}>
<div className={styles.downloadBox}>
<div className={styles.downloadBoxTextBox}>
{/* Download box title */}
<div className={styles.downloadBoxTitle}>
{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.TITLE}
</div>
{/* Download box description 1 */}
<div className={styles.downloadSourceText}>
{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.DESCRIPTION1}
</div>
{/* Download box button 1 */}
<div className={styles.downloadButtonContainer}>
<UpdateTag/>
<a data-cy={'download-link'}
download
href={METHODOLOGY_COPY.DOWNLOAD_ZIP_URL}>
<DownloadButton>{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.BUTTON_TEXT1}</DownloadButton>
</a>
</div>
<div className={styles.lastUpdated}>
{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.ZIP_LAST_UPDATED}
</div>
{/* Download box button 2 */}
<div className={styles.downloadButtonContainer}>
<UpdateTag/>
<a data-cy={'shapefile-link'}
download
href={METHODOLOGY_COPY.DOWNLOAD_SHAPEFILE_URL}>
<DownloadButton>{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.BUTTON_TEXT2}</DownloadButton>
</a>
</div>
<div className={styles.lastUpdated}>
{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.SHAPE_LAST_UPDATED}
</div>
{/* Download box button 3 */}
<div className={styles.downloadButtonContainer}>
<NewTag/>
{/* target and rel required since PDFs open in browser and don't download */}
<a data-cy={'tsd-link'}
download
target={'_blank'}
rel={'noreferrer'}
href={METHODOLOGY_COPY.DOWNLOAD_TSD_URL}>
<DownloadButton>{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.BUTTON_TEXT3}</DownloadButton>
</a>
</div>
<div className={styles.lastUpdated}>
{METHODOLOGY_COPY.DOWNLOAD_PACKAGE.TSD_LAST_UPDATED}
</div>
</div>
</div>
</div>
</Grid>
);
};
export default DownloadPacket;

View file

@ -1,148 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`download packet component defined checks if component renders 1`] = `
<DocumentFragment>
<div
class=""
data-testid="grid"
>
<div>
<div>
<div>
<div>
<span>
NEW
</span>
files available for download
</div>
<div>
Download the data sources used in the CEJST (.csv, .xlxs,
<span>
.pdf
</span>
that describes how to use the list, and a
<span>
codebook
</span>
, 53MB unzipped), the shapefile, along with a
<span>
codebook
</span>
(.zip, 742MB unzipped) or the technical support document (.pdf, 2.5MB unzipped).
</div>
<div>
<div>
<span
class="usa-tag"
data-testid="tag"
>
<strong>
Updated
</strong>
</span>
</div>
<a
data-cy="download-link"
download=""
href="//"
>
<button
class="usa-button"
data-testid="button"
type="button"
>
<span>
<img
alt="download icon for download package"
src="test-file-stub"
/>
</span>
<span>
Download data sources
</span>
</button>
</a>
</div>
<div>
Last updated: 05/04/22
</div>
<div>
<div>
<span
class="usa-tag"
data-testid="tag"
>
<strong>
Updated
</strong>
</span>
</div>
<a
data-cy="shapefile-link"
download=""
href="//"
>
<button
class="usa-button"
data-testid="button"
type="button"
>
<span>
<img
alt="download icon for download package"
src="test-file-stub"
/>
</span>
<span>
Download shapefile
</span>
</button>
</a>
</div>
<div>
Last updated: 04/26/22
</div>
<div>
<div>
<span
class="usa-tag"
data-testid="tag"
>
<strong>
NEW
</strong>
</span>
</div>
<a
data-cy="tsd-link"
download=""
href="//"
rel="noreferrer"
target="_blank"
>
<button
class="usa-button"
data-testid="button"
type="button"
>
<span>
<img
alt="download icon for download package"
src="test-file-stub"
/>
</span>
<span>
Download technical support document
</span>
</button>
</a>
</div>
<div>
Last updated: 04/19/22
</div>
</div>
</div>
</div>
</div>
</DocumentFragment>
`;

View file

@ -1,114 +0,0 @@
@use '../../styles/design-system.scss' as *;
@mixin baseButtonContainerStyles {
align-self: center;
@include u-margin-top(2);
a {
text-decoration: none;
}
img {
// This should be a global css-filter value as it's generated
// from the primary color.
filter: invert(15%) sepia(9%) saturate(5666%) hue-rotate(175deg) brightness(96%) contrast(95%);
}
}
@mixin baseTextStyle {
@include typeset('sans', 'xs', 3);
@include u-margin-top(2);
@include u-margin-bottom(2);
};
@mixin baseButtonTextStyle {
padding-top: 4px;
padding-left: 5px;
}
.downloadBoxContainer {
color: whitesmoke;
margin: auto;
@include u-margin-top(2.5);
.downloadBox {
@include u-bg('blue-80v');
border-radius: 6px 6px;
// @include u-margin-top(3);
.downloadBoxTextBox {
padding: 25px 25px;
display: flex;
flex-direction: column;
.downloadBoxTitle {
@include typeset('sans', 'xs', 3);
@include u-text('semibold');
}
.downloadSourceText {
@include u-margin-top(2);
}
// Last updated
.lastUpdated {
font-style: italic;
align-self: center;
@include u-margin-top(1);
}
// Data source button (scoped)
.downloadButtonContainer {
display: flex;
flex-direction: column;
@include baseButtonContainerStyles();
text-align: center;
.downloadButtonText {
@include baseButtonTextStyle();
@include u-margin-right(1);
}
.downloadButtonIconSpan {
display: contents;
max-width: 1.5em;
}
.downloadButtonIcon {
width: 1.5em;
height: 1.5em;
}
}
}
}
}
.downloadBoxButton {
@include u-bg('white');
@include u-color('blue-80v');
display: flex;
width: 16em;
}
.tagContainer {
align-self: end;
@include u-margin-bottom(-1);
z-index: 2;
}
.newTag {
@include u-text('bold');
@include u-text("blue-80v");
@include u-bg("gold-20v");
}
.updateTag {
@include u-text('bold');
@include u-text("blue-80v");
@include u-bg("gray-10");
}
.newCalloutFontColor {
@include u-text("gold-20v");
}

View file

@ -1,26 +0,0 @@
declare namespace DownloadPacketModuleScssNamespace {
export interface IDownloadPacketModuleScss {
downloadBoxContainer: string;
downloadBox: string;
downloadBoxTextBox: string;
downloadBoxTitle: string;
downloadSourceText: string;
downloadButtonContainer: string;
downloadBoxButton: string;
downloadButtonText: string;
downloadButtonIconSpan: string;
downloadButtonIcon: string;
tagContainer: string;
newTag: string;
updateTag: string;
newCalloutFontColor: string;
lastUpdated:string;
}
}
declare const DownloadPacketModuleScssModule: DownloadPacketModuleScssNamespace.IDownloadPacketModuleScss & {
/** WARNING: Only available when `css-loader` is used without `style-loader` or `mini-css-extract-plugin` */
locals: DownloadPacketModuleScssNamespace.IDownloadPacketModuleScss;
};
export = DownloadPacketModuleScssModule;

View file

@ -1,3 +0,0 @@
import DownloadPacket from './DownloadPacket';
export default DownloadPacket;

View file

@ -0,0 +1,27 @@
import React from 'react';
import * as styles from './howYouCanHelp.module.scss';
import * as EXPLORE_COPY from '../../data/copy/explore';
const HowYouCanHelp = () => {
return (
<div className={styles.howYouCanHelpContainer}>
<h2>
{EXPLORE_COPY.HOW_YOU_CAN_HELP_LIST_ITEMS.HEADING}
</h2>
<ul className={styles.howYouCanHelpListWrapper}>
<li className={styles.howYouCanHelpList}>
{EXPLORE_COPY.HOW_YOU_CAN_HELP_LIST_ITEMS.LIST_ITEM_1}
</li>
<li className={styles.howYouCanHelpList}>
{EXPLORE_COPY.HOW_YOU_CAN_HELP_LIST_ITEMS.LIST_ITEM_2}
</li>
<li className={styles.howYouCanHelpList}>
{EXPLORE_COPY.HOW_YOU_CAN_HELP_LIST_ITEMS.LIST_ITEM_3}
</li>
</ul>
</div>
);
};
export default HowYouCanHelp;

View file

@ -1,27 +1,3 @@
import React from 'react';
import * as styles from './howYouCanHelp.module.scss';
import * as EXPLORE_COPY from '../../data/copy/explore';
const HowYouCanHelp = () => {
return (
<div className={styles.howYouCanHelpContainer}>
<h2>
{EXPLORE_COPY.HOW_YOU_CAN_HELP_LIST_ITEMS.HEADING}
</h2>
<ul className={styles.howYouCanHelpListWrapper}>
<li className={styles.howYouCanHelpList}>
{EXPLORE_COPY.HOW_YOU_CAN_HELP_LIST_ITEMS.LIST_ITEM_1}
</li>
<li className={styles.howYouCanHelpList}>
{EXPLORE_COPY.HOW_YOU_CAN_HELP_LIST_ITEMS.LIST_ITEM_2}
</li>
<li className={styles.howYouCanHelpList}>
{EXPLORE_COPY.HOW_YOU_CAN_HELP_LIST_ITEMS.LIST_ITEM_3}
</li>
</ul>
</div>
);
};
import HowYouCanHelp from './HowYouCanHelp';
export default HowYouCanHelp;

View file

@ -30,17 +30,7 @@ exports[`rendering of the HowYouCanHelp checks if various text fields are visibl
.
</li>
<li>
Respond to our Request for Information on
<a
class="usa-link usa-link--external"
data-cy=""
href="https://www.federalregister.gov/d/2022-03920"
rel="noreferrer"
target="_blank"
>
federalregister.gov
</a>
.
The Request for Information on the Federal Register is now closed.
</li>
</ul>
</div>

View file

@ -5,14 +5,14 @@ import {
NavMenuButton,
PrimaryNav,
Grid,
Alert,
// NavDropDownButton,
// Menu,
NavDropDownButton,
Menu,
} from '@trussworks/react-uswds';
import BetaBanner from '../BetaBanner';
import J40MainGridContainer from '../J40MainGridContainer';
import GovernmentBanner from '../GovernmentBanner';
import Language from '../Language';
import {useWindowSize} from 'react-use';
// @ts-ignore
import siteLogo from '../../images/j40-logo-v2.png';
@ -20,73 +20,79 @@ import * as styles from './J40Header.module.scss';
import * as COMMON_COPY from '../../data/copy/common';
import {PAGES_ENDPOINTS} from '../../data/constants';
/**
* The J40Header component will control how the header looks for both mobile and desktop
*
* The Header is defined as
* 1. Two rows of Banners (ie, official gov website and beta site)
* 2. Logo and Nav Links Row
* 3. Any Alerts
*
* @return {JSX.Element}
*/
const J40Header = () => {
const intl = useIntl();
const {width} = useWindowSize();
const titleL1 = intl.formatMessage(COMMON_COPY.HEADER.TITLE_LINE_1);
const titleL2 = intl.formatMessage(COMMON_COPY.HEADER.TITLE_LINE_2);
// Logo text
const logoLine1 = intl.formatMessage(COMMON_COPY.HEADER.TITLE_LINE_1);
const logoLine2 = intl.formatMessage(COMMON_COPY.HEADER.TITLE_LINE_2);
/**
* State variable to control the mobile menu toggle
* State variable to control the toggling of mobile menu button
*/
const [mobileNavOpen, setMobileNavOpen] = useState(false);
const toggleMobileNav = (): void =>
setMobileNavOpen((prevOpen) => !prevOpen);
/**
* State variable to hold the open/close state of each nav dropdown. This will allow for two
* dropdown that are being used, each corresponding to an index in the state array:
*
* index 0 = Data & Methodology dropdown (being used)
* index 1 = About dropdown (removed for now)
*/
const [isOpen, setIsOpen] = useState([true]);
const onToggle = (index: number): void => {
setIsOpen((prevIsOpen) => {
const newIsOpen = [true];
newIsOpen[index] = !prevIsOpen[index];
return newIsOpen;
});
};
/**
* The original work of this release called for creating a download page, a FAQ page and TSD page. These
* were to be embedded in dropdown menus in the navigation bar of the header. These were all completed.
* After discovering that the dropdown component from USWDS was not operating as expected, we decided to
* revert to another design.
*
* It was also decided that some more design was needed and that these pages along with their designs will
* be used in the near future. Rather than deleted the code or moving it to another branch, the assumption
* was made that since this will be added back in the near term, let's comment it out for now.
*
* If for some reason we haven't integrated this logic in the near future, this code will be deleted.
* On mobile, the Methodology & Data page should have two sub-nav links. This defines
* the array that will hold these links
*/
const methPageSubNavLinks = [
<Link
to={PAGES_ENDPOINTS.METHODOLOGY}
key={'methodology'}
activeClassName="usa-current"
data-cy={'nav-link-methodology'}>
{intl.formatMessage(COMMON_COPY.HEADER.METHODOLOGY)}
</Link>,
<Link
to={PAGES_ENDPOINTS.DOWNLOADS}
key={'downloads'}
activeClassName="usa-current"
data-cy={'nav-link-downloads'}>
{intl.formatMessage(COMMON_COPY.HEADER.DOWNLOADS)}
</Link>,
// <Link
// to={PAGES_ENDPOINTS.TSD}
// key={'tsd'}
// activeClassName="usa-current"
// data-cy={'nav-link-technical-support-docs'}>
// {intl.formatMessage(COMMON_COPY.HEADER.TSD)}
// </Link>,
];
/**
* State variable to hold the open/close state of each nav dropdown. There are currently two
* dropdowns that are being used, each corresponding to an index in the state array:
*
* index 0 = Data & Methodology dropdown
* index 1 = About dropdown
* In the future, we may want to add sub-pages to the About page. This array will
* define the sub-pages for the About page.
*/
// const [isOpen, setIsOpen] = useState([false, false]);
// const onToggle = (index: number): void => {
// setIsOpen((prevIsOpen) => {
// const newIsOpen = [false, false];
// newIsOpen[index] = !prevIsOpen[index];
// return newIsOpen;
// });
// };
// const methPageSubNavLinks = [
// <Link
// to={PAGES_ENDPOINTS.METHODOLOGY}
// key={'methodology'}
// activeClassName="usa-current"
// data-cy={'nav-link-methodology'}>
// {intl.formatMessage(COMMON_COPY.HEADER.METHODOLOGY)}
// </Link>,
// <Link
// to={PAGES_ENDPOINTS.DOWNLOADS}
// key={'downloads'}
// activeClassName="usa-current"
// data-cy={'nav-link-downloads'}>
// {intl.formatMessage(COMMON_COPY.HEADER.DOWNLOADS)}
// </Link>,
// <Link
// to={PAGES_ENDPOINTS.TSD}
// key={'tsd'}
// activeClassName="usa-current"
// data-cy={'nav-link-technical-support-docs'}>
// {intl.formatMessage(COMMON_COPY.HEADER.TSD)}
// </Link>,
// ];
// const aboutSubNavLinks = [
// <Link
// to={PAGES_ENDPOINTS.ABOUT}
@ -111,6 +117,17 @@ const J40Header = () => {
// </Link>,
// ];
/**
* This is the array that holds the navigation links and eventually is the one
* that is passed to the render function. It only defines Explore, About and
* Contact.
*
* The Methodology & Data link is passed in depending on screen size.
*
* For mobile: the Methodology & Data link should have sub-pages
* For desktop: the Methodology & Data link should NOT have sub-pages
*/
const navLinks = [
<Link
to={PAGES_ENDPOINTS.EXPLORE}
@ -119,13 +136,6 @@ const J40Header = () => {
data-cy={'nav-link-explore-the-map'}>
{intl.formatMessage(COMMON_COPY.HEADER.EXPLORE)}
</Link>,
<Link
to={PAGES_ENDPOINTS.METHODOLOGY}
key={'methodology'}
activeClassName="usa-current"
data-cy={'nav-link-methodology'}>
{intl.formatMessage(COMMON_COPY.HEADER.METHODOLOGY)}
</Link>,
<Link
to={PAGES_ENDPOINTS.ABOUT}
key={'about'}
@ -133,43 +143,6 @@ const J40Header = () => {
data-cy={'nav-link-about'}>
{intl.formatMessage(COMMON_COPY.HEADER.ABOUT)}
</Link>,
// <>
// <NavDropDownButton
// key="methDropDown"
// label={intl.formatMessage(COMMON_COPY.HEADER.METHODOLOGY)}
// menuId="methMenu"
// isOpen={isOpen[0]}
// onToggle={(): void => onToggle(0)}
// data-cy={'nav-dropdown-methodology'}
// className={styles.navDropDownBtn}
// >
// </NavDropDownButton>
// <Menu
// id='methMenu'
// type='subnav'
// items={methPageSubNavLinks}
// isOpen={isOpen[0]}
// >
// </Menu>
// </>,
// <>
// <NavDropDownButton
// key="aboutDropDown"
// label={intl.formatMessage(COMMON_COPY.HEADER.ABOUT)}
// menuId="aboutMenu"
// isOpen={isOpen[1]}
// onToggle={(): void => onToggle(1)}
// data-cy={'nav-dropdown-about'}
// >
// </NavDropDownButton>
// <Menu
// id='aboutMenu'
// type='subnav'
// items={aboutSubNavLinks}
// isOpen={isOpen[1]}
// >
// </Menu>
// </>,
<Link
to={PAGES_ENDPOINTS.CONTACT}
key={'contact'}
@ -182,6 +155,40 @@ const J40Header = () => {
</div>,
];
// For mobile: the Methodology & Data link should have sub-pages
const MethPageNavWithSubPages = () =>
<>
<NavDropDownButton
key="methDropDown"
label={intl.formatMessage(COMMON_COPY.HEADER.METHODOLOGY)}
menuId="methMenu"
isOpen={isOpen[0]}
onToggle={(): void => onToggle(0)}
data-cy={'nav-dropdown-methodology'}
>
</NavDropDownButton>
<Menu
id='methMenu'
type='subnav'
items={methPageSubNavLinks}
isOpen={isOpen[0]}
>
</Menu>
</>;
// For desktop: the Methodology & Data link should NOT have sub-pages
const MethPageNav = () =>
<Link
to={PAGES_ENDPOINTS.METHODOLOGY}
key={'methodology'}
activeClassName="usa-current"
data-cy={'nav-link-methodology'}>
{intl.formatMessage(COMMON_COPY.HEADER.METHODOLOGY)}
</Link>;
// Modify navLinks to choose the appropriate Methodology & Data nav link depending on screen size
navLinks.splice(1, 0, width > 1024 ? <MethPageNav/> : <MethPageNavWithSubPages/>);
return (
<Header basic={true} role={'banner'}>
@ -196,15 +203,15 @@ const J40Header = () => {
{/* Logo */}
<Grid col={1}>
<img className={styles.logo} src={siteLogo} alt={`${titleL1} ${titleL2}`} />
<img className={styles.logo} src={siteLogo} alt={`${logoLine1} ${logoLine2}`} />
</Grid>
{/* Logo Title */}
<Grid col={6}>
<div className={styles.logoTitle}>
<div>{titleL1}</div>
<div>{logoLine1}</div>
<div className={styles.title2BetaPill}>
<div> {titleL2} </div>
<div> {logoLine2} </div>
<div className={styles.betaPill}>BETA</div>
</div>
</div>
@ -230,7 +237,7 @@ const J40Header = () => {
</J40MainGridContainer>
{/* Alert */}
{<J40MainGridContainer>
{/* {<J40MainGridContainer>
<Alert
className={styles.alert}
type="info"
@ -245,7 +252,7 @@ const J40Header = () => {
{COMMON_COPY.ALERTS.ALERT_1_DESCRIPTION}
</Alert>
</J40MainGridContainer>
}
} */}
</Header>
);
};

View file

@ -247,12 +247,43 @@ exports[`rendering of the J40Header checks if component renders 1`] = `
<li
class="usa-nav__primary-item"
>
<a
data-cy="nav-link-methodology"
href="/en/methodology"
<button
aria-controls="methMenu"
aria-expanded="true"
class="usa-accordion__button usa-nav__link"
data-cy="nav-dropdown-methodology"
data-testid="navDropDownButton"
type="button"
>
Methodology & data
</a>
<span>
Methodology & data
</span>
</button>
<ul
class="usa-nav__submenu"
id="methMenu"
>
<li
class="usa-nav__submenu-item"
>
<a
data-cy="nav-link-methodology"
href="/en/methodology"
>
Methodology & data
</a>
</li>
<li
class="usa-nav__submenu-item"
>
<a
data-cy="nav-link-downloads"
href="/en/downloads"
>
Downloads
</a>
</li>
</ul>
</li>
<li
class="usa-nav__primary-item"
@ -301,79 +332,6 @@ exports[`rendering of the J40Header checks if component renders 1`] = `
</div>
</div>
</div>
<div
class="grid-container-desktop-lg"
data-testid="gridContainer"
>
<div
class="usa-alert usa-alert--info"
data-testid="alert"
>
<div
class="usa-alert__body"
>
<h4
class="usa-alert__heading"
>
Additional documentation now available
</h4>
<p
class="usa-alert__text"
>
Download new
<a
class="usa-link usa-link--external"
data-cy=""
href="https://static-data-screeningtool.geoplatform.gov/data-pipeline/data/score/downloadable/cejst_technical_support_document.pdf"
rel="noreferrer"
target="_blank"
>
technical support
</a>
and other documentation and
<a
class="usa-link usa-link--external"
data-cy=""
href="mailto:Screeningtool-Support@omb.eop.gov"
rel="noreferrer"
target="_blank"
>
send feedback
</a>
.
</p>
</div>
</div>
<div
class="usa-alert usa-alert--info"
data-testid="alert"
>
<div
class="usa-alert__body"
>
<h4
class="usa-alert__heading"
>
Public comment period extended
</h4>
<p
class="usa-alert__text"
>
The public comment period for
<a
class="usa-link usa-link--external"
data-cy=""
href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
rel="noreferrer"
target="_blank"
>
sending feedback
</a>
via the Request for Information has been extended to May 25, 2022.
</p>
</div>
</div>
</div>
</header>
</DocumentFragment>
`;

View file

@ -4,7 +4,7 @@ import {Link as TrussLink} from '@trussworks/react-uswds';
import {IDefineMessage} from '../../data/copy/common';
interface ILinkTypeWrapper {
export interface ILinkTypeWrapper {
linkText?: string | JSX.Element;
internal?: boolean;
url: string | IDefineMessage;

View file

@ -17,6 +17,7 @@
display: flex;
flex-direction: column;
@include u-padding-top(2.5);
@include u-margin-top(4);
.link, .link:visited {
color:white;

View file

@ -1,6 +1,9 @@
import React from 'react';
import {useIntl, Link} from 'gatsby-plugin-intl';
import {Button, Tag} from '@trussworks/react-uswds';
import {
Button,
// Tag
} from '@trussworks/react-uswds';
import * as styles from './PublicEngageButton.module.scss';
import * as PUBLIC_ENG_COPY from '../../data/copy/publicEngage';
@ -13,11 +16,12 @@ const PublicEngageButton = () => {
return (
<div className={styles.container}>
<div className={styles.tagContainer}>
{/* Remove Updated Tag for now */}
{/* <div className={styles.tagContainer}>
<Tag className={styles.tag}>
{intl.formatMessage(PUBLIC_ENG_COPY.PUBLIC_ENG_BUTTON.TAG_LABEL)}
</Tag>
</div>
</div> */}
<Link className={styles.link} to={'/public-engagement'}>
<Button
type="button"

View file

@ -3,14 +3,6 @@
exports[`rendering of the PublicEngageButton checks if component renders 1`] = `
<DocumentFragment>
<div>
<div>
<span
class="usa-tag"
data-testid="tag"
>
UPDATED
</span>
</div>
<a
href="/en/public-engagement"
>

View file

@ -4,7 +4,6 @@ import {useIntl} from 'gatsby-plugin-intl';
import * as CONTACT_COPY from '../../data/copy/contact';
import * as styles from './RequestForInfo.module.scss';
import * as COMMON_COPY from '../../data/copy/common';
const RequestForInfo = () => {
const intl = useIntl();
@ -12,7 +11,6 @@ const RequestForInfo = () => {
return (
<SummaryBox className={styles.rfiBox} heading={intl.formatMessage(CONTACT_COPY.RFI_BOX.TITLE)}>
<p>{CONTACT_COPY.RFI_BOX_BODY}</p>
<p>{COMMON_COPY.ALERTS.ALERT_1_DESCRIPTION}</p>
</SummaryBox>
);
};

View file

@ -18,30 +18,7 @@ exports[`rendering of the RequestForInfo checks if component renders 1`] = `
class="usa-summary-box__text"
>
<p>
During the beta period, comments may be submitted on the Climate and Economic Justice Screening Tool via CEQs Request for Information available on
<a
class="usa-link usa-link--external"
data-cy=""
href="https://www.federalregister.gov/d/2022-03920"
rel="noreferrer"
target="_blank"
>
federalregister.gov
</a>
.
</p>
<p>
The public comment period for
<a
class="usa-link usa-link--external"
data-cy=""
href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
rel="noreferrer"
target="_blank"
>
sending feedback
</a>
via the Request for Information has been extended to May 25, 2022.
The Request for Information on the Federal Register for the public beta period closed on May 25, 2022
</p>
</div>
</div>

View file

@ -0,0 +1,35 @@
import * as React from 'react';
import {render} from '@testing-library/react';
import {LocalizedComponent} from '../../test/testHelpers';
import SubPageNav from './SubPageNav';
describe('rendering of the SubPageNav', () => {
const firstLinkActive = 1;
const secondLinkIndex = 2;
it('checks if the first link is active', () => {
const {container} = render(
<LocalizedComponent>
<SubPageNav activeSubPageIndex={firstLinkActive}/>
</LocalizedComponent>,
);
const firstLink = container.querySelector(`.usa-sidenav li:nth-child(${firstLinkActive}) a`);
const secondLink = container.querySelector(`.usa-sidenav li:nth-child(${secondLinkIndex}) a`);
expect(firstLink?.className).toBe('usa-current');
expect(secondLink?.className).not.toBe('usa-current');
});
it('checks if the second link is active', () => {
const {container} = render(
<LocalizedComponent>
<SubPageNav activeSubPageIndex={secondLinkIndex}/>
</LocalizedComponent>,
);
const firstLink = container.querySelector(`.usa-sidenav li:nth-child(${firstLinkActive}) a`);
const secondLink = container.querySelector(`.usa-sidenav li:nth-child(${secondLinkIndex}) a`);
expect(secondLink?.className).toBe('usa-current');
expect(firstLink?.className).not.toBe('usa-current');
});
});

View file

@ -0,0 +1,39 @@
import React from 'react';
import {SideNav} from '@trussworks/react-uswds';
import {useIntl} from 'gatsby-plugin-intl';
import LinkTypeWrapper from '../LinkTypeWrapper';
import {PAGES_ENDPOINTS} from '../../data/constants';
import * as COMMON_COPY from '../../data/copy/common';
// This prop is used to set which sub-page navigation is active
interface ISubPageNav {
activeSubPageIndex?: number;
}
const SubPageNav = ({activeSubPageIndex}:ISubPageNav) => {
const intl = useIntl();
const subPages = [
<LinkTypeWrapper
key={0}
className={activeSubPageIndex === 1 ? 'usa-current' : ''}
url={PAGES_ENDPOINTS.METHODOLOGY}
internal={true}
linkText={intl.formatMessage(COMMON_COPY.HEADER.METHODOLOGY)}
/>,
<LinkTypeWrapper
key={1}
className={activeSubPageIndex === 2 ? 'usa-current' : ''}
url={PAGES_ENDPOINTS.DOWNLOADS}
internal={true}
linkText={intl.formatMessage(COMMON_COPY.HEADER.DOWNLOADS)}
/>,
];
return (
<SideNav items={subPages}/>
);
};
export default SubPageNav;

View file

@ -0,0 +1,3 @@
import SubPageNav from './SubPageNav';
export default SubPageNav;

View file

@ -4,6 +4,7 @@ import React from 'react';
import {FormattedDate, FormattedMessage} from 'gatsby-plugin-intl';
import {defineMessages} from 'react-intl';
import LinkTypeWrapper from '../../components/LinkTypeWrapper';
import DownloadLink from '../../components/DownloadLink';
export interface IDefineMessage {
id: string,
@ -20,6 +21,8 @@ export interface IDefineMessage {
export const italicFn = (str:string) => <i>{str}</i>;
export const boldFn = (str:string) => <strong>{str}</strong>;
export const simpleLink = (href:string) => (str:string) => <a href={href}>{str}</a>;
// export const downloadLink = (href:string) => (str:string) => <a href={href} download>{str}</a>;
export const downloadLink = (href:string) => (str:string) => <DownloadLink href={href} linkText={str} />;
// eslint-disable-next-line max-len
export const linkFn = (to:string | IDefineMessage, isInternal:boolean, isOpenNewTab:boolean) => (str:string) => <LinkTypeWrapper linkText={str} internal={isInternal} url={to} openUrlNewTab={isOpenNewTab}/>;
@ -51,7 +54,7 @@ export const TSD = defineMessages({
// Alerts
// Expiration month is zero-based: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/getMonth
const ALERT_1_EXPIRATION_DATE= new Date(2022, 4, 25, 11, 59, 59); // May 25
export const RFI_EXPIRATION_DATE= new Date(2022, 4, 25, 11, 59, 59); // May 25
export const ALERTS = {
ALERT_1_TITLE: defineMessages({
TITLE: {
@ -60,7 +63,7 @@ export const ALERTS = {
description: 'Alert title that appears on landing page.',
},
}),
EXPIRATION_DATE: ALERT_1_EXPIRATION_DATE,
EXPIRATION_DATE: RFI_EXPIRATION_DATE,
ALERT_1_DESCRIPTION: <FormattedMessage
id={'common.pages.alerts.public_comment_period.description'}
defaultMessage={`The public comment period for <link1>sending feedback</link1> via the Request for Information has been extended to {expDate1}.`}
@ -68,7 +71,7 @@ export const ALERTS = {
values={{
link1: linkFn('https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version', false, true),
expDate1: <FormattedDate
value={ALERT_1_EXPIRATION_DATE}
value={RFI_EXPIRATION_DATE}
year="numeric"
month="short"
day="numeric"

View file

@ -1,10 +1,9 @@
/* eslint-disable max-len */
import React from 'react';
import {defineMessages} from 'react-intl';
import {FormattedMessage} from 'gatsby-plugin-intl';
import {FormattedDate, FormattedMessage} from 'gatsby-plugin-intl';
import * as COMMON_COPY from './common';
import {PAGES_ENDPOINTS} from '../constants';
import {FOOTER} from './common';
export const PAGE_INTRO = defineMessages({
PAGE_TILE: {
@ -49,10 +48,15 @@ export const RFI_BOX = defineMessages({
export const RFI_BOX_BODY = <FormattedMessage
id={'contact.page.request.for.info.box.body'}
defaultMessage={`During the beta period, comments may be submitted on the Climate and Economic Justice Screening Tool via CEQs Request for Information available on <link1>federalregister.gov</link1>.`}
defaultMessage={`The Request for Information on the Federal Register for the public beta period closed on {rfiExpDate}`}
description={'Navigate to the contact page, this is the body of the request for information box'}
values={{
link1: COMMON_COPY.linkFn(FOOTER.RFI_LINK.defaultMessage, false, true),
rfiExpDate: <FormattedDate
value={COMMON_COPY.RFI_EXPIRATION_DATE}
year="numeric"
month="long"
day="numeric"
/>,
}}
/>;

View file

@ -2,7 +2,7 @@
import React from 'react';
import {defineMessages} from 'react-intl';
import {FormattedMessage, FormattedNumber} from 'gatsby-plugin-intl';
import {simpleLink} from './common';
import * as COMMON_COPY from './common';
export const PAGE_INTRO = defineMessages({
PAGE_TILE: {
@ -27,53 +27,129 @@ export const PAGE_INTRO = defineMessages({
},
});
export const DOWNLOAD_LINKS = {
EXCEL: <FormattedMessage
id={'downloads.page.excel.link'}
defaultMessage={`
<link1>Excel file</link1> (.xlxs {excelFileSize} unzipped)
`}
description={'On the downloads page, the description of the excel link'}
values={{
link1: (str:string) => <a href='/about'>{str}</a>,
excelFileSize: <FormattedNumber
value={54}
style="unit"
unit="megabyte"
unitDisplay="narrow"
/>,
}}
/>,
CSV: <FormattedMessage
id={'downloads.page.csv.link'}
defaultMessage={`
<link1>CSV file </link1> (.csv {csvFileSize} unzipped)
`}
description={'On the downloads page, the description of the csv link'}
values={{
link1: simpleLink('/csv'),
csvFileSize: <FormattedNumber
value={52}
style="unit"
unit="megabyte"
unitDisplay="narrow"
/>,
}}
/>,
SHAPE: <FormattedMessage
id={'downloads.page.shape.link'}
defaultMessage={`
<link1>Shapefiles </link1> (Codebook included with geojson {shapeFileSize} unzipped)
`}
description={'On the downloads page, the description of the shapefiles link'}
values={{
link1: simpleLink('/shape'),
shapeFileSize: <FormattedNumber
value={110}
style="unit"
unit="megabyte"
unitDisplay="narrow"
/>,
}}
/>,
const getDownloadFileUrl = (filePath:string | undefined) => {
return [
process.env.GATSBY_CDN_TILES_BASE_URL,
process.env.GATSBY_DATA_PIPELINE_SCORE_PATH,
filePath,
].join('/');
};
// Define meta data on dowload files
export const DOWNLOAD_FILES = {
SCREENING_TOOL_DATA_ZIP: {
SIZE: 53.7, // MB
URL: getDownloadFileUrl(process.env.GATSBY_FILE_DL_PATH_SCREENING_TOOL_DATA_ZIP),
LAST_UPDATED: new Date('5/4/2022').getTime(),
},
COMMUNITIES_LIST_CSV: {
SIZE: 28.1, // MB
URL: getDownloadFileUrl(process.env.GATSBY_FILE_DL_PATH_COMMUNITIES_LIST_CSV),
LAST_UPDATED: new Date('5/4/2022').getTime(),
},
COMMUNITIES_LIST_XLS: {
SIZE: 24.9, // MB
URL: getDownloadFileUrl(process.env.GATSBY_FILE_DL_PATH_COMMUNITIES_LIST_XLS),
LAST_UPDATED: new Date('5/4/2022').getTime(),
},
SHAPE_FILE: {
SIZE: 741, // MB
URL: getDownloadFileUrl(process.env.GATSBY_FILE_DL_PATH_SHAPE_FILE_ZIP),
LAST_UPDATED: new Date('5/4/2022').getTime(),
},
TSD: {
SIZE: 2.5, // MB
URL: getDownloadFileUrl(process.env.GATSBY_FILE_DL_PATH_TSD_PDF),
LAST_UPDATED: new Date('5/4/2022').getTime(),
},
HOW_TO_COMMUNITIES: {
SIZE: 674, // KB
URL: getDownloadFileUrl(process.env.GATSBY_FILE_DL_PATH_HOW_TO_COMMUNITIES_PDF),
LAST_UPDATED: new Date('5/4/2022').getTime(),
},
};
// If this is not a function, it will cause a circular dependency
export const getDownloadIconAltTag = () => defineMessages({
ALT_TAG: {
id: 'downloads.page.download.icon.alt.tag',
defaultMessage: 'The icon used to indicate that the file is downloadable',
description: 'Navigate to the Downloads page, this is the icon used to indicate that the file is downloadable',
},
});
export const DOWNLOAD_LINKS = {
LINK1: <FormattedMessage
id={'download.page.download.file.1'}
defaultMessage={`
<link1>Communities list data</link1> (.xlsx {cldXlsFileSize})
`}
description={'Navigate to the download page. This is first download file link'}
values={{
link1: COMMON_COPY.downloadLink(DOWNLOAD_FILES.COMMUNITIES_LIST_XLS.URL),
cldXlsFileSize: <FormattedNumber
value={DOWNLOAD_FILES.COMMUNITIES_LIST_XLS.SIZE}
style="unit"
unit="megabyte"
unitDisplay="narrow"
/>,
}}
/>,
LINK2: <FormattedMessage
id={'download.page.download.file.2'}
defaultMessage={`<link2>Communities list data</link2> (.csv {cldCsvFileSize})`}
description={'Navigate to the download page. This is second download file link'}
values={{
link2: COMMON_COPY.downloadLink(DOWNLOAD_FILES.COMMUNITIES_LIST_CSV.URL),
cldCsvFileSize: <FormattedNumber
value={DOWNLOAD_FILES.COMMUNITIES_LIST_CSV.SIZE}
style="unit"
unit="megabyte"
unitDisplay="narrow"
/>,
}}
/>,
LINK3: <FormattedMessage
id={'download.page.download.file.3'}
defaultMessage={`<link3>Shapefile</link3> (Codebook included with geojson {shapeFileSize} unzipped)`}
description={'Navigate to the download page. This is third download file link'}
values={{
link3: COMMON_COPY.downloadLink(DOWNLOAD_FILES.SHAPE_FILE.URL),
shapeFileSize: <FormattedNumber
value={DOWNLOAD_FILES.SHAPE_FILE.SIZE}
style="unit"
unit="megabyte"
unitDisplay="narrow"
/>,
}}
/>,
LINK4: <FormattedMessage
id={'download.page.download.file.4'}
defaultMessage={`<link4>Technical support document</link4> (.pdf {tsdFileSize})`}
description={'Navigate to the download page. This is fourth download file link'}
values={{
link4: COMMON_COPY.linkFn(DOWNLOAD_FILES.TSD.URL, false, true),
tsdFileSize: <FormattedNumber
value={DOWNLOAD_FILES.TSD.SIZE}
style="unit"
unit="megabyte"
unitDisplay="narrow"
/>,
}}
/>,
LINK5: <FormattedMessage
id={'download.page.download.file.5'}
defaultMessage={`<link5>How to use the list of communities</link5> (.pdf {howToCommFileSize})`}
description={'Navigate to the download page. This is fifth download file link'}
values={{
link5: COMMON_COPY.linkFn(DOWNLOAD_FILES.HOW_TO_COMMUNITIES.URL, false, true),
howToCommFileSize: <FormattedNumber
value={DOWNLOAD_FILES.HOW_TO_COMMUNITIES.SIZE}
style="unit"
unit="kilobyte"
unitDisplay="narrow"
/>,
}}
/>,
// };
};

View file

@ -5,8 +5,8 @@ import {defineMessages} from 'react-intl';
import {FormattedDate, FormattedMessage, FormattedNumber} from 'gatsby-plugin-intl';
import * as COMMON_COPY from './common';
import * as DOWNLOADS_COPY from './downloads';
import * as METHODOLOGY_COPY from './methodology';
import {simpleLink, linkFn} from './common';
import {PAGES_ENDPOINTS} from '../constants';
export const PAGE_INTRO = defineMessages({
@ -32,7 +32,7 @@ export const PAGE_DESCRIPTION = <FormattedMessage
`}
description={'On the explore the map page, the description of the page'}
values={{
link1: linkFn(PAGES_ENDPOINTS.METHODOLOGY, true, false),
link1: COMMON_COPY.linkFn(PAGES_ENDPOINTS.METHODOLOGY, true, false),
}}
/>;
@ -777,15 +777,15 @@ export const DOWNLOAD_DRAFT = {
map that will download the data packet
`}
values={{
link1: simpleLink(METHODOLOGY_COPY.DOWNLOAD_ZIP_URL),
link1: COMMON_COPY.downloadLink(DOWNLOADS_COPY.DOWNLOAD_FILES.SHAPE_FILE.URL),
downloadFileSize: <FormattedNumber
value={METHODOLOGY_COPY.DOWNLOAD_FILE_SIZE}
value={DOWNLOADS_COPY.DOWNLOAD_FILES.SHAPE_FILE.SIZE}
style="unit"
unit="megabyte"
unitDisplay="narrow"
/>,
dateUpdated: <FormattedDate
value={METHODOLOGY_COPY.DOWNLOAD_ZIP_LAST_UPDATED}
value={DOWNLOADS_COPY.DOWNLOAD_FILES.SHAPE_FILE.LAST_UPDATED}
year="2-digit"
month="2-digit"
day="2-digit"
@ -809,7 +809,7 @@ export const NOTE_ON_TERRITORIES = {
`}
description={`Navigate to the explore the map page. Under the map, you will see territories paragraph 1`}
values={{
link1: linkFn(PAGES_ENDPOINTS.METHODOLOGY, true, false),
link1: COMMON_COPY.linkFn(PAGES_ENDPOINTS.METHODOLOGY, true, false),
}}
/>,
PARA_2: <FormattedMessage
@ -863,10 +863,10 @@ export const NOTE_ON_TRIBAL_NATIONS = {
`}
description={`Navigate to the explore the map page. Under the map, you will see tribal nations paragraph 1`}
values={{
link1: linkFn(PAGES_ENDPOINTS.METHODOLOGY, true, false),
link2: linkFn(`https://www.whitehouse.gov/wp-content/uploads/2022/01/CEQ-Tribal-Consultation-Plan-04.26.2021.pdf`, false, true),
link3: linkFn(`https://www.whitehouse.gov/briefing-room/presidential-actions/2021/01/26/memorandum-on-tribal-consultation-and-strengthening-nation-to-nation-relationships/`, false, true),
link4: linkFn(`https://www.federalregister.gov/documents/2000/11/09/00-29003/consultation-and-coordination-with-indian-tribal-governments`, false, true),
link1: COMMON_COPY.linkFn(PAGES_ENDPOINTS.METHODOLOGY, true, false),
link2: COMMON_COPY.linkFn(`https://www.whitehouse.gov/wp-content/uploads/2022/01/CEQ-Tribal-Consultation-Plan-04.26.2021.pdf`, false, true),
link3: COMMON_COPY.linkFn(`https://www.whitehouse.gov/briefing-room/presidential-actions/2021/01/26/memorandum-on-tribal-consultation-and-strengthening-nation-to-nation-relationships/`, false, true),
link4: COMMON_COPY.linkFn(`https://www.federalregister.gov/documents/2000/11/09/00-29003/consultation-and-coordination-with-indian-tribal-governments`, false, true),
}}
/>,
};
@ -884,7 +884,7 @@ export const HOW_YOU_CAN_HELP_LIST_ITEMS = {
`}
defaultMessage={`View the <link1>Methodology & data</link1> page and send feedback.`}
values={{
link1: linkFn(PAGES_ENDPOINTS.METHODOLOGY, true, false),
link1: COMMON_COPY.linkFn(PAGES_ENDPOINTS.METHODOLOGY, true, false),
}}
/>,
LIST_ITEM_2: <FormattedMessage
@ -892,16 +892,13 @@ export const HOW_YOU_CAN_HELP_LIST_ITEMS = {
description={`Navigate to the explore the map page. Under the map, you will see share your feedback`}
defaultMessage={`Use the map to find communities and <link1>share your feedback</link1>.`}
values={{
link1: linkFn(`mailto:${COMMON_COPY.FEEDBACK_EMAIL}`, false, true),
link1: COMMON_COPY.linkFn(`mailto:${COMMON_COPY.FEEDBACK_EMAIL}`, false, true),
}}
/>,
LIST_ITEM_3: <FormattedMessage
id={'explore.map.page.under.map.how.you.can.help.list.item.3'}
description={`Navigate to the explore the map page. Under the map, you will see share your feedback`}
defaultMessage={`Respond to our Request for Information on <link1>federalregister.gov</link1>.`}
values={{
link1: linkFn(`https://www.federalregister.gov/d/2022-03920`, false, true),
}}
description={`Navigate to the explore the map page. Under the map, you will see RFI is expired`}
defaultMessage={`The Request for Information on the Federal Register is now closed.`}
/>,
};

View file

@ -1,9 +1,10 @@
/* eslint-disable max-len */
import React from 'react';
import {defineMessages} from 'react-intl';
import {FormattedDate, FormattedMessage, FormattedNumber} from 'gatsby-plugin-intl';
import {FormattedMessage} from 'gatsby-plugin-intl';
import {boldFn, linkFn, simpleLink} from './common';
import * as styles from '../../components/DownloadPacket/downloadPacket.module.scss';
export const VERSION_NUMBER = 0.1;
export const PAGE = defineMessages({
TILE: {
@ -40,7 +41,6 @@ export const PAGE = defineMessages({
});
export const FORMULA = {
INTRO: <FormattedMessage
id={'methodology.page.formula.intro'}
@ -72,143 +72,6 @@ export const FORMULA = {
/>,
};
// Download Package
export const DOWNLOAD_FILE_SIZE = 53;
export const DOWNLOAD_SHAPE_FILE_SIZE = 742;
export const DOWNLOAD_TSD_FILE_SIZE = 2.5;
export const DOWNLOAD_ZIP_LAST_UPDATED = new Date('5/4/2022').getTime();
export const DOWNLOAD_SHAPE_LAST_UPDATED = new Date('4/26/2022').getTime();
export const DOWNLOAD_TSD_LAST_UPDATED = new Date('4/19/2022').getTime();
export const VERSION_NUMBER = 0.1;
export const DOWNLOAD_ZIP_URL = [
process.env.GATSBY_CDN_TILES_BASE_URL,
process.env.GATSBY_DATA_PIPELINE_SCORE_PATH,
process.env.GATSBY_SCORE_DOWNLOAD_FILE_PATH,
].join('/');
export const DOWNLOAD_SHAPEFILE_URL = [
process.env.GATSBY_CDN_TILES_BASE_URL,
process.env.GATSBY_DATA_PIPELINE_SCORE_PATH,
process.env.GATSBY_SHAPE_FILE_PATH,
].join('/');
// TSD = Tech Support Document
export const DOWNLOAD_TSD_URL = [
process.env.GATSBY_CDN_TILES_BASE_URL,
process.env.GATSBY_DATA_PIPELINE_SCORE_PATH,
process.env.GATSBY_TSD_DOWNLOAD_FILE_PATH,
].join('/');
const newCalloutFontColorFn = (str: string) => <span className={styles.newCalloutFontColor}>{str}</span>;
export const DOWNLOAD_PACKAGE = {
TITLE: <FormattedMessage
id={'methodology.page.downloadPacket.header.text'}
defaultMessage={`<callout>NEW</callout> files available for download`}
description={'Navigate to the methodology page. This is the download packet header text'}
values={{
callout: newCalloutFontColorFn,
}}
/>,
DESCRIPTION1: <FormattedMessage
id={'methodology.page.downloadPacket.info.text1'}
defaultMessage={`Download the data sources used in the CEJST (.csv, .xlxs, <callout>.pdf</callout> that describes how to use the list, and a <callout>codebook</callout>, {downloadFileSize} unzipped), the shapefile, along with a <callout>codebook</callout> (.zip, {shapefileSize} unzipped) or the technical support document (.pdf, {tsdFileSize} unzipped).`}
description={'Navigate to the methodology page. This is the download packet info text'}
values={{
callout: newCalloutFontColorFn,
downloadFileSize: <FormattedNumber
value={DOWNLOAD_FILE_SIZE}
style="unit"
unit="megabyte"
unitDisplay="narrow"
/>,
shapefileSize: <FormattedNumber
value={DOWNLOAD_SHAPE_FILE_SIZE}
style="unit"
unit="megabyte"
unitDisplay="narrow"
/>,
tsdFileSize: <FormattedNumber
value={DOWNLOAD_TSD_FILE_SIZE}
style="unit"
unit="megabyte"
unitDisplay="narrow"
/>,
}}
/>,
ZIP_LAST_UPDATED: <FormattedMessage
id={'methodology.page.downloadPacket.info.zip.last.updated'}
defaultMessage={`Last updated: {downloadLastUpdated} `}
description={'Navigate to the methodology page. This is the download packet info last updated'}
values={{
downloadLastUpdated: <FormattedDate
value={DOWNLOAD_ZIP_LAST_UPDATED}
year="2-digit"
month="2-digit"
day="2-digit"
/>,
}}
/>,
SHAPE_LAST_UPDATED: <FormattedMessage
id={'methodology.page.downloadPacket.info.shape.last.updated'}
defaultMessage={`Last updated: {shapeLastUpdated} `}
description={'Navigate to the methodology page. This is the download packet info last updated'}
values={{
shapeLastUpdated: <FormattedDate
value={DOWNLOAD_SHAPE_LAST_UPDATED}
year="2-digit"
month="2-digit"
day="2-digit"
/>,
}}
/>,
TSD_LAST_UPDATED: <FormattedMessage
id={'methodology.page.downloadPacket.info.tsd.last.updated'}
defaultMessage={`Last updated: {tsdLastUpdated} `}
description={'Navigate to the methodology page. This is the download packet info last updated'}
values={{
tsdLastUpdated: <FormattedDate
value={DOWNLOAD_TSD_LAST_UPDATED}
year="2-digit"
month="2-digit"
day="2-digit"
/>,
}}
/>,
BUTTON_TEXT1: <FormattedMessage
id={'methodology.page.downloadPacket.button1.text'}
defaultMessage={'Download data sources'}
description={'Navigate to the methodology page. This is the download packet button text'}
/>,
BUTTON_TEXT2: <FormattedMessage
id={'methodology.page.downloadPacket.button2.text'}
defaultMessage={'Download shapefile'}
description={'Navigate to the methodology page. This is the download shapefiles text'}
/>,
BUTTON_TEXT3: <FormattedMessage
id={'methodology.page.downloadPacket.button3.text'}
defaultMessage={'Download technical support document'}
description={'Navigate to the methodology page. This is the download technical support document spreadsheet'}
/>,
NEW_TAG: <FormattedMessage
id={'methodology.page.downloadPacket.new.tag.text'}
defaultMessage={`<boldtag>NEW</boldtag>`}
description={'Navigate to the methodology page. This is the new tag text'}
values={{
boldtag: boldFn,
}}
/>,
UPDATED_TAG: <FormattedMessage
id={'methodology.page.downloadPacket.updated.tag.text'}
defaultMessage={`<boldtag>Updated</boldtag>`}
description={'Navigate to the methodology page. This is the update callout tag text that overlaps the button'}
values={{
boldtag: boldFn,
}}
/>,
};
export const CATEGORY = {
HEADING: <FormattedMessage
id={'methodology.page.indicator.categories.heading'}

View file

@ -272,7 +272,7 @@
"description": "Navigate to the contact page, this is the contact page header text"
},
"contact.page.request.for.info.box.body": {
"defaultMessage": "During the beta period, comments may be submitted on the Climate and Economic Justice Screening Tool via CEQs Request for Information available on <link1>federalregister.gov</link1>.",
"defaultMessage": "The Request for Information on the Federal Register for the public beta period closed on {rfiExpDate}",
"description": "Navigate to the contact page, this is the body of the request for information box"
},
"contact.page.request.for.info.box.title": {
@ -287,17 +287,33 @@
"defaultMessage": "Contact",
"description": "Navigate to the contact page, this is the contact page title text"
},
"downloads.page.csv.link": {
"defaultMessage": "<link1>CSV file </link1> (.csv {csvFileSize} unzipped)",
"description": "On the downloads page, the description of the csv link"
"download.page.download.file.1": {
"defaultMessage": "<link1>Communities list data</link1> (.xlsx {cldXlsFileSize})",
"description": "Navigate to the download page. This is first download file link"
},
"download.page.download.file.2": {
"defaultMessage": "<link2>Communities list data</link2> (.csv {cldCsvFileSize})",
"description": "Navigate to the download page. This is second download file link"
},
"download.page.download.file.3": {
"defaultMessage": "<link3>Shapefile</link3> (Codebook included with geojson {shapeFileSize} unzipped)",
"description": "Navigate to the download page. This is third download file link"
},
"download.page.download.file.4": {
"defaultMessage": "<link4>Technical support document</link4> (.pdf {tsdFileSize})",
"description": "Navigate to the download page. This is fourth download file link"
},
"download.page.download.file.5": {
"defaultMessage": "<link5>How to use the list of communities</link5> (.pdf {howToCommFileSize})",
"description": "Navigate to the download page. This is fifth download file link"
},
"downloads.page.description1.text": {
"defaultMessage": "The dataset used in the tool, along with a data dictionary and information about how to use the list of communities (.pdf) are available in the following file formats:",
"description": "Navigate to the Downloads page, this will be the page description1 text"
},
"downloads.page.excel.link": {
"defaultMessage": "<link1>Excel file</link1> (.xlxs {excelFileSize} unzipped)",
"description": "On the downloads page, the description of the excel link"
"downloads.page.download.icon.alt.tag": {
"defaultMessage": "The icon used to indicate that the file is downloadable",
"description": "Navigate to the Downloads page, this is the icon used to indicate that the file is downloadable"
},
"downloads.page.heading1.text": {
"defaultMessage": "Downloads",
@ -307,10 +323,6 @@
"defaultMessage": "File formats",
"description": "Navigate to the Downloads page, this will be the page heading2 text"
},
"downloads.page.shape.link": {
"defaultMessage": "<link1>Shapefiles </link1> (Codebook included with geojson {shapeFileSize} unzipped)",
"description": "On the downloads page, the description of the shapefiles link"
},
"downloads.page.title.text": {
"defaultMessage": "Downloads",
"description": "Navigate to the Downloads page, this will be the page title text"
@ -816,8 +828,8 @@
"description": "Navigate to the explore the map page. Under the map, you will see share your feedback"
},
"explore.map.page.under.map.how.you.can.help.list.item.3": {
"defaultMessage": "Respond to our Request for Information on <link1>federalregister.gov</link1>.",
"description": "Navigate to the explore the map page. Under the map, you will see share your feedback"
"defaultMessage": "The Request for Information on the Federal Register is now closed.",
"description": "Navigate to the explore the map page. Under the map, you will see RFI is expired"
},
"explore.map.page.under.map.note.on.territories.intro": {
"defaultMessage": "A note on the U.S. territories",
@ -1235,46 +1247,6 @@
"defaultMessage": "All categories",
"description": "Navigate to the methodology page. Navigate to the dataset section. This is the portion of the dataset card Used In text for all methodologies"
},
"methodology.page.downloadPacket.button1.text": {
"defaultMessage": "Download data sources",
"description": "Navigate to the methodology page. This is the download packet button text"
},
"methodology.page.downloadPacket.button2.text": {
"defaultMessage": "Download shapefile",
"description": "Navigate to the methodology page. This is the download shapefiles text"
},
"methodology.page.downloadPacket.button3.text": {
"defaultMessage": "Download technical support document",
"description": "Navigate to the methodology page. This is the download technical support document spreadsheet"
},
"methodology.page.downloadPacket.header.text": {
"defaultMessage": "<callout>NEW</callout> files available for download",
"description": "Navigate to the methodology page. This is the download packet header text"
},
"methodology.page.downloadPacket.info.shape.last.updated": {
"defaultMessage": "Last updated: {shapeLastUpdated}",
"description": "Navigate to the methodology page. This is the download packet info last updated"
},
"methodology.page.downloadPacket.info.text1": {
"defaultMessage": "Download the data sources used in the CEJST (.csv, .xlxs, <callout>.pdf</callout> that describes how to use the list, and a <callout>codebook</callout>, {downloadFileSize} unzipped), the shapefile, along with a <callout>codebook</callout> (.zip, {shapefileSize} unzipped) or the technical support document (.pdf, {tsdFileSize} unzipped).",
"description": "Navigate to the methodology page. This is the download packet info text"
},
"methodology.page.downloadPacket.info.tsd.last.updated": {
"defaultMessage": "Last updated: {tsdLastUpdated}",
"description": "Navigate to the methodology page. This is the download packet info last updated"
},
"methodology.page.downloadPacket.info.zip.last.updated": {
"defaultMessage": "Last updated: {downloadLastUpdated}",
"description": "Navigate to the methodology page. This is the download packet info last updated"
},
"methodology.page.downloadPacket.new.tag.text": {
"defaultMessage": "<boldtag>NEW</boldtag>",
"description": "Navigate to the methodology page. This is the new tag text"
},
"methodology.page.downloadPacket.updated.tag.text": {
"defaultMessage": "<boldtag>Updated</boldtag>",
"description": "Navigate to the methodology page. This is the update callout tag text that overlaps the button"
},
"methodology.page.formula.first": {
"defaultMessage": "<boldtag>IF</boldtag> the census tract is above the threshold for one or more environmental or climate indicators",
"description": "Navigate to the methodology page. This is the first part of the formula used in the methodology"

View file

@ -67,12 +67,17 @@
"contact.page.fab.survey.text": "Ayude a mejorar el sitio web y los datos",
"contact.page.general": "Para comentarios generales, envíe un correo eléctronico a {general_email_address}.",
"contact.page.header.text": "Contacto",
"contact.page.request.for.info.box.body": "Durante el periodo beta, se pueden enviar comentarios sobre la Herramienta para la evaluación de la justicia climática y económica mediante la Solicitud de información del CEQ que se encuentra disponible en <link1>federalregister.gov</link1>.",
"contact.page.request.for.info.box.body": "La Solicitud de Información en el Registro Federal para el período beta público cerró el {rfiExpDate}",
"contact.page.request.for.info.box.title": "Solicitud de información",
"contact.page.sub.header.text": "Envíenos un correo electrónico",
"contact.page.title.text": "Contacto",
"downloads.page.csv.link": "<link1>Archivo CSV </link1> (.csv {csvFileSize} descomprimido)",
"download.page.download.file.1": "<link1>Datos de la lista de comunidades</link1> (.xlsx {cldXlsFileSize})",
"download.page.download.file.2": "<link2>Datos de la lista de comunidades</link2> (.csv {cldCsvFileSize})",
"download.page.download.file.3": "<link3>Archivo de forma</link3> (Libro de códigos incluido con geojson {shapeFileSize} descomprimido)",
"download.page.download.file.4": "<link4>Documento de soporte técnico</link4> (.pdf {tsdFileSize})",
"download.page.download.file.5": "<link5>Cómo utilizar la lista de comunidades</link5> (.pdf {howToCommFileSize})",
"downloads.page.description1.text": "Los conjuntos de datos que se utilizan en la herramienta, junto con un diccionario de datos e información sobre cómo utilizar la lista de comunidades (.pdf) están disponibles en los siguientes formatos del archivo:",
"downloads.page.download.icon.alt.tag": "El icono utilizado para indicar que el archivo se puede descargar",
"downloads.page.excel.link": "<link1>Archivo Excel</link1> (.xlxs {excelFileSize} descomprimido)",
"downloads.page.heading1.text": "Descargas",
"downloads.page.heading2.text": "Formatos del archivo",
@ -205,7 +210,7 @@
"explore.map.page.under.map.how.you.can.help.heading": "Contribuya a mejorar la herramienta",
"explore.map.page.under.map.how.you.can.help.list.item.1": "Vaya a la página <link1>Metodología y datos</link1> y envíe sus comentarios.",
"explore.map.page.under.map.how.you.can.help.list.item.2": "Use la herramienta para buscar comunidades y <link1>enviar sus comentarios</link1>.",
"explore.map.page.under.map.how.you.can.help.list.item.3": "En <link1>federalregister.gov</link1>, responda a nuestra Solicitud de información.",
"explore.map.page.under.map.how.you.can.help.list.item.3": "La Solicitud de Información en el Registro Federal ya está cerrada.",
"explore.map.page.under.map.note.on.territories.intro": "Observaciones sobre los territorios de los Estados Unidos",
"explore.map.page.under.map.note.on.territories.para.1": "Las fuentes de datos que se describen en la página <link1>Metodología y datos</link1> se usan para identificar las comunidades desfavorecidas en los cincuenta estados y el Distrito de Columbia. No obstante, no todas estas fuentes de datos están disponibles actualmente para los territorios de los EE. UU.",
"explore.map.page.under.map.note.on.territories.para.2": "Para Puerto Rico, se usan los datos de la Encuesta sobre la Comunidad Estadounidense (ACS, por sus siglas en inglés) de 2015 a 2019 de la Oficina del Censo para la tasa de inscripción en educación superior y los demás campos de la categoría Capacitación y desarrollo de la fuerza laboral a fin de identificar las comunidades desfavorecidas. Por ahora, no se dispone de datos en las demás categorías.",

View file

@ -4,37 +4,64 @@ import {useIntl} from 'gatsby-plugin-intl';
import J40MainGridContainer from '../components/J40MainGridContainer';
import Layout from '../components/layout';
import PublicEngageButton from '../components/PublicEngageButton';
import SubPageNav from '../components/SubPageNav';
import {useWindowSize} from 'react-use';
import * as DOWNLOADS_COPY from '../data/copy/downloads';
import * as CONSTANTS from '../data/constants';
interface IDownloadsPageProps {
location: Location;
}
const DownloadsPage = ({location}: IDownloadsPageProps) => {
const intl = useIntl();
const {width} = useWindowSize();
return (
<Layout location={location} title={intl.formatMessage(DOWNLOADS_COPY.PAGE_INTRO.PAGE_TILE)}>
<J40MainGridContainer>
<h1>{intl.formatMessage(DOWNLOADS_COPY.PAGE_INTRO.PAGE_HEADING1)}</h1>
<section className={'page-heading'}>
<h1>{intl.formatMessage(DOWNLOADS_COPY.PAGE_INTRO.PAGE_HEADING1)}</h1>
<PublicEngageButton />
</section>
<Grid desktop={{col: 8}}>
<h2>{intl.formatMessage(DOWNLOADS_COPY.PAGE_INTRO.PAGE_HEADING2)}</h2>
<p>
{intl.formatMessage(DOWNLOADS_COPY.PAGE_INTRO.PAGE_DESCRIPTION1)}
</p>
<p>
{DOWNLOADS_COPY.DOWNLOAD_LINKS.EXCEL}
</p>
<p>
{DOWNLOADS_COPY.DOWNLOAD_LINKS.CSV}
</p>
<p>
{DOWNLOADS_COPY.DOWNLOAD_LINKS.SHAPE}
</p>
<Grid row gap className={'j40-mb5-mt3'}>
<Grid col={12} tablet={{col: 8}}>
<h2>{intl.formatMessage(DOWNLOADS_COPY.PAGE_INTRO.PAGE_HEADING2)}</h2>
<p>
{intl.formatMessage(DOWNLOADS_COPY.PAGE_INTRO.PAGE_DESCRIPTION1)}
</p>
<p>
{DOWNLOADS_COPY.DOWNLOAD_LINKS.LINK1}
</p>
<p>
{DOWNLOADS_COPY.DOWNLOAD_LINKS.LINK2}
</p>
<p>
{DOWNLOADS_COPY.DOWNLOAD_LINKS.LINK3}
</p>
<p>
{DOWNLOADS_COPY.DOWNLOAD_LINKS.LINK4}
</p>
<p>
{DOWNLOADS_COPY.DOWNLOAD_LINKS.LINK5}
</p>
</Grid>
{/* Second column */}
<Grid col={12} tablet={{col: 1}}>
{/* Spacer column */}
</Grid>
{/* Third column - Only show the SubPagNav component on desktop width */}
{width > CONSTANTS.USWDS_BREAKPOINTS.DESKTOP ?
<Grid col={12} tablet={{col: 3}}>
<SubPageNav activeSubPageIndex={2}/>
</Grid> : ''}
</Grid>
</J40MainGridContainer>

View file

@ -4,12 +4,14 @@ import {useIntl} from 'gatsby-plugin-intl';
import Categories from '../components/Categories';
import DatasetContainer from '../components/DatasetContainer';
import DownloadPacket from '../components/DownloadPacket';
import J40MainGridContainer from '../components/J40MainGridContainer';
import MethodologyFormula from '../components/MethodologyFormula';
import Layout from '../components/layout';
import PublicEngageButton from '../components/PublicEngageButton';
import SubPageNav from '../components/SubPageNav';
import {useWindowSize} from 'react-use';
import * as CONSTANTS from '../data/constants';
import * as METHODOLOGY_COPY from '../data/copy/methodology';
interface MethodPageProps {
@ -18,6 +20,7 @@ interface MethodPageProps {
const IndexPage = ({location}: MethodPageProps) => {
const intl = useIntl();
const {width} = useWindowSize();
return (
<Layout location={location} title={intl.formatMessage(METHODOLOGY_COPY.PAGE.TILE)}>
@ -51,9 +54,15 @@ const IndexPage = ({location}: MethodPageProps) => {
</Grid>
{/* Second column */}
<Grid col={12} tablet={{col: 4}}>
<DownloadPacket />
<Grid col={12} tablet={{col: 1}}>
{/* Spacer column */}
</Grid>
{/* Third column */}
{width > CONSTANTS.USWDS_BREAKPOINTS.DESKTOP ?
<Grid col={12} tablet={{col: 3}}>
<SubPageNav activeSubPageIndex={1}/>
</Grid> : ''}
</Grid>
</J40MainGridContainer>

View file

@ -247,12 +247,43 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
<li
class="usa-nav__primary-item"
>
<a
data-cy="nav-link-methodology"
href="/en/methodology"
<button
aria-controls="methMenu"
aria-expanded="true"
class="usa-accordion__button usa-nav__link"
data-cy="nav-dropdown-methodology"
data-testid="navDropDownButton"
type="button"
>
Methodology & data
</a>
<span>
Methodology & data
</span>
</button>
<ul
class="usa-nav__submenu"
id="methMenu"
>
<li
class="usa-nav__submenu-item"
>
<a
data-cy="nav-link-methodology"
href="/en/methodology"
>
Methodology & data
</a>
</li>
<li
class="usa-nav__submenu-item"
>
<a
data-cy="nav-link-downloads"
href="/en/downloads"
>
Downloads
</a>
</li>
</ul>
</li>
<li
class="usa-nav__primary-item"
@ -301,79 +332,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
</div>
</div>
</div>
<div
class="grid-container-desktop-lg"
data-testid="gridContainer"
>
<div
class="usa-alert usa-alert--info"
data-testid="alert"
>
<div
class="usa-alert__body"
>
<h4
class="usa-alert__heading"
>
Additional documentation now available
</h4>
<p
class="usa-alert__text"
>
Download new
<a
class="usa-link usa-link--external"
data-cy=""
href="https://static-data-screeningtool.geoplatform.gov/data-pipeline/data/score/downloadable/cejst_technical_support_document.pdf"
rel="noreferrer"
target="_blank"
>
technical support
</a>
and other documentation and
<a
class="usa-link usa-link--external"
data-cy=""
href="mailto:Screeningtool-Support@omb.eop.gov"
rel="noreferrer"
target="_blank"
>
send feedback
</a>
.
</p>
</div>
</div>
<div
class="usa-alert usa-alert--info"
data-testid="alert"
>
<div
class="usa-alert__body"
>
<h4
class="usa-alert__heading"
>
Public comment period extended
</h4>
<p
class="usa-alert__text"
>
The public comment period for
<a
class="usa-link usa-link--external"
data-cy=""
href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
rel="noreferrer"
target="_blank"
>
sending feedback
</a>
via the Request for Information has been extended to May 25, 2022.
</p>
</div>
</div>
</div>
</header>
<main
id="main-content"
@ -391,14 +349,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
About
</h1>
<div>
<div>
<span
class="usa-tag"
data-testid="tag"
>
UPDATED
</span>
</div>
<a
href="/en/public-engagement"
>

View file

@ -247,12 +247,43 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
<li
class="usa-nav__primary-item"
>
<a
data-cy="nav-link-methodology"
href="/en/methodology"
<button
aria-controls="methMenu"
aria-expanded="true"
class="usa-accordion__button usa-nav__link"
data-cy="nav-dropdown-methodology"
data-testid="navDropDownButton"
type="button"
>
Methodology & data
</a>
<span>
Methodology & data
</span>
</button>
<ul
class="usa-nav__submenu"
id="methMenu"
>
<li
class="usa-nav__submenu-item"
>
<a
data-cy="nav-link-methodology"
href="/en/methodology"
>
Methodology & data
</a>
</li>
<li
class="usa-nav__submenu-item"
>
<a
data-cy="nav-link-downloads"
href="/en/downloads"
>
Downloads
</a>
</li>
</ul>
</li>
<li
class="usa-nav__primary-item"
@ -301,79 +332,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
</div>
</div>
</div>
<div
class="grid-container-desktop-lg"
data-testid="gridContainer"
>
<div
class="usa-alert usa-alert--info"
data-testid="alert"
>
<div
class="usa-alert__body"
>
<h4
class="usa-alert__heading"
>
Additional documentation now available
</h4>
<p
class="usa-alert__text"
>
Download new
<a
class="usa-link usa-link--external"
data-cy=""
href="https://static-data-screeningtool.geoplatform.gov/data-pipeline/data/score/downloadable/cejst_technical_support_document.pdf"
rel="noreferrer"
target="_blank"
>
technical support
</a>
and other documentation and
<a
class="usa-link usa-link--external"
data-cy=""
href="mailto:Screeningtool-Support@omb.eop.gov"
rel="noreferrer"
target="_blank"
>
send feedback
</a>
.
</p>
</div>
</div>
<div
class="usa-alert usa-alert--info"
data-testid="alert"
>
<div
class="usa-alert__body"
>
<h4
class="usa-alert__heading"
>
Public comment period extended
</h4>
<p
class="usa-alert__text"
>
The public comment period for
<a
class="usa-link usa-link--external"
data-cy=""
href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
rel="noreferrer"
target="_blank"
>
sending feedback
</a>
via the Request for Information has been extended to May 25, 2022.
</p>
</div>
</div>
</div>
</header>
<main
id="main-content"
@ -389,14 +347,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
Contact
</h1>
<div>
<div>
<span
class="usa-tag"
data-testid="tag"
>
UPDATED
</span>
</div>
<a
href="/en/public-engagement"
>
@ -499,30 +449,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
class="usa-summary-box__text"
>
<p>
During the beta period, comments may be submitted on the Climate and Economic Justice Screening Tool via CEQs Request for Information available on
<a
class="usa-link usa-link--external"
data-cy=""
href="https://www.federalregister.gov/d/2022-03920"
rel="noreferrer"
target="_blank"
>
federalregister.gov
</a>
.
</p>
<p>
The public comment period for
<a
class="usa-link usa-link--external"
data-cy=""
href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
rel="noreferrer"
target="_blank"
>
sending feedback
</a>
via the Request for Information has been extended to May 25, 2022.
The Request for Information on the Federal Register for the public beta period closed on May 25, 2022
</p>
</div>
</div>

View file

@ -247,12 +247,43 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
<li
class="usa-nav__primary-item"
>
<a
data-cy="nav-link-methodology"
href="/en/methodology"
<button
aria-controls="methMenu"
aria-expanded="true"
class="usa-accordion__button usa-nav__link"
data-cy="nav-dropdown-methodology"
data-testid="navDropDownButton"
type="button"
>
Methodology & data
</a>
<span>
Methodology & data
</span>
</button>
<ul
class="usa-nav__submenu"
id="methMenu"
>
<li
class="usa-nav__submenu-item"
>
<a
data-cy="nav-link-methodology"
href="/en/methodology"
>
Methodology & data
</a>
</li>
<li
class="usa-nav__submenu-item"
>
<a
data-cy="nav-link-downloads"
href="/en/downloads"
>
Downloads
</a>
</li>
</ul>
</li>
<li
class="usa-nav__primary-item"
@ -301,79 +332,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
</div>
</div>
</div>
<div
class="grid-container-desktop-lg"
data-testid="gridContainer"
>
<div
class="usa-alert usa-alert--info"
data-testid="alert"
>
<div
class="usa-alert__body"
>
<h4
class="usa-alert__heading"
>
Additional documentation now available
</h4>
<p
class="usa-alert__text"
>
Download new
<a
class="usa-link usa-link--external"
data-cy=""
href="https://static-data-screeningtool.geoplatform.gov/data-pipeline/data/score/downloadable/cejst_technical_support_document.pdf"
rel="noreferrer"
target="_blank"
>
technical support
</a>
and other documentation and
<a
class="usa-link usa-link--external"
data-cy=""
href="mailto:Screeningtool-Support@omb.eop.gov"
rel="noreferrer"
target="_blank"
>
send feedback
</a>
.
</p>
</div>
</div>
<div
class="usa-alert usa-alert--info"
data-testid="alert"
>
<div
class="usa-alert__body"
>
<h4
class="usa-alert__heading"
>
Public comment period extended
</h4>
<p
class="usa-alert__text"
>
The public comment period for
<a
class="usa-link usa-link--external"
data-cy=""
href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
rel="noreferrer"
target="_blank"
>
sending feedback
</a>
via the Request for Information has been extended to May 25, 2022.
</p>
</div>
</div>
</div>
</header>
<main
id="main-content"
@ -382,52 +340,119 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
class="grid-container-desktop-lg"
data-testid="gridContainer"
>
<h1>
Downloads
</h1>
<section
class="page-heading"
>
<h1>
Downloads
</h1>
<div>
<a
href="/en/public-engagement"
>
<button
class="usa-button"
data-testid="button"
type="button"
>
<div>
<img
alt="an icon that represents a calendar"
src="test-file-stub"
/>
<div>
Public engagement
</div>
</div>
</button>
</a>
</div>
</section>
<div
class="desktop:grid-col-8"
class="grid-row grid-gap j40-mb5-mt3"
data-testid="grid"
>
<h2>
File formats
</h2>
<p>
The dataset used in the tool, along with a data dictionary and information about how to use the list of communities (.pdf) are available in the following file formats:
</p>
<p>
<a
href="/about"
>
Excel file
</a>
(.xlxs 54MB unzipped)
<div
class="grid-col-12 tablet:grid-col-8"
data-testid="grid"
>
<h2>
File formats
</h2>
<p>
The dataset used in the tool, along with a data dictionary and information about how to use the list of communities (.pdf) are available in the following file formats:
</p>
<p>
</p>
<p>
<a
href="/csv"
>
CSV file
</a>
(.csv 52MB unzipped)
<a
download=""
href="//"
>
Communities list data
</a>
<img
alt="The icon used to indicate that the file is downloadable"
src="test-file-stub"
/>
(.xlsx 24.9MB)
</p>
<p>
<a
href="/shape"
>
Shapefiles
</a>
(Codebook included with geojson 110MB unzipped)
</p>
</p>
<p>
<a
download=""
href="//"
>
Communities list data
</a>
<img
alt="The icon used to indicate that the file is downloadable"
src="test-file-stub"
/>
(.csv 28.1MB)
</p>
<p>
<a
download=""
href="//"
>
Shapefile
</a>
<img
alt="The icon used to indicate that the file is downloadable"
src="test-file-stub"
/>
(Codebook included with geojson 741MB unzipped)
</p>
<p>
<a
class="usa-link usa-link--external"
data-cy=""
href="//"
rel="noreferrer"
target="_blank"
>
Technical support document
</a>
(.pdf 2.5MB)
</p>
<p>
<a
class="usa-link usa-link--external"
data-cy=""
href="//"
rel="noreferrer"
target="_blank"
>
How to use the list of communities
</a>
(.pdf 674kB)
</p>
</div>
<div
class="grid-col-12 tablet:grid-col-1"
data-testid="grid"
/>
</div>
</div>
</main>

View file

@ -247,12 +247,43 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
<li
class="usa-nav__primary-item"
>
<a
data-cy="nav-link-methodology"
href="/en/methodology"
<button
aria-controls="methMenu"
aria-expanded="true"
class="usa-accordion__button usa-nav__link"
data-cy="nav-dropdown-methodology"
data-testid="navDropDownButton"
type="button"
>
Methodology & data
</a>
<span>
Methodology & data
</span>
</button>
<ul
class="usa-nav__submenu"
id="methMenu"
>
<li
class="usa-nav__submenu-item"
>
<a
data-cy="nav-link-methodology"
href="/en/methodology"
>
Methodology & data
</a>
</li>
<li
class="usa-nav__submenu-item"
>
<a
data-cy="nav-link-downloads"
href="/en/downloads"
>
Downloads
</a>
</li>
</ul>
</li>
<li
class="usa-nav__primary-item"
@ -301,79 +332,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
</div>
</div>
</div>
<div
class="grid-container-desktop-lg"
data-testid="gridContainer"
>
<div
class="usa-alert usa-alert--info"
data-testid="alert"
>
<div
class="usa-alert__body"
>
<h4
class="usa-alert__heading"
>
Additional documentation now available
</h4>
<p
class="usa-alert__text"
>
Download new
<a
class="usa-link usa-link--external"
data-cy=""
href="https://static-data-screeningtool.geoplatform.gov/data-pipeline/data/score/downloadable/cejst_technical_support_document.pdf"
rel="noreferrer"
target="_blank"
>
technical support
</a>
and other documentation and
<a
class="usa-link usa-link--external"
data-cy=""
href="mailto:Screeningtool-Support@omb.eop.gov"
rel="noreferrer"
target="_blank"
>
send feedback
</a>
.
</p>
</div>
</div>
<div
class="usa-alert usa-alert--info"
data-testid="alert"
>
<div
class="usa-alert__body"
>
<h4
class="usa-alert__heading"
>
Public comment period extended
</h4>
<p
class="usa-alert__text"
>
The public comment period for
<a
class="usa-link usa-link--external"
data-cy=""
href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
rel="noreferrer"
target="_blank"
>
sending feedback
</a>
via the Request for Information has been extended to May 25, 2022.
</p>
</div>
</div>
</div>
</header>
<main
id="main-content"

View file

@ -247,12 +247,43 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
<li
class="usa-nav__primary-item"
>
<a
data-cy="nav-link-methodology"
href="/en/methodology"
<button
aria-controls="methMenu"
aria-expanded="true"
class="usa-accordion__button usa-nav__link"
data-cy="nav-dropdown-methodology"
data-testid="navDropDownButton"
type="button"
>
Methodology & data
</a>
<span>
Methodology & data
</span>
</button>
<ul
class="usa-nav__submenu"
id="methMenu"
>
<li
class="usa-nav__submenu-item"
>
<a
data-cy="nav-link-methodology"
href="/en/methodology"
>
Methodology & data
</a>
</li>
<li
class="usa-nav__submenu-item"
>
<a
data-cy="nav-link-downloads"
href="/en/downloads"
>
Downloads
</a>
</li>
</ul>
</li>
<li
class="usa-nav__primary-item"
@ -301,79 +332,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
</div>
</div>
</div>
<div
class="grid-container-desktop-lg"
data-testid="gridContainer"
>
<div
class="usa-alert usa-alert--info"
data-testid="alert"
>
<div
class="usa-alert__body"
>
<h4
class="usa-alert__heading"
>
Additional documentation now available
</h4>
<p
class="usa-alert__text"
>
Download new
<a
class="usa-link usa-link--external"
data-cy=""
href="https://static-data-screeningtool.geoplatform.gov/data-pipeline/data/score/downloadable/cejst_technical_support_document.pdf"
rel="noreferrer"
target="_blank"
>
technical support
</a>
and other documentation and
<a
class="usa-link usa-link--external"
data-cy=""
href="mailto:Screeningtool-Support@omb.eop.gov"
rel="noreferrer"
target="_blank"
>
send feedback
</a>
.
</p>
</div>
</div>
<div
class="usa-alert usa-alert--info"
data-testid="alert"
>
<div
class="usa-alert__body"
>
<h4
class="usa-alert__heading"
>
Public comment period extended
</h4>
<p
class="usa-alert__text"
>
The public comment period for
<a
class="usa-link usa-link--external"
data-cy=""
href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
rel="noreferrer"
target="_blank"
>
sending feedback
</a>
via the Request for Information has been extended to May 25, 2022.
</p>
</div>
</div>
</div>
</header>
<main
id="main-content"
@ -389,14 +347,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
Methodology
</h1>
<div>
<div>
<span
class="usa-tag"
data-testid="tag"
>
UPDATED
</span>
</div>
<a
href="/en/public-engagement"
>
@ -475,152 +425,9 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
</section>
</div>
<div
class="grid-col-12 tablet:grid-col-4"
class="grid-col-12 tablet:grid-col-1"
data-testid="grid"
>
<div
class=""
data-testid="grid"
>
<div>
<div>
<div>
<div>
<span>
NEW
</span>
files available for download
</div>
<div>
Download the data sources used in the CEJST (.csv, .xlxs,
<span>
.pdf
</span>
that describes how to use the list, and a
<span>
codebook
</span>
, 53MB unzipped), the shapefile, along with a
<span>
codebook
</span>
(.zip, 742MB unzipped) or the technical support document (.pdf, 2.5MB unzipped).
</div>
<div>
<div>
<span
class="usa-tag"
data-testid="tag"
>
<strong>
Updated
</strong>
</span>
</div>
<a
data-cy="download-link"
download=""
href="//"
>
<button
class="usa-button"
data-testid="button"
type="button"
>
<span>
<img
alt="download icon for download package"
src="test-file-stub"
/>
</span>
<span>
Download data sources
</span>
</button>
</a>
</div>
<div>
Last updated: 05/04/22
</div>
<div>
<div>
<span
class="usa-tag"
data-testid="tag"
>
<strong>
Updated
</strong>
</span>
</div>
<a
data-cy="shapefile-link"
download=""
href="//"
>
<button
class="usa-button"
data-testid="button"
type="button"
>
<span>
<img
alt="download icon for download package"
src="test-file-stub"
/>
</span>
<span>
Download shapefile
</span>
</button>
</a>
</div>
<div>
Last updated: 04/26/22
</div>
<div>
<div>
<span
class="usa-tag"
data-testid="tag"
>
<strong>
NEW
</strong>
</span>
</div>
<a
data-cy="tsd-link"
download=""
href="//"
rel="noreferrer"
target="_blank"
>
<button
class="usa-button"
data-testid="button"
type="button"
>
<span>
<img
alt="download icon for download package"
src="test-file-stub"
/>
</span>
<span>
Download technical support document
</span>
</button>
</a>
</div>
<div>
Last updated: 04/19/22
</div>
</div>
</div>
</div>
</div>
</div>
/>
</div>
</div>
<div

View file

@ -247,12 +247,43 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
<li
class="usa-nav__primary-item"
>
<a
data-cy="nav-link-methodology"
href="/en/methodology"
<button
aria-controls="methMenu"
aria-expanded="true"
class="usa-accordion__button usa-nav__link"
data-cy="nav-dropdown-methodology"
data-testid="navDropDownButton"
type="button"
>
Methodology & data
</a>
<span>
Methodology & data
</span>
</button>
<ul
class="usa-nav__submenu"
id="methMenu"
>
<li
class="usa-nav__submenu-item"
>
<a
data-cy="nav-link-methodology"
href="/en/methodology"
>
Methodology & data
</a>
</li>
<li
class="usa-nav__submenu-item"
>
<a
data-cy="nav-link-downloads"
href="/en/downloads"
>
Downloads
</a>
</li>
</ul>
</li>
<li
class="usa-nav__primary-item"
@ -301,79 +332,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
</div>
</div>
</div>
<div
class="grid-container-desktop-lg"
data-testid="gridContainer"
>
<div
class="usa-alert usa-alert--info"
data-testid="alert"
>
<div
class="usa-alert__body"
>
<h4
class="usa-alert__heading"
>
Additional documentation now available
</h4>
<p
class="usa-alert__text"
>
Download new
<a
class="usa-link usa-link--external"
data-cy=""
href="https://static-data-screeningtool.geoplatform.gov/data-pipeline/data/score/downloadable/cejst_technical_support_document.pdf"
rel="noreferrer"
target="_blank"
>
technical support
</a>
and other documentation and
<a
class="usa-link usa-link--external"
data-cy=""
href="mailto:Screeningtool-Support@omb.eop.gov"
rel="noreferrer"
target="_blank"
>
send feedback
</a>
.
</p>
</div>
</div>
<div
class="usa-alert usa-alert--info"
data-testid="alert"
>
<div
class="usa-alert__body"
>
<h4
class="usa-alert__heading"
>
Public comment period extended
</h4>
<p
class="usa-alert__text"
>
The public comment period for
<a
class="usa-link usa-link--external"
data-cy=""
href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
rel="noreferrer"
target="_blank"
>
sending feedback
</a>
via the Request for Information has been extended to May 25, 2022.
</p>
</div>
</div>
</div>
</header>
<main
id="main-content"

View file

@ -247,12 +247,43 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
<li
class="usa-nav__primary-item"
>
<a
data-cy="nav-link-methodology"
href="/en/methodology"
<button
aria-controls="methMenu"
aria-expanded="true"
class="usa-accordion__button usa-nav__link"
data-cy="nav-dropdown-methodology"
data-testid="navDropDownButton"
type="button"
>
Methodology & data
</a>
<span>
Methodology & data
</span>
</button>
<ul
class="usa-nav__submenu"
id="methMenu"
>
<li
class="usa-nav__submenu-item"
>
<a
data-cy="nav-link-methodology"
href="/en/methodology"
>
Methodology & data
</a>
</li>
<li
class="usa-nav__submenu-item"
>
<a
data-cy="nav-link-downloads"
href="/en/downloads"
>
Downloads
</a>
</li>
</ul>
</li>
<li
class="usa-nav__primary-item"
@ -301,79 +332,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
</div>
</div>
</div>
<div
class="grid-container-desktop-lg"
data-testid="gridContainer"
>
<div
class="usa-alert usa-alert--info"
data-testid="alert"
>
<div
class="usa-alert__body"
>
<h4
class="usa-alert__heading"
>
Additional documentation now available
</h4>
<p
class="usa-alert__text"
>
Download new
<a
class="usa-link usa-link--external"
data-cy=""
href="https://static-data-screeningtool.geoplatform.gov/data-pipeline/data/score/downloadable/cejst_technical_support_document.pdf"
rel="noreferrer"
target="_blank"
>
technical support
</a>
and other documentation and
<a
class="usa-link usa-link--external"
data-cy=""
href="mailto:Screeningtool-Support@omb.eop.gov"
rel="noreferrer"
target="_blank"
>
send feedback
</a>
.
</p>
</div>
</div>
<div
class="usa-alert usa-alert--info"
data-testid="alert"
>
<div
class="usa-alert__body"
>
<h4
class="usa-alert__heading"
>
Public comment period extended
</h4>
<p
class="usa-alert__text"
>
The public comment period for
<a
class="usa-link usa-link--external"
data-cy=""
href="https://www.federalregister.gov/documents/2022/04/25/2022-08774/climate-and-economic-justice-screening-tool-beta-version"
rel="noreferrer"
target="_blank"
>
sending feedback
</a>
via the Request for Information has been extended to May 25, 2022.
</p>
</div>
</div>
</div>
</header>
<main
id="main-content"

View file

@ -139,7 +139,6 @@ components include:
}
}
/*
******************************
* FOOTER STYLES