Authentication
Login with Password
Nextbase supports traditional email and password authentication, providing a familiar login experience for users.
Server Action
Here's the server action used for password-based login:
"use server";
import { createSupabaseUserServerActionClient } from "@/supabase-clients/user/createSupabaseUserServerActionClient";
export const signInWithPassword = async (email: string, password: string) => {
const supabase = createSupabaseUserServerActionClient();
const { error } = await supabase.auth.signInWithPassword({
email,
password,
});
if (error) {
throw error;
}
};Usage
Here's an example of how to use password-based authentication in your login component:
const passwordMutation = useToastMutation(
async ({ email, password }: { email: string; password: string }) => {
return await signInWithPassword(email, password);
},
{
onSuccess: redirectToDashboard,
loadingMessage: "Logging in...",
errorMessage: "Failed to login",
successMessage: "Logged in!",
},
);
// In your component JSX
<EmailAndPassword
isLoading={passwordMutation.isLoading}
onSubmit={(data) => {
passwordMutation.mutate(data);
}}
view="sign-in"
/>;This implementation allows users to log in using their email and password credentials.