From aaa5e192d955b53d22042f4406dda9865e4dbd22 Mon Sep 17 00:00:00 2001 From: kanghaeun <145974230+kanghaeun@users.noreply.github.com> Date: Fri, 19 Jul 2024 15:47:55 +0900 Subject: [PATCH] =?UTF-8?q?feat:=20=EB=B8=8C=EB=9E=9C=EC=B9=98=20=EC=B5=9C?= =?UTF-8?q?=EC=8B=A0=ED=99=94=20(#80)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * style: 필터 디자인 수정 * chore: 파일 경로 업데이트 * feat: 필터 생성 모달 추가 * style: 모달 css 추가 * style: 필터추가모달 스타일 수정 * feat: 필터 생성 모달 추가 * chore: 컴포넌트 이름 변경 * feat: 그룹 필터 컴포넌트 내부에 베이직 모달 추가 * chore: 컴포넌트 이름 변경 후 파일 경로 수정 * feat: 그룹 모달 추가 * chore: 필터 색상 선택 컴포넌트 분리 * chore: 경로변경 * style: 제목입력칸 css 수정 * chore: 컴포넌트 분리에 따른 경로 변경 * feat: 그룹내 유저 추가 모달 추가 * feat: 상태값에 따른 모달 내용 변경 * feat: 상위 컴포넌트에서 받은 상태값에 따른 렌더링 * feat: 필터 색상 추가 * feat: 특정 캘린더에 따라 프롭스 다르게 보내주는 코드 수정 * stylde: 스타일드 컴포넌트에 Co-authored-by: LimSumi Co-authored-by: LimSoomi <114466348+LimSumi@users.noreply.github.com> Co-authored-by: kanghaeun <145974230+kanghaeun@users.noreply.github.com> * feat: 그룹,개인 필터 리스트 분리 기능 추가 * style: 필터 기준 margin값 변경 * style: 필터 삭제 및 편집 아이콘 마우스 호버기능 추가 * feat: 체크 모양 아이콘 변경 (#66) * feat: cors 설정 추가 * feat: 1차 스프린트 기능 개발 캘린더 기능 개발, 일정 리스트, 수정, 생성, 삭제 기능 개발 * feat: 프로필 선택 페이지 마크업 (#61) * style: 로그인 페이지 CSS 수정 * feat: 프로필 선택 페이지 마크업 * fix: 중복 파일 제거 * chore: .env테스트 * feat: .gitignore 경로 추가 * chore: .gitignore 경로 수정 * chore: 캐시 삭제 * style: 체크 모양 아이콘 svg 이미지 변경 --------- Co-authored-by: capDoYeonLee Co-authored-by: LimSumi Co-authored-by: LimSoomi <114466348+LimSumi@users.noreply.github.com> Co-authored-by: kanghaeun <145974230+kanghaeun@users.noreply.github.com> * feat: 필터 접기 기능 추가 * style: 필터 접기 up and down 아이콘 추가 * style: 필터 삭제 및 더보기 아이콘 배치 수정 * style: 모달 수정 * feat: 필터 사이드바 보완 (#67) * style: 필터 디자인 수정 * chore: 파일 경로 업데이트 * feat: 필터 생성 모달 추가 * style: 모달 css 추가 * style: 필터추가모달 스타일 수정 * feat: 필터 생성 모달 추가 * chore: 컴포넌트 이름 변경 * feat: 그룹 필터 컴포넌트 내부에 베이직 모달 추가 * chore: 컴포넌트 이름 변경 후 파일 경로 수정 * feat: 그룹 모달 추가 * chore: 필터 색상 선택 컴포넌트 분리 * chore: 경로변경 * style: 제목입력칸 css 수정 * chore: 컴포넌트 분리에 따른 경로 변경 * feat: 그룹내 유저 추가 모달 추가 * feat: 상태값에 따른 모달 내용 변경 * feat: 상위 컴포넌트에서 받은 상태값에 따른 렌더링 * feat: 필터 색상 추가 * feat: 특정 캘린더에 따라 프롭스 다르게 보내주는 코드 수정 * stylde: 스타일드 컴포넌트에 Co-authored-by: capDoYeonLee Co-authored-by: LimSumi Co-authored-by: LimSoomi <114466348+LimSumi@users.noreply.github.com> --- FE/error/src/pages/LoginPage.jsx | 42 +++++++++++++++++++++++++++----- 1 file changed, 36 insertions(+), 6 deletions(-) diff --git a/FE/error/src/pages/LoginPage.jsx b/FE/error/src/pages/LoginPage.jsx index 1f795ab9..425003bf 100644 --- a/FE/error/src/pages/LoginPage.jsx +++ b/FE/error/src/pages/LoginPage.jsx @@ -1,26 +1,56 @@ -import React, { useEffect } from "react"; +import { useEffect, useState } from "react"; import styled from "styled-components"; import { useNavigate, useSearchParams } from "react-router-dom"; +import axios from "axios"; + +// Axios 기본 설정 +axios.defaults.baseURL = import.meta.env.VITE_ERROR_API; +axios.defaults.headers.common["Content-Type"] = "application/json"; +axios.defaults.withCredentials = true; const LoginPage = () => { const navigate = useNavigate(); const [searchParams] = useSearchParams(); const code = searchParams.get("code"); + const [isLoading, setIsLoading] = useState(false); useEffect(() => { if (code) { - // code를 이용한 처리 로직 - console.log("Received code:", code); - // 여기에 code를 사용하는 추가 로직을 구현할 수 있습니다. - // 예: API 호출, 상태 업데이트 등 + handleSlackAuth(code); + localStorage.setItem("slackCode", code); + navigate("/"); } - }, [code]); + }, [code, navigate]); + + const handleSlackAuth = async (authCode) => { + setIsLoading(true); + try { + const response = await axios.post("/slack/auth", { code: authCode }); + + if (response.data.success) { + localStorage.setItem("slackToken", response.data.token); + navigate("/dashboard"); + } else { + console.error("Login failed:", response.data.message); + // 여기에 에러 처리 로직 추가 (예: 사용자에게 알림) + } + } catch (error) { + console.error("Error during Slack authentication:", error); + // 여기에 에러 처리 로직 추가 (예: 사용자에게 알림) + } finally { + setIsLoading(false); + } + }; const handleOnLogin = () => { const slackAuthUrl = `https://econovation-2018.slack.com/oauth?client_id=437291124342.7141431332214&scope=incoming-webhook&user_scope=&redirect_uri=&state=&granular_bot_scope=0&single_channel=0&install_redirect=&tracked=1&team=`; window.location.href = slackAuthUrl; }; + if (isLoading) { + return
로그인 중...
; + } + return ( <>