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 00000000..aa78809d Binary files /dev/null and b/src/assets/images/kakaologin.png differ diff --git a/src/components/Common/Header.jsx b/src/components/Common/Header.jsx index 3cf7a8eb..7554de15 100644 --- a/src/components/Common/Header.jsx +++ b/src/components/Common/Header.jsx @@ -11,7 +11,7 @@ function Header() { { - 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