Merge pull request #131 from Gamegoo-repo/fix/#128

[Fix] 더보기 버튼, 게시판 오류 수정
Gamegoo-repo · Oct 15, 2024 · bd7f935 · bd7f935
2 parents 81811f4 + 4caa3cd
commit bd7f935
Show file tree

Hide file tree

Showing 9 changed files with 111 additions and 112 deletions.
diff --git a/src/app/board/page.tsx b/src/app/board/page.tsx
@@ -280,10 +280,10 @@ const BoardPage = () => {
           icon="exclamation"
           width={68}
           height={58}
-          content="로그아웃 되었습니다. 다시 로그인 해주세요."
+          content="로그인이 필요한 서비스입니다."
           alt="로그인 필요"
-          onClose={() => router.push("/login")}
-          buttonText="로그인하기"
+          onClose={() => setShowAlert(false)}
+          buttonText="확인"
         />
       )}
       {isPostingModal && (

diff --git a/src/app/login/page.tsx b/src/app/login/page.tsx
@@ -13,6 +13,7 @@ import {
   clearUserProfile,
   setUserName,
   setUserProfileImg,
+  setUserId
 } from "@/redux/slices/userSlice";
 import { connectSocket, socket } from "@/socket";
 import { theme } from "@/styles/theme";
@@ -22,6 +23,7 @@ import {
   setName,
   setProfileImg,
   setToken,
+  setId
 } from "@/utils/storage";
 import { AxiosError } from "axios";
 import Image from "next/image";
@@ -81,8 +83,10 @@ const Login = () => {
 
       dispatch(setUserName(response.result.name));
       dispatch(setUserProfileImg(response.result.profileImage));
+      dispatch(setUserId(response.result.id));
       setName(response.result.name, autoLogin);
       setProfileImg(response.result.profileImage, autoLogin);
+      setId(response.result.id, autoLogin);
 
       router.push("/");
 

diff --git a/src/components/chat/ChatLayout.tsx b/src/components/chat/ChatLayout.tsx
@@ -55,6 +55,8 @@ const ChatLayout = (props: ChatLayoutProps) => {
     const isChatRoomOpen = useSelector((state: RootState) => state.chat.isChatRoomOpen);
     const isChatUuid = useSelector((state: RootState) => state.chat.isChatRoomUuid);
     const isModalType = useSelector((state: RootState) => state.modal.modalType);
+    const isUser = useSelector((state: RootState) => state.user);
+
 
     /* 채팅창이 닫힐 때 store에서 채팅창 닫힘 처리 */
     useEffect(() => {
@@ -431,13 +433,13 @@ const ChatLayout = (props: ChatLayoutProps) => {
         : [
             { text: '채팅방 나가기', onClick: (e: React.MouseEvent) => handleModalChange(e, 'leave') },
             // 친구 추가 조건: 친구가 아니고, 친구 요청도 하지 않은 경우
-            !chatEnterData?.friend && !chatEnterData?.friendRequestMemberId &&
+            !chatEnterData?.friend && chatEnterData?.friendRequestMemberId !== isUser.id &&
             { text: '친구 추가', onClick: handleFriendAdd },
             // 친구 취소 조건: 친구인 경우
             chatEnterData?.friend &&
             { text: '친구 삭제', onClick: handleFriendDelete },
             // 친구 요청 취소 조건: 친구가 아니고, 친구 요청을 이미 한 경우
-            !chatEnterData?.friend && chatEnterData?.friendRequestMemberId &&
+            !chatEnterData?.friend && chatEnterData?.friendRequestMemberId === isUser.id &&
             { text: '친구 요청 취소', onClick: handleCancelFriendReq },
 
             { text: '차단하기', onClick: (e: React.MouseEvent) => handleModalChange(e, 'block') },

diff --git a/src/components/chat/ChatRoomList.tsx b/src/components/chat/ChatRoomList.tsx
@@ -26,8 +26,8 @@ const ChatRoomList = (props: ChatRoomListProps) => {
 
     const dispatch = useDispatch();
 
-    const isUser = useSelector((state: RootState) => state.user);
     const isModalType = useSelector((state: RootState) => state.modal.modalType);
+    const isUser = useSelector((state: RootState) => state.user);
 
     const [chatrooms, setChatrooms] = useState<ChatroomList[]>([]);
     const [reloadChatrooms, setReloadChatrooms] = useState(false);
@@ -114,7 +114,7 @@ const ChatRoomList = (props: ChatRoomListProps) => {
         if (room.friend) {
             // 친구 삭제
             handleFriendDelete(e, room.targetMemberId);
-        } else if (!room.friend && room.friendRequestMemberId) {
+        } else if (!room.friend && room.friendRequestMemberId === isUser.id) {
             //친구 요청 취소
             handleCancelFriendReq(e, room.targetMemberId);
         } else if (!room.friend) {
@@ -137,9 +137,9 @@ const ChatRoomList = (props: ChatRoomListProps) => {
 
         if (room.friend) {
             friendText = '친구 삭제';
-        } else if (!room.friend && room.friendRequestMemberId) {
+        } else if (!room.friend && room.friendRequestMemberId === isUser.id) {
             friendText = '친구 요청 취소';
-        } else if (!room.friend && !room.friendRequestMemberId) {
+        } else if (!room.friend) {
             friendText = '친구 추가';
         }
 
@@ -228,54 +228,4 @@ const NoData = styled.p`
   margin-top:50%;
 `;
 
-const CheckContent = styled.div`
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  gap: 20px;
-`;
-
-const ModalSubmitBtn = styled.div`
-  margin-top:52px;
-`;
-
-const ReportLabel = styled.p`
-  color: ${theme.colors.gray600};
-  ${(props) => props.theme.fonts.semiBold18};
-  margin-bottom: 12px;
-`;
-
-const ReportContent = styled.div`
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  gap: 20px;
-`;
-
-const ReportReasonContent = styled(ReportContent)`
-  margin-bottom: 38px;
-`;
-
-const ReportButton = styled.div`
-  margin-top:21px;
-`;
-
-const Text = styled.div`
-  text-align: center;
-  color: ${theme.colors.gray600};
-  ${(props) => props.theme.fonts.regular20};
-  margin: 28px 0;
-`;
-
-const SmallText = styled.div`
-  text-align: center;
-  color: ${theme.colors.gray200};
-  ${(props) => props.theme.fonts.regular14};
-  margin-top: 13px;
-`;
-
-const MsgConfirm = styled(Text)`
-  ${(props) => props.theme.fonts.regular25};
-  margin: 80px 0;
-`;
 
diff --git a/src/components/chat/MessageHeader.tsx b/src/components/chat/MessageHeader.tsx
@@ -9,7 +9,6 @@ import { getProfileBgColor } from "@/utils/profile";
 import { useRouter } from "next/navigation";
 import { RootState } from "@/redux/store";
 import { MoreBoxMenuItems } from "@/interface/moreBox";
-import { useEffect } from "react";
 
 interface MessageHeaderProps {
   isMoreBoxOpen: boolean;

diff --git a/src/components/common/Header.tsx b/src/components/common/Header.tsx
@@ -12,10 +12,12 @@ import {
   getAccessToken,
   getName,
   getProfileImg,
+  getUserId,
 } from "@/utils/storage";
 import { getProfileBgColor } from "@/utils/profile";
 import {
   clearUserProfile,
+  setUserId,
   setUserName,
   setUserProfileImg,
 } from "@/redux/slices/userSlice";
@@ -48,6 +50,7 @@ const Header = () => {
 
   const storedName = getName();
   const storedProfileImg = Number(getProfileImg());
+  const storedUserId = Number(getUserId());
 
   const isFirstRender = useRef(true);
 
@@ -58,6 +61,9 @@ const Header = () => {
     if (storedProfileImg) {
       dispatch(setUserProfileImg(storedProfileImg));
     }
+    if (storedUserId) {
+      dispatch(setUserId(storedUserId));
+    }
   }, []);
 
   /* 알림창 열고 닫는 함수 */
@@ -105,7 +111,7 @@ const Header = () => {
     }
   }, [storedName]);
 
-  useEffect(() => {}, [notiCount]);
+  useEffect(() => { }, [notiCount]);
 
   return (
     <Head>

diff --git a/src/components/createBoard/PostBoard.tsx b/src/components/createBoard/PostBoard.tsx
@@ -25,6 +25,7 @@ import { useRouter } from "next/navigation";
 import { getProfile } from "@/api/user";
 import { setUserProfile } from "@/redux/slices/userSlice";
 import { theme } from "@/styles/theme";
+import { setClosePostingModal } from "@/redux/slices/modalSlice";
 
 interface PostBoardProps {
   onClose: () => void;
@@ -81,19 +82,25 @@ const PostBoard = (props: PostBoardProps) => {
   const [isFocused, setIsFocused] = useState<boolean>(false);
   const [showAlert, setShowAlert] = useState(false);
 
-  useEffect(() => {
-    const fetchProfile = async () => {
-      try {
-        const response = await getProfile();
-        dispatch(setUserProfile(response));
-      } catch (error) {
-        console.error(error);
-      }
-    };
+  const fetchProfile = async () => {
+    try {
+      const response = await getProfile();
+      dispatch(setUserProfile(response));
+    } catch (error) {
+      console.error(error);
+    }
+  };
 
+  useEffect(() => {
     fetchProfile();
   }, []);
 
+  useEffect(() => {
+    return () => {
+      dispatch(setClosePostingModal());
+    }
+  }, [])
+
   /* 유저가 게시판에 올린 글에 대한 데이터 */
   useEffect(() => {
     if (!!currentPost) {