Merge pull request #286 from SKKUD/develop

v1.0.2 update
SKKUD · Sep 9, 2023 · dacf690 · dacf690
2 parents 1bc5c2b + ba5e5da
commit dacf690
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 8 deletions.
diff --git a/src/components/Message/Message.components.tsx b/src/components/Message/Message.components.tsx
@@ -3,6 +3,7 @@ import {
   MessageHolder, 
   MessageImage,
   MessageContent,
+  MessageHolderPublic,
 } from "./Message.styles";
 
 // import assets
@@ -15,10 +16,11 @@ import { useExtractID } from "../../hooks/useExtractID";
 interface IMessage {
   id: number;
   isOpen: boolean;
+  isPublic: boolean;
   nickName: string;
 }
 
-const Message = ({ id, isOpen, nickName }: IMessage) => {
+const Message = ({ id, isOpen, isPublic, nickName }: IMessage) => {
   const userid = useExtractID();
   const navigate = useNavigate();
 
@@ -28,14 +30,25 @@ const Message = ({ id, isOpen, nickName }: IMessage) => {
 
   return (
     <MessageFrame>
-      <MessageHolder onClick={RedirectToID}>
-        {isOpen ? (
-          <MessageImage src={OpenIcon}></MessageImage>
+      {
+        isPublic ? (
+          <MessageHolderPublic onClick={RedirectToID}>
+            {isOpen ? (
+              <MessageImage src={OpenIcon}></MessageImage>
+            ) : (
+              <MessageImage src={CloseIcon}></MessageImage>
+            )}
+          </MessageHolderPublic>
         ) : (
-          <MessageImage src={CloseIcon}></MessageImage>
-        )}
-      </MessageHolder>
-
+          <MessageHolder onClick={RedirectToID}>
+            {isOpen ? (
+              <MessageImage src={OpenIcon}></MessageImage>
+            ) : (
+              <MessageImage src={CloseIcon}></MessageImage>
+            )}
+          </MessageHolder>
+        )
+      }
       <MessageContent>{nickName}</MessageContent>
     </MessageFrame>
   );

diff --git a/src/components/Message/Message.styles.tsx b/src/components/Message/Message.styles.tsx
@@ -7,6 +7,21 @@ export const MessageFrame = styled.div`
   padding-left: 2px;
   padding-right: 2px;
 `
+export const MessageHolderPublic = styled.div`
+  width: 17vw;
+  max-width: 60px;
+  height: 17vw;
+  max-height: 60px;
+  border-radius: 10px;
+  border: 1px solid #8DC63F;
+  background: #fff;
+
+  /* default */
+  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+`;
 
 export const MessageHolder = styled.div`
   width: 17vw;

diff --git a/src/pages/MessageBox/MessageBox.components.tsx b/src/pages/MessageBox/MessageBox.components.tsx
@@ -32,6 +32,7 @@ interface IBean {
   messageId: number;
   author: string;
   isOpened: boolean;
+  isPublic: boolean;
 }
 
 // interface
@@ -132,6 +133,7 @@ const MessageList = () => {
                 messageId: message.message_id,
                 author: message.author,
                 isOpened: message.is_opened,
+                isPublic: message.is_public,
               };
               beans.push(beanObject);
             }
@@ -197,6 +199,7 @@ const MessageList = () => {
                                       key={bean.messageId}
                                       id={bean.messageId}
                                       isOpen={bean.isOpened}
+                                      isPublic={bean.isPublic}
                                       nickName={bean.author}
                                     />
                                   );