Merge pull request #336 from JEOLLOGA/feat/#334/test-api

[FEAT] 테스트 기능 구현

Author: bykbyk0401

package.json

@@ -22,6 +22,7 @@
     "@vanilla-extract/vite-plugin": "^4.0.19",
     "axios": "^1.7.9",
     "cookies-next": "^6.0.0",
+    "html-to-image": "^1.11.13",
     "jotai": "^2.11.1",
     "motion": "^12.10.1",
     "next": "^15.2.4",

public/assets/images/test/test_banner_bg.png

@@ -1,7 +1,7 @@
 import instance from '@apis/instance';
 
 export const getKakaoLogin = async (code: string) => {
-  const res = await instance.get(`v2/auth/login?code=${encodeURIComponent(code)}`);
+  const res = await instance.get(`v2/auth/login/new?code=${encodeURIComponent(code)}`);
 
   return res;
 };

public/assets/images/test/test_result_loading_bg.png

@@ -1,17 +1,19 @@
 import { getKakaoLogin, postLogout, postWithdraw } from '@apis/auth/axios';
+import { useSaveTestResult } from '@apis/test';
+import { TestType } from '@constants/test';
 import { useMutation } from '@tanstack/react-query';
 import { deleteCookie, setCookie } from 'cookies-next';
 import { useRouter } from 'next/navigation';
 
 export const useGetKakaoLogin = () => {
   const router = useRouter();
+  const saveTestResultMutation = useSaveTestResult();
 
   return useMutation({
     mutationFn: ({ code }: { code: string }) => getKakaoLogin(code),
-    onSuccess: (response) => {
+    onSuccess: async (response) => {
       const userNickname = response.data.data.nickname;
-      const userId = response.data.data.userId;
-      const userInfo = response.data.data.userInfo;
+      const hasType = response.data.data.hasType;
 
       setCookie('userNickname', userNickname, {
         httpOnly: false,
@@ -21,13 +23,25 @@ export const useGetKakaoLogin = () => {
         maxAge: 1209600, // 14일
       });
 
-      localStorage.setItem('userId', userId);
+      setCookie('hasType', hasType, {
+        httpOnly: false,
+        secure: process.env.NODE_ENV === 'production',
+        sameSite: 'lax',
+        path: '/',
+        maxAge: 1209600, // 14일
+      });
 
-      if (!userInfo) {
-        router.push('/onboarding');
-      } else {
-        router.push('/');
+      // 비회원 상태에서 테스트 완료 후 로그인한 경우 테스트 결과 저장
+      const type = sessionStorage.getItem('type') as TestType;
+
+      if (type) {
+        try {
+          await saveTestResultMutation.mutateAsync(type);
+        } finally {
+          sessionStorage.removeItem('type');
+        }
       }
+      router.push('/');
     },
     onError: (error) => {
       console.error(error);
@@ -43,6 +57,7 @@ export const usePostLogout = () => {
     onSuccess: () => {
       localStorage.clear();
       deleteCookie('userNickname');
+      deleteCookie('hasType');
 
       router.push('/');
     },
@@ -61,6 +76,7 @@ export const usePostWithdraw = () => {
     onSuccess: () => {
       localStorage.clear();
       deleteCookie('userNickname');
+      deleteCookie('hasType');
       router.push('/');
       window.location.reload();
     },

public/test_og_img.png

@@ -68,6 +68,7 @@ instance.interceptors.response.use(
 
         localStorage.clear();
         deleteCookie('userNickname');
+        deleteCookie('hasType');
         console.error(error);
         alert(MESSAGES.EXPIRED);
         window.location.replace('/');

src/apis/auth/axios.ts

@@ -0,0 +1,19 @@
+import instance from '@apis/instance';
+import { ApiResponse } from '@apis/response';
+import { TestResponse } from '@apis/test/type';
+
+export const postJbtiTest = async (result: string): Promise<TestResponse> => {
+  const response = await instance.post<ApiResponse<TestResponse>>(`/v2/api/templestay/type`, {
+    result,
+  });
+
+  return response.data.data;
+};
+
+export const postTestResult = async (type: string) => {
+  const response = await instance.post('/v2/user/type', {
+    type,
+  });
+
+  return response;
+};

src/apis/auth/index.ts

@@ -0,0 +1,51 @@
+import { postJbtiTest, postTestResult } from '@apis/test/axios';
+import { TestType } from '@constants/test';
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import { setCookie } from 'cookies-next';
+import { useRouter } from 'next/navigation';
+
+export const usePostTestResult = () => {
+  const router = useRouter();
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (result: string) => {
+      const [data] = await Promise.all([
+        postJbtiTest(result),
+        new Promise((resolve) => setTimeout(resolve, 2500)),
+      ]);
+
+      return data;
+    },
+    onSuccess: (data) => {
+      setCookie('hasType', true, {
+        httpOnly: false,
+        secure: process.env.NODE_ENV === 'production',
+        sameSite: 'lax',
+        path: '/',
+        maxAge: 1209600,
+      });
+
+      queryClient.setQueryData(['test-result'], data);
+      router.push(`/test/result`);
+    },
+    onError: (error) => {
+      console.error(error);
+    },
+  });
+};
+
+export const useSaveTestResult = () => {
+  return useMutation({
+    mutationFn: (type: TestType) => postTestResult(type),
+    onSuccess: () => {
+      setCookie('hasType', true, {
+        httpOnly: false,
+        secure: process.env.NODE_ENV === 'production',
+        sameSite: 'lax',
+        path: '/',
+        maxAge: 1209600,
+      });
+    },
+  });
+};

src/apis/instance.ts

@@ -0,0 +1,10 @@
+import { TestType } from '@constants/test';
+
+export interface TestResponse {
+  code: TestType;
+  tagline: string;
+  description: string;
+  requirement: string;
+  bestMate: string;
+  worstMate: string;
+}