첫 커밋

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

@@ -0,0 +1,18 @@
+import { HeaderType } from '@/entities/common/model/types';
+import { 
+  useSetHeaderTitle,
+  useSetHeaderType,
+  useSetFooterMode
+} from '@/widgets/sub-layout/use-sub-layout';
+
+export const FaqDetailPage = () => {
+  useSetHeaderTitle('자주 묻는 질문');
+  useSetHeaderType(HeaderType.RightClose);
+  useSetFooterMode(false);
+
+  return (
+    <>
+
+    </>
+  );
+};

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

@@ -0,0 +1,18 @@
+import { HeaderType } from '@/entities/common/model/types';
+import { 
+	useSetHeaderTitle,
+	useSetHeaderType,
+	useSetFooterMode
+} from '@/widgets/sub-layout/use-sub-layout';
+
+export const FaqListPage = () => {
+  useSetHeaderTitle('자주 묻는 질문');
+  useSetHeaderType(HeaderType.LeftArrow);
+  useSetFooterMode(true);
+
+  return (
+    <>
+
+    </>
+  );
+};

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

@@ -0,0 +1,48 @@
+import { HeaderType } from '@/entities/common/model/types';
+import { 
+  useSetHeaderTitle,
+  useSetHeaderType,
+  useSetFooterMode
+} from '@/widgets/sub-layout/use-sub-layout';
+
+export const NoticeDetailPage = () => {
+  useSetHeaderTitle('공지사항');
+  useSetHeaderType(HeaderType.RightClose);
+  useSetFooterMode(false);
+
+  return (
+    <>
+      <main>
+        <div className="tab-content">
+          <div className="tab-pane sub active" id="tab1">
+            <div className="option-list pb-120">
+              <div className="notice-detail">
+                <div className="notice-detail__title">[관리비 출금] 5월 관리비(4월 사용료) 출금일 변경(정정)</div>
+                <div className="notice-detail__meta">2025.08.19 | 카테고리</div>
+                <div className="notice-detail__divider"></div>
+                <div className="notice-detail__body">안녕하세요. 페이앳 관리자입니다.
+
+                    ‘25년 5월 페이앳 관리비(4월 사용료)출금일자 변경을 다음과 같이 공지드립니다.
+
+                    관리비 청구 데이터 확정 지연으로 부득이하게 금번 5월 페이앳 관리비 출금일자가 아래와 같이 변경되어 출금될 예정입니다.
+
+                    서비스 운영에 참고하시기 바라며, 서비스 이용에 불편드려 죄송합니다.
+
+                    -----------  다음  -----------
+
+                    기존 : 매월 15일(영업일 기준)/*5월 출금일 : 19일(월)
+
+                    변경 : 5월 19일(월)
+
+                    세금계산서 발행일 : 5월 19일(*19일 출금분에 한함)
+
+                    -----------------------------
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+    </main>
+    </>
+  );
+};

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

@@ -0,0 +1,18 @@
+import { HeaderType } from '@/entities/common/model/types';
+import { 
+	useSetHeaderTitle,
+	useSetHeaderType,
+	useSetFooterMode
+} from '@/widgets/sub-layout/use-sub-layout';
+
+export const NoticeListPage = () => {
+  useSetHeaderTitle('공지사항');
+  useSetHeaderType(HeaderType.LeftArrow);
+  useSetFooterMode(true);
+
+  return (
+    <>
+
+    </>
+  );
+};

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

@@ -0,0 +1,18 @@
+import { HeaderType } from '@/entities/common/model/types';
+import { 
+  useSetHeaderTitle,
+  useSetHeaderType,
+  useSetFooterMode
+} from '@/widgets/sub-layout/use-sub-layout';
+
+export const QnaDetailPage = () => {
+  useSetHeaderTitle('1:1 문의');
+  useSetHeaderType(HeaderType.RightClose);
+  useSetFooterMode(false);
+
+  return (
+    <>
+
+    </>
+  );
+};

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

@@ -0,0 +1,18 @@
+import { HeaderType } from '@/entities/common/model/types';
+import { 
+	useSetHeaderTitle,
+	useSetHeaderType,
+	useSetFooterMode
+} from '@/widgets/sub-layout/use-sub-layout';
+
+export const QnaListPage = () => {
+  useSetHeaderTitle('1:1 문의');
+  useSetHeaderType(HeaderType.LeftArrow);
+  useSetFooterMode(true);
+
+  return (
+    <>
+
+    </>
+  );
+};

src/pages/support/support-pages.tsx

@@ -0,0 +1,30 @@
+import { Route } from 'react-router-dom';
+import { SentryRoutes } from '@/shared/configs/sentry';
+import { ROUTE_NAMES } from '@/shared/constants/route-names';
+import { NoticeListPage } from './notice/list-page';
+import { NoticeDetailPage } from './notice/detail-page';
+import { FaqListPage } from './faq/list-page';
+import { FaqDetailPage } from './faq/detail-page';
+import { QnaListPage } from './qna/list-page';
+import { QnaDetailPage } from './qna/detail-page';
+
+export const SupportPages = () => {
+  return (
+    <>
+      <SentryRoutes>
+        <Route path={ROUTE_NAMES.support.notice.base}>
+          <Route path={ROUTE_NAMES.support.notice.list} element={<NoticeListPage />} />
+          <Route path={ROUTE_NAMES.support.notice.detail} element={<NoticeDetailPage />} />
+        </Route>
+        <Route path={ROUTE_NAMES.support.faq.base}>
+          <Route path={ROUTE_NAMES.support.faq.list} element={<FaqListPage />} />
+          <Route path={ROUTE_NAMES.support.faq.detail} element={<FaqDetailPage />} />
+        </Route>
+        <Route path={ROUTE_NAMES.support.qna.base}>
+          <Route path={ROUTE_NAMES.support.qna.list} element={<QnaListPage />} />
+          <Route path={ROUTE_NAMES.support.qna.detail} element={<QnaDetailPage />} />
+        </Route>
+      </SentryRoutes>
+    </>
+  );
+};