diff --git a/README.md b/README.md index 5a29a65..4f59230 100644 --- a/README.md +++ b/README.md @@ -10,7 +10,7 @@ pairing with smart people at Hashrocket. For a steady stream of TILs, [sign up for my newsletter](https://crafty-builder-6996.ck.page/e169c61186). -_1354 TILs and counting..._ +_1355 TILs and counting..._ --- @@ -43,6 +43,7 @@ _1354 TILs and counting..._ * [MySQL](#mysql) * [Neovim](#neovim) * [Netlify](#netlify) +* [NextAuth.js](#next-auth) * [Next.js](#nextjs) * [Phoenix](#phoenix) * [Planetscale](#planetscale) @@ -580,6 +581,10 @@ _1354 TILs and counting..._ - [Override The Default Yarn Version](netlify/override-the-default-yarn-version.md) +### NextAuth.js + +- [Adjust The Shape Of The User Type](next-auth/adjust-the-shape-of-the-user-type.md) + ### Next.js - [Create Files And Directories For Dynamic Routes](nextjs/create-files-and-directories-for-dynamic-routes.md) diff --git a/next-auth/adjust-the-shape-of-the-user-type.md b/next-auth/adjust-the-shape-of-the-user-type.md new file mode 100644 index 0000000..c15db70 --- /dev/null +++ b/next-auth/adjust-the-shape-of-the-user-type.md @@ -0,0 +1,40 @@ +# Adjust The Shape Of The User Type + +Let's say we want extra attributes on our `user` object that gets passed around +as part of authentication with [NextAuth.js](https://next-auth.js.org/). If +we're using a database adapter, it's because we have added columns to the +`User` table. Or it may be that we are adding extra attributes to the body of +the JWT token. + +Either way, we need the underlying `User` type (rather, interface) to reflect +that. + +Within a `declare module` block for NextAuth, we can define a `User` interface +with any additional properties that we want. + +This adds `roles` as a required `string` type. + +```typescript +declare module "next-auth" { + interface User { + // ...other properties + roles: string; + } +} +``` + +Some natural places to add this declaration are in the auth file itself (e.g. +`src/server/auth.ts`). Or we can put it in a dedicated top-level +`next-auth.d.ts` file as long as we tell our `tsconfig.json` to include it: + +```json +{ + ... + "include": [ + "src/**/*", + "process.d.ts", + "next-auth.d.ts" + ], + ... +} +```