Modifies ExploreTool page to match sprint 4 design (#481)

* initial commit of sprint 4 explore page

* adds styling on HowYouCanHelp module

* troubleshooting li element on deployed URL

removing local bullet styles

* removing unused styles

* recreating HowYouCanHelp

* explicit list el styles

* adds bullets back in

* fixes tooltip style and alert padding

* componentize MapLegend

* fix links

* inital intl and unit tests

* adds trusswork tooltip for comparison

* updates based on various feedback and disucssions:

- removes react-tooltip
- placeholder trussworks tooltip
- removes download packet component
- intl on HowYouCanHelp
- updates MapLegend tests
- add initial cy test on ExploreTool page

* removes bold on alert

* PR feedback:

- removes location from J40Alert
- localizes `COLOR KEY`

* adds intl to constants file

* modifies download zip URL to new S3 location

* removes location depedencies on Alerts

* add localization for HowYouCanHelp

client/src/data/constants.tsx

@@ -1,7 +1,9 @@
 import {LngLatBoundsLike} from 'maplibre-gl';
 import {isMobile as isMobileReactDeviceDetect} from 'react-device-detect';
+import {defineMessages} from 'react-intl';
 
 // URLS
+export const DOWNLOAD_ZIP_URL = 'https://justice40-data.s3.amazonaws.com/data-pipeline/data/score/downloadable/Screening+Tool+Data.zip';
 export const FEATURE_TILE_BASE_URL = 'https://d2zjid6n5ja2pt.cloudfront.net';
 const XYZ_SUFFIX = '{z}/{x}/{y}.pbf';
 export const featureURLForTilesetName = (tilesetName :string ) : string => {
@@ -114,4 +116,24 @@ export const SCORE_BOUNDARY_LOW = 0.0;
 export const SCORE_BOUNDARY_THRESHOLD = 0.6;
 export const SCORE_BOUNDARY_PRIORITIZED = 0.75;
 
+
+// Explore the Tool:
+export const EXPLORE_TOOL_PAGE_TEXT = defineMessages({
+  PRIORITY_LABEL: {
+    id: 'legend.info.priority.label',
+    defaultMessage: 'Prioritized community',
+    description: 'the label of the prioritized community legend',
+  },
+  THRESHOLD_LABEL: {
+    id: 'legend.info.threshold.label',
+    defaultMessage: 'Threshold community',
+    description: 'the label of the threshold community legend',
+  },
+  LEGEND_LABEL: {
+    id: 'legend.colorkey.label',
+    defaultMessage: 'COLOR KEY',
+    description: 'the label of the key in the legend',
+  },
+});
+
 export const isMobile = isMobileReactDeviceDetect;