diff --git a/.github/workflows/deploy_fe_staging.yml b/.github/workflows/deploy_fe_staging.yml index 0ddc1f86..44d844cd 100644 --- a/.github/workflows/deploy_fe_staging.yml +++ b/.github/workflows/deploy_fe_staging.yml @@ -36,7 +36,7 @@ jobs: # https://github.com/usds/justice40-tool/blob/main/client/README.md DATA_SOURCE: cdn SITE_URL: "${{ secrets.STAGE_SITE_URL }}" - PATH_PREFIX: "/justice40-tool/${{env.DESTINATION_FOLDER}}" + PATH_PREFIX: "/${{env.DESTINATION_FOLDER}}" MAPBOX_STYLES_READ_TOKEN: "${{ secrets.MAPBOX_STYLES_READ_TOKEN }}" - name: Get directory contents run: ls -la public @@ -94,7 +94,7 @@ jobs: # Deploy to S3 for the staging URL message: | **🚢 Here is the frontend staging link: 🚢** - Find it here: http://usds-geoplatform-justice40-website.s3-website-us-east-1.amazonaws.com/justice40-tool/${{env.DESTINATION_FOLDER}}/en/ ! + Find it here: https://screeningtool-staging.geoplatform.gov/${{env.DESTINATION_FOLDER}}/en/ ! repo-token: ${{ secrets.GITHUB_TOKEN }} repo-token-user-login: "github-actions[bot]" # The user.login for temporary GitHub tokens allow-repeats: false # This is the default diff --git a/client/README.md b/client/README.md index 42b468cd..78fe76fd 100644 --- a/client/README.md +++ b/client/README.md @@ -222,5 +222,5 @@ The following attemps to explain why certain packages versions have been chosen | gatsby | 3.14.6 | 4.14.2 | No | when attempting to update - breaks all unit tests. Compatibility warning come up with all plugins but this doesn't seems to effect functionality. This is the latest version we can release without investigating unit tests. | | gatsby-cli | 3.14.2 | 4.15.2 | No | when attempting to update - breaks all unit tests. Compatibility warning come up with all plugins but this doesn't seems to effect functionality. This is the latest version we can release without investigating unit tests.| | sass | 1.32.12 | 1.52.3 | No | This version is needed to surpress the dart warnings on / as division for each component. See [here](https://github.com/twbs/bootstrap/issues/34051#issuecomment-845884423) for more information | -| uswds | 2.11.2 | 3.0.2 | No | Needs to stay at 2.11 for peer dependency on trussworks| -| trussworks | 2.9.0 | 3.0.2 | No | Needs to stay at 2.9 as 3.0 is breaking change | \ No newline at end of file +| uswds | 2.13.3 | 3.0.2 | No | Needs to stay at 2.13.3 for peer dependency on trussworks| +| trussworks | 3.1.0 | 3.1.0 | No | latest! | \ No newline at end of file diff --git a/client/package-lock.json b/client/package-lock.json index 98a13bc7..f4a654cb 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -11,7 +11,7 @@ "dependencies": { "-": "^0.0.1", "@sentry/gatsby": "^7.7.0", - "@trussworks/react-uswds": "^2.9.0", + "@trussworks/react-uswds": "^3.1.0", "@turf/bbox": "^6.5.0", "d3-ease": "^3.0.1", "gatsby-plugin-env-variables": "^2.2.0", @@ -27,7 +27,7 @@ "react-intl": "^5.24.7", "react-map-gl": "^6.1.19", "react-use": "^17.3.2", - "uswds": "^2.11.2" + "uswds": "^2.13.3" }, "devDependencies": { "@formatjs/cli": "^4.8.2", @@ -3579,16 +3579,16 @@ } }, "node_modules/@trussworks/react-uswds": { - "version": "2.9.0", - "resolved": "https://registry.npmjs.org/@trussworks/react-uswds/-/react-uswds-2.9.0.tgz", - "integrity": "sha512-qv5twPgzLJulWsZew3No3W45FTp3WrYGwG/3B+w/mPFuAMHmAX7VAiigmg+k2kHFvrpjyAiKZHREpHyhkZIbig==", + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/@trussworks/react-uswds/-/react-uswds-3.1.0.tgz", + "integrity": "sha512-4krdLn8LGgr3EwOsizUF6cBLnwDS6x0WgJjjGk59kNBpgH4qiv8YGzic3HYaVr8xWBq36VpEEfGeQZnjYGMegw==", "engines": { - "node": "10.x - 16.x" + "node": "10.x - 18.x" }, "peerDependencies": { "react": "^16.x || ^17.x", "react-dom": "^16.x || ^17.x", - "uswds": "2.11.2" + "uswds": "2.13.3" } }, "node_modules/@trysound/sax": { @@ -6622,9 +6622,9 @@ } }, "node_modules/classlist-polyfill": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/classlist-polyfill/-/classlist-polyfill-1.2.0.tgz", - "integrity": "sha1-k1vC39lFiodrJ5YXUUY4vKqWSi4=" + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/classlist-polyfill/-/classlist-polyfill-1.0.3.tgz", + "integrity": "sha512-bDLDUsSg5LYFWsc2hphtG6ulyaCFSupdEBU3wxNECKWHnyPVvY8EB9Wbt9DzWkstWclFZhDaZK/VnEK/DmqE/Q==" }, "node_modules/clean-stack": { "version": "2.2.0", @@ -8877,11 +8877,6 @@ "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.89.tgz", "integrity": "sha512-z1Axg0Fu54fse8wN4fd+GAINdU5mJmLtcl6bqIcYyzNVGONcfHAeeJi88KYMQVKalhXlYuVPzKkFIU5VD0raUw==" }, - "node_modules/elem-dataset": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/elem-dataset/-/elem-dataset-2.0.0.tgz", - "integrity": "sha512-e7gieGopWw5dMdEgythH3lUS7nMizutPDTtkzfQW/q2gCvFnACyNnK3ytCncAXKxdBXQWcXeKaYTTODiMnp8mw==" - }, "node_modules/element-closest": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/element-closest/-/element-closest-2.0.2.tgz", @@ -25238,57 +25233,20 @@ } }, "node_modules/uswds": { - "version": "2.11.2", - "resolved": "https://registry.npmjs.org/uswds/-/uswds-2.11.2.tgz", - "integrity": "sha512-JISTXCjPIlrufbObIifjrMDn5jF9bbLu7UYhGWmEs9iqB6Z2KDCXHVoBUyzMmIrIjW/UWWYHZzPqOOHO6/IMCQ==", + "version": "2.13.3", + "resolved": "https://registry.npmjs.org/uswds/-/uswds-2.13.3.tgz", + "integrity": "sha512-qCblljeaRvS3+PrSxoHqQwmMnp746+Y1YZA34BkTzJknvo2bhhdzGE21yJaInumzIqV3glLD13TFdRwrwikMMQ==", "dependencies": { - "classlist-polyfill": "^1.0.3", - "del": "^6.0.0", - "domready": "^1.0.8", - "elem-dataset": "^2.0.0", - "object-assign": "^4.1.1", - "receptor": "^1.0.0", - "resolve-id-refs": "^0.1.0" + "classlist-polyfill": "1.0.3", + "domready": "1.0.8", + "object-assign": "4.1.1", + "receptor": "1.0.0", + "resolve-id-refs": "0.1.0" }, "engines": { "node": ">= 4" } }, - "node_modules/uswds/node_modules/del": { - "version": "6.0.0", - "resolved": "https://registry.npmjs.org/del/-/del-6.0.0.tgz", - "integrity": "sha512-1shh9DQ23L16oXSZKB2JxpL7iMy2E0S9d517ptA1P8iw0alkPtQcrKH7ru31rYtKwF499HkTu+DRzq3TCKDFRQ==", - "dependencies": { - "globby": "^11.0.1", - "graceful-fs": "^4.2.4", - "is-glob": "^4.0.1", - "is-path-cwd": "^2.2.0", - "is-path-inside": "^3.0.2", - "p-map": "^4.0.0", - "rimraf": "^3.0.2", - "slash": "^3.0.0" - }, - "engines": { - "node": ">=10" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, - "node_modules/uswds/node_modules/p-map": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/p-map/-/p-map-4.0.0.tgz", - "integrity": "sha512-/bjOqmgETBYB5BoEeGVea8dmvHb2m9GLy1E9W43yeyfP6QQCZGFNa+XRceJEuDB6zqr+gKpIAmlLebMpykw/MQ==", - "dependencies": { - "aggregate-error": "^3.0.0" - }, - "engines": { - "node": ">=10" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, "node_modules/util": { "version": "0.10.4", "resolved": "https://registry.npmjs.org/util/-/util-0.10.4.tgz", @@ -29128,9 +29086,9 @@ "dev": true }, "@trussworks/react-uswds": { - "version": "2.9.0", - "resolved": "https://registry.npmjs.org/@trussworks/react-uswds/-/react-uswds-2.9.0.tgz", - "integrity": "sha512-qv5twPgzLJulWsZew3No3W45FTp3WrYGwG/3B+w/mPFuAMHmAX7VAiigmg+k2kHFvrpjyAiKZHREpHyhkZIbig==", + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/@trussworks/react-uswds/-/react-uswds-3.1.0.tgz", + "integrity": "sha512-4krdLn8LGgr3EwOsizUF6cBLnwDS6x0WgJjjGk59kNBpgH4qiv8YGzic3HYaVr8xWBq36VpEEfGeQZnjYGMegw==", "requires": {} }, "@trysound/sax": { @@ -31616,9 +31574,9 @@ } }, "classlist-polyfill": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/classlist-polyfill/-/classlist-polyfill-1.2.0.tgz", - "integrity": "sha1-k1vC39lFiodrJ5YXUUY4vKqWSi4=" + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/classlist-polyfill/-/classlist-polyfill-1.0.3.tgz", + "integrity": "sha512-bDLDUsSg5LYFWsc2hphtG6ulyaCFSupdEBU3wxNECKWHnyPVvY8EB9Wbt9DzWkstWclFZhDaZK/VnEK/DmqE/Q==" }, "clean-stack": { "version": "2.2.0", @@ -33405,11 +33363,6 @@ "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.89.tgz", "integrity": "sha512-z1Axg0Fu54fse8wN4fd+GAINdU5mJmLtcl6bqIcYyzNVGONcfHAeeJi88KYMQVKalhXlYuVPzKkFIU5VD0raUw==" }, - "elem-dataset": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/elem-dataset/-/elem-dataset-2.0.0.tgz", - "integrity": "sha512-e7gieGopWw5dMdEgythH3lUS7nMizutPDTtkzfQW/q2gCvFnACyNnK3ytCncAXKxdBXQWcXeKaYTTODiMnp8mw==" - }, "element-closest": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/element-closest/-/element-closest-2.0.2.tgz", @@ -45704,42 +45657,15 @@ "integrity": "sha512-cwESVXlO3url9YWlFW/TA9cshCEhtu7IKJ/p5soJ/gGpj7vbvFrAY/eIioQ6Dw23KjZhYgiIo8HOs1nQ2vr/oQ==" }, "uswds": { - "version": "2.11.2", - "resolved": "https://registry.npmjs.org/uswds/-/uswds-2.11.2.tgz", - "integrity": "sha512-JISTXCjPIlrufbObIifjrMDn5jF9bbLu7UYhGWmEs9iqB6Z2KDCXHVoBUyzMmIrIjW/UWWYHZzPqOOHO6/IMCQ==", + "version": "2.13.3", + "resolved": "https://registry.npmjs.org/uswds/-/uswds-2.13.3.tgz", + "integrity": "sha512-qCblljeaRvS3+PrSxoHqQwmMnp746+Y1YZA34BkTzJknvo2bhhdzGE21yJaInumzIqV3glLD13TFdRwrwikMMQ==", "requires": { - "classlist-polyfill": "^1.0.3", - "del": "^6.0.0", - "domready": "^1.0.8", - "elem-dataset": "^2.0.0", - "object-assign": "^4.1.1", - "receptor": "^1.0.0", - "resolve-id-refs": "^0.1.0" - }, - "dependencies": { - "del": { - "version": "6.0.0", - "resolved": "https://registry.npmjs.org/del/-/del-6.0.0.tgz", - "integrity": "sha512-1shh9DQ23L16oXSZKB2JxpL7iMy2E0S9d517ptA1P8iw0alkPtQcrKH7ru31rYtKwF499HkTu+DRzq3TCKDFRQ==", - "requires": { - "globby": "^11.0.1", - "graceful-fs": "^4.2.4", - "is-glob": "^4.0.1", - "is-path-cwd": "^2.2.0", - "is-path-inside": "^3.0.2", - "p-map": "^4.0.0", - "rimraf": "^3.0.2", - "slash": "^3.0.0" - } - }, - "p-map": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/p-map/-/p-map-4.0.0.tgz", - "integrity": "sha512-/bjOqmgETBYB5BoEeGVea8dmvHb2m9GLy1E9W43yeyfP6QQCZGFNa+XRceJEuDB6zqr+gKpIAmlLebMpykw/MQ==", - "requires": { - "aggregate-error": "^3.0.0" - } - } + "classlist-polyfill": "1.0.3", + "domready": "1.0.8", + "object-assign": "4.1.1", + "receptor": "1.0.0", + "resolve-id-refs": "0.1.0" } }, "util": { diff --git a/client/package.json b/client/package.json index b4de4d1a..7b643cbb 100644 --- a/client/package.json +++ b/client/package.json @@ -77,7 +77,7 @@ "dependencies": { "-": "^0.0.1", "@sentry/gatsby": "^7.7.0", - "@trussworks/react-uswds": "^2.9.0", + "@trussworks/react-uswds": "^3.1.0", "@turf/bbox": "^6.5.0", "d3-ease": "^3.0.1", "gatsby-plugin-env-variables": "^2.2.0", @@ -93,7 +93,7 @@ "react-intl": "^5.24.7", "react-map-gl": "^6.1.19", "react-use": "^17.3.2", - "uswds": "^2.11.2" + "uswds": "^2.13.3" }, "cypress-cucumber-preprocessor": { "nonGlobalStepDefinitions": false diff --git a/client/src/components/AboutCard/AboutCard.tsx b/client/src/components/AboutCard/AboutCard.tsx index 84b20742..88aeb96a 100644 --- a/client/src/components/AboutCard/AboutCard.tsx +++ b/client/src/components/AboutCard/AboutCard.tsx @@ -64,7 +64,7 @@ const AboutCard = (props: React.PropsWithChildren) => { internal={props.internal} url={props.url ? props.url : ''} openUrlNewTab={props.openUrlNewTab} - className={'j40-aboutcard-link'} + // className={'j40-aboutcard-link'} /> diff --git a/client/src/components/AboutCard/__snapshots__/AboutCard.test.tsx.snap b/client/src/components/AboutCard/__snapshots__/AboutCard.test.tsx.snap index 27af5591..d2101d46 100644 --- a/client/src/components/AboutCard/__snapshots__/AboutCard.test.tsx.snap +++ b/client/src/components/AboutCard/__snapshots__/AboutCard.test.tsx.snap @@ -77,7 +77,6 @@ exports[`rendering of the AboutCard checks if small cards component renders 1`] class="j40-aboutcard-sm-link" > diff --git a/client/src/components/AreaDetail/AreaDetail.tsx b/client/src/components/AreaDetail/AreaDetail.tsx index 4f19f968..48d61346 100644 --- a/client/src/components/AreaDetail/AreaDetail.tsx +++ b/client/src/components/AreaDetail/AreaDetail.tsx @@ -288,7 +288,7 @@ const AreaDetail = ({properties, hash}: IAreaDetailProps) => { // description: intl.formatMessage(EXPLORE_COPY.SIDE_PANEL_INDICATOR_DESCRIPTION.MED_HOME_VAL), // value: properties[constants.MEDIAN_HOME_VALUE_PERCENTILE] ? // properties[constants.MEDIAN_HOME_VALUE_PERCENTILE] : null, - // isDisadvagtaged: false, // TODO + // isDisadvagtaged: false, // }; const proxHaz: indicatorInfo = { @@ -531,6 +531,15 @@ const AreaDetail = ({properties, hash}: IAreaDetailProps) => { // component to render the actual Indicator const categoryItems = categories.map((category) => ({ id: category.id, + + /* + As of trussworks 3.0.0, there were some breaking changes. This new prop of headingLevel + is required, however, the title prop is already defining the category styling, so this + is placed here to satisfy the requirement of the AccordionItems API, however it's not + being used. + */ + headingLevel: 'h4', + title: , content: ( <> diff --git a/client/src/components/J40Map.module.scss b/client/src/components/J40Map.module.scss index 926f2f58..f1d83333 100644 --- a/client/src/components/J40Map.module.scss +++ b/client/src/components/J40Map.module.scss @@ -1,24 +1,57 @@ @use '../styles/design-system.scss' as *; @import "./utils.scss"; -.j40Popup { - width: 375px; -} -.navigationControl { - left: .75em; - top: units(15); - // width: 2.5em; -} +.j40Map { + // width < 1024 + @include at-media-max("desktop") { + height: 55vh; + } -.fullscreenControl { - right: 1.25em; - top: 2.5em; -} + .mapHeaderRow{ + @include u-display("flex"); + @include u-padding-left(1.5); + justify-content: flex-start; + + + .geolocateBox { + flex: 1 2 47%; + align-self: flex-end; + margin-bottom: 30px; + margin-left: 1rem; + + .geolocateMessage { + visibility: visible; + background-color: white; + margin-bottom: 3px; + max-width: fit-content; + } + + .geolocateMessageHide { + visibility: hidden; + margin-bottom: 3px; + } + + .geolocateIcon{ + align-self: flex-end; + } + } + } + + .navigationControl { + left: .75em; + top: units(15); + } + + //These classes are behind feature flags: + .fullscreenControl { + right: 1.25em; + top: 2.5em; + } + .j40Popup { + width: 375px; + } -.geolocateControl { - right: 1.25em; - top: 5em; } .mapInfoPanel { @@ -26,11 +59,3 @@ overflow-y: auto; height: 90vh; } - -// This will control the height of the map when the device -// width is less than desktop (1024px) -.j40Map { - @include at-media-max("desktop") { - height: 55vh; - } -} \ No newline at end of file diff --git a/client/src/components/J40Map.module.scss.d.ts b/client/src/components/J40Map.module.scss.d.ts index 502b1205..60fea2cc 100644 --- a/client/src/components/J40Map.module.scss.d.ts +++ b/client/src/components/J40Map.module.scss.d.ts @@ -1,14 +1,23 @@ declare namespace J40MapModuleScssNamespace { export interface IJ40MapModuleScss { - j40Popup: string; - territoryFocusButton: string; - territoryFocusContainer: string; - navigationControl: string; - fullscreenControl: string; - geolocateControl: string; - detailView: string; - mapInfoPanel: string; + // main J40 map style j40Map: string; + + // map header row + mapHeaderRow: string; + geolocateBox: string; + geolocateMessage: string; + geolocateMessageHide: string; + geolocateIcon: string; + + // nav control + navigationControl: string; + + // feature flags + fullscreenControl: string; + j40Popup: string; + + mapInfoPanel: string; } } diff --git a/client/src/components/J40Map.tsx b/client/src/components/J40Map.tsx index 814c9dd4..f4e57fc3 100644 --- a/client/src/components/J40Map.tsx +++ b/client/src/components/J40Map.tsx @@ -13,6 +13,7 @@ import ReactMapGL, { FlyToInterpolator, FullscreenControl, MapRef, Source, Layer} from 'react-map-gl'; +import {useIntl} from 'gatsby-plugin-intl'; import bbox from '@turf/bbox'; import * as d3 from 'd3-ease'; import {isMobile} from 'react-device-detect'; @@ -34,6 +35,7 @@ import 'maplibre-gl/dist/maplibre-gl.css'; import * as constants from '../data/constants'; import * as styles from './J40Map.module.scss'; import * as COMMON_COPY from '../data/copy/common'; +import * as EXPLORE_COPY from '../data/copy/explore'; declare global { @@ -98,7 +100,12 @@ export const featureURLForTilesetName = (tilesetName: string): string => { } }; - +/** + * This the main map component + * + * @param {IJ40Interface} location + * @returns {ReactElement} + */ const J40Map = ({location}: IJ40Interface) => { /** * Initializes the zoom, and the map's center point (lat, lng) via the URL hash #{z}/{lat}/{long} @@ -131,6 +138,7 @@ const J40Map = ({location}: IJ40Interface) => { const mapRef = useRef(null); const flags = useFlags(); + const intl = useIntl(); const selectedFeatureId = (selectedFeature && selectedFeature.id) || ''; const filter = useMemo(() => ['in', constants.GEOID_PROPERTY, selectedFeatureId], [selectedFeature]); @@ -329,12 +337,12 @@ const J40Map = ({location}: IJ40Interface) => { return ( <> - {/** - * // * This will render the MapSearch component - * * Note: - * The MapSearch component is no longer wrapped in a div in order to allow this feature + * The MapSearch component is no longer used in this location. It has been moved inside the + * component itself. + * + * It was originally wrapped in a div in order to allow this feature * to be behind a feature flag. This was causing a bug for MapSearch to render * correctly in a production build. Leaving this comment here in case future flags are * needed in this component. @@ -346,9 +354,9 @@ const J40Map = ({location}: IJ40Interface) => { * - npm run clean && npm run build && npm run serve * * to ensure the production build works and that MapSearch and the map (ReactMapGL) render correctly. + * + * Any component declarations outside the component may be susceptible to this bug. */} - - {/** * The ReactMapGL component's props are grouped by the API's documentation. The component also has @@ -393,7 +401,9 @@ const J40Map = ({location}: IJ40Interface) => { data-cy={'reactMapGL'} > {/** - * The low zoom source + * Load all data sources and layers + * + * First the low zoom: */} { /> - {/* This will add the navigation controls of the zoom in and zoom out buttons */} + {/* This is the first overlayed row on the map: Search and Geolocation */} +
+ + +
+ {windowWidth > constants.USWDS_BREAKPOINTS.MOBILE_LG &&
+ {intl.formatMessage(EXPLORE_COPY.MAP.GEOLOC_MSG_LOCATING)} +
} +
+ +
+
+ +
+ + {/* This is the second row overlayed on the map, it will add the navigation controls + of the zoom in and zoom out buttons */} { windowWidth > constants.USWDS_BREAKPOINTS.MOBILE_LG && } - {/* This will show shortcut buttons to pan/zoom to US territories */} + {/* This is the third row overlayed on the map, it will show shortcut buttons to + pan/zoom to US territories */} - {/* This places Geolocation behind a feature flag */} - {'gl' in flags ? : ''} - {geolocationInProgress ?
Geolocation in progress...
: ''} - {/* Enable fullscreen pop-up behind a feature flag */} {('fs' in flags && detailViewData && !transitionInProgress) && ( 1024 + @include at-media("desktop") { + flex: 1 1 72%; + } } diff --git a/client/src/components/MapSearch/__snapshots__/MapSearch.test.tsx.snap b/client/src/components/MapSearch/__snapshots__/MapSearch.test.tsx.snap index 6a56e2de..9d1c383c 100644 --- a/client/src/components/MapSearch/__snapshots__/MapSearch.test.tsx.snap +++ b/client/src/components/MapSearch/__snapshots__/MapSearch.test.tsx.snap @@ -31,11 +31,11 @@ exports[`rendering of the MapSearch checks if component renders 1`] = ` data-testid="button" type="submit" > - - Search - + Search diff --git a/client/src/components/MapSearchMessage/MapSearchMessage.module.scss b/client/src/components/MapSearchMessage/MapSearchMessage.module.scss index 646b8116..6d0e6e23 100644 --- a/client/src/components/MapSearchMessage/MapSearchMessage.module.scss +++ b/client/src/components/MapSearchMessage/MapSearchMessage.module.scss @@ -11,6 +11,7 @@ .showMessage { @include searchMessageLayout; display: block; + width: fit-content; } .hideMessage { diff --git a/client/src/components/PublicEvent/PublicEvent.tsx b/client/src/components/PublicEvent/PublicEvent.tsx index 6a9c8b65..39408b3c 100644 --- a/client/src/components/PublicEvent/PublicEvent.tsx +++ b/client/src/components/PublicEvent/PublicEvent.tsx @@ -43,7 +43,7 @@ const PublicEvent = ({event}:IPublicEvent) => { }> {/* Heading */} - + {isEventExpired ? eventName : { return ( - {intl.formatMessage(PUBLIC_COPY.PUBLIC_ENG_VIDEO.BODY)} - - - - - - + + + ); }; diff --git a/client/src/components/RequestForInfo/RequestForInfo.tsx b/client/src/components/RequestForInfo/RequestForInfo.tsx index bb8324b8..9ef6a7b8 100644 --- a/client/src/components/RequestForInfo/RequestForInfo.tsx +++ b/client/src/components/RequestForInfo/RequestForInfo.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import {SummaryBox} from '@trussworks/react-uswds'; +import {SummaryBox, SummaryBoxContent, SummaryBoxHeading} from '@trussworks/react-uswds'; import {useIntl} from 'gatsby-plugin-intl'; import * as CONTACT_COPY from '../../data/copy/contact'; @@ -9,8 +9,16 @@ const RequestForInfo = () => { const intl = useIntl(); return ( - -

{CONTACT_COPY.RFI_BOX_BODY}

+ + + + {intl.formatMessage(CONTACT_COPY.RFI_BOX.TITLE)} + + + +

{CONTACT_COPY.RFI_BOX_BODY}

+ + ); }; diff --git a/client/src/data/copy/explore.tsx b/client/src/data/copy/explore.tsx index 33029c9b..3f56d83b 100644 --- a/client/src/data/copy/explore.tsx +++ b/client/src/data/copy/explore.tsx @@ -9,6 +9,12 @@ import * as DOWNLOADS_COPY from './downloads'; import * as METHODOLOGY_COPY from './methodology'; import {PAGES_ENDPOINTS} from '../constants'; +export const EXPLORE_PAGE_LINKS = { + TRIBAL_ACTION_PLAN: `https://www.whitehouse.gov/wp-content/uploads/2022/01/CEQ-Tribal-Consultation-Plan-04.26.2021.pdf`, + TRIBAL_WHITEHOUSE: `https://www.whitehouse.gov/briefing-room/presidential-actions/2021/01/26/memorandum-on-tribal-consultation-and-strengthening-nation-to-nation-relationships/`, + TRIBAL_FED_REGISTER: `https://www.federalregister.gov/documents/2000/11/09/00-29003/consultation-and-coordination-with-indian-tribal-governments`, +}; + export const PAGE_INTRO = defineMessages({ PAGE_TILE: { id: 'explore.map.page.title.text', @@ -158,6 +164,26 @@ export const MAP = defineMessages({ defaultMessage: 'US Virgin Islands', description: 'On the explore the map page, on the map, the full name indicating the bounds of US Virgin Islands', }, + GEOLOC_MSG_LOCATING: { + id: 'explore.map.page.map.geolocation.locating', + defaultMessage: 'Finding location...', + description: 'On the explore the map page, on the map, this is the message above the gelocation icon that geolocation is locating.', + }, + GEOLOC_MSG_DISABLED: { + id: 'explore.map.page.map.geolocation.disabled', + defaultMessage: 'Geolocation disabled', + description: 'On the explore the map page, on the map, this is the message above the gelocation icon that geolocation is disabled.', + }, + // GEOLOC_MSG_OFF: { + // id: 'explore.map.page.map.geolocation.off', + // defaultMessage: 'Geolocation off', + // description: 'On the explore the map page, on the map, this is the message above the gelocation icon that geolocation is off.', + // }, + // GEOLOC_MSG_LOCKED: { + // id: 'explore.map.page.map.geolocation.locked', + // defaultMessage: 'Geolocation locked', + // description: 'On the explore the map page, on the map, this is the message above the gelocation icon that geolocation is locked.', + // }, }); @@ -868,16 +894,16 @@ export const NOTE_ON_TRIBAL_NATIONS = { is engaging in consultation and coordination with Tribal Nations on the beta version of the map to provide Tribal Nations with meaningful opportunities for input, consistent with CEQ’s Action Plan for Consultation and Coordination with Tribal Nations, - President Biden’s Memorandum on Tribal Consultation and Strengthening - Nation-to-Nation Consultation, and Executive Order 13175 on Consultation and + President Biden’s Memorandum on Tribal Consultation and Strengthening + Nation-to-Nation Consultation, and Executive Order 13175 on Consultation and Coordination With Indian Tribal Governments. `} description={`Navigate to the explore the map page. Under the map, you will see tribal nations paragraph 1`} values={{ 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), + link2: COMMON_COPY.linkFn(EXPLORE_PAGE_LINKS.TRIBAL_ACTION_PLAN, false, true), + link3: COMMON_COPY.linkFn(EXPLORE_PAGE_LINKS.TRIBAL_WHITEHOUSE, false, true), + link4: COMMON_COPY.linkFn(EXPLORE_PAGE_LINKS.TRIBAL_FED_REGISTER, false, true), }} />, }; diff --git a/client/src/intl/en.json b/client/src/intl/en.json index af1164be..d86db2f3 100644 --- a/client/src/intl/en.json +++ b/client/src/intl/en.json @@ -343,6 +343,14 @@ "defaultMessage": "Communities identified as disadvantaged by the map are those that are marginalized, underserved, and overburdened by pollution. These communities are at or above the thresholds in one or more of eight categories of criteria.", "description": "On the explore the map page, the description of the legend" }, + "explore.map.page.map.geolocation.disabled": { + "defaultMessage": "Geolocation disabled", + "description": "On the explore the map page, on the map, this is the message above the gelocation icon that geolocation is disabled." + }, + "explore.map.page.map.geolocation.locating": { + "defaultMessage": "Finding location...", + "description": "On the explore the map page, on the map, this is the message above the gelocation icon that geolocation is locating." + }, "explore.map.page.map.search.placeholder.mobile.text": { "defaultMessage": "Search locations", "description": "On the explore the map page, on the map, the placeholder text for search" @@ -868,7 +876,7 @@ "description": "Navigate to the explore the map page. Under the map, you will see tribal nations intro text" }, "explore.map.page.under.map.note.on.tribal.nations.para.1": { - "defaultMessage": "The map covers all U.S. census tracts, including those located within Tribal Nations, to the extent that data is available (see our Methodology & data page for more information). CEQ is engaging in consultation and coordination with Tribal Nations on the beta version of the map to provide Tribal Nations with meaningful opportunities for input, consistent with CEQ’s Action Plan for Consultation and Coordination with Tribal Nations, President Biden’s Memorandum on Tribal Consultation and Strengthening Nation-to-Nation Consultation, and Executive Order 13175 on Consultation and Coordination With Indian Tribal Governments.", + "defaultMessage": "The map covers all U.S. census tracts, including those located within Tribal Nations, to the extent that data is available (see our Methodology & data page for more information). CEQ is engaging in consultation and coordination with Tribal Nations on the beta version of the map to provide Tribal Nations with meaningful opportunities for input, consistent with CEQ’s Action Plan for Consultation and Coordination with Tribal Nations, President Biden’s Memorandum on Tribal Consultation and Strengthening Nation-to-Nation Consultation, and Executive Order 13175 on Consultation and Coordination With Indian Tribal Governments.", "description": "Navigate to the explore the map page. Under the map, you will see tribal nations paragraph 1" }, "fab.survey.text": { diff --git a/client/src/pages/tests/__snapshots__/about.test.tsx.snap b/client/src/pages/tests/__snapshots__/about.test.tsx.snap index e028de3e..0734b65a 100644 --- a/client/src/pages/tests/__snapshots__/about.test.tsx.snap +++ b/client/src/pages/tests/__snapshots__/about.test.tsx.snap @@ -607,7 +607,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis class="j40-aboutcard-sm-link" > Methodology & data @@ -662,7 +661,6 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis class="j40-aboutcard-sm-link" > Explore the map @@ -731,7 +729,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis class="j40-aboutcard-sm-link" >