버그 픽스

src/entities/home/ui/home-notice-item.tsx

@@ -1,8 +1,9 @@
-import { NoticeItemProps } from '@/entities/support/model/types';
-import { IMAGE_ROOT } from '@/shared/constants/common';
+import moment from 'moment';
 import { PATHS } from '@/shared/constants/paths';
 import { useNavigate } from '@/shared/lib/hooks/use-navigate';
-import moment from 'moment';
+import { NoticeItemProps } from '@/entities/support/model/types';
+import { useTranslation } from 'react-i18next';
+import { IMAGE_ROOT } from '@/shared/constants/common';
 
 export const HomeNoticeItem = ({
   id,
@@ -12,6 +13,7 @@ export const HomeNoticeItem = ({
   isNew
 }: NoticeItemProps) => {
   const { navigate } = useNavigate();
+  const { t } = useTranslation();
 
   const onClickToDetail = () => {
     navigate(PATHS.support.notice.detail, {
@@ -30,7 +32,7 @@ export const HomeNoticeItem = ({
       >
         <div className="notice-content">
           <div className="notice-title">{ title }</div>
-          <div className="notice-meta">{ category}<span>{ moment(regDate).format('YY년 MM월 DD일') }</span></div>
+          <div className="notice-meta">{ t(`support.notice.categories.${category}`) }<span>{ moment(regDate).format('YY년 MM월 DD일') }</span></div>
         </div>
         <div className="notice-arrow">
           <img 

src/entities/support/ui/notice-item.tsx

@@ -1,7 +1,7 @@
+import moment from 'moment';
 import { PATHS } from '@/shared/constants/paths';
 import { useNavigate } from '@/shared/lib/hooks/use-navigate';
 import { NoticeItemProps } from '../model/types';
-import moment from 'moment';
 import { useTranslation } from 'react-i18next';
 
 export const SupportNoticeItem = ({
@@ -9,7 +9,7 @@ export const SupportNoticeItem = ({
   title,
   category,
   regDate,
-  isNew // eslint-disable-line @typescript-eslint/no-unused-vars
+  isNew
 }: NoticeItemProps) => {
   const { navigate } = useNavigate();
   const { t } = useTranslation();

src/pages/support/faq/detail-page.tsx

@@ -31,15 +31,17 @@ export const FaqDetailPage = () => {
   return (
     <>
       <main>
-        <div className="tab-content">
-          <div className="tab-pane sub active">
-            <div className="faq-detail">
-              <div className="faq-detail__title">{ title }</div>
-              <div className="faq-detail__divider"></div>
-              <div className="faq-detail__body" dangerouslySetInnerHTML={{ __html: contents || '' }}></div>
+        { contents &&
+          <div className="tab-content">
+            <div className="tab-pane sub active">
+              <div className="faq-detail">
+                <div className="faq-detail__title">{ title }</div>
+                <div className="faq-detail__divider"></div>
+                <div className="faq-detail__body" dangerouslySetInnerHTML={{ __html: contents || '' }}></div>
+              </div>
             </div>
           </div>
-        </div>
+        }
       </main>
     </>
   );

src/pages/support/notice/detail-page.tsx

@@ -50,25 +50,26 @@ export const NoticeDetailPage = () => {
 
   useEffect(() => {
     callDetail();
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
   return (
     <>
       <main>
-        <div className="tab-content">
-          <div className="tab-pane sub active">
-            <div className="option-list">
-              <div className="notice-detail">
-                <div className="notice-detail__title">{ result.title }</div>
-                <div className="notice-detail__meta">{ moment(result.regDate).format('YYYY.MM.DD') } | { t(`support.notice.categories.${result.category}`) }</div>
-                <div className="notice-detail__divider"></div>
-                <div className="notice-detail__body" dangerouslySetInnerHTML={{ __html: result.content || '' }}></div>
+        { result.category &&
+          <div className="tab-content">
+            <div className="tab-pane sub active">
+              <div className="option-list">
+                <div className="notice-detail">
+                  <div className="notice-detail__title">{ result.title }</div>
+                  <div className="notice-detail__meta">{ moment(result.regDate).format('YYYY.MM.DD') } | { t(`support.notice.categories.${result.category}`) }</div>
+                  <div className="notice-detail__divider"></div>
+                  <div className="notice-detail__body" dangerouslySetInnerHTML={{ __html: result.content || '' }}></div>
+                </div>
               </div>
             </div>
           </div>
-        </div>
-    </main>
+        }
+      </main>
     </>
   );
 };

src/pages/support/qna/detail-page.tsx

@@ -47,39 +47,41 @@ export const QnaDetailPage = () => {
   return (
     <>
       <main>
-        <div className="tab-content">
-          <div className="tab-pane active">
-            <div className="inq-detail">
-              <div className="inq-detail__head">
-                <div className="inq-detail__row">
-                  <span className="inq-badge">제목</span>
-                  <span className="inq-head-text bold">{ title }</span>
+        { statusCode && 
+          <div className="tab-content">
+            <div className="tab-pane active">
+              <div className="inq-detail">
+                <div className="inq-detail__head">
+                  <div className="inq-detail__row">
+                    <span className="inq-badge">제목</span>
+                    <span className="inq-head-text bold">{ title }</span>
+                  </div>
+                  <div className="inq-detail__row">
+                    <span className="inq-badge">유형</span>
+                    <span className="inq-head-text">{ t(`support.qna.categories.${requestType}`) }</span>
+                  </div>
+                  <div className="inq-detail__row">
+                    <span className="inq-badge">등록일</span>
+                    <span className="inq-head-text">{ moment(requestDate).format('YYYY.MM.DD') }</span>
+                  </div>
+                  <div className="inq-detail__row">
+                    <span className="inq-badge">답변일</span>
+                    <span className="inq-head-text">{ moment(answerDate).format('YYYY.MM.DD') }</span>
+                  </div>
                 </div>
-                <div className="inq-detail__row">
-                  <span className="inq-badge">유형</span>
-                  <span className="inq-head-text">{ t(`support.qna.categories.${requestType}`) }</span>
+                <div className="inq-detail__divider"></div>
+                <div className="inq-detail__section">
+                  <div className="inq-detail__section-title">문의 답변</div>
+                  <div className="inq-detail__body" dangerouslySetInnerHTML={{ __html: answer || '' }}></div>
                 </div>
-                <div className="inq-detail__row">
-                  <span className="inq-badge">등록일</span>
-                  <span className="inq-head-text">{ moment(requestDate).format('YYYY.MM.DD') }</span>
+                <div className="inq-detail__section">
+                  <div className="inq-detail__section-title">문의 내용</div>  
+                  <div className="inq-detail__body" dangerouslySetInnerHTML={{ __html: contents || '' }}></div>
                 </div>
-                <div className="inq-detail__row">
-                  <span className="inq-badge">답변일</span>
-                  <span className="inq-head-text">{ moment(answerDate).format('YYYY.MM.DD') }</span>
-                </div>
-              </div>
-              <div className="inq-detail__divider"></div>
-              <div className="inq-detail__section">
-                <div className="inq-detail__section-title">문의 답변</div>
-                <div className="inq-detail__body" dangerouslySetInnerHTML={{ __html: answer || '' }}></div>
-              </div>
-              <div className="inq-detail__section">
-                <div className="inq-detail__section-title">문의 내용</div>  
-                <div className="inq-detail__body" dangerouslySetInnerHTML={{ __html: contents || '' }}></div>
               </div>
             </div>
           </div>
-        </div>
+        }
       </main>
     </>
   );