Error handling

dcramer · Aug 22, 2024 · 76a9a5b · 76a9a5b
1 parent fb214ed
commit 76a9a5b
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 5 deletions.
diff --git a/apps/web/src/components/passwordResetChangeForm.tsx b/apps/web/src/components/passwordResetChangeForm.tsx
@@ -4,6 +4,7 @@ import Button from "@peated/web/components/button";
 import TextField from "@peated/web/components/textField";
 import { passwordResetConfirmForm } from "@peated/web/lib/auth.actions";
 import { useFormState, useFormStatus } from "react-dom";
+import Alert from "./alert";
 
 function FormComponent({ token }: { token: string }) {
   const { pending } = useFormStatus();
@@ -39,6 +40,7 @@ export default function PasswordResetChangeForm({ token }: { token: string }) {
 
   return (
     <div className="min-w-sm flex flex-auto flex-col gap-y-4">
+      {result?.error && <Alert>{result.error}</Alert>}
       {result?.ok ? (
         <>
           <p className="mb-8 text-center">Your password has been changed.</p>

diff --git a/apps/web/src/components/passwordResetForm.tsx b/apps/web/src/components/passwordResetForm.tsx
@@ -4,6 +4,7 @@ import Button from "@peated/web/components/button";
 import TextField from "@peated/web/components/textField";
 import { passwordResetForm } from "@peated/web/lib/auth.actions";
 import { useFormState, useFormStatus } from "react-dom";
+import Alert from "./alert";
 
 function FormComponent() {
   const { pending } = useFormStatus();
@@ -35,6 +36,7 @@ export default function PasswordResetForm() {
 
   return (
     <div className="min-w-sm flex flex-auto flex-col gap-y-4">
+      {result?.error && <Alert>{result.error}</Alert>}
       {result?.ok ? (
         <p className="mb-8 text-center">
           We've sent instructions to your email address.

diff --git a/apps/web/src/lib/auth.actions.ts b/apps/web/src/lib/auth.actions.ts
@@ -182,7 +182,15 @@ export async function passwordResetForm(
   const session = await getSession();
 
   const trpcClient = makeTRPCClient(config.API_SERVER, session.accessToken);
-  await trpcClient.authPasswordReset.mutate({ email });
+  try {
+    await trpcClient.authPasswordReset.mutate({ email });
+  } catch (err) {
+    if (isTRPCClientError(err)) {
+      return { ok: false, error: err.message };
+    }
+
+    throw err;
+  }
 
   return { ok: true };
 }
@@ -199,10 +207,20 @@ export async function passwordResetConfirmForm(
   const session = await getSession();
 
   const trpcClient = makeTRPCClient(config.API_SERVER, session.accessToken);
-  const data = await trpcClient.authPasswordResetConfirm.mutate({
-    token,
-    password,
-  });
+
+  let data;
+  try {
+    data = await trpcClient.authPasswordResetConfirm.mutate({
+      token,
+      password,
+    });
+  } catch (err) {
+    if (isTRPCClientError(err)) {
+      return { ok: false, error: err.message };
+    }
+
+    throw err;
+  }
 
   session.user = data.user;
   session.accessToken = data.accessToken;