수정사항 반영 (issue #746) (#747)

* refactor: 커스텀 뮤테이션 인자 변경 * Merge branch 'dev' of https://github.com/woowacourse-teams/2024-devel-up into dev * remove: 파일 삭제 * refactor: 수정사항 반영 * refactor: privateRotue * refacotr: a링크로 대체 * fix: 링크 삭제 * design: 수정사항 반영 * design: 수정사항 반영
woowacourse-teams · Oct 24, 2024 · 808eb30 · 808eb30
1 parent 439bae2
commit 808eb30
Show file tree

Hide file tree

Showing 9 changed files with 47 additions and 23 deletions.
diff --git a/frontend/src/components/DashBoard/DashboardDiscussion/DashboardDiscussion.styled.ts b/frontend/src/components/DashBoard/DashboardDiscussion/DashboardDiscussion.styled.ts
@@ -81,13 +81,19 @@ export const ImageCommentWrapper = styled.div`
 export const TextWrapper = styled.div`
   display: flex;
   flex-direction: column;
+  width: 50rem;
+
+  ${media.medium`
+  width:18rem
+    `}
 `;
 
 export const CommentText = styled.span`
   ${(props) => props.theme.font.body}
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
+  width: 80%;
 `;
 
 export const SubText = styled.span`

diff --git a/frontend/src/components/DashBoard/DashboardDiscussion/DiscussionItem.tsx b/frontend/src/components/DashBoard/DashboardDiscussion/DiscussionItem.tsx
@@ -6,7 +6,7 @@ import { formatDateString } from '@/utils/formatDateString';
 interface DiscussionItemProps {
   id: number;
   mission: string;
-  hashTags: HashTag[];
+  hashTags?: HashTag[];
   title: string;
   imageUrl: string;
   commentCount: number;
@@ -27,9 +27,10 @@ export default function DiscussionItem({
       <S.TextWrapper>
         <S.HashTagWrapper>
           {mission && <S.HashTag $isTitle>{mission}</S.HashTag>}
-          {hashTags.map((hashTag) => {
-            return <S.HashTag key={hashTag.id}>{hashTag.name}</S.HashTag>;
-          })}
+          {hashTags &&
+            hashTags.map((hashTag) => {
+              return <S.HashTag key={hashTag.id}>{hashTag.name}</S.HashTag>;
+            })}
         </S.HashTagWrapper>
         <S.CommentText>{title}</S.CommentText>
         <S.SubText>{formatDateString(createdAt)}</S.SubText>

diff --git a/frontend/src/components/DashBoard/DashboardDiscussion/index.tsx b/frontend/src/components/DashBoard/DashboardDiscussion/index.tsx
@@ -30,16 +30,16 @@ export default function DashBoardDiscussionList() {
 
   return (
     <>
-      {!discussionList.length ? (
+      {!discussionList?.length ? (
         <NoContent type="dashboardDiscussion" />
       ) : (
         <S.Container>
-          {discussionList.map((discussion) => {
+          {discussionList?.map((discussion) => {
             return (
               <DiscussionItem
                 key={discussion.id}
                 id={discussion.id}
-                hashTags={discussion.hashTags}
+                hashTags={discussion?.hashTags || []}
                 title={discussion.title}
                 mission={discussion.mission}
                 imageUrl={discussion.member?.imageUrl}

diff --git a/frontend/src/components/common/Error/ErrorLogo.tsx b/frontend/src/components/common/Error/ErrorLogo.tsx
@@ -1,12 +1,15 @@
 import * as S from '@/components/Header/Header.styled';
+import LogoImg from '@/assets/images/logo.svg';
 
 export default function ErrorLogo() {
   return (
     <>
       <S.Container>
         <S.Wrapper>
           <S.LeftPart>
-            <S.Logo>🚀 DEVEL UP</S.Logo>
+            <S.Logo>
+              <LogoImg width={30} height={30} /> DEVEL UP
+            </S.Logo>
           </S.LeftPart>
         </S.Wrapper>
       </S.Container>

diff --git a/frontend/src/index.tsx b/frontend/src/index.tsx
@@ -284,17 +284,17 @@ export const router = createBrowserRouter(routes, {
   basename: ROUTES.main,
 });
 
-// async function enableMocking() {
-//   if (process.env.NODE_ENV !== 'development') {
-//     return;
-//   }
+async function enableMocking() {
+  if (process.env.NODE_ENV !== 'development') {
+    return;
+  }
 
-//   const { worker } = await import('./mocks/browser');
+  const { worker } = await import('./mocks/browser');
 
-//   // `worker.start()` returns a Promise that resolves
-//   // once the Service Worker is up and ready to intercept requests.
-//   return worker.start();
-// }
+  // `worker.start()` returns a Promise that resolves
+  // once the Service Worker is up and ready to intercept requests.
+  return worker.start();
+}
 
 // enableMocking().then(() => {
 //   root.render(

diff --git a/frontend/src/pages/DashboardPage/DashBoardPageLayout/DashBoardPageLayout.styled.ts b/frontend/src/pages/DashboardPage/DashBoardPageLayout/DashBoardPageLayout.styled.ts
@@ -10,7 +10,6 @@ export const Container = styled.div`
   width: 100rem;
 
   ${media.large`
-  width: 80rem;
     padding: 3rem 0;
     gap: 3rem;
   `}

diff --git a/frontend/src/pages/DashboardPage/DashBoardPageLayout/index.tsx b/frontend/src/pages/DashboardPage/DashBoardPageLayout/index.tsx
@@ -1,7 +1,7 @@
 import { createContext, type PropsWithChildren, useContext, useEffect, useState } from 'react';
 import useUserInfo from '@/hooks/useUserInfo';
 import * as S from './DashBoardPageLayout.styled';
-import { Link, useLocation } from 'react-router-dom';
+import { useLocation } from 'react-router-dom';
 
 const PATH_INFO = [
   {
@@ -63,6 +63,11 @@ export default function DashboardPageLayout({ children }: PropsWithChildren) {
   const { data: userInfo } = useUserInfo();
   const currentPathText = PATH_INFO.find((item) => item.name === path);
 
+  const URL =
+    process.env.NODE_ENV === 'development'
+      ? 'https://dev.devel-up.co.kr'
+      : 'https://devel-up.co.kr';
+
   return (
     <S.Container>
       <S.ProfileAndCurrentPathWrapper>
@@ -78,9 +83,9 @@ export default function DashboardPageLayout({ children }: PropsWithChildren) {
             return (
               <S.LinkWrapper key={index}>
                 <S.Circle $isSelected={path.name === location.pathname} />
-                <Link to={path.name}>
+                <a href={`${URL}${path.name}`}>
                   <S.Path $isSelected={path.name === location.pathname}>{path.text}</S.Path>
-                </Link>
+                </a>
               </S.LinkWrapper>
             );
           })}

diff --git a/frontend/src/pages/DashboardPage/Discussion/index.tsx b/frontend/src/pages/DashboardPage/Discussion/index.tsx
@@ -1,5 +1,10 @@
 import DashBoardDiscussionList from '@/components/DashBoard/DashboardDiscussion';
+import SpinnerSuspense from '@/components/common/SpinnerSuspense';
 
 export default function DashboardDiscussionPage() {
-  return <DashBoardDiscussionList />;
+  return (
+    <SpinnerSuspense>
+      <DashBoardDiscussionList />
+    </SpinnerSuspense>
+  );
 }
diff --git a/frontend/src/pages/DashboardPage/DiscussionComment/index.tsx b/frontend/src/pages/DashboardPage/DiscussionComment/index.tsx
@@ -1,5 +1,10 @@
 import DiscussionCommentList from '@/components/DashBoard/DiscussionComment';
+import SpinnerSuspense from '@/components/common/SpinnerSuspense';
 
 export default function DashboardDiscussionCommentPage() {
-  return <DiscussionCommentList />;
+  return (
+    <SpinnerSuspense>
+      <DiscussionCommentList />
+    </SpinnerSuspense>
+  );
 }