publicdata/j40-cejst-2
1
0
Fork 0
mirror of https://github.com/DOI-DO/j40-cejst-2.git synced 2025-02-23 01:54:18 -08:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add TractInfo component

Browse source
This commit is contained in:
Vim USDS 2022-07-29 20:02:55 -07:00
parent 3a31f2b821
commit d0ff171ee6
10 changed files with 772 additions and 587 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

39
client/src/components/AreaDetail/AreaDetail.tsx
View file

@ -10,6 +10,7 @@ import Demographics from '../Demographics';
import DisadvantageDot from '../DisadvantageDot';
import ExceedBurden from '../ExceedBurden';
import Indicator from '../Indicator';
import TractInfo from '../TractInfo';
// Styles and constants
import * as styles from './areaDetail.module.scss';
@ -573,36 +574,14 @@ const AreaDetail = ({properties, hash}: IAreaDetailProps) => {
{EXPLORE_COPY.SIDE_PANEL_VERION.TITLE}
</div>
{/* Census Info */}
<ul className={styles.censusRow}>
<li>
<span className={styles.censusLabel}>
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_CBG_INFO.CENSUS_BLOCK_GROUP)}
</span>
<span className={styles.censusText}>{` ${blockGroup}`}</span>
</li>
<li>
<span className={styles.censusLabel}>
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_CBG_INFO.COUNTY)}
</span>
<span className={styles.censusText}>{` ${countyName}`}</span>
</li>
<li>
<span className={styles.censusLabel}>
{properties[constants.SIDE_PANEL_STATE] !== constants.SIDE_PANEL_STATE_VALUES.NATION ?
intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_CBG_INFO.TERRITORY) :
intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_CBG_INFO.STATE)
}
</span>
<span className={styles.censusText}>{` ${stateName}`}</span>
</li>
<li>
<span className={styles.censusLabel}>
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_CBG_INFO.POPULATION)}
</span>
<span className={styles.censusText}>{` ${population.toLocaleString()}`}</span>
</li>
</ul>
{/* Tract Info */}
<TractInfo
blockGroup={blockGroup}
countyName={countyName}
stateName={stateName}
population={population}
sidePanelState={properties[constants.SIDE_PANEL_STATE]}
/>
{/* Demographics */}
<Demographics />

831
client/src/components/AreaDetail/tests/__snapshots__/areaDetail.test.tsx.snap
View file

@ -11,7 +11,12 @@ exports[`rendering of the AreaDetail checks if indicators for ISLAND AREAS are p
<ul>
<li>
<span>
Census tract:
Tract information
</span>
</li>
<li>
<span>
Number:
</span>
<span>
98729374234
@ -46,146 +51,146 @@ exports[`rendering of the AreaDetail checks if indicators for ISLAND AREAS are p
<div>
Tract demographics
</div>
<h6>
Racial Ethnographic
<button
aria-controls="race-expand-content"
aria-expanded="false"
class="usa-accordion__button usa-banner__button"
id="race-expand-control"
type="button"
>
<span
class="usa-banner__button-text"
>
show
</span>
</button>
</h6>
<div
aria-multiselectable="true"
class="usa-accordion"
data-testid="accordion"
aria-labelledby="race-expand-control"
class="usa-banner__content usa-accordion__content"
hidden=""
id="race-expand-content"
>
<h4
class="usa-accordion__heading"
>
<button
aria-controls="123"
aria-expanded="false"
class="usa-accordion__button"
data-testid="accordionButton_123"
type="button"
>
Racial Ethnographic
</button>
</h4>
<div
class="usa-accordion__content usa-prose"
data-testid="accordionItem_123"
hidden=""
id="123"
>
<div>
<span>
White
</span>
<span>
61.4%
</span>
</div>
<div>
<span>
Black or African Americon
</span>
<span>
10.3%
</span>
</div>
<div>
<span>
American Indian and Alaska Native
</span>
<span>
10.3%
</span>
</div>
<div>
<span>
American Indian and Alaska Native
</span>
<span>
0.3%
</span>
</div>
<div>
<span>
Asian
</span>
<span>
7.2%
</span>
</div>
<div>
<span>
Native Hawiian or Pacific Islander
</span>
<span>
4.2%
</span>
</div>
<div>
<span>
Other
</span>
<span>
2.5%
</span>
</div>
<div>
<span>
Two or more races
</span>
<span>
6.7%
</span>
</div>
<div>
<span>
Hispanic or Latino
</span>
<span>
10.4%
</span>
</div>
<div>
<span>
White
</span>
<span>
61.4%
</span>
</div>
<h4
class="usa-accordion__heading"
<div>
<span>
Black or African Americon
</span>
<span>
10.3%
</span>
</div>
<div>
<span>
American Indian and Alaska Native
</span>
<span>
10.3%
</span>
</div>
<div>
<span>
American Indian and Alaska Native
</span>
<span>
0.3%
</span>
</div>
<div>
<span>
Asian
</span>
<span>
7.2%
</span>
</div>
<div>
<span>
Native Hawiian or Pacific Islander
</span>
<span>
4.2%
</span>
</div>
<div>
<span>
Other
</span>
<span>
2.5%
</span>
</div>
<div>
<span>
Two or more races
</span>
<span>
6.7%
</span>
</div>
<div>
<span>
Hispanic or Latino
</span>
<span>
10.4%
</span>
</div>
</div>
<h6>
Age
<button
aria-controls="age-expand-content"
aria-expanded="false"
class="usa-accordion__button usa-banner__button"
id="age-expand-control"
type="button"
>
<button
aria-controls="abc"
aria-expanded="false"
class="usa-accordion__button"
data-testid="accordionButton_abc"
type="button"
<span
class="usa-banner__button-text"
>
Age
</button>
</h4>
<div
class="usa-accordion__content usa-prose"
data-testid="accordionItem_abc"
hidden=""
id="abc"
>
<div>
<span>
Children under 10
</span>
<span>
1.4%
</span>
</div>
<div>
<span>
Ages 10 - 64
</span>
<span>
80.3%
</span>
</div>
<div>
<span>
Elderly over 65
</span>
<span>
7.2%
</span>
</div>
show
</span>
</button>
</h6>
<div
aria-labelledby="age-expand-control"
class="usa-banner__content usa-accordion__content"
hidden=""
id="age-expand-content"
>
<div>
<span>
Children under 10
</span>
<span>
1.4%
</span>
</div>
<div>
<span>
Ages 10 - 64
</span>
<span>
80.3%
</span>
</div>
<div>
<span>
Elderly over 65
</span>
<span>
7.2%
</span>
</div>
</div>
</div>
@ -519,7 +524,12 @@ exports[`rendering of the AreaDetail checks if indicators for NATION is present
<ul>
<li>
<span>
Census tract:
Tract information
</span>
</li>
<li>
<span>
Number:
</span>
<span>
98729374234
@ -554,146 +564,146 @@ exports[`rendering of the AreaDetail checks if indicators for NATION is present
<div>
Tract demographics
</div>
<h6>
Racial Ethnographic
<button
aria-controls="race-expand-content"
aria-expanded="false"
class="usa-accordion__button usa-banner__button"
id="race-expand-control"
type="button"
>
<span
class="usa-banner__button-text"
>
show
</span>
</button>
</h6>
<div
aria-multiselectable="true"
class="usa-accordion"
data-testid="accordion"
aria-labelledby="race-expand-control"
class="usa-banner__content usa-accordion__content"
hidden=""
id="race-expand-content"
>
<h4
class="usa-accordion__heading"
>
<button
aria-controls="123"
aria-expanded="false"
class="usa-accordion__button"
data-testid="accordionButton_123"
type="button"
>
Racial Ethnographic
</button>
</h4>
<div
class="usa-accordion__content usa-prose"
data-testid="accordionItem_123"
hidden=""
id="123"
>
<div>
<span>
White
</span>
<span>
61.4%
</span>
</div>
<div>
<span>
Black or African Americon
</span>
<span>
10.3%
</span>
</div>
<div>
<span>
American Indian and Alaska Native
</span>
<span>
10.3%
</span>
</div>
<div>
<span>
American Indian and Alaska Native
</span>
<span>
0.3%
</span>
</div>
<div>
<span>
Asian
</span>
<span>
7.2%
</span>
</div>
<div>
<span>
Native Hawiian or Pacific Islander
</span>
<span>
4.2%
</span>
</div>
<div>
<span>
Other
</span>
<span>
2.5%
</span>
</div>
<div>
<span>
Two or more races
</span>
<span>
6.7%
</span>
</div>
<div>
<span>
Hispanic or Latino
</span>
<span>
10.4%
</span>
</div>
<div>
<span>
White
</span>
<span>
61.4%
</span>
</div>
<h4
class="usa-accordion__heading"
<div>
<span>
Black or African Americon
</span>
<span>
10.3%
</span>
</div>
<div>
<span>
American Indian and Alaska Native
</span>
<span>
10.3%
</span>
</div>
<div>
<span>
American Indian and Alaska Native
</span>
<span>
0.3%
</span>
</div>
<div>
<span>
Asian
</span>
<span>
7.2%
</span>
</div>
<div>
<span>
Native Hawiian or Pacific Islander
</span>
<span>
4.2%
</span>
</div>
<div>
<span>
Other
</span>
<span>
2.5%
</span>
</div>
<div>
<span>
Two or more races
</span>
<span>
6.7%
</span>
</div>
<div>
<span>
Hispanic or Latino
</span>
<span>
10.4%
</span>
</div>
</div>
<h6>
Age
<button
aria-controls="age-expand-content"
aria-expanded="false"
class="usa-accordion__button usa-banner__button"
id="age-expand-control"
type="button"
>
<button
aria-controls="abc"
aria-expanded="false"
class="usa-accordion__button"
data-testid="accordionButton_abc"
type="button"
<span
class="usa-banner__button-text"
>
Age
</button>
</h4>
<div
class="usa-accordion__content usa-prose"
data-testid="accordionItem_abc"
hidden=""
id="abc"
>
<div>
<span>
Children under 10
</span>
<span>
1.4%
</span>
</div>
<div>
<span>
Ages 10 - 64
</span>
<span>
80.3%
</span>
</div>
<div>
<span>
Elderly over 65
</span>
<span>
7.2%
</span>
</div>
show
</span>
</button>
</h6>
<div
aria-labelledby="age-expand-control"
class="usa-banner__content usa-accordion__content"
hidden=""
id="age-expand-content"
>
<div>
<span>
Children under 10
</span>
<span>
1.4%
</span>
</div>
<div>
<span>
Ages 10 - 64
</span>
<span>
80.3%
</span>
</div>
<div>
<span>
Elderly over 65
</span>
<span>
7.2%
</span>
</div>
</div>
</div>
@ -2402,7 +2412,12 @@ exports[`rendering of the AreaDetail checks if indicators for PUERTO RICO are pr
<ul>
<li>
<span>
Census tract:
Tract information
</span>
</li>
<li>
<span>
Number:
</span>
<span>
98729374234
@ -2437,146 +2452,146 @@ exports[`rendering of the AreaDetail checks if indicators for PUERTO RICO are pr
<div>
Tract demographics
</div>
<h6>
Racial Ethnographic
<button
aria-controls="race-expand-content"
aria-expanded="false"
class="usa-accordion__button usa-banner__button"
id="race-expand-control"
type="button"
>
<span
class="usa-banner__button-text"
>
show
</span>
</button>
</h6>
<div
aria-multiselectable="true"
class="usa-accordion"
data-testid="accordion"
aria-labelledby="race-expand-control"
class="usa-banner__content usa-accordion__content"
hidden=""
id="race-expand-content"
>
<h4
class="usa-accordion__heading"
>
<button
aria-controls="123"
aria-expanded="false"
class="usa-accordion__button"
data-testid="accordionButton_123"
type="button"
>
Racial Ethnographic
</button>
</h4>
<div
class="usa-accordion__content usa-prose"
data-testid="accordionItem_123"
hidden=""
id="123"
>
<div>
<span>
White
</span>
<span>
61.4%
</span>
</div>
<div>
<span>
Black or African Americon
</span>
<span>
10.3%
</span>
</div>
<div>
<span>
American Indian and Alaska Native
</span>
<span>
10.3%
</span>
</div>
<div>
<span>
American Indian and Alaska Native
</span>
<span>
0.3%
</span>
</div>
<div>
<span>
Asian
</span>
<span>
7.2%
</span>
</div>
<div>
<span>
Native Hawiian or Pacific Islander
</span>
<span>
4.2%
</span>
</div>
<div>
<span>
Other
</span>
<span>
2.5%
</span>
</div>
<div>
<span>
Two or more races
</span>
<span>
6.7%
</span>
</div>
<div>
<span>
Hispanic or Latino
</span>
<span>
10.4%
</span>
</div>
<div>
<span>
White
</span>
<span>
61.4%
</span>
</div>
<h4
class="usa-accordion__heading"
<div>
<span>
Black or African Americon
</span>
<span>
10.3%
</span>
</div>
<div>
<span>
American Indian and Alaska Native
</span>
<span>
10.3%
</span>
</div>
<div>
<span>
American Indian and Alaska Native
</span>
<span>
0.3%
</span>
</div>
<div>
<span>
Asian
</span>
<span>
7.2%
</span>
</div>
<div>
<span>
Native Hawiian or Pacific Islander
</span>
<span>
4.2%
</span>
</div>
<div>
<span>
Other
</span>
<span>
2.5%
</span>
</div>
<div>
<span>
Two or more races
</span>
<span>
6.7%
</span>
</div>
<div>
<span>
Hispanic or Latino
</span>
<span>
10.4%
</span>
</div>
</div>
<h6>
Age
<button
aria-controls="age-expand-content"
aria-expanded="false"
class="usa-accordion__button usa-banner__button"
id="age-expand-control"
type="button"
>
<button
aria-controls="abc"
aria-expanded="false"
class="usa-accordion__button"
data-testid="accordionButton_abc"
type="button"
<span
class="usa-banner__button-text"
>
Age
</button>
</h4>
<div
class="usa-accordion__content usa-prose"
data-testid="accordionItem_abc"
hidden=""
id="abc"
>
<div>
<span>
Children under 10
</span>
<span>
1.4%
</span>
</div>
<div>
<span>
Ages 10 - 64
</span>
<span>
80.3%
</span>
</div>
<div>
<span>
Elderly over 65
</span>
<span>
7.2%
</span>
</div>
show
</span>
</button>
</h6>
<div
aria-labelledby="age-expand-control"
class="usa-banner__content usa-accordion__content"
hidden=""
id="age-expand-content"
>
<div>
<span>
Children under 10
</span>
<span>
1.4%
</span>
</div>
<div>
<span>
Ages 10 - 64
</span>
<span>
80.3%
</span>
</div>
<div>
<span>
Elderly over 65
</span>
<span>
7.2%
</span>
</div>
</div>
</div>

270
client/src/components/Demographics/__snapshots__/Demographics.test.tsx.snap
View file

@ -6,146 +6,146 @@ exports[`rendering of Demographics Component checks if component renders 1`] = `
<div>
Tract demographics
</div>
<h6>
Racial Ethnographic
<button
aria-controls="race-expand-content"
aria-expanded="false"
class="usa-accordion__button usa-banner__button"
id="race-expand-control"
type="button"
>
<span
class="usa-banner__button-text"
>
show
</span>
</button>
</h6>
<div
aria-multiselectable="true"
class="usa-accordion"
data-testid="accordion"
aria-labelledby="race-expand-control"
class="usa-banner__content usa-accordion__content"
hidden=""
id="race-expand-content"
>
<h4
class="usa-accordion__heading"
>
<button
aria-controls="123"
aria-expanded="false"
class="usa-accordion__button"
data-testid="accordionButton_123"
type="button"
>
Racial Ethnographic
</button>
</h4>
<div
class="usa-accordion__content usa-prose"
data-testid="accordionItem_123"
hidden=""
id="123"
>
<div>
<span>
White
</span>
<span>
61.4%
</span>
</div>
<div>
<span>
Black or African Americon
</span>
<span>
10.3%
</span>
</div>
<div>
<span>
American Indian and Alaska Native
</span>
<span>
10.3%
</span>
</div>
<div>
<span>
American Indian and Alaska Native
</span>
<span>
0.3%
</span>
</div>
<div>
<span>
Asian
</span>
<span>
7.2%
</span>
</div>
<div>
<span>
Native Hawiian or Pacific Islander
</span>
<span>
4.2%
</span>
</div>
<div>
<span>
Other
</span>
<span>
2.5%
</span>
</div>
<div>
<span>
Two or more races
</span>
<span>
6.7%
</span>
</div>
<div>
<span>
Hispanic or Latino
</span>
<span>
10.4%
</span>
</div>
<div>
<span>
White
</span>
<span>
61.4%
</span>
</div>
<h4
class="usa-accordion__heading"
<div>
<span>
Black or African Americon
</span>
<span>
10.3%
</span>
</div>
<div>
<span>
American Indian and Alaska Native
</span>
<span>
10.3%
</span>
</div>
<div>
<span>
American Indian and Alaska Native
</span>
<span>
0.3%
</span>
</div>
<div>
<span>
Asian
</span>
<span>
7.2%
</span>
</div>
<div>
<span>
Native Hawiian or Pacific Islander
</span>
<span>
4.2%
</span>
</div>
<div>
<span>
Other
</span>
<span>
2.5%
</span>
</div>
<div>
<span>
Two or more races
</span>
<span>
6.7%
</span>
</div>
<div>
<span>
Hispanic or Latino
</span>
<span>
10.4%
</span>
</div>
</div>
<h6>
Age
<button
aria-controls="age-expand-content"
aria-expanded="false"
class="usa-accordion__button usa-banner__button"
id="age-expand-control"
type="button"
>
<button
aria-controls="abc"
aria-expanded="false"
class="usa-accordion__button"
data-testid="accordionButton_abc"
type="button"
<span
class="usa-banner__button-text"
>
Age
</button>
</h4>
<div
class="usa-accordion__content usa-prose"
data-testid="accordionItem_abc"
hidden=""
id="abc"
>
<div>
<span>
Children under 10
</span>
<span>
1.4%
</span>
</div>
<div>
<span>
Ages 10 - 64
</span>
<span>
80.3%
</span>
</div>
<div>
<span>
Elderly over 65
</span>
<span>
7.2%
</span>
</div>
show
</span>
</button>
</h6>
<div
aria-labelledby="age-expand-control"
class="usa-banner__content usa-accordion__content"
hidden=""
id="age-expand-content"
>
<div>
<span>
Children under 10
</span>
<span>
1.4%
</span>
</div>
<div>
<span>
Ages 10 - 64
</span>
<span>
80.3%
</span>
</div>
<div>
<span>
Elderly over 65
</span>
<span>
7.2%
</span>
</div>
</div>
</div>

23
client/src/components/TractInfo/TractInfo.module.scss
View file

@ -1,5 +1,24 @@
@use '../../styles/design-system.scss' as *;
@use "../../styles/design-system.scss" as *;
@import "../utils.scss";
.tractInfoContainer{
$sidePanelLabelFontColor: #171716;
@mixin sidePanelLabelStyle {
font-size: medium;
color: $sidePanelLabelFontColor;
font-weight: 600;
}
.tractInfoContainer {
display: flex;
flex-direction: column;
list-style: none;
margin: 0;
padding: 1.2rem 1rem 0 1.2rem;
font-size: medium;
.tractInfoLabel {
@include sidePanelLabelStyle;
}
}

2
client/src/components/TractInfo/TractInfo.module.scss.d.ts vendored
View file

@ -1,6 +1,8 @@
declare namespace TractInfoNamespace {
export interface ITractInfoScss {
tractInfoContainer: string;
tractInfoLabel: string;
tractInfoText: string;
}
}

40
client/src/components/TractInfo/TractInfo.test.tsx
View file

@ -1,15 +1,45 @@
import React from 'react';
import { render } from '@testing-library/react';
import {render} from '@testing-library/react';
import {LocalizedComponent} from '../../test/testHelpers';
import TractInfo from './TractInfo';
describe('rendering of TractInfo Component', () => {
it('checks if tract info renders correctly for national tracts', () => {
const blockGroup = '21183920100';
const countyName = 'Ohio County';
const stateName = 'Kentucky';
const population = 3103;
const sidePanelState = 'Nation';
const {asFragment} = render(
<LocalizedComponent>
<TractInfo />
<TractInfo
blockGroup={blockGroup}
countyName ={countyName}
stateName ={stateName}
population ={population}
sidePanelState ={sidePanelState}
/>
</LocalizedComponent>,
);
it('checks if component renders', () => {
expect(asFragment()).toMatchSnapshot();
});
expect(asFragment()).toMatchSnapshot();
});
it('checks if tract info renders correctly for non-national tracts', () => {
const blockGroup = '72107954901';
const countyName = 'Orocovis Municipio';
const stateName = 'Puerto Rico';
const population = 3103;
const sidePanelState = 'Puerto Rico';
const {asFragment} = render(
<LocalizedComponent>
<TractInfo
blockGroup={blockGroup}
countyName ={countyName}
stateName ={stateName}
population ={population}
sidePanelState ={sidePanelState}
/>
</LocalizedComponent>,
);
expect(asFragment()).toMatchSnapshot();
});
});

52
client/src/components/TractInfo/TractInfo.tsx
View file

@ -1,14 +1,56 @@
import React from 'react';
import {useIntl} from 'gatsby-plugin-intl';
import * as styles from './TractInfo.module.scss';
import * as EXPLORE_COPY from '../../data/copy/explore';
import * as constants from '../../data/constants';
export interface ITractInfoProps {}
export interface ITractInfoProps {
blockGroup: string,
countyName: string,
stateName: string,
population: number,
sidePanelState: string,
}
const TractInfo = ({blockGroup, countyName, stateName, population, sidePanelState}: ITractInfoProps) => {
const intl = useIntl();
const TractInfo = ({}: ITractInfoProps) => {
return (
<div className={styles.tractInfoContainer}>
Hello 👋, I am a TractInfo component.
</div>
<ul className={styles.tractInfoContainer}>
<li>
<span className={styles.tractInfoLabel}>
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_CBG_INFO.CENSUS_INFO_TITLE)}
</span>
</li>
<li>
<span>
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_CBG_INFO.CENSUS_BLOCK_GROUP)}
</span>
<span>{` ${blockGroup}`}</span>
</li>
<li>
<span>
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_CBG_INFO.COUNTY)}
</span>
<span>{` ${countyName}`}</span>
</li>
<li>
<span>
{sidePanelState !== constants.SIDE_PANEL_STATE_VALUES.NATION ?
intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_CBG_INFO.TERRITORY) :
intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_CBG_INFO.STATE)
}
</span>
<span>{` ${stateName}`}</span>
</li>
<li>
<span>
{intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_CBG_INFO.POPULATION)}
</span>
<span>{` ${population.toLocaleString()}`}</span>
</li>
</ul>
);
};

89
client/src/components/TractInfo/__snapshots__/TractInfo.test.tsx.snap Normal file
View file

@ -0,0 +1,89 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`rendering of TractInfo Component checks if tract info renders correctly for national tracts 1`] = `
<DocumentFragment>
<ul>
<li>
<span>
Tract information
</span>
</li>
<li>
<span>
Number:
</span>
<span>
21183920100
</span>
</li>
<li>
<span>
County:
</span>
<span>
Ohio County
</span>
</li>
<li>
<span>
State:
</span>
<span>
Kentucky
</span>
</li>
<li>
<span>
Population:
</span>
<span>
3,103
</span>
</li>
</ul>
</DocumentFragment>
`;
exports[`rendering of TractInfo Component checks if tract info renders correctly for non-national tracts 1`] = `
<DocumentFragment>
<ul>
<li>
<span>
Tract information
</span>
</li>
<li>
<span>
Number:
</span>
<span>
72107954901
</span>
</li>
<li>
<span>
County:
</span>
<span>
Orocovis Municipio
</span>
</li>
<li>
<span>
Territory:
</span>
<span>
Puerto Rico
</span>
</li>
<li>
<span>
Population:
</span>
<span>
3,103
</span>
</li>
</ul>
</DocumentFragment>
`;

7
client/src/data/copy/explore.tsx
View file

@ -253,9 +253,14 @@ export const SIDE_PANEL_VERION = {
};
export const SIDE_PANEL_CBG_INFO = defineMessages({
CENSUS_INFO_TITLE: {
id: 'explore.map.page.side.panel.geographicInfo.title',
defaultMessage: 'Tract information',
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show the census tract info title`,
},
CENSUS_BLOCK_GROUP: {
id: 'explore.map.page.side.panel.geographicInfo.censusBlockGroup',
defaultMessage: 'Census tract:',
defaultMessage: 'Number:',
description: `Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show the census tract id number of the feature selected`,
},
COUNTY: {

6
client/src/intl/en.json
View file

@ -452,7 +452,7 @@
"description": "Navigate to the explore the map page. When the map is in view, click on the map. This will display YES if the census tract is disadvantaged"
},
"explore.map.page.side.panel.geographicInfo.censusBlockGroup": {
"defaultMessage": "Census tract:",
"defaultMessage": "Number:",
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show the census tract id number of the feature selected"
},
"explore.map.page.side.panel.geographicInfo.county": {
@ -471,6 +471,10 @@
"defaultMessage": "Territory:",
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show the territory of the feature selected"
},
"explore.map.page.side.panel.geographicInfo.title": {
"defaultMessage": "Tract information",
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show the census tract info title"
},
"explore.map.page.side.panel.indicator.asthma": {
"defaultMessage": "Asthma",
"description": "Navigate to the explore the map page. When the map is in view, click on the map. The side panel will show Asthma"