From c76526bf9bc9d59d3a8d6aaeb28648ee2a84c47c Mon Sep 17 00:00:00 2001
From: yoosangwook <swyoo@interplug.co.kr>
Date: Thu, 22 May 2025 16:57:54 +0900
Subject: [PATCH] chore: Update package.json scripts and enhance middleware
 session handling

- Added local build and start scripts to package.json for improved local development.
- Commented out login redirection logic in middleware for future implementation.
- Introduced a new checkbox in the sample page for enhanced UI functionality.
- Refactored useAxios to improve request and response handling with better modularization.
- Updated checkbox styles in SCSS for improved visual consistency.
---
 package.json                      |  2 +
 src/app/sample/page.tsx           |  4 ++
 src/hooks/useAxios.ts             | 69 +++++++++++++++++++++----------
 src/middleware.ts                 |  6 +--
 src/styles/base/_check-radio.scss | 17 ++++++++
 5 files changed, 73 insertions(+), 25 deletions(-)

diff --git a/package.json b/package.json
index d3be4d7..53ed0e8 100644
--- a/package.json
+++ b/package.json
@@ -6,8 +6,10 @@
     "dev": "env-cmd -f .env.localhost next dev --turbopack",
     "build": "next build",
     "start": "next start",
+    "build:local": "env-cmd -f .env.localhost next build",
     "build:dev": "env-cmd -f .env.development next build",
     "build:prod": "env-cmd -f .env.production next build",
+    "start:local": "env-cmd -f .env.localhost next start",
     "start:dev": "env-cmd -f .env.development next start",
     "start:prod": "env-cmd -f .env.production next start",
     "lint": "next lint"
diff --git a/src/app/sample/page.tsx b/src/app/sample/page.tsx
index c4c30d3..1ae671d 100644
--- a/src/app/sample/page.tsx
+++ b/src/app/sample/page.tsx
@@ -113,6 +113,10 @@ export default function page() {
               <input type="checkbox" id="ch06" disabled />
               <label htmlFor="ch06">Check Box</label>
             </div>
+            <div className="check-form-box space">
+              <input type="checkbox" id="ch07" defaultChecked />
+              <label htmlFor="ch07">Check Box</label>
+            </div>
           </div>
         </div>
         <div className="design-box">
diff --git a/src/hooks/useAxios.ts b/src/hooks/useAxios.ts
index 49c5ec0..3fc9e4e 100644
--- a/src/hooks/useAxios.ts
+++ b/src/hooks/useAxios.ts
@@ -1,40 +1,65 @@
-import axios from 'axios'
+import axios, { AxiosResponse, InternalAxiosRequestConfig } from 'axios'
 import Config from '@/config/config.export'
 import { useSpinnerStore } from '@/store/spinnerStore'
 
-export const useAxios = () => {
-  const { setIsShow } = useSpinnerStore()
+export function useAxios() {
+  // const { setIsShow } = useSpinnerStore()
+
+  const requestHandler = (config: InternalAxiosRequestConfig) => {
+    // setIsShow(true)
+    return config
+  }
+
+  const responseHandler = (response: AxiosResponse) => {
+    // setIsShow(false)
+    response.data = transferResponse(response)
+    return response
+  }
+
+  const errorHandler = (error: any) => {
+    // setIsShow(false)
+    return Promise.reject(error)
+  }
+
+  const createAxiosInstance = (url: string | null | undefined) => {
+    const baseURL = url || Config().baseUrl
+    return axios.create({
+      baseURL,
+      headers: {
+        Accept: 'application/json',
+      },
+    })
+  }
 
   const axiosInstance = (url: string | null | undefined) => {
-    const baseURL = url || Config().baseUrl
     const instance = axios.create({
-      baseURL,
+      baseURL: url || Config().baseUrl,
       headers: {
         Accept: 'application/json',
       },
     })
 
     instance.interceptors.request.use(
-      (config) => {
-        // console.log('🚀 ~ config:', config)
-        setIsShow(true)
-        return config
-      },
-      (error) => {
-        return Promise.reject(error)
-      },
+      // (config) => {
+      //   return config
+      // },
+      // (error) => {
+      //   return Promise.reject(error)
+      // },
+      (config) => requestHandler(config),
+      (error) => errorHandler(error),
     )
 
     instance.interceptors.response.use(
-      (response) => {
-        response.data = transferResponse(response)
-        setIsShow(false)
-        return response
-      },
-      (error) => {
-        // 에러 처리 로직
-        return Promise.reject(error)
-      },
+      // (response) => {
+      //   response.data = transferResponse(response)
+      //   return response
+      // },
+      // (error) => {
+      //   return Promise.reject(error)
+      // },
+      (response) => responseHandler(response),
+      (error) => errorHandler(error),
     )
 
     return instance
diff --git a/src/middleware.ts b/src/middleware.ts
index 115fd8a..1bcfd96 100644
--- a/src/middleware.ts
+++ b/src/middleware.ts
@@ -10,9 +10,9 @@ export async function middleware(request: NextRequest) {
   const session = await getIronSession<SessionData>(cookieStore, sessionOptions)
 
   // todo: 로그인 기능 추가 시 주석 해제
-  if (!session.isLoggedIn) {
-    return NextResponse.redirect(new URL('/login', request.url))
-  }
+  // if (!session.isLoggedIn) {
+  //   return NextResponse.redirect(new URL('/login', request.url))
+  // }
 
   return NextResponse.next()
 }
diff --git a/src/styles/base/_check-radio.scss b/src/styles/base/_check-radio.scss
index f6ff573..fea97ff 100644
--- a/src/styles/base/_check-radio.scss
+++ b/src/styles/base/_check-radio.scss
@@ -98,6 +98,23 @@
       color: #8595A7;
     }
   }
+  &.space{
+    label{
+      &::after{
+        top: 8px;
+        left: 0px;
+        width: 10px;
+        height: 2px;
+        border: none;
+        background-color: transparent;
+        transform: translate(50%, 50%);
+        -ms-transform: none;
+      }
+    }
+    input[type="checkbox"]:checked + label::after{
+      background-color: #fff;
+    }
+  }
 }
 
 // radio box