Typescrit error for a promise

[coarse sapphire]

Hello guys, i had a code that worked with jsx, but now I'm on tsx and I have an error to resolve.

This error is in the declaration of my async function authorize(credentials) .

This is a big part of my code :

import GoogleProvider from "next-auth/providers/google";
import CredentialsProvider from "next-auth/providers/credentials";
import bcrypt from "bcrypt";
import User from "@/app/(models)/User";

export const options = {
  providers: [
    GoogleProvider({
      profile(profile) {
        let userRole = "noroleuser";
        if (profile?.email === "[email protected]") {
            userRole = "Prov";
          }
        return {
          ...profile,
          id: profile.sub,
          role: userRole,
          image: profile.picture,
        };
      },
      clientId: process.env.GOOGLE_ID as string,
      clientSecret: process.env.GOOGLE_Secret as string,
    }),
    CredentialsProvider({
      name: "Credentials",
      credentials: {
        email: {
          label: "email:",
          type: "text",
          placeholder: "email",
        },
        password: {
          label: "mot de passe",
          type: "password",
          placeholder: "mot de passe",
        },
      },
      async authorize(credentials) {
        try {
          const foundUser = await User.findOne({ email: credentials.email }).lean().exec();
      
          if (foundUser) {
            const match = await bcrypt.compare(credentials.password, foundUser.password);
      
            if (match) {
              delete foundUser.password;
              foundUser["role"] = "Cred";
              return foundUser;
            }
          }
        } catch (err) {
          console.log(err);
        }
        return null;
      },      
    }),
  ],
  // ( rest of the code ) 

And this is my error : Type '(credentials: Record<"email" | "password", string> | undefined) => Promise<(FlattenMaps<any> & Required<{ _id: unknown; }>)[] | (FlattenMaps<any> & Required<...>) | null>' is not assignable to type '(credentials: Record<"email" | "password", string> | undefined, req: Pick<RequestInternal, "body" | "query" | "headers" | "method">) => Awaitable<...>'.
Type 'Promise<(FlattenMaps<any> & Required<{ _id: unknown; }>)[] | (FlattenMaps<any> & Required<{ _id: unknown; }>) | null>' is not assignable to type 'Awaitable<User | null>'.
Type 'Promise<(FlattenMaps<any> & Required<{ _id: unknown; }>)[] | (FlattenMaps<any> & Required<{ _id: unknown; }>) | null>' is not assignable to type 'PromiseLike<User | null>'.
Types of property 'then' are incompatible.
Type '<TResult1 = (FlattenMaps<any> & Required<{ _id: unknown; }>)[] | (FlattenMaps<any> & Required<{ _id: unknown; }>) | null, TResult2 = never>(onfulfilled?: ((value: (FlattenMaps<any> & Required<...>)[] | (FlattenMaps<...> & Required<...>) | null) => TResult1 | PromiseLike<...>) | null | undefined, onrejected?: ((reaso...' is not assignable to type '<TResult1 = User | null, TResult2 = never>(onfulfilled?: ((value: User | null) => TResult1 | PromiseLike<TResult1>) | null | undefined, onrejected?: ((reason: any) => TResult2 | PromiseLike<...>) | null | undefined) => PromiseLike<...>'.

As far as I understand, it concerns promise but I don't know how to resolve this.
So I would really love to have your help since i struggle a lot with this haha.

[bronze ledge]

credentials might be undefined

so you cannot use the object and access some properties if it is

make sure it's not undefined first, then use the object

[coarse sapphire]

Ok nice I will try it, ty bro

[bronze ledge]

also, not too familiar with bcrypt, but can't you encrypt the recieved password first, then try to find a user with the matching username/password combo?

[coarse sapphire]

So i tried to change some things but I have the same error

CredentialsProvider({
      name: "Credentials",
      credentials: {
        email: {
          label: "email:",
          type: "text",
          placeholder: "email",
        },
        password: {
          label: "mot de passe",
          type: "password",
          placeholder: "mot de passe",
        },
      },
      async authorize(credentials:Record<"email" | "password",string> | undefined) {
        if (!credentials) {
            return null;
          }
        try {
          const foundUser = await User.findOne({ email: credentials.email }).lean().exec();
      
          if (foundUser) {
            const match = await bcrypt.compare(credentials.password, foundUser.password);
      
            if (match) {
              delete foundUser.password;
              foundUser["role"] = "Cred";
              return foundUser;
            }
          }
        } catch (err) {
          console.log(err);
        }
        return null;
      },      
    }),
  ]

[coarse sapphire]

I think that when I do bcrypt.compare(), the 2 password are encrypted first, if it's what you are asking

[bronze ledge]

probably because of your return null; at the end

[north parcel]

ascor8522#0

Playground Link

Preview:```ts
import GoogleProvider from "next-auth/providers/google"
import CredentialsProvider from "next-auth/providers/credentials"
import bcrypt from "bcrypt"
import mongoose from "mongoose"

const User = mongoose.model(
"User",
new mongoose.Schema({
email: String,
password: String,
})
)
...```

You can choose specific lines to embed by selecting them before copying the link.

[coarse sapphire]

is this the solution ? that is the 1st time I see this

[coarse sapphire]

Oh and yeah but i don't know what to put tbh...

[bronze ledge]

that's the problem

you can't just return anything at random just because you don't know

check the docs

what are you supposed to do if the user provides incorrect info? return null? throw an error? something else?