refact: nextauth typings and api

src/pages/api/conferences.ts

@@ -0,0 +1,10 @@
+import { type NextApiRequest, type NextApiResponse } from 'next'
+
+import { prisma } from '../../server/db/client'
+
+const events = async (req: NextApiRequest, res: NextApiResponse) => {
+  const events = await prisma.event.findMany()
+  res.status(200).json(events)
+}
+
+export default events

src/server/auth.ts

@@ -33,14 +33,13 @@ declare module 'next-auth' {
 export const authOptions: NextAuthOptions = {
   debug: true,
   callbacks: {
-    session({ session, user }) {
-      if (session.user) {
-        session.user.id = user.id
-        session.user.image = user.image
-        session.user.name = user.name
-      }
-      return session
-    },
+    session: ({ session, user }) => ({
+      ...session,
+      user: {
+        ...session.user,
+        id: user.id,
+      },
+    }),
   },
   adapter: PrismaAdapter(prisma),
   providers: [

src/server/db/client.ts

@@ -1,19 +1,16 @@
 import { PrismaClient } from '@prisma/client'
 
-import { env } from '../../env/env.mjs'
+import { env } from '@/env/env.mjs'
 
-declare global {
-  // eslint-disable-next-line no-var
-  var prisma: PrismaClient | undefined
+const globalForPrisma = globalThis as unknown as {
+  prisma: PrismaClient | undefined
 }
 
 export const prisma =
-  global.prisma ||
+  globalForPrisma.prisma ??
   new PrismaClient({
     log:
       env.NODE_ENV === 'development' ? ['query', 'error', 'warn'] : ['error'],
   })
 
-if (env.NODE_ENV !== 'production') {
-  global.prisma = prisma
-}
+if (env.NODE_ENV !== 'production') globalForPrisma.prisma = prisma

src/server/trpc/trpc.ts

@@ -1,12 +1,22 @@
 import { initTRPC, TRPCError } from '@trpc/server'
+import { type CreateNextContextOptions } from '@trpc/server/adapters/next'
+import { type Session } from 'next-auth'
 import superjson from 'superjson'
+import { ZodError } from 'zod'
 
 import { type Context } from './context'
 
 const t = initTRPC.context<Context>().create({
   transformer: superjson,
-  errorFormatter({ shape }) {
-    return shape
+  errorFormatter({ shape, error }) {
+    return {
+      ...shape,
+      data: {
+        ...shape.data,
+        zodError:
+          error.cause instanceof ZodError ? error.cause.flatten() : null,
+      },
+    }
   },
 })
 

src/view/components/base/button/Button.test.tsx

@@ -0,0 +1,27 @@
+import { fireEvent, render, screen } from '@testing-library/react'
+import { describe, expect, test, vi } from 'vitest'
+
+import { Button } from './Button'
+
+describe('<Button />', () => {
+  test('render button', () => {
+    render(<Button>Get started</Button>)
+
+    expect(screen.getByText('Get started')).toBeDefined()
+  })
+
+  test('call on click', () => {
+    const onClick = vi.fn()
+    render(<Button onClick={onClick}>Get started</Button>)
+
+    fireEvent.click(screen.getByRole('button'))
+
+    expect(onClick).toBeCalledTimes(1)
+  })
+
+  test('render as anchor', () => {
+    render(<Button as="a">Home</Button>)
+
+    expect(screen.getByText('Home').tagName).toBe('A')
+  })
+})

src/view/components/base/button/Button.tsx

@@ -9,6 +9,7 @@ type ButtonProps<T extends React.ElementType> = {
   href?: string
   colorScheme?: string
   variant?: 'outline' | 'ghost' | 'solid' | 'cutted'
+  type?: 'submit' | 'button'
 }
 
 const Button = <T extends React.ElementType = 'button'>(
@@ -24,9 +25,9 @@ const Button = <T extends React.ElementType = 'button'>(
   } = props
   const Component = as
   const classes = cx({
-    [styles.button]: true,
-    [styles['button-outline']]: variant === 'outline',
-    [styles['button-cutted']]: variant === 'cutted',
+    [styles.button as string]: true,
+    [styles['button-outline'] as string]: variant === 'outline',
+    [styles['button-cutted'] as string]: variant === 'cutted',
   })
 
   const colorSchemes = {

src/view/components/container/Container.tsx

@@ -1,9 +1,8 @@
+import React from 'react'
 import styles from './Container.module.css'
 
-const Container = ({ children }) => (
-  <div className={styles.container}>
-    {children}
-  </div>
+const Container = ({ children }: { children: React.ReactNode }) => (
+  <div className={styles.container}>{children}</div>
 )
 
 export { Container }

src/view/components/toast/Toast.tsx

@@ -38,8 +38,8 @@ const Toast = ({
   children,
 }: ToastProps) => {
   const viewportClass = cx({
-    [styles.viewport]: true,
-    [styles[`viewport--${placement}`]]: true,
+    [styles.viewport as string]: true,
+    [styles[`viewport--${placement}`] as string]: true,
   })
 
   return (

vitest.config.ts

@@ -8,6 +8,6 @@ export default defineConfig({
   plugins: [react()],
   test: {
     environment: 'happy-dom',
-    setupFiles: './src/__tests__/setup.ts'
+    setupFiles: './src/__tests__/setup.ts',
   },
 })