[#136] 🐛 빌드 에러 해결 (#137)

* [#99] ✨ add Pagination component

* [#99] ✨ add usePagination hook

* [#99] 💄 update chevron-right svg with currentColor attribute

* [#99] ♻️ refactor button from using label and icons props to children props

* [#99] ♻️ reflect changes in Clickable on module content component

* [#99] ✅ add Pagination stories

* [#99] ✨ add extended twMerge due to the issue with merging custom classes

* [#99] ♻️ apply extended twMerge in clickable to test if it works

* [#99] ♻️ separate resuable interface (UsePagination)

* [#99] ♻️ replace clsx with twMergeEx in Pagination component

* [#99] ♻️ add conditional className handling function in Pagination component'

* [#99] 🚚 rename UsePaginationReturn into PaginationState

* [#134] 🚚 rename api related type locations to types/api/...

* [#134] 🔧 update generate:types scripts with type saving path

* [#134] 🚚 reflect location change of type files on import lines

* [#136] 🐛 add return type to functions

* [#136] 🐛 fix any type usages by exploiting httperror interface from ky

* [#136] 🗑️ remove unused lines

Author: KingNono1030

src/app/(pages)/protected/page.tsx

@@ -1,4 +1,4 @@
-export default function protectedPage() {
+export default function protectedPage(): JSX.Element {
   return (
     <>
       <div>인증되어야만 접근 가능한 페이지</div>

src/app/(pages)/sign-up/page.tsx

@@ -1,18 +1,17 @@
 'use client'
 
-import { useRouter } from 'next/navigation'
-
+// import { useRouter } from 'next/navigation'
 import { SubmitHandler, useForm } from 'react-hook-form'
 
 import { SignUpRequest } from '@/types/api/auth.types'
 import { useSignUpMutation } from 'queries/useSignUp'
 
 export default function SignUpPage(): JSX.Element {
-  const router = useRouter()
+  // const router = useRouter()
   const {
     register,
     handleSubmit,
-    formState: { errors },
+    // formState: { errors },
   } = useForm<SignUpRequest>()
   const mutation = useSignUpMutation()
 

src/app/api/auth/refresh/route.ts

@@ -1,8 +1,8 @@
 import { NextResponse } from 'next/server'
 
-import { backendApi } from '@/services/api'
+import { HTTPError } from 'ky'
 
-const BACKEND_BASE_URL = process.env.NEXT_PUBLIC_BACKEND_BASE_URL
+import { backendApi } from '@/services/api'
 
 export const POST = async (req: Request): Promise<NextResponse> => {
   const { refreshToken } = await req.json()
@@ -12,10 +12,9 @@ export const POST = async (req: Request): Promise<NextResponse> => {
       .post('refresh', { json: { refreshToken } })
       .json<{ accessToken: string }>()
     return NextResponse.json({ success: true, accessToken })
-  } catch (error: any) {
+  } catch (error: unknown) {
     console.error('토큰 갱신 에러:', error)
-
-    if (error.response) {
+    if (error instanceof HTTPError) {
       const errorData = await error.response.json()
       return NextResponse.json(
         {
@@ -25,7 +24,6 @@ export const POST = async (req: Request): Promise<NextResponse> => {
         { status: error.response.status }
       )
     }
-
     return NextResponse.json(
       { success: false, message: 'Internal server error' },
       { status: 500 }

src/app/api/auth/sign-in/route.ts

@@ -1,18 +1,19 @@
 import { NextResponse } from 'next/server'
 
-import { SignInRequest, SignInResponseResult } from '@/types/api/auth.types'
+import { SignInRequest, SignInResponse } from '@/types/api/auth.types'
+import { HTTPError } from 'ky'
 
 import { backendApi } from '@/services/api'
 
 export const POST = async (req: Request): Promise<NextResponse> => {
-  const { email, password } = await req.json()
+  const { email, password }: SignInRequest = await req.json()
 
   try {
     const { accessToken, refreshToken } = await backendApi
       .post('v1/auth/sign-in', {
         json: { email, password },
       })
-      .json<SignInResponseResult>()
+      .json<SignInResponse>()
 
     const res = NextResponse.json({ success: true })
 
@@ -33,10 +34,10 @@ export const POST = async (req: Request): Promise<NextResponse> => {
     })
 
     return res
-  } catch (error: any) {
+  } catch (error: unknown) {
     console.error('Login failed:', error)
 
-    if (error.response) {
+    if (error instanceof HTTPError) {
       const errorData = await error.response.json()
       return NextResponse.json(
         { error: errorData.message || 'Login failed' },

src/middleware.ts

@@ -8,7 +8,9 @@ export const config = {
   // 인증이 필요한 사이트
 }
 
-export async function middleware(req: NextRequest) {
+export async function middleware(
+  req: NextRequest
+): Promise<NextResponse<unknown>> {
   console.log('Middleware is running')
   console.log('Requested URL:', req.nextUrl.pathname)
   console.log('Headers:', req.headers)
@@ -44,7 +46,7 @@ export async function middleware(req: NextRequest) {
       })
 
       return res
-    } catch (error: any) {
+    } catch (error: unknown) {
       console.error('엑세스 토큰 갱신 실패', error)
       return NextResponse.redirect(new URL('/sign-in', req.url))
     }