Skip to content

Implement User Authentication Mutations #36

Description

@0xdevcollins

Description

Create mutation hooks for user authentication operations including password management, session handling, and sign-out functionality using Better Auth.

Context

This issue covers the core authentication mutations that allow users to manage their authentication state and credentials.

Reference:

Files to create

  • change-password-mutation.ts
  • sign-out-mutation.ts
  • revoke-session-mutation.ts

Mutations to Implement

1. Change Password Mutation

File: user/change-password-mutation.ts

  • Create useChangePassword mutation hook

      const { mutate: changePassword, isPending, isError } = useChangePassword();
    
      changePassword({
        currentPassword: string;
        newPassword: string;
        confirmPassword: string;
        revokeOtherSessions?: boolean;
      });
  • Validate current password before change

  • Enforce password strength requirements

  • Handle Better Auth password change API

  • Show success/error notifications

  • Invalidate user session if needed

Acceptance Criteria:

  • Validates current password is correct
  • New password meets security requirements (min 8 chars, uppercase, lowercase, number, special char)
  • Passwords match validation
  • Error handling for weak passwords
  • Success toast notification
  • Auto sign-out after password change (optional)

2. Sign Out Mutation

File: user/sign-out-mutation.ts

  • Create useSignOut mutation hook
const { mutate: signOut, isPending } = useSignOut();

signOut(); // Signs out current user
  • Clear Better Auth session
  • Clear local storage/cookies
  • Redirect to login page
  • Clear React Query cache
  • Handle sign-out errors gracefully

Acceptance Criteria:

  • Clears all authentication tokens
  • Removes user data from state
  • Redirects to /login or home page
  • Clears cached queries
  • Shows confirmation toast
  • Handles network errors

3. Revoke Session Mutation

File: user/revoke-session-mutation.ts

  • Create useRevokeSession mutation hook
const { mutate: revokeSession } = useRevokeSession();

revokeSession({ sessionId: string });
  • Revoke specific user session by ID
  • Support revoking all sessions except current
  • Integrate with Better Auth session management
  • Update active sessions list
  • Show revocation confirmation

Acceptance Criteria:

  • Can revoke individual sessions
  • Option to revoke all other sessions
  • Updates session list immediately
  • Shows success confirmation
  • Handles already-revoked sessions gracefully

Technical Requirements

React Query Setup

  • Use useMutation from @tanstack/react-query
  • Proper error handling with Better Auth error types
  • Optimistic updates where applicable
  • Query invalidation after successful mutations
    Type Safety
interface ChangePasswordInput {
  currentPassword: string;
  newPassword: string;
  confirmPassword: string;
}

interface RevokeSessionInput {
  sessionId: string;
  revokeAll?: boolean;
}

Error Handling

  • Handle Better Auth specific errors
  • Network error handling
  • Form validation errors
  • User-friendly error messages

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions