@better-auth-ui/react 1.6.2 → 1.6.3

package/src/hooks/auth/use-send-verification-email.ts

@@ -1,21 +1,31 @@
+import { useMutation } from "@tanstack/react-query"
+
 import { useAuth } from "../../components/auth/auth-provider"
 import type { AuthClient } from "../../lib/auth-client"
-import {
-  type UseAuthMutationOptions,
-  useAuthMutation
-} from "./use-auth-mutation"
+import { sendVerificationEmailOptions } from "../../mutations/auth/send-verification-email-options"
+
+export type UseSendVerificationEmailParams = NonNullable<
+  Parameters<AuthClient["sendVerificationEmail"]>[0]
+>
+
+export type UseSendVerificationEmailOptions = Omit<
+  ReturnType<typeof sendVerificationEmailOptions>,
+  "mutationKey" | "mutationFn"
+>
 
 /**
  * Hook that creates a mutation to send a verification email.
  *
- * The mutation sends a verification email to the specified email address.
- *
+ * @param options - React Query options forwarded to `useMutation`.
  * @returns The `useMutation` result.
  */
 export function useSendVerificationEmail(
-  options?: UseAuthMutationOptions<AuthClient["sendVerificationEmail"]>
+  options?: UseSendVerificationEmailOptions
 ) {
   const { authClient } = useAuth()
 
-  return useAuthMutation({ authFn: authClient.sendVerificationEmail, options })
+  return useMutation({
+    ...sendVerificationEmailOptions(authClient),
+    ...options
+  })
 }

package/src/hooks/auth/use-session.ts

@@ -1,27 +1,31 @@
+import { useQuery } from "@tanstack/react-query"
 import { useAuth } from "../../components/auth/auth-provider"
 import type { AuthClient } from "../../lib/auth-client"
-import {
-  type UseAuthQueryOptions,
-  type UseAuthQueryResult,
-  useAuthQuery
-} from "./use-auth-query"
+import { sessionOptions } from "../../queries/auth/session-options"
+
+export type UseSessionParams = NonNullable<
+  Parameters<AuthClient["getSession"]>[0]
+>
+
+export type UseSessionOptions = Omit<
+  ReturnType<typeof sessionOptions>,
+  "queryKey" | "queryFn"
+> &
+  UseSessionParams
 
 /**
  * Retrieve the current authentication session.
  *
- * @param options - Options to merge into the React Query configuration for the session query.
- * @returns The React Query result for the session query: `data` contains session information, `isLoading`/`isFetching` indicate loading state, and `error` contains any fetch error.
+ * @param options - Better Auth params (`query`, `fetchOptions`) and React
+ *   Query options forwarded to `useQuery`.
+ * @returns React Query result for the session.
  */
-export function useSession(
-  options?: Partial<UseAuthQueryOptions<AuthClient["getSession"]>>
-): UseAuthQueryResult<AuthClient["getSession"]> {
+export function useSession(options?: UseSessionOptions) {
   const { authClient } = useAuth()
+  const { query, fetchOptions, ...queryOptions } = options ?? {}
 
-  return useAuthQuery({
-    authFn: authClient.getSession,
-    options: {
-      queryKey: ["auth", "getSession"],
-      ...options
-    }
+  return useQuery({
+    ...sessionOptions(authClient, { query, fetchOptions }),
+    ...queryOptions
   })
 }

package/src/hooks/auth/use-sign-in-email.ts

@@ -1,11 +1,18 @@
-import { useQueryClient } from "@tanstack/react-query"
+import { useMutation, useQueryClient } from "@tanstack/react-query"
 
 import { useAuth } from "../../components/auth/auth-provider"
 import type { AuthClient } from "../../lib/auth-client"
-import {
-  type UseAuthMutationOptions,
-  useAuthMutation
-} from "./use-auth-mutation"
+import { signInEmailOptions } from "../../mutations/auth/sign-in-email-options"
+import { sessionOptions } from "../../queries/auth/session-options"
+
+export type UseSignInEmailParams = NonNullable<
+  Parameters<AuthClient["signIn"]["email"]>[0]
+>
+
+export type UseSignInEmailOptions = Omit<
+  ReturnType<typeof signInEmailOptions>,
+  "mutationKey" | "mutationFn"
+>
 
 /**
  * Hook that creates a mutation for email/password sign-in.
@@ -13,22 +20,22 @@ import {
  * The mutation sends an email/password sign-in request and
  * refetches the session on completion.
  *
+ * @param options - React Query options forwarded to `useMutation`.
  * @returns The `useMutation` result.
  */
-export function useSignInEmail(
-  options?: UseAuthMutationOptions<AuthClient["signIn"]["email"]>
-) {
+export function useSignInEmail(options?: UseSignInEmailOptions) {
   const { authClient } = useAuth()
   const queryClient = useQueryClient()
 
-  return useAuthMutation({
-    authFn: authClient.signIn.email,
-    options: {
-      ...options,
-      onSuccess: async (...args) => {
-        queryClient.resetQueries({ queryKey: ["auth", "getSession"] })
-        await options?.onSuccess?.(...args)
-      }
+  return useMutation({
+    ...signInEmailOptions(authClient),
+    ...options,
+    onSuccess: async (...args) => {
+      queryClient.resetQueries({
+        queryKey: sessionOptions(authClient).queryKey
+      })
+
+      await options?.onSuccess?.(...args)
     }
   })
 }

package/src/hooks/auth/use-sign-in-magic-link.ts

@@ -1,21 +1,29 @@
+import { useMutation } from "@tanstack/react-query"
+
 import { useAuth } from "../../components/auth/auth-provider"
 import type { AuthClient } from "../../lib/auth-client"
-import {
-  type UseAuthMutationOptions,
-  useAuthMutation
-} from "./use-auth-mutation"
+import { signInMagicLinkOptions } from "../../mutations/auth/sign-in-magic-link-options"
+
+export type UseSignInMagicLinkParams = NonNullable<
+  Parameters<AuthClient["signIn"]["magicLink"]>[0]
+>
+
+export type UseSignInMagicLinkOptions = Omit<
+  ReturnType<typeof signInMagicLinkOptions>,
+  "mutationKey" | "mutationFn"
+>
 
 /**
  * Hook that creates a mutation for magic-link sign-in.
  *
- * The mutation sends a magic-link sign-in email to the specified address.
- *
+ * @param options - React Query options forwarded to `useMutation`.
  * @returns The `useMutation` result.
  */
-export function useSignInMagicLink(
-  options?: UseAuthMutationOptions<AuthClient["signIn"]["magicLink"]>
-) {
+export function useSignInMagicLink(options?: UseSignInMagicLinkOptions) {
   const { authClient } = useAuth()
 
-  return useAuthMutation({ authFn: authClient.signIn.magicLink, options })
+  return useMutation({
+    ...signInMagicLinkOptions(authClient),
+    ...options
+  })
 }

package/src/hooks/auth/use-sign-in-passkey.ts

@@ -1,34 +1,40 @@
-import { useQueryClient } from "@tanstack/react-query"
+import { useMutation, useQueryClient } from "@tanstack/react-query"
 
 import { useAuth } from "../../components/auth/auth-provider"
 import type { AuthClient } from "../../lib/auth-client"
-import {
-  type UseAuthMutationOptions,
-  useAuthMutation
-} from "./use-auth-mutation"
+import { signInPasskeyOptions } from "../../mutations/auth/sign-in-passkey-options"
+import { sessionOptions } from "../../queries/auth/session-options"
+
+export type UseSignInPasskeyParams = NonNullable<
+  Parameters<AuthClient["signIn"]["passkey"]>[0]
+>
+
+export type UseSignInPasskeyOptions = Omit<
+  ReturnType<typeof signInPasskeyOptions>,
+  "mutationKey" | "mutationFn"
+>
 
 /**
  * Hook that creates a mutation for passkey sign-in.
  *
- * The mutation sends a passkey sign-in request and
- * refetches the session on completion.
+ * Resets the session query on completion so the new session is refetched.
  *
+ * @param options - React Query options forwarded to `useMutation`.
  * @returns The `useMutation` result.
  */
-export function useSignInPasskey(
-  options?: UseAuthMutationOptions<AuthClient["signIn"]["passkey"]>
-) {
+export function useSignInPasskey(options?: UseSignInPasskeyOptions) {
   const { authClient } = useAuth()
   const queryClient = useQueryClient()
 
-  return useAuthMutation({
-    authFn: authClient.signIn.passkey,
-    options: {
-      ...options,
-      onSuccess: async (...args) => {
-        queryClient.resetQueries({ queryKey: ["auth", "getSession"] })
-        await options?.onSuccess?.(...args)
-      }
+  return useMutation({
+    ...signInPasskeyOptions(authClient),
+    ...options,
+    onSuccess: async (...args) => {
+      queryClient.resetQueries({
+        queryKey: sessionOptions(authClient).queryKey
+      })
+
+      await options?.onSuccess?.(...args)
     }
   })
 }

package/src/hooks/auth/use-sign-in-social.ts

@@ -1,21 +1,31 @@
+import { useMutation } from "@tanstack/react-query"
+
 import { useAuth } from "../../components/auth/auth-provider"
 import type { AuthClient } from "../../lib/auth-client"
-import {
-  type UseAuthMutationOptions,
-  useAuthMutation
-} from "./use-auth-mutation"
+import { signInSocialOptions } from "../../mutations/auth/sign-in-social-options"
+
+export type UseSignInSocialParams = NonNullable<
+  Parameters<AuthClient["signIn"]["social"]>[0]
+>
+
+export type UseSignInSocialOptions = Omit<
+  ReturnType<typeof signInSocialOptions>,
+  "mutationKey" | "mutationFn"
+>
 
 /**
  * Hook that creates a mutation for social sign-in.
  *
  * The mutation initiates a social sign-in flow with the specified provider.
  *
+ * @param options - React Query options forwarded to `useMutation`.
  * @returns The `useMutation` result.
  */
-export function useSignInSocial(
-  options?: UseAuthMutationOptions<AuthClient["signIn"]["social"]>
-) {
+export function useSignInSocial(options?: UseSignInSocialOptions) {
   const { authClient } = useAuth()
 
-  return useAuthMutation({ authFn: authClient.signIn.social, options })
+  return useMutation({
+    ...signInSocialOptions(authClient),
+    ...options
+  })
 }

package/src/hooks/auth/use-sign-in-username.ts

@@ -1,34 +1,40 @@
-import { useQueryClient } from "@tanstack/react-query"
+import { useMutation, useQueryClient } from "@tanstack/react-query"
 
 import { useAuth } from "../../components/auth/auth-provider"
 import type { AuthClient } from "../../lib/auth-client"
-import {
-  type UseAuthMutationOptions,
-  useAuthMutation
-} from "./use-auth-mutation"
+import { signInUsernameOptions } from "../../mutations/auth/sign-in-username-options"
+import { sessionOptions } from "../../queries/auth/session-options"
+
+export type UseSignInUsernameParams = NonNullable<
+  Parameters<AuthClient["signIn"]["username"]>[0]
+>
+
+export type UseSignInUsernameOptions = Omit<
+  ReturnType<typeof signInUsernameOptions>,
+  "mutationKey" | "mutationFn"
+>
 
 /**
  * Hook that creates a mutation for username/password sign-in.
  *
- * The mutation sends a username/password sign-in request and
- * refetches the session on completion.
+ * Resets the session query on completion so the new session is refetched.
  *
+ * @param options - React Query options forwarded to `useMutation`.
  * @returns The `useMutation` result.
  */
-export function useSignInUsername(
-  options?: UseAuthMutationOptions<AuthClient["signIn"]["username"]>
-) {
+export function useSignInUsername(options?: UseSignInUsernameOptions) {
   const { authClient } = useAuth()
   const queryClient = useQueryClient()
 
-  return useAuthMutation({
-    authFn: authClient.signIn.username,
-    options: {
-      ...options,
-      onSuccess: async (...args) => {
-        queryClient.resetQueries({ queryKey: ["auth", "getSession"] })
-        await options?.onSuccess?.(...args)
-      }
+  return useMutation({
+    ...signInUsernameOptions(authClient),
+    ...options,
+    onSuccess: async (...args) => {
+      queryClient.resetQueries({
+        queryKey: sessionOptions(authClient).queryKey
+      })
+
+      await options?.onSuccess?.(...args)
     }
   })
 }

package/src/hooks/auth/use-sign-out.ts

@@ -1,33 +1,34 @@
-import { useQueryClient } from "@tanstack/react-query"
+import { useMutation, useQueryClient } from "@tanstack/react-query"
 
 import { useAuth } from "../../components/auth/auth-provider"
 import type { AuthClient } from "../../lib/auth-client"
-import {
-  type UseAuthMutationOptions,
-  useAuthMutation
-} from "./use-auth-mutation"
+import { signOutOptions } from "../../mutations/auth/sign-out-options"
+
+export type UseSignOutParams = NonNullable<Parameters<AuthClient["signOut"]>[0]>
+
+export type UseSignOutOptions = Omit<
+  ReturnType<typeof signOutOptions>,
+  "mutationKey" | "mutationFn"
+>
 
 /**
  * Hook that creates a mutation for signing out.
  *
- * The mutation signs out the current user and removes auth queries from cache.
+ * Removes all cached auth queries on completion.
  *
+ * @param options - React Query options forwarded to `useMutation`.
  * @returns The `useMutation` result.
  */
-export function useSignOut(
-  options?: UseAuthMutationOptions<AuthClient["signOut"]>
-) {
+export function useSignOut(options?: UseSignOutOptions) {
   const { authClient } = useAuth()
   const queryClient = useQueryClient()
 
-  return useAuthMutation({
-    authFn: authClient.signOut,
-    options: {
-      ...options,
-      onSuccess: async (...args) => {
-        queryClient.removeQueries({ queryKey: ["auth"] })
-        await options?.onSuccess?.(...args)
-      }
+  return useMutation({
+    ...signOutOptions(authClient),
+    ...options,
+    onSuccess: async (...args) => {
+      queryClient.removeQueries({ queryKey: ["auth"] })
+      await options?.onSuccess?.(...args)
     }
   })
 }

package/src/hooks/auth/use-sign-up-email.ts

@@ -1,34 +1,40 @@
-import { useQueryClient } from "@tanstack/react-query"
+import { useMutation, useQueryClient } from "@tanstack/react-query"
 
 import { useAuth } from "../../components/auth/auth-provider"
 import type { AuthClient } from "../../lib/auth-client"
-import {
-  type UseAuthMutationOptions,
-  useAuthMutation
-} from "./use-auth-mutation"
+import { signUpEmailOptions } from "../../mutations/auth/sign-up-email-options"
+import { sessionOptions } from "../../queries/auth/session-options"
+
+export type UseSignUpEmailParams = NonNullable<
+  Parameters<AuthClient["signUp"]["email"]>[0]
+>
+
+export type UseSignUpEmailOptions = Omit<
+  ReturnType<typeof signUpEmailOptions>,
+  "mutationKey" | "mutationFn"
+>
 
 /**
  * Hook that creates a mutation for email/password sign-up.
  *
- * The mutation sends an email/password sign-up request and
- * refetches the session on success.
+ * Resets the session query on success so the new session is refetched.
  *
+ * @param options - React Query options forwarded to `useMutation`.
  * @returns The `useMutation` result.
  */
-export function useSignUpEmail(
-  options?: UseAuthMutationOptions<AuthClient["signUp"]["email"]>
-) {
+export function useSignUpEmail(options?: UseSignUpEmailOptions) {
   const { authClient } = useAuth()
   const queryClient = useQueryClient()
 
-  return useAuthMutation({
-    authFn: authClient.signUp.email,
-    options: {
-      ...options,
-      onSuccess: async (...args) => {
-        queryClient.resetQueries({ queryKey: ["auth", "getSession"] })
-        await options?.onSuccess?.(...args)
-      }
+  return useMutation({
+    ...signUpEmailOptions(authClient),
+    ...options,
+    onSuccess: async (...args) => {
+      queryClient.resetQueries({
+        queryKey: sessionOptions(authClient).queryKey
+      })
+
+      await options?.onSuccess?.(...args)
     }
   })
 }

package/src/hooks/auth/use-user.ts

@@ -1,16 +1,15 @@
-import type { AuthClient } from "../../lib/auth-client"
-import type { UseAuthQueryOptions } from "./use-auth-query"
-import { useSession } from "./use-session"
+import { type UseSessionOptions, useSession } from "./use-session"
 
 /**
  * Retrieve the current authenticated user.
  *
- * @param options - Options to merge into the React Query configuration for the session query.
- * @returns The React Query result with `data` containing the user object from the session.
+ * Thin wrapper over `useSession` that returns `session.user` as `data`.
+ *
+ * @param options - Better Auth params (`query`, `fetchOptions`) and React
+ *   Query options forwarded to `useQuery`.
+ * @returns React Query result with `data` narrowed to the user object.
  */
-export function useUser(
-  options?: Partial<UseAuthQueryOptions<AuthClient["getSession"]>>
-) {
+export function useUser(options?: UseSessionOptions) {
   const { data, ...rest } = useSession(options)
 
   return {

package/src/hooks/settings/use-account-info.ts

@@ -1,31 +1,40 @@
+import { skipToken, useQuery } from "@tanstack/react-query"
 import { useAuth } from "../../components/auth/auth-provider"
 import type { AuthClient } from "../../lib/auth-client"
-import { type UseAuthQueryOptions, useAuthQuery } from "../auth/use-auth-query"
+import { accountInfoOptions } from "../../queries/settings/account-info-options"
+import { useSession } from "../auth/use-session"
+
+export type UseAccountInfoParams = NonNullable<
+  Parameters<AuthClient["accountInfo"]>[0]
+>
+
+export type UseAccountInfoOptions = Omit<
+  ReturnType<typeof accountInfoOptions>,
+  "queryKey" | "queryFn"
+> &
+  UseAccountInfoParams
 
 /**
- * Retrieve provider-specific account info for a given account ID.
+ * Retrieve provider-specific info for a linked account.
  *
- * Uses the `accountInfo` API endpoint to fetch detailed information
- * from the social provider. The provider is automatically detected
- * from the account ID.
+ * Keyed per-user; waits for the active session and `options.query.accountId`
+ * before firing.
  *
- * @param accountId - The provider-given account ID to fetch info for
- * @param options - Optional react-query options forwarded to `useQuery`
- * @returns The react-query result containing account info data, loading state, and error state
+ * @param options - Better Auth params (`query`, `fetchOptions`) and React
+ *   Query options forwarded to `useQuery`.
  */
-export function useAccountInfo(
-  accountId?: string,
-  options?: Partial<UseAuthQueryOptions<AuthClient["accountInfo"]>>
-) {
+export function useAccountInfo(options?: UseAccountInfoOptions) {
   const { authClient } = useAuth()
+  const { data: session } = useSession({ refetchOnMount: false })
+  const userId = session?.user.id
+
+  const { query, fetchOptions, ...queryOptions } = options ?? {}
+  const accountId = query?.accountId
+  const disabled = !userId || !accountId
 
-  return useAuthQuery({
-    authFn: authClient.accountInfo,
-    params: { query: { accountId } },
-    options: {
-      queryKey: ["auth", "accountInfo", accountId],
-      enabled: !!accountId,
-      ...options
-    }
+  return useQuery({
+    ...accountInfoOptions(authClient, userId, { query, fetchOptions }),
+    ...(disabled && { queryFn: skipToken }),
+    ...queryOptions
   })
 }

package/src/hooks/settings/use-add-passkey.ts

@@ -1,32 +1,37 @@
+import { useMutation } from "@tanstack/react-query"
+
 import { useAuth } from "../../components/auth/auth-provider"
 import type { AuthClient } from "../../lib/auth-client"
-import {
-  type UseAuthMutationOptions,
-  useAuthMutation
-} from "../auth/use-auth-mutation"
+import { addPasskeyOptions } from "../../mutations/settings/add-passkey-options"
 import { useListUserPasskeys } from "./use-list-user-passkeys"
 
+export type UseAddPasskeyParams = NonNullable<
+  Parameters<AuthClient["passkey"]["addPasskey"]>[0]
+>
+
+export type UseAddPasskeyOptions = Omit<
+  ReturnType<typeof addPasskeyOptions>,
+  "mutationKey" | "mutationFn"
+>
+
 /**
- * Hook that creates a mutation for adding a new passkey.
+ * Hook that creates a mutation for registering a new passkey.
  *
- * Refetches the passkeys list on success.
+ * Refetches the user's passkey list on success.
  *
+ * @param options - React Query options forwarded to `useMutation`.
  * @returns The `useMutation` result.
  */
-export function useAddPasskey(
-  options?: UseAuthMutationOptions<AuthClient["passkey"]["addPasskey"]>
-) {
+export function useAddPasskey(options?: UseAddPasskeyOptions) {
   const { authClient } = useAuth()
   const { refetch } = useListUserPasskeys()
 
-  return useAuthMutation({
-    authFn: authClient.passkey.addPasskey,
-    options: {
-      ...options,
-      onSuccess: async (...args) => {
-        await refetch()
-        await options?.onSuccess?.(...args)
-      }
+  return useMutation({
+    ...addPasskeyOptions(authClient),
+    ...options,
+    onSuccess: async (...args) => {
+      await refetch()
+      await options?.onSuccess?.(...args)
     }
   })
 }

package/src/hooks/settings/use-change-email.ts

@@ -1,33 +1,37 @@
+import { useMutation } from "@tanstack/react-query"
+
 import { useAuth } from "../../components/auth/auth-provider"
 import type { AuthClient } from "../../lib/auth-client"
-import {
-  type UseAuthMutationOptions,
-  useAuthMutation
-} from "../auth/use-auth-mutation"
+import { changeEmailOptions } from "../../mutations/settings/change-email-options"
 import { useSession } from "../auth/use-session"
 
+export type UseChangeEmailParams = NonNullable<
+  Parameters<AuthClient["changeEmail"]>[0]
+>
+
+export type UseChangeEmailOptions = Omit<
+  ReturnType<typeof changeEmailOptions>,
+  "mutationKey" | "mutationFn"
+>
+
 /**
  * Hook that creates a mutation for changing the current user's email address.
  *
- * The mutation sends an email-change request and shows success or error toasts.
- * On success the callback URL is set to the account settings view.
+ * Refetches the session on success to surface the new email.
  *
+ * @param options - React Query options forwarded to `useMutation`.
  * @returns The `useMutation` result.
  */
-export function useChangeEmail(
-  options?: UseAuthMutationOptions<AuthClient["changeEmail"]>
-) {
+export function useChangeEmail(options?: UseChangeEmailOptions) {
   const { authClient } = useAuth()
   const { refetch } = useSession({ refetchOnMount: false })
 
-  return useAuthMutation({
-    authFn: authClient.changeEmail,
-    options: {
-      ...options,
-      onSuccess: async (...args) => {
-        refetch()
-        await options?.onSuccess?.(...args)
-      }
+  return useMutation({
+    ...changeEmailOptions(authClient),
+    ...options,
+    onSuccess: async (...args) => {
+      await refetch()
+      await options?.onSuccess?.(...args)
     }
   })
 }