From 40c2021cdeb0a656fdd0ef31a25d06c47df999df Mon Sep 17 00:00:00 2001 From: HanJul_01 <129282275+Hanjuri@users.noreply.github.com> Date: Mon, 9 Sep 2024 16:19:13 +0900 Subject: [PATCH] =?UTF-8?q?=EC=B9=B4=EC=B9=B4=EC=98=A4=20=EB=A1=9C?= =?UTF-8?q?=EA=B7=B8=EC=9D=B8=20=EC=8B=9C=EB=8F=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .gitignore | 2 +- src/App.jsx | 4 ++- src/assets/images/kakaologin.png | Bin 0 -> 6081 bytes src/components/Common/Header.jsx | 13 ++++--- src/pages/ChatPage/ChatPage.js | 0 src/pages/ChatPage/ChatPage.styled.js | 2 -- src/pages/LoginPage.js | 0 src/pages/SignInPage.js | 0 src/pages/chat/ChatList.jsx | 2 ++ src/pages/chat/ChatMain.jsx | 14 ++++---- src/pages/chat/ChatRoom.jsx | 2 +- src/pages/chat/dummyChatData/dummyChatList | 39 +++++++++++++++++++++ src/pages/chat/styled/ChatMain.styled.js | 2 +- src/pages/home/HomeMain.jsx | 15 -------- src/pages/home/HomeMain_styled.js | 29 --------------- src/pages/join/KakaoLogin.jsx | 31 ++++++++++++++++ 16 files changed, 92 insertions(+), 63 deletions(-) create mode 100644 src/assets/images/kakaologin.png delete mode 100644 src/pages/ChatPage/ChatPage.js delete mode 100644 src/pages/ChatPage/ChatPage.styled.js delete mode 100644 src/pages/LoginPage.js delete mode 100644 src/pages/SignInPage.js create mode 100644 src/pages/chat/dummyChatData/dummyChatList delete mode 100644 src/pages/home/HomeMain.jsx delete mode 100644 src/pages/home/HomeMain_styled.js create mode 100644 src/pages/join/KakaoLogin.jsx diff --git a/.gitignore b/.gitignore index fe164706..2246f169 100644 --- a/.gitignore +++ b/.gitignore @@ -26,4 +26,4 @@ node_modules /dist .env -.env* \ No newline at end of file +.env* diff --git a/src/App.jsx b/src/App.jsx index b28a411e..18850629 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -13,15 +13,17 @@ import { PeopleListPage } from "./pages/PeopleListPage/PeopleListPage.jsx"; import { PeopleDetailPage } from "./pages/PeopleDetailPage/PeopleDetailPage.jsx"; import ChatPage from "./pages/chat/ChatPage"; import RTCPage from "./pages/VideoPage"; +import KakaoLogin from "./pages/join/KakaoLogin.jsx"; function App() { return ( - }> + }> }> }> } /> } /> + } /> ); diff --git a/src/assets/images/kakaologin.png b/src/assets/images/kakaologin.png new file mode 100644 index 0000000000000000000000000000000000000000..aa78809d688d9006d78fcdb3c1a4f0d82d85e168 GIT binary patch literal 6081 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 { - navigate("/"); + navigate("/list"); }} > @@ -19,14 +19,17 @@ function Header() { - 카부 게시판 - 카부 프로젝트 - 카부 편의 + 카부 게시판 + 카부 프로젝트 + 카부 편의 카부 커넥션 - + { + navigate("/login"); + }}/> ); diff --git a/src/pages/ChatPage/ChatPage.js b/src/pages/ChatPage/ChatPage.js deleted file mode 100644 index e69de29b..00000000 diff --git a/src/pages/ChatPage/ChatPage.styled.js b/src/pages/ChatPage/ChatPage.styled.js deleted file mode 100644 index eef3b3ac..00000000 --- a/src/pages/ChatPage/ChatPage.styled.js +++ /dev/null @@ -1,2 +0,0 @@ -import styled from "@emotion/styled"; - diff --git a/src/pages/LoginPage.js b/src/pages/LoginPage.js deleted file mode 100644 index e69de29b..00000000 diff --git a/src/pages/SignInPage.js b/src/pages/SignInPage.js deleted file mode 100644 index e69de29b..00000000 diff --git a/src/pages/chat/ChatList.jsx b/src/pages/chat/ChatList.jsx index 6f41d68c..4bb148e4 100644 --- a/src/pages/chat/ChatList.jsx +++ b/src/pages/chat/ChatList.jsx @@ -1,11 +1,13 @@ import React from "react"; import * as styles from "./styled/ChatList.styled"; import smile from "../../assets/images/smiles.png"; + const ChatList = (props) => { const truncatedContent = props.content.length > 20 ? `${props.content.slice(0, 15)}...` : props.content; + console.log(props); return ( diff --git a/src/pages/chat/ChatMain.jsx b/src/pages/chat/ChatMain.jsx index dec43480..50680627 100644 --- a/src/pages/chat/ChatMain.jsx +++ b/src/pages/chat/ChatMain.jsx @@ -4,17 +4,15 @@ import * as styles from "./styled/ChatMain.styled"; import ChatRoom from "./ChatRoom"; import ChatList from "./ChatList"; import {getChatList} from "../../api/ChatListCall.js"; +import dummyChatList from "./dummyChatData/dummyChatList"; + function ChatMain() { const [chatList, setChatList] = useState([]) const [selectedChatRoom, setSelectedChatRoom] = useState(null); const nowUser = 'pjh2'; - const sampleList = [ - {chatRoomName:'홍창기', chatRoomContent:"홍창기 안타 안타 날려 홍창기 홍창기 안타 날려 버려라", chatRoomUUID:1}, - {chatRoomName:'문보경', chatRoomContent:"동해물과 백두산이 마르고 닳도록 하느님이 보우하사 우리나라 만세",chatRoomUUID:2}, - {chatRoomName:'박동원', chatRoomContent:"시원하게 날려버려 무적엘지 박동원 무적엘지의 승리를 위해 날려버려라", chatRoomUUID:3}, - ] + useEffect(() => { const fetchChatList = async () => { @@ -42,7 +40,7 @@ function ChatMain() { - {Array.isArray(chatList)&&chatList.map((eachChat, id) => ( + {Array.isArray(dummyChatList)&&dummyChatList.map((eachChat, id) => ( { @@ -51,8 +49,8 @@ function ChatMain() { diff --git a/src/pages/chat/ChatRoom.jsx b/src/pages/chat/ChatRoom.jsx index 4c5f6fc4..0152630f 100644 --- a/src/pages/chat/ChatRoom.jsx +++ b/src/pages/chat/ChatRoom.jsx @@ -12,7 +12,7 @@ const ChatRoom = (props) => { const [message, setMessage] = useState(""); const [stompClient, setStompClient] = useState(null); - const currentUsername = "pjh2"; // 현재 사용자를 pjh2로 가정 + const currentUsername = '홍창기'; // 현재 사용자를 pjh2로 가정 const roomId = props.uuid; diff --git a/src/pages/chat/dummyChatData/dummyChatList b/src/pages/chat/dummyChatData/dummyChatList new file mode 100644 index 00000000..0ff70d20 --- /dev/null +++ b/src/pages/chat/dummyChatData/dummyChatList @@ -0,0 +1,39 @@ +const dummyChatList = [ + { + chatRoomUUID: 1, + chatRoomName: "문보경", + chatContent: "잘지냈어?? 그동안 뭐하고 지냄?", + time: "10:30 AM", + alramcount: 2, + }, + { + chatRoomUUID: 2, + chatRoomName: "박해민", + chatContent: "우리 내일 만나는거 맞나?", + time: "11:15 AM", + alramcount: 0, + }, + { + chatRoomUUID: 3, + chatRoomName: "이영빈", + chatContent: "넵 항상 감사드립니다...!", + time: "12:45 PM", + alramcount: 1, + }, + { + chatRoomUUID: 4, + chatRoomName: "김현수", + chatContent: "너 파일 나한테 보냈니??", + time: "1:20 PM", + alramcount: 3, + }, + { + chatRoomUUID: 5, + chatRoomName: "오지환", + chatContent: "그래 곧 만나자~! 오늘 너무 즐거웠어.", + time: "2:10 PM", + alramcount: 0, + }, +]; + +export default dummyChatList; \ No newline at end of file diff --git a/src/pages/chat/styled/ChatMain.styled.js b/src/pages/chat/styled/ChatMain.styled.js index be91ccb8..0583283e 100644 --- a/src/pages/chat/styled/ChatMain.styled.js +++ b/src/pages/chat/styled/ChatMain.styled.js @@ -5,7 +5,7 @@ import { css } from "@emotion/react"; export const TotalWrapper = styled.div` display: flex; flex-direction: column; - width: 100%; + width: 85%; height: 100vh; align-items: center; justify-content: center; diff --git a/src/pages/home/HomeMain.jsx b/src/pages/home/HomeMain.jsx deleted file mode 100644 index ad632550..00000000 --- a/src/pages/home/HomeMain.jsx +++ /dev/null @@ -1,15 +0,0 @@ -import React from 'react'; -import * as main from './HomeMain_styled'; -import Header from '../../components/Header'; - -function HomeMain() { - return ( - - - - - ) - } - - export default HomeMain; - \ No newline at end of file diff --git a/src/pages/home/HomeMain_styled.js b/src/pages/home/HomeMain_styled.js deleted file mode 100644 index bb3d5296..00000000 --- a/src/pages/home/HomeMain_styled.js +++ /dev/null @@ -1,29 +0,0 @@ -/** @jsxImportSource @emotion/react */ -import styled from '@emotion/styled'; - -export const Container= styled.div` - display: flex; - flex-direction: column; - width: 100%; - height: 100vh; - align-items: center; - justify-content: center; - background-color: blue; - -`; - -export const Header = styled.header` - width: 100%; - color: white; - text-align: center; - padding: 10px; -`; - -export const Main = styled.main` - flex: 1; - display: flex; - align-items: center; - justify-content: center; - width: 100%; - overflow-y: auto; -`; diff --git a/src/pages/join/KakaoLogin.jsx b/src/pages/join/KakaoLogin.jsx new file mode 100644 index 00000000..80ae3946 --- /dev/null +++ b/src/pages/join/KakaoLogin.jsx @@ -0,0 +1,31 @@ +import React from "react"; +import { useNavigate } from "react-router-dom"; +import Layout from "../../components/Common/Layout.jsx"; +import MiniLayout from "../../components/Common/miniLayout.jsx"; +import kakaologin from "../../assets/images/kakaologin.png"; + +function KakaoLogin() { + const CLIENT_ID = import.meta.env.REACT_APP_KAKAO_CLIENT_ID; // 환경변수에 CLIENT_ID 설정 + const REDIRECT_URL = import.meta.env.REACT_APP_KAKAO_REDIRECT_URL; // 환경변수에 REDIRECT_URL 설정 + + const handleKakaoLogin = () => { + + const kakaoLoginUrl = `https://api.kaboo.site:8081/oauth2/authorization/kakao?client_id=${CLIENT_ID}&redirect_uri=${REDIRECT_URL}&response_type=code`; + window.location.href = kakaoLoginUrl; // URL로 리디렉션 + }; + + return ( + + + + + + ); +} + +export default KakaoLogin; \ No newline at end of file