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;
+}