✨ Add user settings, improve color scheme

src/server/api/routers/user.ts

@@ -2,9 +2,9 @@ import { TRPCError } from '@trpc/server';
 import bcrypt from 'bcrypt';
 import { z } from 'zod';
 import { hashPassword } from '~/utils/security';
-import { signUpFormSchema } from '~/validations/user';
+import { colorSchemeParser, signUpFormSchema } from '~/validations/user';
 
-import { createTRPCRouter, publicProcedure } from '../trpc';
+import { createTRPCRouter, protectedProcedure, publicProcedure } from '../trpc';
 
 export const userRouter = createTRPCRouter({
   register: publicProcedure
@@ -50,6 +50,12 @@ export const userRouter = createTRPCRouter({
           name: input.username,
           password: hashedPassword,
           salt: salt,
+          settings: {
+            create: {
+              colorScheme: colorSchemeParser.parse(ctx.cookies['color-scheme']),
+              language: ctx.cookies['config-locale'] ?? 'en',
+            },
+          },
         },
       });
       await ctx.prisma.registrationToken.delete({
@@ -63,4 +69,24 @@ export const userRouter = createTRPCRouter({
         name: user.name,
       };
     }),
+  changeColorScheme: protectedProcedure
+    .input(
+      z.object({
+        colorScheme: colorSchemeParser,
+      })
+    )
+    .mutation(async ({ ctx, input }) => {
+      await ctx.prisma.user.update({
+        where: {
+          id: ctx.session?.user?.id,
+        },
+        data: {
+          settings: {
+            update: {
+              colorScheme: input.colorScheme,
+            },
+          },
+        },
+      });
+    }),
 });

src/server/api/trpc.ts

@@ -25,6 +25,7 @@ import { prisma } from '../db';
 
 interface CreateContextOptions {
   session: Session | null;
+  cookies: Partial<Record<string, string>>;
 }
 
 /**
@@ -39,6 +40,7 @@ interface CreateContextOptions {
  */
 const createInnerTRPCContext = (opts: CreateContextOptions) => ({
   session: opts.session,
+  cookies: opts.cookies,
   prisma,
 });
 
@@ -56,6 +58,7 @@ export const createTRPCContext = async (opts: CreateNextContextOptions) => {
 
   return createInnerTRPCContext({
     session,
+    cookies: req.cookies,
   });
 };
 

src/server/auth.ts

@@ -8,7 +8,7 @@ import Credentials from 'next-auth/providers/credentials';
 import { prisma } from '~/server/db';
 import EmptyNextAuthProvider from '~/utils/empty-provider';
 import { fromDate, generateSessionToken } from '~/utils/session';
-import { signInSchema } from '~/validations/user';
+import { colorSchemeParser, signInSchema } from '~/validations/user';
 
 /**
  * Module augmentation for `next-auth` types. Allows us to add custom properties to the `session`
@@ -21,6 +21,8 @@ declare module 'next-auth' {
     user: DefaultSession['user'] & {
       id: string;
       isAdmin: boolean;
+      colorScheme: 'light' | 'dark' | 'environment';
+      language: string;
       // ...other properties
       // role: UserRole;
     };
@@ -28,6 +30,8 @@ declare module 'next-auth' {
 
   interface User {
     isAdmin: boolean;
+    colorScheme: 'light' | 'dark' | 'environment';
+    language: string;
     // ...other properties
     // role: UserRole;
   }
@@ -64,9 +68,19 @@ export const constructAuthOptions = (
           where: {
             id: user.id,
           },
+          include: {
+            settings: {
+              select: {
+                colorScheme: true,
+                language: true,
+              },
+            },
+          },
         });
 
         session.user.isAdmin = userFromDatabase.isAdmin;
+        session.user.colorScheme = colorSchemeParser.parse(userFromDatabase.settings?.colorScheme);
+        session.user.language = userFromDatabase.settings?.language ?? 'en';
       }
 
       return session;
@@ -122,6 +136,14 @@ export const constructAuthOptions = (
           where: {
             name: data.name,
           },
+          include: {
+            settings: {
+              select: {
+                colorScheme: true,
+                language: true,
+              },
+            },
+          },
         });
 
         if (!user || !user.password) {
@@ -142,6 +164,8 @@ export const constructAuthOptions = (
           id: user.id,
           name: user.name,
           isAdmin: false,
+          colorScheme: colorSchemeParser.parse(user.settings?.colorScheme),
+          language: user.settings?.language ?? 'en',
         };
       },
     }),