From 33859b27c5ef3631748f36259ea7f409b0620fba Mon Sep 17 00:00:00 2001
From: jyjy1229 <kimjy18@kaist.ac.kr>
Date: Tue, 12 Mar 2024 23:31:34 +0900
Subject: [PATCH 01/21] Add click event to profile image
---
.../Chat/MessagesBody/MessageSet/index.tsx | 87 ++++++++++---------
1 file changed, 47 insertions(+), 40 deletions(-)
diff --git a/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx b/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
index 5bd3cf8f5..af9d369bf 100644
--- a/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
+++ b/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
@@ -1,9 +1,10 @@
-import { memo, useCallback } from "react";
+import { memo, useCallback, useState } from "react";
import type { BotChat, LayoutType, UserChat } from "@/types/chat";
import { useValueRecoilState } from "@/hooks/useFetchRecoilState";
+import { ModalChatReport } from "@/components/ModalPopup";
import ProfileImage from "@/components/User/ProfileImage";
import MessageAccount from "./MessageAccount";
@@ -58,7 +59,11 @@ type MessageSetProps = {
};
const MessageSet = ({ chats, layoutType, roomInfo }: MessageSetProps) => {
+ const [isOpenReport, setIsOpenReport] = useState<boolean>(false);
const { oid: userOid } = useValueRecoilState("loginInfo") || {};
+
+ const onClickReport = useCallback(() => setIsOpenReport(true), []);
+
const authorId = chats?.[0]?.authorId;
const authorProfileUrl =
"authorProfileUrl" in chats?.[0] ? chats?.[0].authorProfileUrl : "";
@@ -135,48 +140,50 @@ const MessageSet = ({ chats, layoutType, roomInfo }: MessageSetProps) => {
};
return (
- <div css={style}>
- <div css={styleProfileSection}>
- {authorId !== userOid && (
- <div
- css={styleProfile}
- onClick={() => {
- /* @fixme @todo */
- }}
- >
- {authorId === "bot" ? (
- <TaxiIcon css={{ width: "100%", height: "100%" }} />
- ) : (
- <ProfileImage url={authorProfileUrl} />
- )}
- </div>
- )}
- </div>
- <div css={styleMessageSection}>
- {authorId !== userOid && (
- <div css={styleName} className="selectable">
- {authorName}
- </div>
- )}
- {chats.map((chat, index) => (
- <div key={getChatUniquewKey(chat)} css={styleMessageWrap}>
- <div css={styleChat(chat.type)}>
- <MessageBody
- type={chat.type}
- content={chat.content}
- roomInfo={roomInfo}
- color={authorId === userOid ? theme.white : theme.black}
- />
+ <>
+ <div css={style}>
+ <div css={styleProfileSection}>
+ {authorId !== userOid && (
+ <div css={styleProfile} onClick={onClickReport}>
+ {authorId === "bot" ? (
+ <TaxiIcon css={{ width: "100%", height: "100%" }} />
+ ) : (
+ <ProfileImage url={authorProfileUrl} />
+ )}
</div>
- {index === chats.length - 1 && (
- <div css={styleTime} className="selectable">
- {dayjs(chat.time).format("H시 mm분")}
+ )}
+ </div>
+ <div css={styleMessageSection}>
+ {authorId !== userOid && (
+ <div css={styleName} className="selectable">
+ {authorName}
+ </div>
+ )}
+ {chats.map((chat, index) => (
+ <div key={getChatUniquewKey(chat)} css={styleMessageWrap}>
+ <div css={styleChat(chat.type)}>
+ <MessageBody
+ type={chat.type}
+ content={chat.content}
+ roomInfo={roomInfo}
+ color={authorId === userOid ? theme.white : theme.black}
+ />
</div>
- )}
- </div>
- ))}
+ {index === chats.length - 1 && (
+ <div css={styleTime} className="selectable">
+ {dayjs(chat.time).format("H시 mm분")}
+ </div>
+ )}
+ </div>
+ ))}
+ </div>
</div>
- </div>
+ <ModalChatReport
+ roomInfo={roomInfo}
+ isOpen={isOpenReport}
+ onChangeIsOpen={setIsOpenReport}
+ />
+ </>
);
};
From 38abfbdaa63b24802382cd664bb660d43dcf4e98 Mon Sep 17 00:00:00 2001
From: jyjy1229 <kimjy18@kaist.ac.kr>
Date: Tue, 12 Mar 2024 23:52:40 +0900
Subject: [PATCH 02/21] Remove click event to taxi bot profile image
---
.../Chat/MessagesBody/MessageSet/index.tsx | 18 ++++++++++++++----
1 file changed, 14 insertions(+), 4 deletions(-)
diff --git a/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx b/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
index af9d369bf..baa0e287d 100644
--- a/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
+++ b/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
@@ -101,6 +101,9 @@ const MessageSet = ({ chats, layoutType, roomInfo }: MessageSetProps) => {
alignItems: "flex-end",
gap: "4px",
};
+ const styleHover = {
+ cursor: "pointer",
+ };
const styleChat = useCallback(
(type: (UserChat | BotChat)["type"]) => ({
maxWidth: "max(75%, 210px)",
@@ -144,13 +147,20 @@ const MessageSet = ({ chats, layoutType, roomInfo }: MessageSetProps) => {
<div css={style}>
<div css={styleProfileSection}>
{authorId !== userOid && (
- <div css={styleProfile} onClick={onClickReport}>
+ <>
{authorId === "bot" ? (
- <TaxiIcon css={{ width: "100%", height: "100%" }} />
+ <div css={styleProfile}>
+ <TaxiIcon css={{ width: "100%", height: "100%" }} />
+ </div>
) : (
- <ProfileImage url={authorProfileUrl} />
+ <div
+ css={{ ...styleProfile, ...styleHover }}
+ onClick={onClickReport}
+ >
+ <ProfileImage url={authorProfileUrl} />
+ </div>
)}
- </div>
+ </>
)}
</div>
<div css={styleMessageSection}>
From d993f20b2353c8e583223886e1e5220059e5d49f Mon Sep 17 00:00:00 2001
From: jyjy1229 <kimjy18@kaist.ac.kr>
Date: Tue, 19 Mar 2024 23:00:14 +0900
Subject: [PATCH 03/21] Fix jsx code
---
.../Chat/MessagesBody/MessageSet/index.tsx | 22 +++++++++----------
1 file changed, 10 insertions(+), 12 deletions(-)
diff --git a/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx b/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
index baa0e287d..f5153be90 100644
--- a/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
+++ b/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
@@ -69,6 +69,8 @@ const MessageSet = ({ chats, layoutType, roomInfo }: MessageSetProps) => {
"authorProfileUrl" in chats?.[0] ? chats?.[0].authorProfileUrl : "";
const authorName = "authorName" in chats?.[0] ? chats?.[0].authorName : "";
+ const isBot = authorId === "bot";
+
const style = {
position: "relative" as any,
display: "flex",
@@ -147,20 +149,16 @@ const MessageSet = ({ chats, layoutType, roomInfo }: MessageSetProps) => {
<div css={style}>
<div css={styleProfileSection}>
{authorId !== userOid && (
- <>
- {authorId === "bot" ? (
- <div css={styleProfile}>
- <TaxiIcon css={{ width: "100%", height: "100%" }} />
- </div>
+ <div
+ css={{ ...styleProfile, ...(!isBot && styleHover) }}
+ onClick={() => !isBot && onClickReport()}
+ >
+ {isBot ? (
+ <TaxiIcon css={{ width: "100%", height: "100%" }} />
) : (
- <div
- css={{ ...styleProfile, ...styleHover }}
- onClick={onClickReport}
- >
- <ProfileImage url={authorProfileUrl} />
- </div>
+ <ProfileImage url={authorProfileUrl} />
)}
- </>
+ </div>
)}
</div>
<div css={styleMessageSection}>
From 35a9e2c331c8687fd04b39bbfb882d6aa21893c9 Mon Sep 17 00:00:00 2001
From: jyjy1229 <kimjy18@kaist.ac.kr>
Date: Tue, 19 Mar 2024 23:01:04 +0900
Subject: [PATCH 04/21] Add userOid props to modal
---
.../web/src/components/Chat/MessagesBody/MessageSet/index.tsx | 1 +
1 file changed, 1 insertion(+)
diff --git a/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx b/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
index f5153be90..df55ab7ea 100644
--- a/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
+++ b/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
@@ -190,6 +190,7 @@ const MessageSet = ({ chats, layoutType, roomInfo }: MessageSetProps) => {
roomInfo={roomInfo}
isOpen={isOpenReport}
onChangeIsOpen={setIsOpenReport}
+ userOid={authorId}
/>
</>
);
From 1a861cbb184533f17a693f49ac97cfd4e03fd934 Mon Sep 17 00:00:00 2001
From: jyjy1229 <kimjy18@kaist.ac.kr>
Date: Tue, 19 Mar 2024 23:02:26 +0900
Subject: [PATCH 05/21] Rename function
---
.../web/src/components/Chat/MessagesBody/MessageSet/index.tsx | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx b/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
index df55ab7ea..e6749d7a5 100644
--- a/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
+++ b/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
@@ -62,7 +62,7 @@ const MessageSet = ({ chats, layoutType, roomInfo }: MessageSetProps) => {
const [isOpenReport, setIsOpenReport] = useState<boolean>(false);
const { oid: userOid } = useValueRecoilState("loginInfo") || {};
- const onClickReport = useCallback(() => setIsOpenReport(true), []);
+ const onClickProfileImage = useCallback(() => setIsOpenReport(true), []);
const authorId = chats?.[0]?.authorId;
const authorProfileUrl =
@@ -151,7 +151,7 @@ const MessageSet = ({ chats, layoutType, roomInfo }: MessageSetProps) => {
{authorId !== userOid && (
<div
css={{ ...styleProfile, ...(!isBot && styleHover) }}
- onClick={() => !isBot && onClickReport()}
+ onClick={() => !isBot && onClickProfileImage()}
>
{isBot ? (
<TaxiIcon css={{ width: "100%", height: "100%" }} />
From 719f9a3e29da573a70b84173ce9d72435c54409f Mon Sep 17 00:00:00 2001
From: jyjy1229 <kimjy18@kaist.ac.kr>
Date: Tue, 19 Mar 2024 23:21:20 +0900
Subject: [PATCH 06/21] Fix css
---
.../src/components/Chat/MessagesBody/MessageSet/index.tsx | 6 ++----
1 file changed, 2 insertions(+), 4 deletions(-)
diff --git a/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx b/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
index e6749d7a5..ab62a70a1 100644
--- a/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
+++ b/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
@@ -103,9 +103,7 @@ const MessageSet = ({ chats, layoutType, roomInfo }: MessageSetProps) => {
alignItems: "flex-end",
gap: "4px",
};
- const styleHover = {
- cursor: "pointer",
- };
+
const styleChat = useCallback(
(type: (UserChat | BotChat)["type"]) => ({
maxWidth: "max(75%, 210px)",
@@ -150,7 +148,7 @@ const MessageSet = ({ chats, layoutType, roomInfo }: MessageSetProps) => {
<div css={styleProfileSection}>
{authorId !== userOid && (
<div
- css={{ ...styleProfile, ...(!isBot && styleHover) }}
+ css={{ ...styleProfile, cursor: !isBot ? "pointer" : undefined }}
onClick={() => !isBot && onClickProfileImage()}
>
{isBot ? (
From c065077c405e10bd45deee1b8b7ff6492ec8df84 Mon Sep 17 00:00:00 2001
From: ybmin <nimby@sparcs.org>
Date: Tue, 26 Mar 2024 20:26:42 +0900
Subject: [PATCH 07/21] Add: channelTalk openChat with given message
---
.../useChannelTalkEffect/channelService.js | 3 +++
.../hooks/skeleton/useChannelTalkEffect/index.tsx | 11 +++++++++++
packages/web/src/pages/Mypage/Menu.tsx | 3 +++
packages/web/src/pages/Mypage/index.tsx | 15 ++++++++++++---
packages/web/src/pages/Mypage/langs/en.json | 1 +
packages/web/src/pages/Mypage/langs/ko.json | 1 +
6 files changed, 31 insertions(+), 3 deletions(-)
diff --git a/packages/web/src/hooks/skeleton/useChannelTalkEffect/channelService.js b/packages/web/src/hooks/skeleton/useChannelTalkEffect/channelService.js
index c6a7638b4..ea3b249a9 100644
--- a/packages/web/src/hooks/skeleton/useChannelTalkEffect/channelService.js
+++ b/packages/web/src/hooks/skeleton/useChannelTalkEffect/channelService.js
@@ -42,6 +42,9 @@ class ChannelService {
updateUser(options) {
window.ChannelIO("updateUser", options);
}
+ openChat(message) {
+ window.ChannelIO("openChat", undefined, message);
+ }
shutdown() {
window.ChannelIO("shutdown");
}
diff --git a/packages/web/src/hooks/skeleton/useChannelTalkEffect/index.tsx b/packages/web/src/hooks/skeleton/useChannelTalkEffect/index.tsx
index 3f2dec5b8..21e8ed292 100644
--- a/packages/web/src/hooks/skeleton/useChannelTalkEffect/index.tsx
+++ b/packages/web/src/hooks/skeleton/useChannelTalkEffect/index.tsx
@@ -36,4 +36,15 @@ export default () => {
});
}
}, [pathname, error]);
+
+ const openWithdraw = () => {
+ if (channelTalkPluginKey) {
+ ChannelService.openChat({
+ chatId: undefined,
+ message:
+ "스팍스 택시 서비스의 계정 탈퇴를 신청하고 싶습니다.\n신청 사유는 다음과 같습니다: ",
+ });
+ }
+ };
+ return { openWithdraw };
};
diff --git a/packages/web/src/pages/Mypage/Menu.tsx b/packages/web/src/pages/Mypage/Menu.tsx
index fcc0dddf1..d63d2d08a 100644
--- a/packages/web/src/pages/Mypage/Menu.tsx
+++ b/packages/web/src/pages/Mypage/Menu.tsx
@@ -12,6 +12,7 @@ import ExitToAppRoundedIcon from "@mui/icons-material/ExitToAppRounded";
import HelpOutlineRoundedIcon from "@mui/icons-material/HelpOutlineRounded";
import KeyboardArrowLeftRoundedIcon from "@mui/icons-material/KeyboardArrowLeftRounded";
import LanguageRoundedIcon from "@mui/icons-material/LanguageRounded";
+import PersonRemoveRoundedIcon from "@mui/icons-material/PersonRemoveRounded";
import PortraitRoundedIcon from "@mui/icons-material/PortraitRounded";
import StarRoundedIcon from "@mui/icons-material/StarRounded";
@@ -46,6 +47,8 @@ const getIcon = (icon: string) => {
return <AlarmOffRoundedIcon style={styleIcon} />;
case "logout":
return <ExitToAppRoundedIcon style={styleIcon} />;
+ case "withdraw":
+ return <PersonRemoveRoundedIcon style={styleIcon} />;
case "beta":
return <StarRoundedIcon style={styleIcon} />;
}
diff --git a/packages/web/src/pages/Mypage/index.tsx b/packages/web/src/pages/Mypage/index.tsx
index f2d4e3005..725d82647 100644
--- a/packages/web/src/pages/Mypage/index.tsx
+++ b/packages/web/src/pages/Mypage/index.tsx
@@ -1,6 +1,7 @@
import { useCallback, useState } from "react";
import { useTranslation } from "react-i18next";
+import useChannelTalkEffect from "@/hooks/skeleton/useChannelTalkEffect";
import { useValueRecoilState } from "@/hooks/useFetchRecoilState";
import AdaptiveDiv from "@/components/AdaptiveDiv";
@@ -63,6 +64,9 @@ const Mypage = () => {
);
const onClickEventPolicy = useCallback(() => setIsOpenEventPolicy(true), []);
const onClickMembers = useCallback(() => setOpenIsMembers(true), []);
+ const onClickWithdraw = useCallback(() => {
+ useChannelTalkEffect().openWithdraw();
+ }, []);
const styleProfImg = {
width: "50px",
@@ -194,9 +198,14 @@ const Mypage = () => {
{t("credit")}
</Menu>
{userId && (
- <LinkLogout>
- <Menu icon="logout">{t("logout")}</Menu>
- </LinkLogout>
+ <>
+ <Menu icon="withdraw" onClick={onClickWithdraw}>
+ {t("withdraw")}
+ </Menu>
+ <LinkLogout>
+ <Menu icon="logout">{t("logout")}</Menu>
+ </LinkLogout>
+ </>
)}
</div>
</WhiteContainer>
diff --git a/packages/web/src/pages/Mypage/langs/en.json b/packages/web/src/pages/Mypage/langs/en.json
index 365791c93..fe6dddb8d 100644
--- a/packages/web/src/pages/Mypage/langs/en.json
+++ b/packages/web/src/pages/Mypage/langs/en.json
@@ -16,6 +16,7 @@
"terms_privacy": "Collection and Use of Personal Information",
"privacy_policy": "Privacy Policy",
"credit": "Credit",
+ "withdraw": "Withdraw Account",
"logout": "Logout",
"page_modify": {
"cancel": "Cancel",
diff --git a/packages/web/src/pages/Mypage/langs/ko.json b/packages/web/src/pages/Mypage/langs/ko.json
index 99afcaebe..e6c52dbab 100644
--- a/packages/web/src/pages/Mypage/langs/ko.json
+++ b/packages/web/src/pages/Mypage/langs/ko.json
@@ -16,6 +16,7 @@
"terms_privacy": "개인정보 수집 및 이용",
"privacy_policy": "개인정보 처리방침",
"credit": "만든 사람들",
+ "withdraw": "회원 탈퇴하기",
"logout": "로그아웃",
"page_modify": {
"cancel": "취소",
From 2c67424934f61c2864b7134464c813583bc80de6 Mon Sep 17 00:00:00 2001
From: ybmin <nimby@sparcs.org>
Date: Tue, 26 Mar 2024 20:39:33 +0900
Subject: [PATCH 08/21] Fix: conflict with dev
---
.../src/hooks/skeleton/useChannelTalkEffect/index.tsx | 11 -----------
packages/web/src/pages/Mypage/index.tsx | 8 ++++++--
2 files changed, 6 insertions(+), 13 deletions(-)
diff --git a/packages/web/src/hooks/skeleton/useChannelTalkEffect/index.tsx b/packages/web/src/hooks/skeleton/useChannelTalkEffect/index.tsx
index 21e8ed292..3f2dec5b8 100644
--- a/packages/web/src/hooks/skeleton/useChannelTalkEffect/index.tsx
+++ b/packages/web/src/hooks/skeleton/useChannelTalkEffect/index.tsx
@@ -36,15 +36,4 @@ export default () => {
});
}
}, [pathname, error]);
-
- const openWithdraw = () => {
- if (channelTalkPluginKey) {
- ChannelService.openChat({
- chatId: undefined,
- message:
- "스팍스 택시 서비스의 계정 탈퇴를 신청하고 싶습니다.\n신청 사유는 다음과 같습니다: ",
- });
- }
- };
- return { openWithdraw };
};
diff --git a/packages/web/src/pages/Mypage/index.tsx b/packages/web/src/pages/Mypage/index.tsx
index 725d82647..4937a2d83 100644
--- a/packages/web/src/pages/Mypage/index.tsx
+++ b/packages/web/src/pages/Mypage/index.tsx
@@ -1,7 +1,7 @@
import { useCallback, useState } from "react";
import { useTranslation } from "react-i18next";
-import useChannelTalkEffect from "@/hooks/skeleton/useChannelTalkEffect";
+import channelService from "@/hooks/skeleton/useChannelTalkEffect/channelService";
import { useValueRecoilState } from "@/hooks/useFetchRecoilState";
import AdaptiveDiv from "@/components/AdaptiveDiv";
@@ -65,7 +65,11 @@ const Mypage = () => {
const onClickEventPolicy = useCallback(() => setIsOpenEventPolicy(true), []);
const onClickMembers = useCallback(() => setOpenIsMembers(true), []);
const onClickWithdraw = useCallback(() => {
- useChannelTalkEffect().openWithdraw();
+ channelService.openChat({
+ chatId: undefined,
+ message:
+ "스팍스 택시 서비스의 계정 탈퇴를 신청하고 싶습니다.\n신청 사유는 다음과 같습니다:\n",
+ });
}, []);
const styleProfImg = {
From 5736a6ca58c4c7d03215d5aa990b8fb805e3de7d Mon Sep 17 00:00:00 2001
From: jyjy1229 <kimjy18@kaist.ac.kr>
Date: Tue, 26 Mar 2024 23:06:28 +0900
Subject: [PATCH 09/21] Keep the selected user when press the previous button
---
.../Body/BodyChatReportSelectType.tsx | 6 +++---
.../Body/BodyChatReportSelectUser.tsx | 19 +++++++++++--------
.../components/ModalPopup/ModalChatReport.tsx | 9 +++++++--
3 files changed, 21 insertions(+), 13 deletions(-)
diff --git a/packages/web/src/components/ModalPopup/Body/BodyChatReportSelectType.tsx b/packages/web/src/components/ModalPopup/Body/BodyChatReportSelectType.tsx
index 523a853a7..1227eeedf 100644
--- a/packages/web/src/components/ModalPopup/Body/BodyChatReportSelectType.tsx
+++ b/packages/web/src/components/ModalPopup/Body/BodyChatReportSelectType.tsx
@@ -32,7 +32,7 @@ import EditRoundedIcon from "@mui/icons-material/EditRounded";
type BodyChatReportSelectTypeProps = {
roomInfo: Room;
reportedId: Report["reportedId"];
- clearReportedId: () => void;
+ setIsSelected: Dispatch<SetStateAction<boolean>>;
setIsSubmitted: Dispatch<SetStateAction<boolean>>;
};
@@ -45,7 +45,7 @@ const selectOptions = [
const BodyChatReportSelectType = ({
roomInfo,
reportedId,
- clearReportedId,
+ setIsSelected,
setIsSubmitted,
}: BodyChatReportSelectTypeProps) => {
const axios = useAxios();
@@ -228,7 +228,7 @@ const BodyChatReportSelectType = ({
borderRadius: "8px",
...theme.font14,
}}
- onClick={clearReportedId}
+ onClick={() => setIsSelected(false)}
>
이전
</Button>
diff --git a/packages/web/src/components/ModalPopup/Body/BodyChatReportSelectUser.tsx b/packages/web/src/components/ModalPopup/Body/BodyChatReportSelectUser.tsx
index c27eff87f..6a3599936 100644
--- a/packages/web/src/components/ModalPopup/Body/BodyChatReportSelectUser.tsx
+++ b/packages/web/src/components/ModalPopup/Body/BodyChatReportSelectUser.tsx
@@ -1,7 +1,8 @@
-import { Dispatch, SetStateAction, useState } from "react";
+import { Dispatch, SetStateAction } from "react";
import type { Report } from "@/types/report";
+import { useValueRecoilState } from "@/hooks/useFetchRecoilState";
import useIsTimeOver from "@/hooks/useIsTimeOver";
import Button from "@/components/Button";
@@ -15,17 +16,19 @@ import CheckRoundedIcon from "@mui/icons-material/CheckRounded";
type BodyChatReportSelectUserProps = {
roomInfo: Room;
+ reportedId: Nullable<Report["reportedId"]>;
setReportedId: Dispatch<SetStateAction<Nullable<Report["reportedId"]>>>;
+ setIsSelected: Dispatch<SetStateAction<boolean>>;
onChangeIsOpen?: (isOpen: boolean) => void;
};
const BodyChatReportSelectUser = ({
roomInfo,
+ reportedId,
setReportedId,
+ setIsSelected,
onChangeIsOpen,
}: BodyChatReportSelectUserProps) => {
- const [selectedUser, setSelectedUser] =
- useState<Nullable<Report["reportedId"]>>(null);
const isDeparted = useIsTimeOver(dayServerToClient(roomInfo.time)); // 방 출발 여부
const styleText = {
@@ -84,16 +87,16 @@ const BodyChatReportSelectUser = ({
<div
key={user._id}
css={styleUser}
- onClick={() => setSelectedUser(user._id)}
+ onClick={() => setReportedId(user._id)}
>
<div
css={{
...styleCheckBox,
background:
- selectedUser === user._id ? theme.purple : theme.purple_light,
+ reportedId === user._id ? theme.purple : theme.purple_light,
}}
>
- {selectedUser === user._id && (
+ {reportedId === user._id && (
<CheckRoundedIcon style={styleCheckBoxIcon} />
)}
</div>
@@ -122,8 +125,8 @@ const BodyChatReportSelectUser = ({
borderRadius: "8px",
...theme.font14_bold,
}}
- onClick={() => setReportedId(selectedUser)}
- disabled={!selectedUser}
+ onClick={() => setIsSelected(true)}
+ disabled={!reportedId}
>
다음
</Button>
diff --git a/packages/web/src/components/ModalPopup/ModalChatReport.tsx b/packages/web/src/components/ModalPopup/ModalChatReport.tsx
index 68dca9a16..fa241eb4e 100644
--- a/packages/web/src/components/ModalPopup/ModalChatReport.tsx
+++ b/packages/web/src/components/ModalPopup/ModalChatReport.tsx
@@ -24,14 +24,17 @@ const ModalChatReport = ({
}: ModalChatReportProps) => {
const [reportedId, setReportedId] =
useState<Nullable<Report["reportedId"]>>();
+ const [isSelected, setIsSelected] = useState<boolean>(false);
const [isSubmitted, setIsSubmitted] = useState<boolean>(false);
useEffect(() => {
if (userOid && roomInfo.part.find((user) => user._id === userOid)) {
setReportedId(userOid);
+ setIsSelected(true);
setIsSubmitted(false);
} else {
setReportedId(undefined);
+ setIsSelected(false);
setIsSubmitted(false);
}
}, [roomInfo, userOid, modalProps.isOpen]);
@@ -53,17 +56,19 @@ const ModalChatReport = ({
<ReportGmailerrorredRoundedIcon style={styleIcon} />
신고하기
</div>
- {!reportedId ? (
+ {!reportedId || !isSelected ? (
<BodyChatReportSelectUser
roomInfo={roomInfo}
+ reportedId={reportedId}
setReportedId={setReportedId}
+ setIsSelected={setIsSelected}
onChangeIsOpen={modalProps?.onChangeIsOpen}
/>
) : !isSubmitted ? (
<BodyChatReportSelectType
roomInfo={roomInfo}
reportedId={reportedId}
- clearReportedId={() => setReportedId(undefined)}
+ setIsSelected={setIsSelected}
setIsSubmitted={setIsSubmitted}
/>
) : (
From 39574e46a353e4b95ec9e4499826958ccbb5eaa1 Mon Sep 17 00:00:00 2001
From: jyjy1229 <kimjy18@kaist.ac.kr>
Date: Tue, 26 Mar 2024 23:07:16 +0900
Subject: [PATCH 10/21] Remove own account in report modal
---
.../Body/BodyChatReportSelectUser.tsx | 46 +++++++++++--------
1 file changed, 26 insertions(+), 20 deletions(-)
diff --git a/packages/web/src/components/ModalPopup/Body/BodyChatReportSelectUser.tsx b/packages/web/src/components/ModalPopup/Body/BodyChatReportSelectUser.tsx
index 6a3599936..ef684168f 100644
--- a/packages/web/src/components/ModalPopup/Body/BodyChatReportSelectUser.tsx
+++ b/packages/web/src/components/ModalPopup/Body/BodyChatReportSelectUser.tsx
@@ -29,6 +29,7 @@ const BodyChatReportSelectUser = ({
setIsSelected,
onChangeIsOpen,
}: BodyChatReportSelectUserProps) => {
+ const { oid: userOid } = useValueRecoilState("loginInfo") || {};
const isDeparted = useIsTimeOver(dayServerToClient(roomInfo.time)); // 방 출발 여부
const styleText = {
@@ -83,26 +84,31 @@ const BodyChatReportSelectUser = ({
<div css={styleText}>신고할 사용자를 선택해주세요.</div>
<DottedLine />
<div css={styleUsers}>
- {roomInfo.part.map((user) => (
- <div
- key={user._id}
- css={styleUser}
- onClick={() => setReportedId(user._id)}
- >
- <div
- css={{
- ...styleCheckBox,
- background:
- reportedId === user._id ? theme.purple : theme.purple_light,
- }}
- >
- {reportedId === user._id && (
- <CheckRoundedIcon style={styleCheckBoxIcon} />
- )}
- </div>
- <User value={user} isDeparted={isDeparted} />
- </div>
- ))}
+ {roomInfo.part.map(
+ (user) =>
+ user._id !== userOid && (
+ <div
+ key={user._id}
+ css={styleUser}
+ onClick={() => setReportedId(user._id)}
+ >
+ <div
+ css={{
+ ...styleCheckBox,
+ background:
+ reportedId === user._id
+ ? theme.purple
+ : theme.purple_light,
+ }}
+ >
+ {reportedId === user._id && (
+ <CheckRoundedIcon style={styleCheckBoxIcon} />
+ )}
+ </div>
+ <User value={user} isDeparted={isDeparted} />
+ </div>
+ )
+ )}
</div>
<div css={styleButtons}>
<Button
From 0429cfc885151edb215bf22e8a7aa9c6ff4aa7e0 Mon Sep 17 00:00:00 2001
From: static <kmc7468@naver.com>
Date: Tue, 26 Mar 2024 23:09:17 +0900
Subject: [PATCH 11/21] Refactor: change the default value of eventMode in
loadenv.ts
---
packages/web/src/tools/loadenv.ts | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/packages/web/src/tools/loadenv.ts b/packages/web/src/tools/loadenv.ts
index 9f2681a14..7919646c1 100644
--- a/packages/web/src/tools/loadenv.ts
+++ b/packages/web/src/tools/loadenv.ts
@@ -13,7 +13,7 @@ export const kakaoSDKKey = env.REACT_APP_KAKAO_SDK_KEY; // optional
export const gaTrackingId = env.REACT_APP_GA_TRACKING_ID; // optional
export const firebaseConfig: Nullable<FirebaseConfig> =
env.REACT_APP_FIREBASE_CONFIG && JSON.parse(env.REACT_APP_FIREBASE_CONFIG); // optional
-export const eventMode = env.REACT_APP_EVENT_MODE || "2024spring"; // optional. "2023fall"로 설정 가능
+export const eventMode = env.REACT_APP_EVENT_MODE || null; // optional. "2023fall"로 설정 가능
// devicet-type 감지
const userAgent = navigator.userAgent.toLowerCase();
From e01914201346fc3a09dfffc86f4d28bf5f68a8ca Mon Sep 17 00:00:00 2001
From: jyjy1229 <kimjy18@kaist.ac.kr>
Date: Tue, 26 Mar 2024 23:23:27 +0900
Subject: [PATCH 12/21] Remove legacy code
---
.../components/ModalPopup/Body/BodyChatReportSelectType.tsx | 6 +-----
1 file changed, 1 insertion(+), 5 deletions(-)
diff --git a/packages/web/src/components/ModalPopup/Body/BodyChatReportSelectType.tsx b/packages/web/src/components/ModalPopup/Body/BodyChatReportSelectType.tsx
index 1227eeedf..c8b6bb9d1 100644
--- a/packages/web/src/components/ModalPopup/Body/BodyChatReportSelectType.tsx
+++ b/packages/web/src/components/ModalPopup/Body/BodyChatReportSelectType.tsx
@@ -11,7 +11,6 @@ import {
import type { Report } from "@/types/report";
-import { useValueRecoilState } from "@/hooks/useFetchRecoilState";
import useIsTimeOver from "@/hooks/useIsTimeOver";
import { useAxios } from "@/hooks/useTaxiAPI";
@@ -50,7 +49,6 @@ const BodyChatReportSelectType = ({
}: BodyChatReportSelectTypeProps) => {
const axios = useAxios();
const setAlert = useSetRecoilState(alertAtom);
- const { oid: userOid } = useValueRecoilState("loginInfo") || {};
const wrapRef = useRef<HTMLDivElement>(null);
const textareaRef = useRef<HTMLTextAreaElement>(null);
const [height, setHeight] = useState<CSSProperties["height"]>("28px");
@@ -76,10 +74,8 @@ const BodyChatReportSelectType = ({
? "기타 사유를 입력해주세요."
: type === "etc-reason" && !regExpTest.reportMsg(etcDetail)
? "기타 사유는 1500자 까지 입력이 허용됩니다."
- : userOid === reportedUser?._id
- ? "나 자신은 신고할 수 없습니다."
: null,
- [type, etcDetail, isDeparted, userOid, reportedUser]
+ [type, etcDetail, isDeparted, reportedUser]
);
const resizeEvent = useCallback(() => {
From 97f218b7c2392fa3f038cc49a5fb91e3955f3b47 Mon Sep 17 00:00:00 2001
From: ybmin <nimby@sparcs.org>
Date: Tue, 2 Apr 2024 22:08:33 +0900
Subject: [PATCH 13/21] =?UTF-8?q?Style:=20=EC=88=9C=EC=84=9C,=20=ED=83=9D?=
=?UTF-8?q?=EC=8A=A4=ED=8A=B8=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
packages/web/src/pages/Mypage/index.tsx | 8 ++++----
1 file changed, 4 insertions(+), 4 deletions(-)
diff --git a/packages/web/src/pages/Mypage/index.tsx b/packages/web/src/pages/Mypage/index.tsx
index 9054174cd..0b7a4c77d 100644
--- a/packages/web/src/pages/Mypage/index.tsx
+++ b/packages/web/src/pages/Mypage/index.tsx
@@ -78,7 +78,7 @@ const Mypage = () => {
channelService.openChat({
chatId: undefined,
message:
- "스팍스 택시 서비스의 계정 탈퇴를 신청하고 싶습니다.\n신청 사유는 다음과 같습니다:\n",
+ "SPARCS Taxi 서비스의 계정 탈퇴를 신청하고 싶습니다.\n신청 사유는 다음과 같습니다:\n",
});
}, []);
@@ -213,12 +213,12 @@ const Mypage = () => {
</Menu>
{userId && (
<>
- <Menu icon="withdraw" onClick={onClickWithdraw}>
- {t("withdraw")}
- </Menu>
<LinkLogout>
<Menu icon="logout">{t("logout")}</Menu>
</LinkLogout>
+ <Menu icon="withdraw" onClick={onClickWithdraw}>
+ {t("withdraw")}
+ </Menu>
</>
)}
</div>
From c106ec1f9ebbb9688a22b30ef58485b371e8a3df Mon Sep 17 00:00:00 2001
From: jinhyeonkwon <athexplorer@kaist.ac.kr>
Date: Tue, 2 Apr 2024 23:04:30 +0900
Subject: [PATCH 14/21] Add: shortcut button in the modal of already joined
room
---
.../src/components/ModalPopup/Body/BodyRoomSelection.tsx | 9 +++++++--
1 file changed, 7 insertions(+), 2 deletions(-)
diff --git a/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx b/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx
index 306f1a2cc..edf92ce34 100644
--- a/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx
+++ b/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx
@@ -125,6 +125,11 @@ const BodyRoomSelection = ({ roomInfo }: BodyRoomSelectionProps) => {
const isDepart = useIsTimeOver(dayServerToClient(roomInfo.time)); // 방 출발 여부
const requestJoin = useCallback(async () => {
+ if (isAlreadyPart) {
+ // 이미 참여 중인 방에서 버튼을 누르면 API 호출 관련 로직을 건너뛰고 해당 방으로 이동합니다.
+ history.push(`/myroom/${roomInfo._id}`);
+ return;
+ }
if (onCall.current) return;
onCall.current = true;
await axios({
@@ -204,7 +209,7 @@ const BodyRoomSelection = ({ roomInfo }: BodyRoomSelectionProps) => {
{isLogin || isRoomFull || isDepart ? (
<Button
type="purple"
- disabled={isRoomFull || isDepart || isAlreadyPart || isMaxPart}
+ disabled={isRoomFull || isDepart || isMaxPart}
css={{
padding: "10px 0 9px",
borderRadius: "8px",
@@ -213,7 +218,7 @@ const BodyRoomSelection = ({ roomInfo }: BodyRoomSelectionProps) => {
onClick={requestJoin}
>
{isAlreadyPart
- ? "이미 참여 중입니다"
+ ? "참여 중인 방 - 바로가기"
: isDepart
? "출발 시각이 현재 이전인 방은 참여할 수 없습니다"
: isRoomFull
From 1c809401f424bd11ea0474a328226536cb3bb333 Mon Sep 17 00:00:00 2001
From: jinhyeonkwon <athexplorer@kaist.ac.kr>
Date: Tue, 2 Apr 2024 23:23:16 +0900
Subject: [PATCH 15/21] Fix: conditions of room join button - disabled
condition and text
---
.../src/components/ModalPopup/Body/BodyRoomSelection.tsx | 8 ++++----
1 file changed, 4 insertions(+), 4 deletions(-)
diff --git a/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx b/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx
index edf92ce34..3862baf9d 100644
--- a/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx
+++ b/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx
@@ -209,7 +209,7 @@ const BodyRoomSelection = ({ roomInfo }: BodyRoomSelectionProps) => {
{isLogin || isRoomFull || isDepart ? (
<Button
type="purple"
- disabled={isRoomFull || isDepart || isMaxPart}
+ disabled={isRoomFull || (isDepart && !isAlreadyPart) || isMaxPart}
css={{
padding: "10px 0 9px",
borderRadius: "8px",
@@ -217,10 +217,10 @@ const BodyRoomSelection = ({ roomInfo }: BodyRoomSelectionProps) => {
}}
onClick={requestJoin}
>
- {isAlreadyPart
- ? "참여 중인 방 - 바로가기"
- : isDepart
+ {isDepart
? "출발 시각이 현재 이전인 방은 참여할 수 없습니다"
+ : isAlreadyPart
+ ? "참여 중인 방 - 바로가기"
: isRoomFull
? "남은 인원이 0명인 방은 참여할 수 없습니다"
: isMaxPart
From c7352ad6bb76d9f445922d57c2138a09dfb3b836 Mon Sep 17 00:00:00 2001
From: jinhyeonkwon <athexplorer@kaist.ac.kr>
Date: Mon, 8 Apr 2024 13:33:30 +0900
Subject: [PATCH 16/21] Fix : Button Message
---
.../web/src/components/ModalPopup/Body/BodyRoomSelection.tsx | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx b/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx
index 3862baf9d..c5ac6e7af 100644
--- a/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx
+++ b/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx
@@ -220,7 +220,7 @@ const BodyRoomSelection = ({ roomInfo }: BodyRoomSelectionProps) => {
{isDepart
? "출발 시각이 현재 이전인 방은 참여할 수 없습니다"
: isAlreadyPart
- ? "참여 중인 방 - 바로가기"
+ ? "이미 참여 중입니다 : 바로가기"
: isRoomFull
? "남은 인원이 0명인 방은 참여할 수 없습니다"
: isMaxPart
From 9239357f79bf35aa7ec14ec477262e6f187a504f Mon Sep 17 00:00:00 2001
From: jinhyeonkwon <athexplorer@kaist.ac.kr>
Date: Mon, 8 Apr 2024 13:56:13 +0900
Subject: [PATCH 17/21] Fix: apply comments from static
---
.../web/src/components/ModalPopup/Body/BodyRoomSelection.tsx | 3 ++-
1 file changed, 2 insertions(+), 1 deletion(-)
diff --git a/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx b/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx
index c5ac6e7af..4833cacaf 100644
--- a/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx
+++ b/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx
@@ -130,6 +130,7 @@ const BodyRoomSelection = ({ roomInfo }: BodyRoomSelectionProps) => {
history.push(`/myroom/${roomInfo._id}`);
return;
}
+ // 여기부터는 이미 참여 중인 방이 아닌 경우의 로직입니다.
if (onCall.current) return;
onCall.current = true;
await axios({
@@ -217,7 +218,7 @@ const BodyRoomSelection = ({ roomInfo }: BodyRoomSelectionProps) => {
}}
onClick={requestJoin}
>
- {isDepart
+ {isDepart && !isAlreadyPart
? "출발 시각이 현재 이전인 방은 참여할 수 없습니다"
: isAlreadyPart
? "이미 참여 중입니다 : 바로가기"
From 55fa949712059ff9ec9cd4c100ad8cb6c63e071f Mon Sep 17 00:00:00 2001
From: Jinhyeon Kwon <athexplorer@kaist.ac.kr>
Date: Tue, 23 Apr 2024 21:38:17 +0900
Subject: [PATCH 18/21] Fix: Issue solved
---
.../web/src/components/ModalPopup/Body/BodyRoomSelection.tsx | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx b/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx
index 4833cacaf..e37671da8 100644
--- a/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx
+++ b/packages/web/src/components/ModalPopup/Body/BodyRoomSelection.tsx
@@ -210,7 +210,7 @@ const BodyRoomSelection = ({ roomInfo }: BodyRoomSelectionProps) => {
{isLogin || isRoomFull || isDepart ? (
<Button
type="purple"
- disabled={isRoomFull || (isDepart && !isAlreadyPart) || isMaxPart}
+ disabled={(isRoomFull || isDepart || isMaxPart) && !isAlreadyPart}
css={{
padding: "10px 0 9px",
borderRadius: "8px",
From 50fea47d6885d6b4d0543d5254e1935e6aca913a Mon Sep 17 00:00:00 2001
From: ybmin <nimby@sparcs.org>
Date: Tue, 23 Apr 2024 21:55:07 +0900
Subject: [PATCH 19/21] Fix: params type
---
packages/web/src/pages/Mypage/index.tsx | 8 +++-----
1 file changed, 3 insertions(+), 5 deletions(-)
diff --git a/packages/web/src/pages/Mypage/index.tsx b/packages/web/src/pages/Mypage/index.tsx
index 0b7a4c77d..067fba6f3 100644
--- a/packages/web/src/pages/Mypage/index.tsx
+++ b/packages/web/src/pages/Mypage/index.tsx
@@ -75,11 +75,9 @@ const Mypage = () => {
const onClickEventPolicy = useCallback(() => setIsOpenEventPolicy(true), []);
const onClickMembers = useCallback(() => setOpenIsMembers(true), []);
const onClickWithdraw = useCallback(() => {
- channelService.openChat({
- chatId: undefined,
- message:
- "SPARCS Taxi 서비스의 계정 탈퇴를 신청하고 싶습니다.\n신청 사유는 다음과 같습니다:\n",
- });
+ channelService.openChat(
+ "SPARCS Taxi 서비스의 계정 탈퇴를 신청하고 싶습니다.\n신청 사유는 다음과 같습니다:\n"
+ );
}, []);
const styleProfImg = {
From 9af8598811575e57cff50dd16230e98be3ff49d5 Mon Sep 17 00:00:00 2001
From: jyjy1229 <kimjy18@kaist.ac.kr>
Date: Tue, 23 Apr 2024 22:17:43 +0900
Subject: [PATCH 20/21] Fix
---
packages/web/src/components/Chat/Header/SideMenu.tsx | 10 ++++++++--
.../components/Chat/MessagesBody/MessageSet/index.tsx | 8 ++++++--
2 files changed, 14 insertions(+), 4 deletions(-)
diff --git a/packages/web/src/components/Chat/Header/SideMenu.tsx b/packages/web/src/components/Chat/Header/SideMenu.tsx
index f9808ef39..cfdafcf09 100644
--- a/packages/web/src/components/Chat/Header/SideMenu.tsx
+++ b/packages/web/src/components/Chat/Header/SideMenu.tsx
@@ -90,6 +90,8 @@ const SideMenu = ({ roomInfo, isOpen, setIsOpen }: SideMenuProps) => {
const onClickCallTaxi = useCallback(() => setIsOpenCallTaxi(true), []);
const onClickReport = useCallback(() => setIsOpenReport(true), []);
+ const isAlone = roomInfo.part.length === 1;
+
const styleBackground = {
position: "absolute" as any,
top: 0,
@@ -192,8 +194,12 @@ const SideMenu = ({ roomInfo, isOpen, setIsOpen }: SideMenuProps) => {
<SideMenuButton type="share" onClick={onClikcShare} />
<DottedLine />
<SideMenuButton type="taxi" onClick={onClickCallTaxi} />
- <DottedLine />
- <SideMenuButton type="report" onClick={onClickReport} />
+ {!isAlone && (
+ <>
+ <DottedLine />
+ <SideMenuButton type="report" onClick={onClickReport} />
+ </>
+ )}
</div>
<DottedLine />
<div css={styleNameSection} onClick={onClickCancel}>
diff --git a/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx b/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
index ab62a70a1..06864f170 100644
--- a/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
+++ b/packages/web/src/components/Chat/MessagesBody/MessageSet/index.tsx
@@ -70,6 +70,7 @@ const MessageSet = ({ chats, layoutType, roomInfo }: MessageSetProps) => {
const authorName = "authorName" in chats?.[0] ? chats?.[0].authorName : "";
const isBot = authorId === "bot";
+ const isAlone = roomInfo.part.length === 1;
const style = {
position: "relative" as any,
@@ -148,8 +149,11 @@ const MessageSet = ({ chats, layoutType, roomInfo }: MessageSetProps) => {
<div css={styleProfileSection}>
{authorId !== userOid && (
<div
- css={{ ...styleProfile, cursor: !isBot ? "pointer" : undefined }}
- onClick={() => !isBot && onClickProfileImage()}
+ css={{
+ ...styleProfile,
+ cursor: !isBot && !isAlone ? "pointer" : undefined,
+ }}
+ onClick={() => !isBot && !isAlone && onClickProfileImage()}
>
{isBot ? (
<TaxiIcon css={{ width: "100%", height: "100%" }} />
From 27b101f80e5b7fa771bcfd31e7d6da1c8f681044 Mon Sep 17 00:00:00 2001
From: ybmin <nimby@sparcs.org>
Date: Thu, 25 Apr 2024 16:03:46 +0900
Subject: [PATCH 21/21] Fix: show only on mobile
---
packages/web/src/pages/Mypage/Menu.tsx | 2 +-
packages/web/src/pages/Mypage/index.tsx | 20 ++++++++++----------
packages/web/src/pages/Mypage/langs/en.json | 2 +-
packages/web/src/pages/Mypage/langs/ko.json | 2 +-
4 files changed, 13 insertions(+), 13 deletions(-)
diff --git a/packages/web/src/pages/Mypage/Menu.tsx b/packages/web/src/pages/Mypage/Menu.tsx
index d63d2d08a..4c809a4ca 100644
--- a/packages/web/src/pages/Mypage/Menu.tsx
+++ b/packages/web/src/pages/Mypage/Menu.tsx
@@ -47,7 +47,7 @@ const getIcon = (icon: string) => {
return <AlarmOffRoundedIcon style={styleIcon} />;
case "logout":
return <ExitToAppRoundedIcon style={styleIcon} />;
- case "withdraw":
+ case "cancel_account":
return <PersonRemoveRoundedIcon style={styleIcon} />;
case "beta":
return <StarRoundedIcon style={styleIcon} />;
diff --git a/packages/web/src/pages/Mypage/index.tsx b/packages/web/src/pages/Mypage/index.tsx
index 067fba6f3..ac10c4073 100644
--- a/packages/web/src/pages/Mypage/index.tsx
+++ b/packages/web/src/pages/Mypage/index.tsx
@@ -25,7 +25,7 @@ import WhiteContainerSuggestLogin from "@/components/WhiteContainer/WhiteContain
import Menu from "./Menu";
-import { eventMode, isDev } from "@/tools/loadenv";
+import { deviceType, eventMode, isDev } from "@/tools/loadenv";
import theme from "@/tools/theme";
import { isNotificationOn } from "@/tools/trans";
@@ -74,7 +74,7 @@ const Mypage = () => {
);
const onClickEventPolicy = useCallback(() => setIsOpenEventPolicy(true), []);
const onClickMembers = useCallback(() => setOpenIsMembers(true), []);
- const onClickWithdraw = useCallback(() => {
+ const onClickCancelAccount = useCallback(() => {
channelService.openChat(
"SPARCS Taxi 서비스의 계정 탈퇴를 신청하고 싶습니다.\n신청 사유는 다음과 같습니다:\n"
);
@@ -210,14 +210,14 @@ const Mypage = () => {
{t("credit")}
</Menu>
{userId && (
- <>
- <LinkLogout>
- <Menu icon="logout">{t("logout")}</Menu>
- </LinkLogout>
- <Menu icon="withdraw" onClick={onClickWithdraw}>
- {t("withdraw")}
- </Menu>
- </>
+ <LinkLogout>
+ <Menu icon="logout">{t("logout")}</Menu>
+ </LinkLogout>
+ )}
+ {userId && deviceType.startsWith("app/") && (
+ <Menu icon="cancel_account" onClick={onClickCancelAccount}>
+ {t("cancel_account")}
+ </Menu>
)}
</div>
</WhiteContainer>
diff --git a/packages/web/src/pages/Mypage/langs/en.json b/packages/web/src/pages/Mypage/langs/en.json
index fe6dddb8d..7c8413599 100644
--- a/packages/web/src/pages/Mypage/langs/en.json
+++ b/packages/web/src/pages/Mypage/langs/en.json
@@ -16,7 +16,7 @@
"terms_privacy": "Collection and Use of Personal Information",
"privacy_policy": "Privacy Policy",
"credit": "Credit",
- "withdraw": "Withdraw Account",
+ "cancel_account": "Cancel Account",
"logout": "Logout",
"page_modify": {
"cancel": "Cancel",
diff --git a/packages/web/src/pages/Mypage/langs/ko.json b/packages/web/src/pages/Mypage/langs/ko.json
index e6c52dbab..c235bb6f7 100644
--- a/packages/web/src/pages/Mypage/langs/ko.json
+++ b/packages/web/src/pages/Mypage/langs/ko.json
@@ -16,7 +16,7 @@
"terms_privacy": "개인정보 수집 및 이용",
"privacy_policy": "개인정보 처리방침",
"credit": "만든 사람들",
- "withdraw": "회원 탈퇴하기",
+ "cancel_account": "회원 탈퇴하기",
"logout": "로그아웃",
"page_modify": {
"cancel": "취소",