feat : 문의보기 preview 별도 훅으로 생성

Author: layout-SY

src/api/customerService.api.ts

@@ -29,6 +29,17 @@ export const getNotice = async (params: NoticeSearch) => {
   }
 };
 
+export const getNoticePreview = async () => {
+  try {
+    const response = await httpClient.get<ApiNotice>(`/notice`);
+
+    return response.data.data;
+  } catch (e) {
+    console.error(e);
+    throw e;
+  }
+};
+
 export const getNoticeDetail = async (id: string) => {
   try {
     const response = await httpClient.get<ApiNoticeDetail>(`/notice/${id}`);

src/components/admin/previewComponent/noticePreview/NoticePreview.tsx

@@ -1,13 +1,10 @@
 import * as S from './NoticePreview.styled';
-import { useGetNotice } from '../../../../hooks/user/useGetNotice';
 import line from '../../../../assets/line.svg';
 import { Spinner } from '../../../common/loadingSpinner/LoadingSpinner.styled';
+import { useGetNoticePreview } from '../../../../hooks/admin/useGetAllNoticePreview';
 
 const NoticePreview = () => {
-  const { noticeData, isLoading, isFetching } = useGetNotice({
-    keyword: '',
-    page: 1,
-  });
+  const { noticeData, isLoading, isFetching } = useGetNoticePreview();
 
   if (isLoading || isFetching) {
     return (
@@ -17,13 +14,13 @@ const NoticePreview = () => {
     );
   }
 
-  if (!noticeData?.notices || noticeData.notices.length === 0) {
+  if (!noticeData) {
     return <S.Container>공지사힝이 없습니다.</S.Container>;
   }
 
   return (
     <S.Container>
-      {noticeData.notices.map((notice) => (
+      {noticeData.map((notice) => (
         <S.Wrapper key={notice.id}>
           <S.Dot src={line} />
           <S.NoticeTitle>{notice.title}</S.NoticeTitle>

src/hooks/admin/useGetAllNoticePreview.ts

@@ -0,0 +1,19 @@
+import { useQuery } from '@tanstack/react-query';
+import { CustomerService } from '../queries/keys';
+import { getNoticePreview } from '../../api/customerService.api';
+
+export const useGetNoticePreview = () => {
+  const {
+    data: noticeData,
+    isLoading,
+    isFetching,
+  } = useQuery({
+    queryKey: [CustomerService.noticePreview],
+    queryFn: () => getNoticePreview(),
+    select: (notice) => notice.notices.slice(0, 5),
+    staleTime: Infinity,
+    gcTime: Infinity,
+  });
+
+  return { noticeData, isLoading, isFetching };
+};