[Add] 브랜치 병합

- 로그인/로그아웃 관련 기능구현으로 인한 브랜치 병합 Issues #17
codestates-seb · Sep 8, 2023 · 0c7bfaf · 0c7bfaf
2 parents 775ce0f + a80ecf2
commit 0c7bfaf
Show file tree

Hide file tree

Showing 6 changed files with 36 additions and 23 deletions.
diff --git a/client/src/components/Headers/LoginHeader.tsx b/client/src/components/Headers/LoginHeader.tsx
@@ -30,12 +30,12 @@ const LoginHeader: React.FC<LoginHeaderProps> = ({ onLogoutClick }) => {
       <SearchBar value={searchValue} onChange={handleSearchChange} />
       <UserActions>
         <NotificationButton> 
-          <img src={AlarmImage} alt="Notification" />  // 알림 이미지
+          <img src={AlarmImage} alt="Notification" />
         </NotificationButton>
         <ProfileButton>
-          <ProfileImage src={SampleProfile} />  // 프로필 이미지
+          <ProfileImage src={SampleProfile} />
         </ProfileButton>
-        <LogoutButton onClick={onLogoutClick}>{logoutText}</LogoutButton>  // 로그아웃 버튼
+        <LogoutButton onClick={onLogoutClick}>{logoutText}</LogoutButton> 
       </UserActions>
     </HeaderContainer>
   );

diff --git a/client/src/components/Logins/EmailLogin.tsx b/client/src/components/Logins/EmailLogin.tsx
@@ -31,14 +31,19 @@ const EmailLoginModal: React.FC<EmailLoginModalProps> = ({ onClose, onLogin }) =
   const handleLoginClick = async () => {
     try {
       // 백엔드에 로그인 요청
-      const response = await axios.post("http://ec2-13-125-246-160.ap-northeast-2.compute.amazonaws.com:8080/login", {
+      const response = await axios.post("http://ec2-13-125-246-160.ap-northeast-2.compute.amazonaws.com:8080/members/login", {
         email,
         password,
       });
       if (response.status === 200) {
-        // 성공적으로 로그인된 경우, 토큰을 로컬 스토리지에 저장
-        const authToken = response.data.authorization;
-        localStorage.setItem('authToken', authToken);
+        const authToken = response.headers['authorization'];
+        const accessToken = response.headers['accessToken'];
+        const refreshToken = response.headers['refreshToken'];
+
+        // 토큰들을 로컬 스토리지에 저장
+        if(authToken) localStorage.setItem('authToken', authToken);
+        if(accessToken) localStorage.setItem('accessToken', accessToken);
+        if(refreshToken) localStorage.setItem('refreshToken', refreshToken);
         onLogin();
         onClose();
       } else {

diff --git a/client/src/components/Logins/OAuthLogin.tsx b/client/src/components/Logins/OAuthLogin.tsx
@@ -19,6 +19,14 @@ const OAuthLoginModal: React.FC<LoginModalProps> = ({ onClose, onEmailLoginClick
       try {
           const response = await axios.post('/oauth2/authorization/google');
           if (response.status === 200) {
+            const authToken = response.headers['authorization'];
+            const accessToken = response.headers['accessToken'];
+            const refreshToken = response.headers['refreshToken'];
+
+            // 토큰들을 로컬 스토리지에 저장
+            if(authToken) localStorage.setItem('authToken', authToken);
+            if(accessToken) localStorage.setItem('accessToken', accessToken);
+            if(refreshToken) localStorage.setItem('refreshToken', refreshToken);
               console.log("Successfully logged in with Google!");
               onClose();
           } else {
@@ -34,6 +42,14 @@ const OAuthLoginModal: React.FC<LoginModalProps> = ({ onClose, onEmailLoginClick
       try {
           const response = await axios.post('/oauth2/authorization/kakao');
           if (response.status === 200) {
+            const authToken = response.headers['authorization'];
+            const accessToken = response.headers['accessToken'];
+            const refreshToken = response.headers['refreshToken'];
+
+            // 토큰들을 로컬 스토리지에 저장
+            if(authToken) localStorage.setItem('authToken', authToken);
+            if(accessToken) localStorage.setItem('accessToken', accessToken);
+            if(refreshToken) localStorage.setItem('refreshToken', refreshToken);
               console.log("Successfully logged in with Kakao!");
               onClose();
           } else {

diff --git a/client/src/components/Signups/Password.tsx b/client/src/components/Signups/Password.tsx
@@ -60,7 +60,7 @@ const PasswordSettingModal: React.FC<PasswordSettingModalProps> = ({ onClose, on
                 confirmPassword,
             });
 
-            if (response.status === 200) {
+            if (response.status === 201) {
                 console.log('Data sent successfully');
                 onClose();
                 onNext();

diff --git a/client/src/hooks/useGetStockData.ts b/client/src/hooks/useGetStockData.ts
@@ -7,25 +7,21 @@ const useGetStockData = (companyId: number) => {
 
   // 시간대 (timeZone) 별로 queryKey를 다르게 설정해서, 서버 데이터가 동일할 때는 캐싱된 데이터 활용하고 서버 데이터가 갱신됐을 때는 새롭게 받아옴 (서버 데이터 30분마다 갱신)
   const currentTime = new Date();
-  const [month, day, hour, minute] = [currentTime.getMonth(), currentTime.getDate(), currentTime.getHours(), currentTime.getMinutes()];
+  const [month, day, hour, minute] = [currentTime.getMonth(), currentTime.getDay(), currentTime.getHours, currentTime.getMinutes()];
   const timeZone = minute === 0 || minute === 30 ? "30 or 60" : 0 < minute && minute < 30 ? "1~29" : "31~59";
   const queryKey = `${month}월 ${day}일 ${hour}시 ${timeZone}`;
 
   // 현재 시각이 30분, 정각이 아닌 경우 남은 시간 계산하여 checkTime 함수 다시 실행
   useEffect(() => {
     if (minute === 0 || minute === 30) {
       setAutoRefetch(true);
-    }
-
-    if (0 < minute && minute < 30) {
+    } else if (0 < minute && minute < 30) {
       const delayTime = (30 - minute) * 60000;
       setTimeout(() => {
         refetch();
         setAutoRefetch(true);
       }, delayTime);
-    }
-
-    if (30 < minute && minute < 60) {
+    } else if (30 < minute && minute < 60) {
       const delayTime = (60 - minute) * 60000;
       setTimeout(() => {
         refetch();
@@ -36,7 +32,7 @@ const useGetStockData = (companyId: number) => {
 
   const { data, isLoading, error, refetch } = useQuery([`chartData${companyId} ${queryKey}`], () => getChartData(companyId), {
     enabled: true,
-    refetchInterval: autoRefetch && 60000 * 10, // 정각 혹은 30분에 맞춰서 10분 마다 데이터 리패칭
+    refetchInterval: autoRefetch ? 60000 * 10 : false, // 정각 혹은 30분에 맞춰서 10분 마다 데이터 리패칭
     onSuccess: (cachedData) => {
       console.log(new Date());
       console.log("Data successfully loaded:", cachedData);

diff --git a/client/src/hooks/useGetStockInfo.ts b/client/src/hooks/useGetStockInfo.ts
@@ -15,17 +15,13 @@ const useGetStockInfo = (companyId: number) => {
   useEffect(() => {
     if (minute === 0 || minute === 30) {
       setAutoRefetch(true);
-    }
-
-    if (0 < minute && minute < 30) {
+    } else if (0 < minute && minute < 30) {
       const delayTime = (30 - minute) * 60000;
       setTimeout(() => {
         refetch();
         setAutoRefetch(true);
       }, delayTime);
-    }
-
-    if (30 < minute && minute < 60) {
+    } else if (30 < minute && minute < 60) {
       const delayTime = (60 - minute) * 60000;
       setTimeout(() => {
         refetch();
@@ -36,7 +32,7 @@ const useGetStockInfo = (companyId: number) => {
 
   const { data, isLoading, error, refetch } = useQuery([`stockInfo${companyId} ${queryKey}}`], () => getStockInfo(companyId), {
     enabled: true,
-    refetchInterval: autoRefetch && 60000 * 10, // 정각 혹은 30분에 맞춰서 10분 마다 데이터 리패칭
+    refetchInterval: autoRefetch ? 60000 * 10 : false, // 정각 혹은 30분에 맞춰서 10분 마다 데이터 리패칭
     onSuccess: (cachedData) => {
       console.log(new Date());
       console.log("Data successfully loaded:", cachedData);