Skip to content

Refactor LoginButton to use useMutation for async sign-in #1209

Description

@fhennig

Context

In website/src/components/auth/LoginButton.tsx, the authClient.signIn.social() call is handled with a raw .catch():

authClient.signIn
    .social({
        provider: 'github',
        callbackURL: callbackUrlThatDoesNotImmediatelyLogoutAgain,
    })
    .catch((error: unknown) => {
        showErrorToast({
            error: error instanceof Error ? error : new Error(String(error)),
            logMessage: `Login failed: ${getErrorLogMessage(error)}`,
            errorToastMessages: ['Login failed. Please try again.'],
        });
    });

Problem

This is an async call that doesn't follow the established pattern of using useMutation for async operations. Using a raw .catch() means we miss out on proper loading/error state handling that useMutation provides, and it's inconsistent with how other async calls are handled in the codebase.

Suggestion

Wrap the sign-in call in a useMutation hook for consistent error handling and to align with the existing pattern.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions