From 6a1f0739b0deec398c0ab53aec562d581396733c Mon Sep 17 00:00:00 2001
From: Johnny Bouder <jbouder@metrostar.com>
Date: Wed, 21 Aug 2024 09:09:16 -0400
Subject: [PATCH 1/4] Update comet-uswds to latest. Update sign in form to use
 form component props instead of explicit wrapper and label components.

---
 package-lock.json             |  9 +++--
 package.json                  |  2 +-
 src/pages/sign-in/sign-in.tsx | 67 +++++++++++++++++++----------------
 3 files changed, 41 insertions(+), 37 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 20d451e9..6106b6ee 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11,8 +11,7 @@
       "dependencies": {
         "@metrostar/comet-data-viz": "1.1.5",
         "@metrostar/comet-extras": "1.4.0",
-        "@metrostar/comet-uswds": "2.4.1",
-        "@rollup/rollup-linux-x64-gnu": "4.21.0",
+        "@metrostar/comet-uswds": "3.0.0-beta.0",
         "@tanstack/react-query": "5.51.24",
         "@tanstack/react-table": "8.20.1",
         "@uswds/uswds": "3.8.2",
@@ -1334,9 +1333,9 @@
       }
     },
     "node_modules/@metrostar/comet-uswds": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/@metrostar/comet-uswds/-/comet-uswds-2.4.1.tgz",
-      "integrity": "sha512-DaQCn/j9YllZThyYGCa7N7wjGKuunICEfOVWp43cnR4WDgeR9lfGxuPeUF6gqkVIq4iyjRZGXOGEihv7S2E2mw==",
+      "version": "3.0.0-beta.0",
+      "resolved": "https://registry.npmjs.org/@metrostar/comet-uswds/-/comet-uswds-3.0.0-beta.0.tgz",
+      "integrity": "sha512-o8bDeXc8kvpPB45UKFHViHP7BNxssx1JjvefMkdk6GbZ83jSgU6k1R5xppE8zrcypqNiHgXNEIdWPp2gfHEscA==",
       "dependencies": {
         "@uswds/uswds": "3.8.2",
         "classnames": "^2.5.1",
diff --git a/package.json b/package.json
index a15d23f1..2995d5b4 100644
--- a/package.json
+++ b/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "@metrostar/comet-data-viz": "1.1.5",
     "@metrostar/comet-extras": "1.4.0",
-    "@metrostar/comet-uswds": "2.4.1",
+    "@metrostar/comet-uswds": "3.0.0-beta.0",
     "@tanstack/react-query": "5.51.24",
     "@tanstack/react-table": "8.20.1",
     "@uswds/uswds": "3.8.2",
diff --git a/src/pages/sign-in/sign-in.tsx b/src/pages/sign-in/sign-in.tsx
index a219839e..3d17d470 100644
--- a/src/pages/sign-in/sign-in.tsx
+++ b/src/pages/sign-in/sign-in.tsx
@@ -2,10 +2,7 @@ import {
   Alert,
   Button,
   ButtonGroup,
-  ErrorMessages,
   Form,
-  FormGroup,
-  Label,
   TextInput,
 } from '@metrostar/comet-uswds';
 import { FormInput } from '@src/types/form';
@@ -58,36 +55,44 @@ export const SignIn = (): React.ReactElement => {
             </Alert>
           )}
           <Form id="login-form" onSubmit={handleSubmit(onSubmit)}>
-            <FormGroup>
-              <Label htmlFor="username">Username</Label>
-              <Controller
-                name="username"
-                control={control}
-                rules={REQUIRED_FORM_FIELDS_RULES}
-                // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                render={({ field: { ref: _, ...field } }) => (
-                  <TextInput {...field} id="username" autoFocus />
-                )}
-              />
-              {errors.username?.message && (
-                <ErrorMessages errors={[errors.username.message]} />
+            <Controller
+              name="username"
+              control={control}
+              rules={REQUIRED_FORM_FIELDS_RULES}
+              // eslint-disable-next-line @typescript-eslint/no-unused-vars
+              render={({ field: { ref: _, ...field } }) => (
+                <TextInput
+                  {...field}
+                  id="username"
+                  label="Username"
+                  errors={
+                    errors.username?.message
+                      ? errors.username.message
+                      : undefined
+                  }
+                  autoFocus
+                />
               )}
-            </FormGroup>
-            <FormGroup>
-              <Label htmlFor="password">Password</Label>
-              <Controller
-                name="password"
-                control={control}
-                rules={PASSWORD_RULES}
-                // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                render={({ field: { ref: _, ...field } }) => (
-                  <TextInput {...field} id="password" type="password" />
-                )}
-              />
-              {errors.password?.message && (
-                <ErrorMessages errors={[errors.password.message]} />
+            />
+            <Controller
+              name="password"
+              control={control}
+              rules={PASSWORD_RULES}
+              // eslint-disable-next-line @typescript-eslint/no-unused-vars
+              render={({ field: { ref: _, ...field } }) => (
+                <TextInput
+                  {...field}
+                  id="password"
+                  type="password"
+                  label="Password"
+                  errors={
+                    errors.password?.message
+                      ? errors.password.message
+                      : undefined
+                  }
+                />
               )}
-            </FormGroup>
+            />
             <ButtonGroup>
               <Button
                 id="submit"

From 9e383fe802650272b17002e8b5334c5792ab14d5 Mon Sep 17 00:00:00 2001
From: Johnny Bouder <jbouder@metrostar.com>
Date: Wed, 21 Aug 2024 09:57:31 -0400
Subject: [PATCH 2/4] Update to display more generic sign in error message and
 provide details through console error.

---
 src/hooks/use-auth.ts         | 3 +++
 src/pages/sign-in/sign-in.tsx | 2 +-
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/hooks/use-auth.ts b/src/hooks/use-auth.ts
index fe03ac1b..f112c56d 100644
--- a/src/hooks/use-auth.ts
+++ b/src/hooks/use-auth.ts
@@ -51,6 +51,9 @@ const useAuth = () => {
     if (auth.error) {
       setError(auth.error.message);
       setIsSignedIn(false);
+
+      // eslint-disable-next-line no-console
+      console.error('Error:', auth.error);
     }
   }, [auth.error, setIsSignedIn]);
 
diff --git a/src/pages/sign-in/sign-in.tsx b/src/pages/sign-in/sign-in.tsx
index 3d17d470..d578b45f 100644
--- a/src/pages/sign-in/sign-in.tsx
+++ b/src/pages/sign-in/sign-in.tsx
@@ -51,7 +51,7 @@ export const SignIn = (): React.ReactElement => {
           <h1>Sign In</h1>
           {error && (
             <Alert id="loginAlert" type="error" heading="Error">
-              Incorrect email or password was entered.
+              There was an error signing in. Please try again.
             </Alert>
           )}
           <Form id="login-form" onSubmit={handleSubmit(onSubmit)}>

From fb5ed6307e1ea0326b2e1c82cfead7570c060c08 Mon Sep 17 00:00:00 2001
From: Johnny Bouder <jbouder@metrostar.com>
Date: Thu, 22 Aug 2024 09:44:38 -0400
Subject: [PATCH 3/4] Update to clear auth error on successful basic auth.

---
 src/hooks/use-auth.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/hooks/use-auth.ts b/src/hooks/use-auth.ts
index f112c56d..4f2df260 100644
--- a/src/hooks/use-auth.ts
+++ b/src/hooks/use-auth.ts
@@ -61,6 +61,7 @@ const useAuth = () => {
     if (isSso) {
       auth.signinRedirect({ redirect_uri: getSignInRedirectUrl() });
     } else {
+      auth.error = undefined;
       setIsSignedIn(true);
       setCurrentUserData(userData);
     }

From 7dee3d2cf979bb0dd40bb5f2b539fbc1adeaaa9e Mon Sep 17 00:00:00 2001
From: Johnny Bouder <jbouder@metrostar.com>
Date: Thu, 22 Aug 2024 09:44:59 -0400
Subject: [PATCH 4/4] Update comet-uswds to latest.

---
 package-lock.json | 8 ++++----
 package.json      | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 6106b6ee..8ad36860 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11,7 +11,7 @@
       "dependencies": {
         "@metrostar/comet-data-viz": "1.1.5",
         "@metrostar/comet-extras": "1.4.0",
-        "@metrostar/comet-uswds": "3.0.0-beta.0",
+        "@metrostar/comet-uswds": "3.0.0",
         "@tanstack/react-query": "5.51.24",
         "@tanstack/react-table": "8.20.1",
         "@uswds/uswds": "3.8.2",
@@ -1333,9 +1333,9 @@
       }
     },
     "node_modules/@metrostar/comet-uswds": {
-      "version": "3.0.0-beta.0",
-      "resolved": "https://registry.npmjs.org/@metrostar/comet-uswds/-/comet-uswds-3.0.0-beta.0.tgz",
-      "integrity": "sha512-o8bDeXc8kvpPB45UKFHViHP7BNxssx1JjvefMkdk6GbZ83jSgU6k1R5xppE8zrcypqNiHgXNEIdWPp2gfHEscA==",
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/@metrostar/comet-uswds/-/comet-uswds-3.0.0.tgz",
+      "integrity": "sha512-bApVDJPBv9kkB0IEl3Hns7g7B5M3SXigts2kr1BcZZ98FpaAgatyyOh/Io4P593S5faH5gzEa0Z2DYsGLjrNEg==",
       "dependencies": {
         "@uswds/uswds": "3.8.2",
         "classnames": "^2.5.1",
diff --git a/package.json b/package.json
index 2995d5b4..86973174 100644
--- a/package.json
+++ b/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "@metrostar/comet-data-viz": "1.1.5",
     "@metrostar/comet-extras": "1.4.0",
-    "@metrostar/comet-uswds": "3.0.0-beta.0",
+    "@metrostar/comet-uswds": "3.0.0",
     "@tanstack/react-query": "5.51.24",
     "@tanstack/react-table": "8.20.1",
     "@uswds/uswds": "3.8.2",