Custom property on JWT is of type unknown

[ntdoJanneck]

I'm using authjs v5 in my nextjs app, which uses TypeScript. I want to use Discord as a provider, and get the Discord user ID in my session. But when assigning the userId from the token to the session, my IDE (WebStorm) shows the error TS2322: Type unknown is not assignable to type string. The app (currently only running in dev mode locally) still works, including authentication, and I can show the userId in my app.

This is my auth.ts:

export const { handlers, signIn, signOut, auth } = NextAuth({
  providers: [
    Discord({
      async profile(profile) {
        return { name: profile.global_name, userId: profile.id, ...profile };
      },
    }),
  ],
  callbacks: {
    jwt: async ({ token, user }) => {
      if (user) {
        token.name = user.name;
        token.userId = user.userId;
      }
      return token;
    },
    session: async ({ session, token }) => {
      session.user.userId = token.userId;
      return session;
    },
  },
  pages: {
    signIn: "/",
  },
});

The typescript error comes up in the session function:

I also have a types/next-auth.d.ts file:

import { DefaultSession } from "next-auth";

declare module "next-auth" {
  interface Session {
    user: {
      userId: string;
    } & DefaultSession["user"];
  }

  interface Account {
    id: string;
  }

  interface User {
    userId: string;
  }
}

declare module "next-auth/jwt" {
  interface JWT {
    userId: string;
  }
}

It's absolutely possible that I forgot something important, but I really have no idea what it could be. In the session function, when I hover over the token.userId property, the IDE correctly shows the type as a string and doing a CMD + Click to jump to the declaration shows the property of the JWT in my next-auth.d.ts. The code seems correct to me, so I'd appreciate some help.

[ntdoJanneck]

Okay so I just solved it myself. I added this import at the top of my next-auth.d.ts:

import "next-auth/jwt";

I must have overlooked this part in the docs, since the import in the docs is in the middle of the file right before the declare module "next-auth/jwt" and I'm used to seeing all relevant imports at the top of the file.

One thing I noticed with the docs though, the import used there is a different from the one I use now:

import { JWT } from "next-auth/jwt"

When I add this import instead of my version, it gets recognized as an unused import and removed by eslint on save. Not sure if this is intended, but since it works for me now I'd consider this discussion resolved.