use errore for better auth client methods

Wrap auth and organization Better Auth client calls in typed helpers that return errors as values, and update form actions to handle them consistently.

Author: michaltarasiuk

apps/dashboard/app/lib/auth/error.ts

@@ -5,6 +5,16 @@ import { z } from "zod";
 
 import type { FormActionError } from "~/components/action-data-context";
 
+export class AuthClientFetchError extends errore.createTaggedError({
+  name: "AuthClientFetchError",
+  message: "$operation request failed",
+}) {}
+
+export class AuthError extends errore.createTaggedError({
+  name: "AuthError",
+  message: "$operation failed",
+}) {}
+
 export class SessionError extends errore.createTaggedError({
   name: "SessionError",
   message: "Session $operation failed",

apps/dashboard/app/lib/auth/href.ts

@@ -1,22 +1,30 @@
 import { isDefined } from "@lite-app/shared/is-defined";
 import { href } from "react-router";
 
-import { organization } from "~/lib/auth";
 import { isAdmin } from "~/lib/auth/session";
+import { getFullOrganization, listOrganizations } from "~/lib/organization";
 
 export async function getAuthenticatedRedirectHref() {
   const [admin, activeOrganization, organizations] = await Promise.all([
     isAdmin(),
-    organization.getFullOrganization(),
-    organization.list(),
+    getFullOrganization(),
+    listOrganizations(),
   ]);
-  if (!isDefined(activeOrganization.data)) {
-    if (!admin || (organizations.data ?? []).length > 0) {
+  if (activeOrganization instanceof Error) {
+    console.error(activeOrganization);
+    throw activeOrganization;
+  }
+  if (organizations instanceof Error) {
+    console.error(organizations);
+    throw organizations;
+  }
+  if (!isDefined(activeOrganization)) {
+    if (!admin || (organizations ?? []).length > 0) {
       return href("/organization/list");
     }
     return href("/organization/create");
   }
   return href(`/organization/:slug`, {
-    slug: activeOrganization.data.slug,
+    slug: activeOrganization.slug,
   });
 }

apps/dashboard/app/lib/auth/index.ts

@@ -1,7 +1,82 @@
+import { isDefined } from "@lite-app/shared/is-defined";
 import { createAuthClient } from "better-auth/client";
 import { adminClient, organizationClient } from "better-auth/client/plugins";
 
+import { AuthClientFetchError, AuthError } from "~/lib/auth/error";
+
 export const authClient = createAuthClient({
   plugins: [adminClient(), organizationClient()],
 });
-export const { organization } = authClient;
+
+async function unwrapAuthClientResult<T>({
+  operation,
+  promise,
+}: {
+  operation: string;
+  promise: Promise<{ data: T; error: unknown }>;
+}) {
+  const result = await promise.catch(
+    (error) =>
+      new AuthClientFetchError({
+        operation,
+        cause: error,
+      })
+  );
+  if (result instanceof Error) {
+    return result;
+  }
+  const { data, error } = result;
+  const success = isDefined(data) && !isDefined(error);
+  if (!success) {
+    return new AuthError({
+      operation,
+      cause: error,
+    });
+  }
+  return data;
+}
+
+export function getSession(
+  ...params: Parameters<typeof authClient.getSession>
+) {
+  return unwrapAuthClientResult({
+    operation: "get session",
+    promise: authClient.getSession(...params),
+  });
+}
+
+export function signUpEmail(
+  ...params: Parameters<typeof authClient.signUp.email>
+) {
+  return unwrapAuthClientResult({
+    operation: "sign up",
+    promise: authClient.signUp.email(...params),
+  });
+}
+
+export function signInEmail(
+  ...params: Parameters<typeof authClient.signIn.email>
+) {
+  return unwrapAuthClientResult({
+    operation: "sign in",
+    promise: authClient.signIn.email(...params),
+  });
+}
+
+export function requestPasswordReset(
+  ...params: Parameters<typeof authClient.requestPasswordReset>
+) {
+  return unwrapAuthClientResult({
+    operation: "request password reset",
+    promise: authClient.requestPasswordReset(...params),
+  });
+}
+
+export function resetPassword(
+  ...params: Parameters<typeof authClient.resetPassword>
+) {
+  return unwrapAuthClientResult({
+    operation: "reset password",
+    promise: authClient.resetPassword(...params),
+  });
+}

apps/dashboard/app/lib/auth/session.ts

@@ -1,12 +1,16 @@
 import { isDefined } from "@lite-app/shared/is-defined";
 
-import { authClient } from "~/lib/auth";
+import { getSession } from "~/lib/auth";
 import { ADMIN_ROLE } from "~/lib/auth/roles";
 
 export async function isAdmin() {
-  const session = await authClient.getSession();
-  if (!isDefined(session.data)) {
+  const session = await getSession();
+  if (session instanceof Error) {
+    console.error(session);
     return false;
   }
-  return session.data.user.role === ADMIN_ROLE;
+  if (!isDefined(session)) {
+    return false;
+  }
+  return session.user.role === ADMIN_ROLE;
 }

apps/dashboard/app/lib/organization/index.ts

@@ -0,0 +1,68 @@
+import { isDefined } from "@lite-app/shared/is-defined";
+
+import { authClient } from "~/lib/auth";
+import { AuthClientFetchError } from "~/lib/auth/error";
+import { OrganizationError } from "~/lib/organization/error";
+
+async function unwrapOrganizationClientResult<T>({
+  operation,
+  promise,
+}: {
+  operation: string;
+  promise: Promise<{ data: T; error: unknown }>;
+}) {
+  const result = await promise.catch(
+    (error) =>
+      new AuthClientFetchError({
+        operation,
+        cause: error,
+      })
+  );
+  if (result instanceof Error) {
+    return result;
+  }
+  const { data, error } = result;
+  if (isDefined(error) || !isDefined(data)) {
+    return new OrganizationError({
+      operation,
+      cause: error,
+    });
+  }
+  return data;
+}
+
+export function getFullOrganization(
+  ...params: Parameters<typeof authClient.organization.getFullOrganization>
+) {
+  return unwrapOrganizationClientResult({
+    operation: "get full organization",
+    promise: authClient.organization.getFullOrganization(...params),
+  });
+}
+
+export function listOrganizations(
+  ...params: Parameters<typeof authClient.organization.list>
+) {
+  return unwrapOrganizationClientResult({
+    operation: "list organizations",
+    promise: authClient.organization.list(...params),
+  });
+}
+
+export function createOrganization(
+  ...params: Parameters<typeof authClient.organization.create>
+) {
+  return unwrapOrganizationClientResult({
+    operation: "create organization",
+    promise: authClient.organization.create(...params),
+  });
+}
+
+export function inviteMember(
+  ...params: Parameters<typeof authClient.organization.inviteMember>
+) {
+  return unwrapOrganizationClientResult({
+    operation: "invite member",
+    promise: authClient.organization.inviteMember(...params),
+  });
+}

apps/dashboard/app/routes/_auth.request-password-reset/route.tsx

@@ -1,5 +1,4 @@
 import { withMinimumDelay } from "@lite-app/shared/delay";
-import { isDefined } from "@lite-app/shared/is-defined";
 import { Card } from "@lite-app/ui/components/card";
 import { FieldError } from "@lite-app/ui/components/field-error";
 import { Input } from "@lite-app/ui/components/input";
@@ -29,7 +28,7 @@ import {
 } from "~/components/form-card";
 import { FormFields } from "~/components/form-fields";
 import { SubmitButton } from "~/components/submit-button";
-import { authClient } from "~/lib/auth";
+import { requestPasswordReset } from "~/lib/auth";
 import { mapAuthErrorToFormActionError } from "~/lib/auth/error";
 import { parseFormData } from "~/lib/form/form-data";
 
@@ -52,25 +51,24 @@ export async function clientAction({
   }
   const { email } = formData;
 
-  const { data, error } = await withMinimumDelay(
-    authClient.requestPasswordReset({
+  const passwordResetRequest = await withMinimumDelay(
+    requestPasswordReset({
       email,
       redirectTo: href("/reset-password"),
     })
   );
-  const success = isDefined(data) && !isDefined(error);
 
-  if (!success) {
+  if (passwordResetRequest instanceof Error) {
     return {
       status: "error",
-      error: mapAuthErrorToFormActionError(error),
+      error: mapAuthErrorToFormActionError(passwordResetRequest.cause),
     };
   }
   return {
     status: "success",
     success: {
       type: "alert",
-      title: data.message,
+      title: passwordResetRequest.message,
     },
   };
 }

apps/dashboard/app/routes/_auth.reset-password/route.tsx

@@ -29,7 +29,7 @@ import {
 } from "~/components/form-card";
 import { FormFields } from "~/components/form-fields";
 import { SubmitButton } from "~/components/submit-button";
-import { authClient } from "~/lib/auth";
+import { resetPassword } from "~/lib/auth";
 import {
   comparePasswords,
   mapAuthErrorToFormActionError,
@@ -73,18 +73,17 @@ export async function clientAction({
     };
   }
 
-  const { error } = await withMinimumDelay(
-    authClient.resetPassword({
+  const passwordReset = await withMinimumDelay(
+    resetPassword({
       newPassword: password,
       ...(isDefined(token) && { token }),
     })
   );
-  const success = !isDefined(error);
 
-  if (!success) {
+  if (passwordReset instanceof Error) {
     return {
       status: "error",
-      error: mapAuthErrorToFormActionError(error),
+      error: mapAuthErrorToFormActionError(passwordReset.cause),
     };
   }
   throw redirect(href("/signin"));

apps/dashboard/app/routes/_auth.signin/route.tsx

@@ -1,5 +1,4 @@
 import { withMinimumDelay } from "@lite-app/shared/delay";
-import { isDefined } from "@lite-app/shared/is-defined";
 import { Card } from "@lite-app/ui/components/card";
 import { FieldError } from "@lite-app/ui/components/field-error";
 import { Input } from "@lite-app/ui/components/input";
@@ -28,7 +27,7 @@ import {
 } from "~/components/form-card";
 import { FormFields } from "~/components/form-fields";
 import { SubmitButton } from "~/components/submit-button";
-import { authClient } from "~/lib/auth";
+import { signInEmail } from "~/lib/auth";
 import { mapAuthErrorToFormActionError } from "~/lib/auth/error";
 import { getAuthenticatedRedirectHref } from "~/lib/auth/href";
 import { parseFormData } from "~/lib/form/form-data";
@@ -53,18 +52,17 @@ export async function clientAction({
   }
   const { email, password } = formData;
 
-  const { error } = await withMinimumDelay(
-    authClient.signIn.email({
+  const session = await withMinimumDelay(
+    signInEmail({
       email,
       password,
     })
   );
-  const success = !isDefined(error);
 
-  if (!success) {
+  if (session instanceof Error) {
     return {
       status: "error",
-      error: mapAuthErrorToFormActionError(error),
+      error: mapAuthErrorToFormActionError(session.cause),
     };
   }
   throw redirectDocument(await getAuthenticatedRedirectHref());

apps/dashboard/app/routes/_auth.signup/route.tsx

@@ -1,5 +1,4 @@
 import { withMinimumDelay } from "@lite-app/shared/delay";
-import { isDefined } from "@lite-app/shared/is-defined";
 import { Card } from "@lite-app/ui/components/card";
 import { FieldError } from "@lite-app/ui/components/field-error";
 import { Input } from "@lite-app/ui/components/input";
@@ -27,7 +26,7 @@ import {
 } from "~/components/form-card";
 import { FormFields } from "~/components/form-fields";
 import { SubmitButton } from "~/components/submit-button";
-import { authClient } from "~/lib/auth";
+import { signUpEmail } from "~/lib/auth";
 import {
   comparePasswords,
   mapAuthErrorToFormActionError,
@@ -84,20 +83,19 @@ export async function clientAction({
     };
   }
 
-  const { error } = await withMinimumDelay(
-    authClient.signUp.email({
+  const account = await withMinimumDelay(
+    signUpEmail({
       name,
       email,
       password,
       image: pickAvatar(),
     })
   );
-  const success = !isDefined(error);
 
-  if (!success) {
+  if (account instanceof Error) {
     return {
       status: "error",
-      error: mapAuthErrorToFormActionError(error),
+      error: mapAuthErrorToFormActionError(account.cause),
     };
   }
   throw redirect(href("/organization/create"));