diff --git a/src/components/organisms/ShareListItem.tsx b/src/components/organisms/ShareListItem.tsx index ca36e48..518c39c 100644 --- a/src/components/organisms/ShareListItem.tsx +++ b/src/components/organisms/ShareListItem.tsx @@ -6,22 +6,16 @@ import React from 'react'; import dayjs from 'dayjs'; const ShareListItem: React.FC<{ - data: { - id: number; - thumbnail: string | null; - title: string; - location: string; - date: dayjs.Dayjs; - }; + data: ShareData; }> = ({ data }) => { return ( - {data.thumbnail ? ( + {data.thumbNailImage ? ( - {dayjs(data.date).format('MM월 DD일 A HH:mm')} + {`${dayjs(data.shareDate).format('MM월 DD일')} ${data.shareTime.hour} : ${data.shareTime.minute}`}

diff --git a/src/hooks/queries/queryKeys.ts b/src/hooks/queries/queryKeys.ts index 670e47a..42585d8 100644 --- a/src/hooks/queries/queryKeys.ts +++ b/src/hooks/queries/queryKeys.ts @@ -1,6 +1,7 @@ export const queryKeys = { INGREDIENT: (id?: number) => (id ? ['ingredient', id] : ['ingredient']), KAKAO: () => ['kakao'], + SHARES: () => ['shares'], } as const; export type QueryKeys = (typeof queryKeys)[keyof typeof queryKeys]; diff --git a/src/hooks/queries/share/index.ts b/src/hooks/queries/share/index.ts new file mode 100644 index 0000000..a6b209c --- /dev/null +++ b/src/hooks/queries/share/index.ts @@ -0,0 +1 @@ +export { default as useGetShares } from './useGetShares'; diff --git a/src/hooks/queries/share/useGetShares.ts b/src/hooks/queries/share/useGetShares.ts new file mode 100644 index 0000000..dadda6c --- /dev/null +++ b/src/hooks/queries/share/useGetShares.ts @@ -0,0 +1,7 @@ +import { queryKeys } from '../queryKeys'; +import { useBaseQuery } from '../useBaseQuery'; + +const useGetShares = () => + useBaseQuery(queryKeys.SHARES(), '/shares', true); + +export default useGetShares; diff --git a/src/pages/share/index.tsx b/src/pages/share/index.tsx index 0fddb89..dbac79c 100644 --- a/src/pages/share/index.tsx +++ b/src/pages/share/index.tsx @@ -14,6 +14,8 @@ import { PlusIcon } from '@/assets/icons'; import { type SortLabel, type TabLabel } from '@/types/common'; import dayjs from 'dayjs'; import Link from 'next/link'; +import { useGetShares } from '@/hooks/queries/share'; +import { SuspenseFallback } from '@/components/templates'; const TABS: TabLabel[] = [ { label: '나눔 신청', value: 'enroll' }, @@ -50,6 +52,12 @@ const SharePage: NextPage = () => { const [curTab, setCurTab] = useState(TABS[0]); const [curSortType, setCurSortType] = useState(SORT_TYPES[0]); const { isOpen, onOpen, onClose } = useDisclosure(); + const { data } = useGetShares(); + console.log(data?.data); + + if (!data?.data) { + return ; + } return ( <> @@ -76,8 +84,8 @@ const SharePage: NextPage = () => {
- {MOCK_DATA.data.map((ele) => ( - + {data?.data.map((ele) => ( + ))}
diff --git a/src/types/share/index.d.ts b/src/types/share/index.d.ts new file mode 100644 index 0000000..b9ccb6c --- /dev/null +++ b/src/types/share/index.d.ts @@ -0,0 +1,18 @@ +interface ShareData { + shareId: number; + title: string; + itemName: string; + content: string; + shareTime: { + hour: number; + minute: number; + second: number; + nano: number; + }; + shareDate: string; + limitDate: string; + limitPerson: number; + location: string; + status: string; + thumbNailImage: string; +}