..

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

@@ -15,9 +15,11 @@ import {
 } from '@/widgets/sub-layout/use-sub-layout';
 import useIntersectionObserver from '@/widgets/intersection-observer';
 import { NoticeDetail } from '@/entities/support/ui/detail/notice-detail';
+import { useParams } from 'react-router';
 
 export const NoticeListPage = () => {
   const { navigate } = useNavigate();
+  const { seq } = useParams();
   const { t } = useTranslation();
 
   const [onActionIntersect, setOnActionIntersect] = useState<boolean>(false);
@@ -26,7 +28,7 @@ export const NoticeListPage = () => {
   const [searchKeyword, setSearchKeyword] = useState<string>('');
   const [resultList, setResultList] = useState<Array<NoticeItem>>([]);
   const [detailOn, setDetailOn] = useState<boolean>(false);
-  const [detailSeq, setDetailSeq] = useState<number>(0);
+  const [detailSeq, setDetailSeq] = useState<number | string>();
 
   useSetHeaderTitle(t('support.notice.title'));
   useSetHeaderType(HeaderType.LeftArrow);
@@ -133,6 +135,12 @@ export const NoticeListPage = () => {
   useEffect(() => {
     callList();
   }, [informCl]);
+  useEffect(() => {
+    if(seq){
+      setDetailOn(true);
+      setDetailSeq(parseInt(seq));
+    }
+  }, [seq]);
 
   return (
     <>

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

@@ -16,9 +16,11 @@ import {
   useSetOnBack
 } from '@/widgets/sub-layout/use-sub-layout';
 import { QnaDetail } from '@/entities/support/ui/detail/qna-detail';
+import { useParams } from 'react-router';
 
 export const QnaListPage = () => {
   const { navigate } = useNavigate();
+  const { seq } = useParams();
   const { t } = useTranslation();
   
   const midOptions = useStore.getState().UserStore.selectOptionsMids;
@@ -33,7 +35,7 @@ export const QnaListPage = () => {
   const [statusCode, setStatusCode] = useState<string>(''); // 02, 03
   const [resultList, setResultList] = useState<Array<QnaItem>>([]);
   const [detailOn, setDetailOn] = useState<boolean>(false);
-  const [detailQnaItem, setDetailQnaItem] = useState<QnaItem>({});
+  const [detailSeq, setDetailSeq] = useState<string | number>();
  
   useSetHeaderTitle(t('support.qna.title'));
   useSetHeaderType(HeaderType.LeftArrow);
@@ -108,8 +110,8 @@ export const QnaListPage = () => {
 
   const setDetailData = (detailData: DetailData) => {
     setDetailOn(detailData.detailOn);
-		if(detailData?.qnaItem){
-			setDetailQnaItem(detailData?.qnaItem);
+		if(detailData?.seq){
+			setDetailSeq(detailData?.seq);
 		}
   };
   
@@ -138,6 +140,12 @@ export const QnaListPage = () => {
     callList();
   }, [mid, statusCode]);
 
+  useEffect(() => {
+    if(!!seq){
+
+    }
+  });
+
   return (
     <>
       <main>
@@ -191,7 +199,7 @@ export const QnaListPage = () => {
       <QnaDetail
         detailOn={ detailOn }
         setDetailOn={ setDetailOn }
-        qnaItem={ detailQnaItem }
+        seq={ detailSeq }
       ></QnaDetail>
     </>
   );

src/pages/support/support-pages.tsx

@@ -12,12 +12,14 @@ export const SupportPages = () => {
       <SentryRoutes>
         <Route path={ROUTE_NAMES.support.notice.base}>
           <Route path={ROUTE_NAMES.support.notice.list} element={<NoticeListPage />} />
+          <Route path={ROUTE_NAMES.support.notice.list + '/:seq'} element={<NoticeListPage />} />
         </Route>
         <Route path={ROUTE_NAMES.support.faq.base}>
           <Route path={ROUTE_NAMES.support.faq.list} element={<FaqListPage />} />
         </Route>
         <Route path={ROUTE_NAMES.support.qna.base}>
           <Route path={ROUTE_NAMES.support.qna.list} element={<QnaListPage />} />
+          <Route path={ROUTE_NAMES.support.qna.list + '/:seq'} element={<QnaListPage />} />
           <Route path={ROUTE_NAMES.support.qna.register} element={<QnaRegisterPage />} />
         </Route>
       </SentryRoutes>