From 682895587c36ca4fd6e8d1089257ab2bd169b951 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E1=84=8C=E1=85=A5=E1=86=BC=E1=84=89=E1=85=A5=E1=86=BC?=
 =?UTF-8?q?=E1=84=92=E1=85=B1?= <whistle_js@naver.com>
Date: Fri, 9 Feb 2024 02:28:55 +0900
Subject: [PATCH] =?UTF-8?q?feature-059:=20=EC=86=8C=EC=85=9C=20=EB=A1=9C?=
 =?UTF-8?q?=EA=B7=B8=EC=9D=B8=20=EC=A7=84=ED=96=89=EC=A4=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.tsx                     |  3 ++-
 src/apis/user.ts                |  7 ++++++-
 src/pages/SignInPage.tsx        |  5 ++---
 src/pages/SocialAccountPage.tsx | 31 +++++++++++++++++++++++++++++++
 4 files changed, 41 insertions(+), 5 deletions(-)
 create mode 100644 src/pages/SocialAccountPage.tsx

diff --git a/src/App.tsx b/src/App.tsx
index b04ad4c..a951307 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -18,6 +18,7 @@ import SearchResult from './pages/SearchResultPage';
 import SignInPage from '@/pages/SignInPage';
 import SignUpPage from '@/pages/SignUpPage';
 import SignUpSuccessPage from '@/pages/SignUpSuccessPage';
+import SocialAccountPage from '@/pages/SocialAccountPage';
 import SummaryPage from '@/pages/SummaryPage';
 
 // Layouts
@@ -45,6 +46,7 @@ const App = () => {
               <Route path="/sign-up/success" element={<SignUpSuccessPage />} />
               <Route path="/find-email" element={<FindEmailPage />} />
               <Route path="/find-password" element={<FindPasswordPage />} />
+              <Route path="/social-account" element={<SocialAccountPage />} />
             </>
           )}
 
@@ -54,7 +56,6 @@ const App = () => {
                 <Route path="/search" element={<SearchPage />} />
                 <Route path="/search/result" element={<SearchResult />} />
                 <Route path="/profile" element={<ProfilePage />} />
-                
               </>
             )}
 
diff --git a/src/apis/user.ts b/src/apis/user.ts
index 6920ccb..d777cf4 100644
--- a/src/apis/user.ts
+++ b/src/apis/user.ts
@@ -45,6 +45,11 @@ export const checkEmailAPI = (data: CheckEmailRequest) => {
     data,
   );
 };
+
 export const joinAPI = (data: JoinRequest) => {
   return axios.post<APIResponse<JoinResponse>>(PREFIX + '/join', data);
-};
\ No newline at end of file
+};
+
+export const socialAccountAPI = (code: string) => {
+  return axios.get(`/sign-up/success?code=${code}`);
+};
diff --git a/src/pages/SignInPage.tsx b/src/pages/SignInPage.tsx
index 620470f..5af90c3 100644
--- a/src/pages/SignInPage.tsx
+++ b/src/pages/SignInPage.tsx
@@ -79,13 +79,12 @@ const SignInPage: React.FC = () => {
     }
   };
 
-  const redirect_uri = `${location.origin}/sign-up/success`; //Redirect URI
+  const redirect_uri = `${location.origin}/social-account`; //Redirect URI
   const KAKAO_KEY = '77ddf1baeb87f4a9752ed437db43cd96'; //kakao REST API KEY
   const NAVER_CLIENT_ID = 'qR4Npp1ui69SCF6nAJd2';
-  const STATE = 'flase';
   // oauth 요청 URL
   const kakaoURL = `https://kauth.kakao.com/oauth/authorize?client_id=${KAKAO_KEY}&redirect_uri=${redirect_uri}&response_type=code`;
-  const naverURL = `https://nid.naver.com/oauth2.0/authorize?response_type=code&client_id=${NAVER_CLIENT_ID}&state=${STATE}&redirect_uri=${redirect_uri}`;
+  const naverURL = `https://nid.naver.com/oauth2.0/authorize?response_type=code&client_id=${NAVER_CLIENT_ID}&redirect_uri=${redirect_uri}`;
 
   const handleKakaoLogin = () => {
     window.location.href = kakaoURL;
diff --git a/src/pages/SocialAccountPage.tsx b/src/pages/SocialAccountPage.tsx
new file mode 100644
index 0000000..480fbf6
--- /dev/null
+++ b/src/pages/SocialAccountPage.tsx
@@ -0,0 +1,31 @@
+import { useEffect } from 'react';
+import { useLocation } from 'react-router-dom';
+
+import { socialAccountAPI } from '@/apis/user';
+
+const SocialAccountPage = () => {
+  const { search } = useLocation();
+
+  const callAPI = async (code: string) => {
+    try {
+      console.log(await socialAccountAPI(code));
+    } catch (e) {
+      console.error(e);
+    }
+  };
+
+  useEffect(() => {
+    const params = new URLSearchParams(search);
+    const code = params.get('code');
+
+    if (!code) {
+      return;
+    }
+
+    callAPI(code);
+  }, [search]);
+
+  return <div />;
+};
+
+export default SocialAccountPage;