Public Engagement Page (#1372)

* Add public engagement page

- modifies sitemap config
- creates PublicEvent component
- adds SVGs for dates
- all copy is in intl

* Add Public Engagement button to each page

- create new PublicEng component
- add to each page
- update snapshots
- modify CEJST and Meth page to give button more space

* Make mobile compliant and fix DOM validation error

- transform each <p>'s descendent into a <CollectionDescription>
- fix a mobile rendering issue with <Collection> library
- format registration links so they render on mobile
- update snapshots

* Add spacing to descriptions and fix links

* Add Gherkin tests for testing links

- all zoom links should be functional
- ensure all legacy tests, test the new page
- add data-cy tag for cypress
- update snapshots

* Refactor to pass accessibility on all pages

- update snapshots

* Correct registration links

* Make registration links into buttons

* Make new tag bold

* Update copy based on feedback from Corey

client/src/components/PublicEngageButton/PublicEngageButton.module.scss

@@ -0,0 +1,22 @@
+@use '../../styles/design-system.scss' as *;
+
+.tagContainer {
+    @include u-margin-bottom(1);
+    @include u-margin-right(1);
+    .tag {
+        @include u-bg("yellow-20v");
+        color: black;
+        border-radius: 5px;
+        @include u-text('bold');
+    }
+}
+
+.container {
+    @include u-padding-top(2.5);
+
+    .link, .link:visited {
+        color:white;
+        text-decoration: none;
+    }
+
+}

client/src/components/PublicEngageButton/PublicEngageButton.module.scss.d.ts

@@ -0,0 +1,15 @@
+declare namespace PublicEngagementButton {
+    export interface IPublicEventScss {
+        tag: string;
+        tagContainer: string;
+        container: string;
+        link: string;
+    }
+  }
+
+declare const PublicEventScssModule: PublicEngagementButton.IPublicEventScss & {
+    /** WARNING: Only available when `css-loader` is used without `style-loader` or `mini-css-extract-plugin` */
+    locals: PublicEngagementButton.IPublicEventScss;
+  };
+
+  export = PublicEventScssModule;

client/src/components/PublicEngageButton/PublicEngageButton.test.tsx

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import {render} from '@testing-library/react';
+import {LocalizedComponent} from '../../test/testHelpers';
+import PublicEngageButton from './PublicEngageButton';
+
+describe('rendering of the PublicEngageButton', () => {
+  const {asFragment} = render(
+      <LocalizedComponent>
+        <PublicEngageButton/>
+      </LocalizedComponent>,
+  );
+
+  it('checks if component renders', () => {
+    expect(asFragment()).toMatchSnapshot();
+  });
+});

client/src/components/PublicEngageButton/PublicEngageButton.tsx

@@ -0,0 +1,28 @@
+import React from 'react';
+import {Link} from 'gatsby';
+import {useIntl} from 'gatsby-plugin-intl';
+import {Button, Tag} from '@trussworks/react-uswds';
+
+import * as styles from './PublicEngageButton.module.scss';
+import * as PUBLIC_ENG_COPY from '../../data/copy/publicEngage';
+
+const PublicEngageButton = () => {
+  const intl = useIntl();
+
+  return (
+    <div className={styles.container}>
+      <div className={styles.tagContainer}>
+        <Tag className={styles.tag}>
+          {intl.formatMessage(PUBLIC_ENG_COPY.PUBLIC_ENG_BUTTON.TAG_LABEL)}
+        </Tag>
+      </div>
+      <Link className={styles.link} to={'/public-engagement'}>
+        <Button type={'button'} icon={true}>
+          {intl.formatMessage(PUBLIC_ENG_COPY.PUBLIC_ENG_BUTTON.LABEL)}
+        </Button>
+      </Link>
+    </div>
+  );
+};
+
+export default PublicEngageButton;

client/src/components/PublicEngageButton/__snapshots__/PublicEngageButton.test.tsx.snap

@@ -0,0 +1,27 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`rendering of the PublicEngageButton checks if component renders 1`] = `
+<DocumentFragment>
+  <div>
+    <div>
+      <span
+        class="usa-tag"
+        data-testid="tag"
+      >
+        NEW
+      </span>
+    </div>
+    <a
+      href="/public-engagement"
+    >
+      <button
+        class="usa-button usa-button--icon"
+        data-testid="button"
+        type="button"
+      >
+        Public Engagement
+      </button>
+    </a>
+  </div>
+</DocumentFragment>
+`;

client/src/components/PublicEngageButton/index.tsx

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