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](trussworks/react-uswds@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>
CDCgov · Jan 20, 2023 · 8da0878 · 8da0878
1 parent f212e80
commit 8da0878
Show file tree

Hide file tree

Showing 16 changed files with 33 additions and 42 deletions.
diff --git 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
@@ -127,15 +127,13 @@ const RenderResendModal = (props: {
                 <ButtonGroup>
                     <Button
                         type="button"
-                        size="small"
                         outline
                         onClick={props.closeResendModal}
                     >
                         Cancel
                     </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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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"