Refactor login functionality to use email instead of username. Update related tests, API routes, and database schema to support email-based authentication. Ensure consistency across login forms and queries.

src/app/api/auth/login/route.ts

@@ -2,7 +2,7 @@ import { z } from 'zod';
 import { checkPassword } from '@/lib/auth';
 import { createSecureToken } from '@/lib/jwt';
 import redis from '@/lib/redis';
-import { getUserByUsername } from '@/queries';
+import { getUserByEmail } from '@/queries';
 import { json, unauthorized } from '@/lib/response';
 import { parseRequest } from '@/lib/request';
 import { saveAuth } from '@/lib/auth';
@@ -11,7 +11,7 @@ import { ROLES } from '@/lib/constants';
 
 export async function POST(request: Request) {
   const schema = z.object({
-    username: z.string(),
+    email: z.string().email(),
     password: z.string(),
   });
 
@@ -21,9 +21,9 @@ export async function POST(request: Request) {
     return error();
   }
 
-  const { username, password } = body;
+  const { email, password } = body;
 
-  const user = await getUserByUsername(username, { includePassword: true });
+  const user = await getUserByEmail(email, { includePassword: true });
 
   if (!user || !checkPassword(password, user.password)) {
     return unauthorized('message.incorrect-username-password');
@@ -41,6 +41,6 @@ export async function POST(request: Request) {
 
   return json({
     token,
-    user: { id, username, role, createdAt, isAdmin: role === ROLES.admin },
+    user: { id, username: user.username, role, createdAt, isAdmin: role === ROLES.admin },
   });
 }

src/app/login/LoginForm.tsx

@@ -20,7 +20,7 @@ export function LoginForm() {
 
   const handleSubmit = async (data: any) => {
     const res = await signIn('credentials', {
-      username: data.username,
+      email: data.email,
       password: data.password,
       redirect: false,
     });
@@ -39,13 +39,13 @@ export function LoginForm() {
       </Icon>
       <div className={styles.title}>umami</div>
       <Form className={styles.form} onSubmit={handleSubmit}>
-        <FormRow label={formatMessage(labels.username)}>
+        <FormRow label={formatMessage(labels.email)}>
           <FormInput
             data-test="input-username"
-            name="username"
+            name="email"
             rules={{ required: formatMessage(labels.required) }}
           >
-            <TextField autoComplete="username" />
+            <TextField autoComplete="email" />
           </FormInput>
         </FormRow>
         <FormRow label={formatMessage(labels.password)}>

src/lib/authOptions.ts

@@ -1,7 +1,7 @@
 import type { NextAuthOptions } from 'next-auth';
 import CredentialsProvider from 'next-auth/providers/credentials';
 import { checkPassword } from '@/lib/auth';
-import { getUserByUsername } from '@/queries';
+import { getUserByEmail } from '@/queries';
 
 const AUTH_SECRET = process.env.NEXTAUTH_SECRET || process.env.APP_SECRET;
 
@@ -12,12 +12,12 @@ const authOptions: NextAuthOptions = {
     CredentialsProvider({
       name: 'Credentials',
       credentials: {
-        username: { label: 'Username', type: 'text' },
+        email: { label: 'Email', type: 'text' },
         password: { label: 'Password', type: 'password' },
       },
       authorize: async credentials => {
-        if (!credentials?.username || !credentials?.password) return null;
-        const user = await getUserByUsername(credentials.username, {
+        if (!credentials?.email || !credentials?.password) return null;
+        const user = await getUserByEmail(credentials.email, {
           includePassword: true,
         } as any);
         if (!user) return null;

src/queries/prisma/user.ts

@@ -32,6 +32,24 @@ async function findUser(
   });
 }
 
+export async function getUserByEmail(email: string, options: GetUserOptions = {}) {
+  const { includePassword = false, showDeleted = false } = options;
+
+  return prisma.client.user.findFirst({
+    where: {
+      OR: [{ email }, { username: email }],
+      ...(showDeleted && { deletedAt: null }),
+    },
+    select: {
+      id: true,
+      username: true,
+      password: includePassword,
+      role: true,
+      createdAt: true,
+    },
+  }) as unknown as Promise<User>;
+}
+
 export async function getUser(userId: string, options: GetUserOptions = {}) {
   return findUser(
     {
@@ -222,6 +240,12 @@ export async function deleteUser(
       where: {
         id: userId,
       },
+      select: {
+        id: true,
+        username: true,
+        role: true,
+        createdAt: true,
+      },
     }),
   ]);
 }