From 8da08784fd281022553a8521e1e65009375395e9 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Fri, 20 Jan 2023 13:30:14 -0500
Subject: [PATCH] Bump @trussworks/react-uswds from 2.9.0 to 3.2.0 in
 /frontend-react (#7978)

* Bump @trussworks/react-uswds from 2.9.0 to 3.2.0 in /frontend-react

Bumps [@trussworks/react-uswds](https://github.com/trussworks/react-uswds) from 2.9.0 to 3.2.0.
- [Release notes](https://github.com/trussworks/react-uswds/releases)
- [Changelog](https://github.com/trussworks/react-uswds/blob/main/CHANGELOG.md)
- [Commits](https://github.com/trussworks/react-uswds/compare/2.9.0...3.2.0)

---
updated-dependencies:
- dependency-name: "@trussworks/react-uswds"
  dependency-type: direct:production
  update-type: version-update:semver-major
...

Signed-off-by: dependabot[bot] <support@github.com>

* fix: update to fix breaking changes

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Stephen Kao <stephenkao@navapbc.com>
---
 frontend-react/package.json                            |  2 +-
 .../components/Admin/AdminLastMileFailuresTable.tsx    |  3 ---
 .../src/components/Admin/OrgReceiverTable.tsx          |  3 ---
 frontend-react/src/components/Admin/OrgsTable.tsx      |  3 ---
 frontend-react/src/components/Crumbs.tsx               |  8 ++------
 .../components/FileHandlers/FileHandlerMessaging.tsx   |  4 ++--
 frontend-react/src/components/IconButton.tsx           |  2 +-
 frontend-react/src/components/SenderModeBanner.tsx     |  4 ++--
 frontend-react/src/components/Table/Pagination.tsx     | 10 +++-------
 frontend-react/src/components/Table/TableHeaders.tsx   |  6 +++---
 .../src/components/tooltips/ObjectTooltip.tsx          |  6 +++---
 frontend-react/src/pages/TermsOfService.tsx            |  1 +
 frontend-react/src/pages/error/Generic.tsx             |  4 +++-
 frontend-react/src/pages/misc/FeatureFlags.tsx         | 10 +++++++---
 .../src/pages/tos-sign/TermsOfServiceForm.tsx          |  1 +
 frontend-react/yarn.lock                               |  8 ++++----
 16 files changed, 33 insertions(+), 42 deletions(-)

diff --git a/frontend-react/package.json b/frontend-react/package.json
index f37b4713d21..b2b707427b2 100644
--- a/frontend-react/package.json
+++ b/frontend-react/package.json
@@ -14,7 +14,7 @@
         "@tanstack/react-query": "^4.20.9",
         "@tanstack/react-query-devtools": "^4.20.9",
         "@testing-library/user-event": "^13.5.0",
-        "@trussworks/react-uswds": "<3.0.0",
+        "@trussworks/react-uswds": "<4.0.0",
         "@types/downloadjs": "^1.4.2",
         "@types/lodash.chunk": "^4.2.7",
         "@types/lodash.omit": "^4.5.7",
diff --git a/frontend-react/src/components/Admin/AdminLastMileFailuresTable.tsx b/frontend-react/src/components/Admin/AdminLastMileFailuresTable.tsx
index 4f09b88c8c8..837faef804b 100644
--- a/frontend-react/src/components/Admin/AdminLastMileFailuresTable.tsx
+++ b/frontend-react/src/components/Admin/AdminLastMileFailuresTable.tsx
@@ -127,7 +127,6 @@ const RenderResendModal = (props: {
                 <ButtonGroup>
                     <Button
                         type="button"
-                        size="small"
                         outline
                         onClick={props.closeResendModal}
                     >
@@ -135,7 +134,6 @@ const RenderResendModal = (props: {
                     </Button>
                     <Button
                         type="button"
-                        size="small"
                         disabled={props.loading}
                         onClick={() => props.startResend()}
                     >
@@ -230,7 +228,6 @@ const DataLoadRenderTable = (props: {
                                 )
                             }
                             type="button"
-                            size="small"
                             className="padding-1 usa-button--outline"
                             title="Requeue items for resend"
                         >
diff --git a/frontend-react/src/components/Admin/OrgReceiverTable.tsx b/frontend-react/src/components/Admin/OrgReceiverTable.tsx
index 4fa2fb47da7..65c85f61c6b 100644
--- a/frontend-react/src/components/Admin/OrgReceiverTable.tsx
+++ b/frontend-react/src/components/Admin/OrgReceiverTable.tsx
@@ -137,7 +137,6 @@ export function OrgReceiverTable(props: OrgSettingsTableProps) {
                                     <ButtonGroup type="segmented">
                                         <Button
                                             type="button"
-                                            size="small"
                                             key={`receiver-row-checkcmd-${eachOrgSetting.name}-${index}`}
                                             data-receiver={eachOrgSetting.name}
                                             onClick={() =>
@@ -212,7 +211,6 @@ export function OrgReceiverTable(props: OrgSettingsTableProps) {
                     <ButtonGroup>
                         <Button
                             type="button"
-                            size="small"
                             outline
                             onClick={() =>
                                 modalRef?.current?.toggleModal(undefined, false)
@@ -222,7 +220,6 @@ export function OrgReceiverTable(props: OrgSettingsTableProps) {
                         </Button>
                         <Button
                             type="button"
-                            size="small"
                             disabled={isLoading}
                             onClick={() => clickDoCheckCmd()}
                         >
diff --git a/frontend-react/src/components/Admin/OrgsTable.tsx b/frontend-react/src/components/Admin/OrgsTable.tsx
index 3d0bc239422..6470b92e928 100644
--- a/frontend-react/src/components/Admin/OrgsTable.tsx
+++ b/frontend-react/src/components/Admin/OrgsTable.tsx
@@ -121,7 +121,6 @@ export function OrgsTable() {
                         key={`savelist`}
                         onClick={() => saveListToCSVFile()}
                         type="button"
-                        size="small"
                         className="usa-button usa-button--outline usa-button--small flex-align-self-end height-5"
                     >
                         Save List to CSV
@@ -173,7 +172,6 @@ export function OrgsTable() {
                                                     )
                                                 }
                                                 type="button"
-                                                size="small"
                                                 className="padding-1 usa-button--outline"
                                             >
                                                 Set
@@ -186,7 +184,6 @@ export function OrgsTable() {
                                                     )
                                                 }
                                                 type="button"
-                                                size="small"
                                                 className="padding-1 usa-button--outline"
                                             >
                                                 Edit
diff --git a/frontend-react/src/components/Crumbs.tsx b/frontend-react/src/components/Crumbs.tsx
index 894ae7048b8..a1ceb210b10 100644
--- a/frontend-react/src/components/Crumbs.tsx
+++ b/frontend-react/src/components/Crumbs.tsx
@@ -1,8 +1,4 @@
-import {
-    BreadcrumbBar,
-    Breadcrumb,
-    IconArrowBack,
-} from "@trussworks/react-uswds";
+import { BreadcrumbBar, Breadcrumb, Icon } from "@trussworks/react-uswds";
 import { ReactChild } from "react";
 
 import { IconButton } from "./IconButton";
@@ -30,7 +26,7 @@ const Crumbs = ({ crumbList, noPadding, previousPage }: CrumbsProps) => {
                             type="button"
                             onClick={() => window.history.back()}
                         >
-                            <IconArrowBack />
+                            <Icon.ArrowBack />
                         </IconButton>
                         Return to {previousPage}
                     </div>
diff --git a/frontend-react/src/components/FileHandlers/FileHandlerMessaging.tsx b/frontend-react/src/components/FileHandlers/FileHandlerMessaging.tsx
index 7450605d7de..33fea96e42c 100644
--- a/frontend-react/src/components/FileHandlers/FileHandlerMessaging.tsx
+++ b/frontend-react/src/components/FileHandlers/FileHandlerMessaging.tsx
@@ -1,5 +1,5 @@
 import React, { useEffect, useMemo } from "react";
-import { IconHelp, Tooltip } from "@trussworks/react-uswds";
+import { Icon, Tooltip } from "@trussworks/react-uswds";
 
 import {
     formattedDateFromTimestamp,
@@ -108,7 +108,7 @@ const TrackingIDTooltip = () => {
             position="right"
             label={"Defaults to MSH-10"}
         >
-            <IconHelp />
+            <Icon.Help />
         </Tooltip>
     );
 };
diff --git a/frontend-react/src/components/IconButton.tsx b/frontend-react/src/components/IconButton.tsx
index a9d12489f7f..9f25d9b3cef 100644
--- a/frontend-react/src/components/IconButton.tsx
+++ b/frontend-react/src/components/IconButton.tsx
@@ -14,7 +14,7 @@ export interface ButtonProps {
     accentStyle?: "cool" | "warm";
     outline?: boolean;
     inverse?: boolean;
-    size?: "big" | "small"; // small is deprecated
+    size?: "big";
     /**
      * @deprecated since 1.6.0, use size
      */
diff --git a/frontend-react/src/components/SenderModeBanner.tsx b/frontend-react/src/components/SenderModeBanner.tsx
index 1ff3a893093..52321286c88 100644
--- a/frontend-react/src/components/SenderModeBanner.tsx
+++ b/frontend-react/src/components/SenderModeBanner.tsx
@@ -1,5 +1,5 @@
 import { ReactElement } from "react";
-import { IconWarning } from "@trussworks/react-uswds";
+import { Icon } from "@trussworks/react-uswds";
 
 import { useSessionContext } from "../contexts/SessionContext";
 import { MemberType } from "../hooks/UseOktaMemberships";
@@ -20,7 +20,7 @@ const BannerContent = () => {
                 <header className="usa-banner__header bg-yellow">
                     <div className="usa-banner__inner">
                         <div className="grid-col-auto margin-right-1">
-                            <IconWarning />
+                            <Icon.Warning />
                         </div>
                         <div className="grid-col-fill tablet:grid-col-auto">
                             <b>Onboarding: </b> Your account is not yet sending
diff --git a/frontend-react/src/components/Table/Pagination.tsx b/frontend-react/src/components/Table/Pagination.tsx
index 74b16895eff..ebe7a8edeec 100644
--- a/frontend-react/src/components/Table/Pagination.tsx
+++ b/frontend-react/src/components/Table/Pagination.tsx
@@ -1,9 +1,5 @@
 import classnames from "classnames";
-import {
-    Button,
-    IconNavigateBefore,
-    IconNavigateNext,
-} from "@trussworks/react-uswds";
+import { Button, Icon } from "@trussworks/react-uswds";
 
 export const OVERFLOW_INDICATOR = Symbol("…");
 export type SlotItem = number | typeof OVERFLOW_INDICATOR;
@@ -79,9 +75,9 @@ const PaginationArrow: React.FC<PaginationArrowProps> = ({
                 type="button"
                 unstyled
             >
-                {direction === "previous" && <IconNavigateBefore />}
+                {direction === "previous" && <Icon.NavigateBefore />}
                 <span className="usa-pagination__link-text">{label}</span>
-                {direction === "next" && <IconNavigateNext />}
+                {direction === "next" && <Icon.NavigateNext />}
             </Button>
         </li>
     );
diff --git a/frontend-react/src/components/Table/TableHeaders.tsx b/frontend-react/src/components/Table/TableHeaders.tsx
index 324f07785df..399eaa90e6f 100644
--- a/frontend-react/src/components/Table/TableHeaders.tsx
+++ b/frontend-react/src/components/Table/TableHeaders.tsx
@@ -1,6 +1,6 @@
 /* Renders the header row of the table from columns.values() */
 import React from "react";
-import { IconArrowDownward, IconArrowUpward } from "@trussworks/react-uswds";
+import { Icon } from "@trussworks/react-uswds";
 
 import { FilterManager } from "../../hooks/filters/UseFilterManager";
 import {
@@ -35,9 +35,9 @@ export const TableHeaders = ({
             order === sortOrder || (locally && localOrder === sortOrder);
 
         if (filterManager && isOrder("ASC")) {
-            return <IconArrowUpward />;
+            return <Icon.ArrowUpward />;
         } else if (filterManager && isOrder("DESC")) {
-            return <IconArrowDownward />;
+            return <Icon.ArrowDownward />;
         }
     };
 
diff --git a/frontend-react/src/components/tooltips/ObjectTooltip.tsx b/frontend-react/src/components/tooltips/ObjectTooltip.tsx
index 8563fbfa15e..8146d79f12e 100644
--- a/frontend-react/src/components/tooltips/ObjectTooltip.tsx
+++ b/frontend-react/src/components/tooltips/ObjectTooltip.tsx
@@ -1,4 +1,4 @@
-import { IconHelp, Tooltip } from "@trussworks/react-uswds";
+import { Icon, Tooltip } from "@trussworks/react-uswds";
 
 import {
     SampleFilterObject,
@@ -32,7 +32,7 @@ const ObjectTooltip = ({ obj }: ObjectTooltipProps) => {
             label={`${obj.stringify()}\n\n\n${obj.description()}`}
             onClick={() => copyToClipboard(obj.stringify())}
         >
-            <IconHelp />
+            <Icon.Help />
         </Tooltip>
     );
 };
@@ -49,7 +49,7 @@ const EnumTooltip = ({ vals }: EnumTooltipProps) => {
             label={label}
             onClick={() => copyToClipboard(clipboard)}
         >
-            <IconHelp />
+            <Icon.Help />
         </Tooltip>
     );
 };
diff --git a/frontend-react/src/pages/TermsOfService.tsx b/frontend-react/src/pages/TermsOfService.tsx
index 55a5abca6d7..bd98c52645b 100644
--- a/frontend-react/src/pages/TermsOfService.tsx
+++ b/frontend-react/src/pages/TermsOfService.tsx
@@ -10,6 +10,7 @@ export const TermsOfService = () => {
                 id="anchor-top"
             >
                 <Alert
+                    headingLevel="h4"
                     type="info"
                     heading="This is a U.S. government service"
                     className="margin-bottom-5"
diff --git a/frontend-react/src/pages/error/Generic.tsx b/frontend-react/src/pages/error/Generic.tsx
index 791b4401eb3..64a299d6da2 100644
--- a/frontend-react/src/pages/error/Generic.tsx
+++ b/frontend-react/src/pages/error/Generic.tsx
@@ -12,7 +12,9 @@ import {
 
 export const StringErrorDisplay = ({ message }: { message?: string }) => {
     return (
-        <Alert type="error">{message ? message : GENERIC_ERROR_STRING}</Alert>
+        <Alert headingLevel="h4" type="error">
+            {message ? message : GENERIC_ERROR_STRING}
+        </Alert>
     );
 };
 
diff --git a/frontend-react/src/pages/misc/FeatureFlags.tsx b/frontend-react/src/pages/misc/FeatureFlags.tsx
index 738c24d59f8..e4b4866a241 100644
--- a/frontend-react/src/pages/misc/FeatureFlags.tsx
+++ b/frontend-react/src/pages/misc/FeatureFlags.tsx
@@ -88,7 +88,6 @@ export function FeatureFlagUIComponent() {
                             key="add-feature-flag"
                             type="button"
                             outline
-                            size="small"
                             className="padding-bottom-1 padding-top-1"
                             onClick={() => addFlagClick()}
                         >
@@ -103,13 +102,18 @@ export function FeatureFlagUIComponent() {
                                 className="margin-top-3"
                                 key={`feature-flag-${i}`}
                             >
-                                <Alert type="success" slim noIcon className="">
+                                <Alert
+                                    headingLevel="h4"
+                                    type="success"
+                                    slim
+                                    noIcon
+                                    className=""
+                                >
                                     <b>{flagname}</b>
                                     {DEFAULT_FEATURE_FLAGS.indexOf(flagname) ===
                                         -1 && (
                                         <Button
                                             key={flagname}
-                                            size="small"
                                             className="padding-bottom-1 padding-top-1 float-right"
                                             type="button"
                                             outline
diff --git a/frontend-react/src/pages/tos-sign/TermsOfServiceForm.tsx b/frontend-react/src/pages/tos-sign/TermsOfServiceForm.tsx
index 11b191c22fd..6132d76caa6 100644
--- a/frontend-react/src/pages/tos-sign/TermsOfServiceForm.tsx
+++ b/frontend-react/src/pages/tos-sign/TermsOfServiceForm.tsx
@@ -431,6 +431,7 @@ function TermsOfServiceForm() {
                         Submit registration
                     </Button>
                     <Alert
+                        headingLevel="h4"
                         style={{
                             visibility: sendGridErrorFlag.isError
                                 ? "visible"
diff --git a/frontend-react/yarn.lock b/frontend-react/yarn.lock
index 0f767246936..c9a7a311099 100644
--- a/frontend-react/yarn.lock
+++ b/frontend-react/yarn.lock
@@ -2154,10 +2154,10 @@
   resolved "https://registry.yarnpkg.com/@tootallnate/once/-/once-1.1.2.tgz#ccb91445360179a04e7fe6aff78c00ffc1eeaf82"
   integrity sha512-RbzJvlNzmRq5c3O09UipeuXno4tA1FE6ikOjxZK0tuxVv3412l64l5t1W5pj4+rJq9vpkm/kwiR07aZXnsKPxw==
 
-"@trussworks/react-uswds@<3.0.0":
-  version "2.9.0"
-  resolved "https://registry.yarnpkg.com/@trussworks/react-uswds/-/react-uswds-2.9.0.tgz#32b2476f98ac27cf610db9a71ac9bd8527619fef"
-  integrity sha512-qv5twPgzLJulWsZew3No3W45FTp3WrYGwG/3B+w/mPFuAMHmAX7VAiigmg+k2kHFvrpjyAiKZHREpHyhkZIbig==
+"@trussworks/react-uswds@<4.0.0":
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/@trussworks/react-uswds/-/react-uswds-3.2.0.tgz#3193b968419837895444a6e9e72a832bd7afcb84"
+  integrity sha512-wZYK03JoP+BwzBaJ3AN5jG5nmsIQokTk863zKo+zkEiynbUAeXLd+IZUKu+yTjfc4RpSlt1aIEo+sxaQZSu10A==
 
 "@trysound/sax@0.2.0":
   version "0.2.0"