Merge pull request #592 from woowacourse-teams/fix/#591

데모데이 버그 수정
woowacourse-teams · Sep 30, 2024 · d5857e4 · d5857e4
2 parents c25c4b5 + b6f9344
commit d5857e4
Show file tree

Hide file tree

Showing 19 changed files with 47 additions and 37 deletions.
diff --git a/frontend/src/apis/endPoints.ts b/frontend/src/apis/endPoints.ts
@@ -1,13 +1,13 @@
 import { getLastDarakbangId } from '@_common/lastDarakbangManager';
 
-const BASE_URL = `${process.env.BASE_URL}/v1`;
+const API_BASE_URL = `${process.env.API_BASE_URL}/v1`;
 export function addBaseUrl(
   endpoint: string,
   isNeedLastDarakbang: boolean = false,
 ) {
   if (isNeedLastDarakbang)
     endpoint = '/darakbang/' + (getLastDarakbangId() || 0) + endpoint;
-  return BASE_URL + endpoint;
+  return API_BASE_URL + endpoint;
 }
 const API_URL = {
   darakbang: {

diff --git a/frontend/src/common/common.style.ts b/frontend/src/common/common.style.ts
@@ -1,10 +1,15 @@
 import { css } from '@emotion/react';
 
 export const common = {
-  nonScroll: css`
+  nonDrag: css`
     user-select: none;
   `,
   cursorPointer: css`
     cursor: pointer;
   `,
+  nonScroll: css`
+    &::-webkit-scrollbar {
+      display: none;
+    }
+  `,
 };
diff --git a/frontend/src/components/DarakbangNameWrapper/DarakbangNameWrapper.tsx b/frontend/src/components/DarakbangNameWrapper/DarakbangNameWrapper.tsx
@@ -3,6 +3,7 @@ import * as S from './DarakbangNameWrapper.style';
 import { SerializedStyles, useTheme } from '@emotion/react';
 
 import { PropsWithChildren } from 'react';
+import { common } from '@_common/common.style';
 
 interface DarakbangNameWrapperProps extends PropsWithChildren {
   font?: string | SerializedStyles;
@@ -12,5 +13,5 @@ export default function DarakbangNameWrapper(props: DarakbangNameWrapperProps) {
   const theme = useTheme();
   const { font = theme.typography.h5, children } = props;
 
-  return <div css={S.name({ font })}>{children}</div>;
+  return <div css={[S.name({ font }), common.nonScroll]}>{children}</div>;
 }
diff --git a/frontend/src/components/NavigationBar/NavigationBarItem/NavigationBarItem.tsx b/frontend/src/components/NavigationBar/NavigationBarItem/NavigationBarItem.tsx
@@ -36,7 +36,7 @@ export default function NavigationBarItem(props: NavigationBarItemProps) {
       onClick={() => onClick(tab)}
     >
       {tabIcon}
-      <span css={[theme.typography.c2, common.nonScroll]}>{tab}</span>
+      <span css={[theme.typography.c2, common.nonDrag]}>{tab}</span>
     </li>
   );
 }
diff --git a/frontend/src/mocks/handler/chatHandler.ts b/frontend/src/mocks/handler/chatHandler.ts
@@ -26,7 +26,7 @@ export const chatSliceIndexes = [
 
 export const chatHandler = [
   http.get(
-    `${process.env.BASE_URL}/v1/darakbang/1/chat`,
+    `${process.env.API_URL}/v1/darakbang/1/chat`,
     async ({ request }) => {
       const url = new URL(request.url);
 

diff --git a/frontend/src/pages/Chatting/ChatPage/ChatPage.tsx b/frontend/src/pages/Chatting/ChatPage/ChatPage.tsx
@@ -22,7 +22,7 @@ export default function ChatPage() {
     <ChattingPreviewLayout>
       <ChattingPreviewLayout.Header>
         <ChattingPreviewLayout.Header.Left>
-          <h2 css={[theme.typography.h5, common.nonScroll]}>
+          <h2 css={[theme.typography.h5, common.nonDrag]}>
             <DarakbangNameWrapper>{darakbangName}</DarakbangNameWrapper>
           </h2>
         </ChattingPreviewLayout.Header.Left>

diff --git a/frontend/src/pages/Chatting/ChatPage/components/ChattingFooter/ChattingFooter.tsx b/frontend/src/pages/Chatting/ChatPage/components/ChattingFooter/ChattingFooter.tsx
@@ -1,6 +1,7 @@
-import { ChangeEvent, useRef, useState } from 'react';
 import * as S from './ChattingFooter.style';
 
+import { ChangeEvent, useRef, useState } from 'react';
+
 import POLICES from '@_constants/poclies';
 import Plus from '@_common/assets/plus.svg';
 import SendButton from '@_components/Icons/SendButton';
@@ -48,7 +49,7 @@ export default function ChattingFooter(props: ChattingFooterProps) {
           ref={textArea}
         />
         <button
-          css={[S.sendingButton, common.nonScroll]}
+          css={[S.sendingButton, common.nonDrag]}
           disabled={message === ''}
           onClick={(e) => {
             e.preventDefault();

diff --git a/frontend/src/pages/Darakbang/DarakbangInvitationPage/DarakbangInvitationPage.tsx b/frontend/src/pages/Darakbang/DarakbangInvitationPage/DarakbangInvitationPage.tsx
@@ -46,6 +46,7 @@ export default function DarakbangInvitationPage() {
 
             if (document.location.protocol === 'https:') {
               await navigator.clipboard.writeText(url);
+              alert('클립보드에 참여코드가 복사되었습니다!');
               return;
             }
             alert('http를 통해서는 복사할 수 없습니다!');

diff --git a/frontend/src/pages/Darakbang/DarakbangLandingPage/DarakbangLandingPage.tsx b/frontend/src/pages/Darakbang/DarakbangLandingPage/DarakbangLandingPage.tsx
@@ -3,11 +3,11 @@ import CompleteLayout from '@_layouts/CompleteLayout/CompleteLayout';
 import DarakbangNameWrapper from '@_components/DarakbangNameWrapper/DarakbangNameWrapper';
 import GET_ROUTES from '@_common/getRoutes';
 import HighlightSpan from '@_components/HighlightSpan/HighlightSpan';
+import { common } from '@_common/common.style';
+import { theme } from '@_common/theme/theme.style';
 import useMyInfo from '@_hooks/queries/useMyInfo';
 import { useNavigate } from 'react-router-dom';
 import useNowDarakbangName from '@_hooks/queries/useNowDarakbangNameById';
-import { theme } from '@_common/theme/theme.style';
-import { common } from '@_common/common.style';
 
 export default function DarakbangLandingPage() {
   const navigate = useNavigate();
@@ -18,7 +18,7 @@ export default function DarakbangLandingPage() {
     <CompleteLayout>
       <CompleteLayout.Header>
         <CompleteLayout.Header.Center>
-          <span css={[[theme.typography.h5, common.nonScroll]]}>
+          <span css={[[theme.typography.h5, common.nonDrag]]}>
             <DarakbangNameWrapper>{darakbangName}</DarakbangNameWrapper>
           </span>
         </CompleteLayout.Header.Center>

diff --git a/frontend/src/pages/Moim/MainPage/MainPage.tsx b/frontend/src/pages/Moim/MainPage/MainPage.tsx
@@ -148,7 +148,7 @@ export default function MainPage() {
           <HomeLayout.Header.Top>
             <HomeLayout.Header.Top.Left>
               <div
-                css={[S.headerLeft, common.cursorPointer, common.nonScroll]}
+                css={[S.headerLeft, common.cursorPointer, common.nonDrag]}
                 onClick={(e) => {
                   e.stopPropagation();
                   setIsDarakbangMenuOpened(!isDarakbangMenuOpened);

diff --git a/...ents/HomeMainContent/MyMoim/MyMoimListFilters/MyMoimListFilterTag/MyMoimListFilterTag.tsx b/...ents/HomeMainContent/MyMoim/MyMoimListFilters/MyMoimListFilterTag/MyMoimListFilterTag.tsx
@@ -15,10 +15,7 @@ export default function MyMoimListFilterTag(props: MyMoimListFilterTagProps) {
   const theme = useTheme();
 
   return (
-    <div
-      css={[S.tag({ theme, isSelected }), common.nonScroll]}
-      onClick={onClick}
-    >
+    <div css={[S.tag({ theme, isSelected }), common.nonDrag]} onClick={onClick}>
       {label}
     </div>
   );

diff --git a/frontend/src/pages/Moim/MainPage/components/MoimTabBar/MoimTabBar.tsx b/frontend/src/pages/Moim/MainPage/components/MoimTabBar/MoimTabBar.tsx
@@ -24,7 +24,7 @@ export default function MoimTabBar(props: MoimTabBarProps) {
           key={index}
           css={[
             S.tabItemStyle({ theme, isTurnedOn: currentTab === tab }),
-            common.nonScroll,
+            common.nonDrag,
           ]}
           onClick={() => onTabClick(tab)}
         >

diff --git a/frontend/src/pages/Mypage/MyPage.tsx b/frontend/src/pages/Mypage/MyPage.tsx
@@ -1,12 +1,12 @@
 import DarakbangNameWrapper from '@_components/DarakbangNameWrapper/DarakbangNameWrapper';
 import InformationLayout from '@_layouts/InformationLayout/InformationLayout';
+import MineInfoCard from './components/MineInfoCard/MineInfoCard';
 import NavigationBar from '@_components/NavigationBar/NavigationBar';
 import NavigationBarWrapper from '@_layouts/components/NavigationBarWrapper/NavigationBarWrapper';
 import { common } from '@_common/common.style';
 import useMyInfo from '@_hooks/queries/useMyInfo';
 import useNowDarakbangName from '@_hooks/queries/useNowDarakbangNameById';
 import { useTheme } from '@emotion/react';
-import MineInfoCard from './components/MineInfoCard/MineInfoCard';
 
 export default function MyPage() {
   const { myInfo, isLoading } = useMyInfo();
@@ -23,7 +23,7 @@ export default function MyPage() {
     <InformationLayout>
       <InformationLayout.Header>
         <InformationLayout.Header.Left>
-          <span css={[[theme.typography.h5, common.nonScroll]]}>
+          <span css={[[theme.typography.h5, common.nonDrag]]}>
             <DarakbangNameWrapper>{darakbangName}</DarakbangNameWrapper>
           </span>
         </InformationLayout.Header.Left>

diff --git a/frontend/src/pages/Mypage/components/MineInfoCard/MineInfoCard.tsx b/frontend/src/pages/Mypage/components/MineInfoCard/MineInfoCard.tsx
@@ -1,9 +1,9 @@
 import * as S from './MineInfoCard.style';
 
+import ProfileFrame from '@_components/ProfileFrame/ProfileFrame';
 import { common } from '@_common/common.style';
 import useNowDarakbangName from '@_hooks/queries/useNowDarakbangNameById';
 import { useTheme } from '@emotion/react';
-import ProfileFrame from '@_components/ProfileFrame/ProfileFrame';
 
 interface MineInfoCardProps {
   nickname: string;
@@ -24,9 +24,7 @@ export default function MineInfoCard(props: MineInfoCardProps) {
       <div css={S.MinetextWrapper}>
         <span css={theme.typography.s1}>안녕하세요</span>
         <span css={theme.typography.h4}>{nickname}</span>
-        <span css={[theme.typography.c1, common.nonScroll]}>
-          {darakbangName}
-        </span>
+        <span css={[theme.typography.c1, common.nonDrag]}>{darakbangName}</span>
       </div>
     </div>
   );

diff --git a/frontend/src/pages/Navigator/DarakbangInvitationRoute.tsx b/frontend/src/pages/Navigator/DarakbangInvitationRoute.tsx
@@ -5,17 +5,30 @@ import Button from '@_components/Button/Button';
 import CompleteLayout from '@_layouts/CompleteLayout/CompleteLayout';
 import MissingFallback from '@_components/MissingFallback/MissingFallback';
 import ROUTES from '@_constants/routes';
+import { setLastDarakbangId } from '@_common/lastDarakbangManager';
 import useDarakbangNameByCode from '@_hooks/queries/useDarakbangNameByCode';
+import useMyDarakbangs from '@_hooks/queries/useMyDarakbang';
 
 export default function DarakbangInvitationRoute() {
   const [searchParam] = useSearchParams();
   const navigate = useNavigate();
 
   const code = searchParam.get('code');
   const { darakbangName } = useDarakbangNameByCode(code || '');
+  const { myDarakbangs } = useMyDarakbangs();
   const isRightCode = darakbangName && darakbangName !== '';
   if (darakbangName === undefined) return null;
+  if (myDarakbangs === undefined) return null;
   if (isRightCode) {
+    const nowDarakbang = myDarakbangs.find(
+      (darakbang) => darakbang.name === darakbangName,
+    );
+    const isParticipated = nowDarakbang !== undefined;
+    if (isParticipated) {
+      alert('이미 참여한 다락방입니다');
+      setLastDarakbangId(nowDarakbang.darakbangId);
+      return <Navigate to={ROUTES.main} replace />;
+    }
     if (code) setInviteCode(code);
     return <Navigate to={ROUTES.darakbangNickname} replace />;
   }

diff --git a/frontend/src/pages/Navigator/SlashRoute.tsx b/frontend/src/pages/Navigator/SlashRoute.tsx
@@ -10,16 +10,16 @@ export default function SlashRoute() {
 
   if (token) {
     if (lastDarakbangId) {
-      return <Navigate to={GET_ROUTES.nowDarakbang.main()} />;
+      return <Navigate to={GET_ROUTES.nowDarakbang.main()} replace />;
     }
     if (!lastDarakbangId) {
-      return <Navigate to={ROUTES.darakbangSelectOption} />;
+      return <Navigate to={ROUTES.darakbangSelectOption} replace />;
     }
   }
 
   if (!token) {
-    return <Navigate to={ROUTES.home} />;
+    return <Navigate to={ROUTES.home} replace />;
   }
 
-  return <Navigate to={ROUTES.home} />;
+  return <Navigate to={ROUTES.home} replace />;
 }
diff --git a/frontend/src/pages/Please/PleasePage/PleasePage.tsx b/frontend/src/pages/Please/PleasePage/PleasePage.tsx
@@ -6,11 +6,11 @@ import NavigationBarWrapper from '@_layouts/components/NavigationBarWrapper/Navi
 import PleaseLayout from '@_layouts/PleaseLayout/PleaseLayout';
 import PleaseList from '@_pages/Please/PleasePage/components/PleaseList/PleaseList';
 import PlusButton from '@_components/PlusButton/PlusButton';
+import RefreshButton from '@_components/RefreshButton/RefreshButton';
 import { common } from '@_common/common.style';
 import { useNavigate } from 'react-router-dom';
 import useNowDarakbangName from '@_hooks/queries/useNowDarakbangNameById';
 import { useTheme } from '@emotion/react';
-import RefreshButton from '@_components/RefreshButton/RefreshButton';
 
 export default function PleasePage() {
   const { darakbangName } = useNowDarakbangName();
@@ -23,7 +23,7 @@ export default function PleasePage() {
       <PleaseLayout>
         <PleaseLayout.Header>
           <PleaseLayout.Header.Left>
-            <h1 css={[common.nonScroll, theme.typography.h5]}>
+            <h1 css={[common.nonDrag, theme.typography.h5]}>
               <DarakbangNameWrapper>{darakbangName}</DarakbangNameWrapper>
             </h1>
           </PleaseLayout.Header.Left>

diff --git a/...rc/pages/Please/PleasePage/components/PleaseList/PleaseCardList/PleaseCard/PleaseCard.tsx b/...rc/pages/Please/PleasePage/components/PleaseList/PleaseCardList/PleaseCard/PleaseCard.tsx
@@ -38,9 +38,7 @@ export default function PleaseCard(props: PleaseCardProps) {
           <div css={S.actionIconWrapper({ theme })}>
             <InterestingIcon isActive={please.isInterested} />
           </div>
-          <div css={[S.actionText({ theme }), common.nonScroll]}>
-            관심있어요
-          </div>
+          <div css={[S.actionText({ theme }), common.nonDrag]}>관심있어요</div>
         </button>
       </div>
     </div>

diff --git a/frontend/src/utils/formatters.ts b/frontend/src/utils/formatters.ts
@@ -61,7 +61,3 @@ export const formatHhmmToKoreanWithPrefix = (
 
   return `오전 ${hour}:${minute.toString().padStart(2, '00')}`;
 };
-
-export const removeBaseUrl = (redirectUrl: string) => {
-  return redirectUrl.replace(`${process.env.BASE_URL}/`, '');
-};