From e932cdc65b3cf620c97f2dea53fbe95cf0e94417 Mon Sep 17 00:00:00 2001 From: waterglasses Date: Tue, 24 Jan 2023 14:05:05 +0900 Subject: [PATCH 01/16] =?UTF-8?q?[FE-150]=20feat:=20=EB=82=A0=EC=A7=9C?= =?UTF-8?q?=EC=97=90=20=EB=94=B0=EB=A5=B8=20=EB=A0=88=EC=BD=94=EB=93=9C=20?= =?UTF-8?q?=EA=B0=80=EC=A0=B8=EC=98=A4=EA=B8=B0=20API=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/record.ts | 16 ++++++++++++++++ src/types/recordData.ts | 31 ++++++++++++++++++++++--------- 2 files changed, 38 insertions(+), 9 deletions(-) diff --git a/src/apis/record.ts b/src/apis/record.ts index 5f7866b..592785e 100644 --- a/src/apis/record.ts +++ b/src/apis/record.ts @@ -1,3 +1,5 @@ +import { Axios, AxiosResponse } from 'axios' +import { IMyRecordRequestParam, IRecordByDateList } from 'types/recordData' import { baseInstance } from './instance' const MEMORY_RECORD_SIZE = 7 @@ -36,3 +38,17 @@ export const deleteRecord = async (recordId: string | undefined) => { return res.data } } + +export const getRecordByDate = ({ + date, + page, + size, +}: IMyRecordRequestParam): Promise> => { + return baseInstance.get(`/record`, { + params: { + date, + page, + size, + }, + }) +} diff --git a/src/types/recordData.ts b/src/types/recordData.ts index 88d5b89..ff84667 100644 --- a/src/types/recordData.ts +++ b/src/types/recordData.ts @@ -11,15 +11,6 @@ export interface IRecordDataType { imageUrls: string[] } -export interface ITodayRecord { - title: string - categoryName: string - commentCount: number - iconName: string - colorName: string - createdAt: string -} - export interface IMemoryRecordList { hasNextPage: boolean isFirstPage: boolean @@ -39,3 +30,25 @@ export interface IRecordMemoryComment { commentId: number content: string } + +export interface IRecordByDate { + recordId: number + title: string + categoryName: string + commentCount: number + iconName: string + colorName: string + createdAt: string +} + +export interface IRecordByDateList { + recordByDateDtos: IRecordByDate[] + totalCount: number + totalPage: number +} + +export interface IMyRecordRequestParam { + date: string + page: number + size: number +} From 642e753b53d91710979eb9e757622470469a09e9 Mon Sep 17 00:00:00 2001 From: waterglasses Date: Tue, 24 Jan 2023 14:05:29 +0900 Subject: [PATCH 02/16] =?UTF-8?q?[FE-150]=20feat:=20=EC=98=A4=EB=8A=98?= =?UTF-8?q?=EC=9D=98=20=EB=A0=88=EC=BD=94=EB=93=9C=20React-Query=20?= =?UTF-8?q?=EC=A0=81=EC=9A=A9=20=EB=B0=8F=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/MyRecord/TodayRecord.tsx | 102 ++++++++++++++------------- src/react-query/hooks/useMyRecord.ts | 25 +++++++ 2 files changed, 78 insertions(+), 49 deletions(-) create mode 100644 src/react-query/hooks/useMyRecord.ts diff --git a/src/pages/MyRecord/TodayRecord.tsx b/src/pages/MyRecord/TodayRecord.tsx index 788c1b9..2833b70 100644 --- a/src/pages/MyRecord/TodayRecord.tsx +++ b/src/pages/MyRecord/TodayRecord.tsx @@ -1,60 +1,64 @@ import React from 'react' import { useNavigate } from 'react-router-dom' -// import { ITodayRecord } from 'types/recordData' -// import { getChipIconName } from '@pages/DetailRecord/getChipIconName' -// import Chip from '@components/Chip' -// import recordIcons from '@assets/record_icons' +import { useMyRecord } from '@react-query/hooks/useMyRecord' +import { getChipIconName } from '@pages/DetailRecord/getChipIconName' +import Chip from '@components/Chip' +import recordIcons from '@assets/record_icons' export default function TodayRecord() { const navigate = useNavigate() - // const todayWriteRecord = null - // const background_color = `bg-${todayWriteRecord?.colorName}` - // const RecordIcon = recordIcons[`${todayWriteRecord?.iconName}`] + const { todayRecord, isLoading } = useMyRecord() + const background_color = `bg-${todayRecord?.colorName}` + const RecordIcon = recordIcons[`${todayRecord?.iconName}`] + + if (isLoading) { + return <> + } + + if (!todayRecord) { + return ( +
+ + 오늘 쓴 레코드가 없어요! +
+ 레코드를 쓰고 추억을 공유해보세요. + +
navigate('/record/add')} + > + 레코드 추가하러 가기 +
+
+ ) + } - // if (!todayWriteRecord) { return ( -
- - 오늘 쓴 레코드가 없어요! -
- 레코드를 쓰고 추억을 공유해보세요. - -
navigate('/record/add')} - > - 레코드 추가하러 가기 +
+ {/* TODO: 레코드 만든 날짜 === 오늘 날짜 포맷팅하기*/} +
{todayRecord.createdAt}
+
+
+ +
+
+ +

+ {todayRecord.title} +

+
+ 댓글 {todayRecord.commentCount}개 +
+
) - // } - - // return ( - //
- // {/* TODO: 레코드 만든 날짜 === 오늘 날짜 포맷팅하기*/} - //
{todayWriteRecord.createdAt}
- //
- //
- // - //
- //
- // - //

- // {todayWriteRecord.title} - //

- //
- // 댓글 {todayWriteRecord.commentCount}개 - //
- //
- //
- //
- // ) } diff --git a/src/react-query/hooks/useMyRecord.ts b/src/react-query/hooks/useMyRecord.ts new file mode 100644 index 0000000..96e021a --- /dev/null +++ b/src/react-query/hooks/useMyRecord.ts @@ -0,0 +1,25 @@ +import { QUERY_KEYS } from '@react-query/queryKeys' +import { useQuery } from '@tanstack/react-query' +import { getRecordByDate } from '@apis/record' +import { getDate } from '@utils/getDate' + +export const useMyRecord = () => { + const today = new Date() + + const { data: records = null, isLoading } = useQuery( + [QUERY_KEYS.todayRecord], + async () => + await getRecordByDate({ date: getDate(today), page: 0, size: 1 }), + { + retry: false, + refetchOnMount: false, + refetchOnReconnect: false, + refetchOnWindowFocus: false, + } + ) + + return { + todayRecord: records?.data.recordByDateDtos[0], + isLoading, + } +} From 293467efa1980074e51e9f0633f3c9b5b6cff7fa Mon Sep 17 00:00:00 2001 From: waterglasses Date: Tue, 24 Jan 2023 14:05:39 +0900 Subject: [PATCH 03/16] =?UTF-8?q?[FE-150]=20feat:=20=EB=82=A0=EC=A7=9C=20?= =?UTF-8?q?=ED=98=95=EC=8B=9D=20=EB=B3=80=ED=99=98=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/utils/getDate.ts | 7 +++++++ 1 file changed, 7 insertions(+) create mode 100644 src/utils/getDate.ts diff --git a/src/utils/getDate.ts b/src/utils/getDate.ts new file mode 100644 index 0000000..ffebef0 --- /dev/null +++ b/src/utils/getDate.ts @@ -0,0 +1,7 @@ +export const getDate = (date: Date) => { + const year = date.getFullYear() + const month = (date.getMonth() + 1).toString().padStart(2, '0') + const day = date.getDate().toString().padStart(2, '0') + + return `${year}-${month}-${day}` +} From d24d75a8b6eb4a66ccc1b0e0a81573a72aad0e38 Mon Sep 17 00:00:00 2001 From: waterglasses Date: Tue, 24 Jan 2023 14:09:02 +0900 Subject: [PATCH 04/16] =?UTF-8?q?[FE-150]=20feat:=20=EC=98=A4=EB=8A=98?= =?UTF-8?q?=EC=9D=98=20=EB=A0=88=EC=BD=94=EB=93=9C=20=EB=82=A0=EC=A7=9C=20?= =?UTF-8?q?=ED=8F=AC=EB=A7=B7=ED=8C=85=20=EC=A0=81=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/MyRecord/TodayRecord.tsx | 5 ++++- src/react-query/hooks/useMyRecord.ts | 6 +++++- src/utils/getDate.ts | 9 ++++++++- 3 files changed, 17 insertions(+), 3 deletions(-) diff --git a/src/pages/MyRecord/TodayRecord.tsx b/src/pages/MyRecord/TodayRecord.tsx index 2833b70..f8fb5be 100644 --- a/src/pages/MyRecord/TodayRecord.tsx +++ b/src/pages/MyRecord/TodayRecord.tsx @@ -4,6 +4,7 @@ import { useMyRecord } from '@react-query/hooks/useMyRecord' import { getChipIconName } from '@pages/DetailRecord/getChipIconName' import Chip from '@components/Chip' import recordIcons from '@assets/record_icons' +import { getDate } from '@utils/getDate' export default function TodayRecord() { const navigate = useNavigate() @@ -36,7 +37,9 @@ export default function TodayRecord() { return (
{/* TODO: 레코드 만든 날짜 === 오늘 날짜 포맷팅하기*/} -
{todayRecord.createdAt}
+
+ {getDate(new Date(todayRecord.createdAt), 'point')} +
{ const { data: records = null, isLoading } = useQuery( [QUERY_KEYS.todayRecord], async () => - await getRecordByDate({ date: getDate(today), page: 0, size: 1 }), + await getRecordByDate({ + date: getDate(today, 'hyphen'), + page: 0, + size: 1, + }), { retry: false, refetchOnMount: false, diff --git a/src/utils/getDate.ts b/src/utils/getDate.ts index ffebef0..4a28b68 100644 --- a/src/utils/getDate.ts +++ b/src/utils/getDate.ts @@ -1,7 +1,14 @@ -export const getDate = (date: Date) => { +const DATE_JOIN_POINT = 'point' +const DATE_JOIN_HYPHEN = 'Hyphen' + +export const getDate = (date: Date, type: string) => { const year = date.getFullYear() const month = (date.getMonth() + 1).toString().padStart(2, '0') const day = date.getDate().toString().padStart(2, '0') + if (type === DATE_JOIN_HYPHEN) { + return `${year}.${month}.${day}` + } + return `${year}-${month}-${day}` } From fafd338e7c21ad27ec1b39c5a1c06eef7b0d5156 Mon Sep 17 00:00:00 2001 From: waterglasses Date: Tue, 24 Jan 2023 14:10:08 +0900 Subject: [PATCH 05/16] =?UTF-8?q?[FE-150]=20refactor:=20utils=20getDate=20?= =?UTF-8?q?=ED=95=A8=EC=88=98=20=EC=9D=B4=EB=A6=84=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/MyRecord/TodayRecord.tsx | 4 ++-- src/react-query/hooks/useMyRecord.ts | 4 ++-- src/utils/{getDate.ts => getFormattedDate.ts} | 2 +- 3 files changed, 5 insertions(+), 5 deletions(-) rename src/utils/{getDate.ts => getFormattedDate.ts} (84%) diff --git a/src/pages/MyRecord/TodayRecord.tsx b/src/pages/MyRecord/TodayRecord.tsx index f8fb5be..839c683 100644 --- a/src/pages/MyRecord/TodayRecord.tsx +++ b/src/pages/MyRecord/TodayRecord.tsx @@ -4,7 +4,7 @@ import { useMyRecord } from '@react-query/hooks/useMyRecord' import { getChipIconName } from '@pages/DetailRecord/getChipIconName' import Chip from '@components/Chip' import recordIcons from '@assets/record_icons' -import { getDate } from '@utils/getDate' +import { getFormattedDate } from '@utils/getFormattedDate' export default function TodayRecord() { const navigate = useNavigate() @@ -38,7 +38,7 @@ export default function TodayRecord() {
{/* TODO: 레코드 만든 날짜 === 오늘 날짜 포맷팅하기*/}
- {getDate(new Date(todayRecord.createdAt), 'point')} + {getFormattedDate(new Date(todayRecord.createdAt), 'point')}
{ const today = new Date() @@ -10,7 +10,7 @@ export const useMyRecord = () => { [QUERY_KEYS.todayRecord], async () => await getRecordByDate({ - date: getDate(today, 'hyphen'), + date: getFormattedDate(today, 'hyphen'), page: 0, size: 1, }), diff --git a/src/utils/getDate.ts b/src/utils/getFormattedDate.ts similarity index 84% rename from src/utils/getDate.ts rename to src/utils/getFormattedDate.ts index 4a28b68..5f231af 100644 --- a/src/utils/getDate.ts +++ b/src/utils/getFormattedDate.ts @@ -1,7 +1,7 @@ const DATE_JOIN_POINT = 'point' const DATE_JOIN_HYPHEN = 'Hyphen' -export const getDate = (date: Date, type: string) => { +export const getFormattedDate = (date: Date, type: string) => { const year = date.getFullYear() const month = (date.getMonth() + 1).toString().padStart(2, '0') const day = date.getDate().toString().padStart(2, '0') From ae06e3c3bcfe122d985e089897eb70ced5372877 Mon Sep 17 00:00:00 2001 From: waterglasses Date: Tue, 24 Jan 2023 14:23:06 +0900 Subject: [PATCH 06/16] =?UTF-8?q?[FE-150]=20feat:=20=EB=8D=B0=EC=9D=B4?= =?UTF-8?q?=ED=84=B0=EA=B0=80=20=EB=B3=80=EA=B2=BD=EB=90=98=EC=97=88?= =?UTF-8?q?=EC=9D=84=20=EB=95=8C=20refetch=20=ED=95=B4=EC=A3=BC=EB=8F=84?= =?UTF-8?q?=EB=A1=9D=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/MyRecord/MemoryRecord.tsx | 7 +++++- src/pages/MyRecord/TodayRecord.tsx | 30 +++++++++++++++--------- src/react-query/hooks/useMemoryRecord.ts | 2 ++ src/react-query/hooks/useMyRecord.ts | 7 +++++- 4 files changed, 33 insertions(+), 13 deletions(-) diff --git a/src/pages/MyRecord/MemoryRecord.tsx b/src/pages/MyRecord/MemoryRecord.tsx index ca38194..61436fb 100644 --- a/src/pages/MyRecord/MemoryRecord.tsx +++ b/src/pages/MyRecord/MemoryRecord.tsx @@ -1,4 +1,4 @@ -import React from 'react' +import React, { useEffect } from 'react' import { IMemoryRecord } from 'types/recordData' import MemoryRecordItem from './MemoryRecordItem' import { useMemoryRecord } from '@react-query/hooks/useMemoryRecord' @@ -13,8 +13,13 @@ export default function MemoryRecord() { hasNextPage, fetchNextPage, isFetchingNextPage, + refetch, } = useMemoryRecord() + useEffect(() => { + refetch() + }, [isLoading]) + if (isLoading) { return <> } diff --git a/src/pages/MyRecord/TodayRecord.tsx b/src/pages/MyRecord/TodayRecord.tsx index 839c683..3cc3c21 100644 --- a/src/pages/MyRecord/TodayRecord.tsx +++ b/src/pages/MyRecord/TodayRecord.tsx @@ -1,4 +1,4 @@ -import React from 'react' +import React, { useEffect } from 'react' import { useNavigate } from 'react-router-dom' import { useMyRecord } from '@react-query/hooks/useMyRecord' import { getChipIconName } from '@pages/DetailRecord/getChipIconName' @@ -8,10 +8,14 @@ import { getFormattedDate } from '@utils/getFormattedDate' export default function TodayRecord() { const navigate = useNavigate() - const { todayRecord, isLoading } = useMyRecord() + const { todayRecord, isLoading, refetch } = useMyRecord() const background_color = `bg-${todayRecord?.colorName}` const RecordIcon = recordIcons[`${todayRecord?.iconName}`] + useEffect(() => { + refetch() + }, [isLoading]) + if (isLoading) { return <> } @@ -35,8 +39,10 @@ export default function TodayRecord() { } return ( -
- {/* TODO: 레코드 만든 날짜 === 오늘 날짜 포맷팅하기*/} +
navigate(`/record/${todayRecord.recordId}`)} + >
{getFormattedDate(new Date(todayRecord.createdAt), 'point')}
@@ -47,13 +53,15 @@ export default function TodayRecord() {
- +
+ +

{todayRecord.title}

diff --git a/src/react-query/hooks/useMemoryRecord.ts b/src/react-query/hooks/useMemoryRecord.ts index b07b5fc..e9e3ae1 100644 --- a/src/react-query/hooks/useMemoryRecord.ts +++ b/src/react-query/hooks/useMemoryRecord.ts @@ -9,6 +9,7 @@ export const useMemoryRecord = () => { hasNextPage, fetchNextPage, isFetchingNextPage, + refetch, } = useInfiniteQuery({ queryKey: [QUERY_KEYS.memoryRecord], queryFn: async ({ pageParam = 0 }) => await getMemoryRecord(pageParam), @@ -31,5 +32,6 @@ export const useMemoryRecord = () => { hasNextPage, fetchNextPage, isFetchingNextPage, + refetch, } } diff --git a/src/react-query/hooks/useMyRecord.ts b/src/react-query/hooks/useMyRecord.ts index e0f026d..8b9746a 100644 --- a/src/react-query/hooks/useMyRecord.ts +++ b/src/react-query/hooks/useMyRecord.ts @@ -6,7 +6,11 @@ import { getFormattedDate } from '@utils/getFormattedDate' export const useMyRecord = () => { const today = new Date() - const { data: records = null, isLoading } = useQuery( + const { + data: records = null, + isLoading, + refetch, + } = useQuery( [QUERY_KEYS.todayRecord], async () => await getRecordByDate({ @@ -25,5 +29,6 @@ export const useMyRecord = () => { return { todayRecord: records?.data.recordByDateDtos[0], isLoading, + refetch, } } From eada88c5c907c172235157c1c8c096b5d300bfbe Mon Sep 17 00:00:00 2001 From: waterglasses Date: Tue, 24 Jan 2023 14:26:23 +0900 Subject: [PATCH 07/16] =?UTF-8?q?[FE-150]=20refactor:=20refetch=20?= =?UTF-8?q?=EC=BD=94=EB=93=9C=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/MyRecord/MemoryRecord.tsx | 5 ----- src/pages/MyRecord/TodayRecord.tsx | 6 +----- src/react-query/hooks/useMemoryRecord.ts | 5 ----- src/react-query/hooks/useMyRecord.ts | 10 +--------- 4 files changed, 2 insertions(+), 24 deletions(-) diff --git a/src/pages/MyRecord/MemoryRecord.tsx b/src/pages/MyRecord/MemoryRecord.tsx index 61436fb..a5e9bb4 100644 --- a/src/pages/MyRecord/MemoryRecord.tsx +++ b/src/pages/MyRecord/MemoryRecord.tsx @@ -13,13 +13,8 @@ export default function MemoryRecord() { hasNextPage, fetchNextPage, isFetchingNextPage, - refetch, } = useMemoryRecord() - useEffect(() => { - refetch() - }, [isLoading]) - if (isLoading) { return <> } diff --git a/src/pages/MyRecord/TodayRecord.tsx b/src/pages/MyRecord/TodayRecord.tsx index 3cc3c21..983a70a 100644 --- a/src/pages/MyRecord/TodayRecord.tsx +++ b/src/pages/MyRecord/TodayRecord.tsx @@ -8,14 +8,10 @@ import { getFormattedDate } from '@utils/getFormattedDate' export default function TodayRecord() { const navigate = useNavigate() - const { todayRecord, isLoading, refetch } = useMyRecord() + const { todayRecord, isLoading } = useMyRecord() const background_color = `bg-${todayRecord?.colorName}` const RecordIcon = recordIcons[`${todayRecord?.iconName}`] - useEffect(() => { - refetch() - }, [isLoading]) - if (isLoading) { return <> } diff --git a/src/react-query/hooks/useMemoryRecord.ts b/src/react-query/hooks/useMemoryRecord.ts index e9e3ae1..4229760 100644 --- a/src/react-query/hooks/useMemoryRecord.ts +++ b/src/react-query/hooks/useMemoryRecord.ts @@ -9,7 +9,6 @@ export const useMemoryRecord = () => { hasNextPage, fetchNextPage, isFetchingNextPage, - refetch, } = useInfiniteQuery({ queryKey: [QUERY_KEYS.memoryRecord], queryFn: async ({ pageParam = 0 }) => await getMemoryRecord(pageParam), @@ -21,9 +20,6 @@ export const useMemoryRecord = () => { return null }, retry: false, - refetchOnMount: false, - refetchOnReconnect: false, - refetchOnWindowFocus: false, }) return { @@ -32,6 +28,5 @@ export const useMemoryRecord = () => { hasNextPage, fetchNextPage, isFetchingNextPage, - refetch, } } diff --git a/src/react-query/hooks/useMyRecord.ts b/src/react-query/hooks/useMyRecord.ts index 8b9746a..95c60a6 100644 --- a/src/react-query/hooks/useMyRecord.ts +++ b/src/react-query/hooks/useMyRecord.ts @@ -6,11 +6,7 @@ import { getFormattedDate } from '@utils/getFormattedDate' export const useMyRecord = () => { const today = new Date() - const { - data: records = null, - isLoading, - refetch, - } = useQuery( + const { data: records = null, isLoading } = useQuery( [QUERY_KEYS.todayRecord], async () => await getRecordByDate({ @@ -20,15 +16,11 @@ export const useMyRecord = () => { }), { retry: false, - refetchOnMount: false, - refetchOnReconnect: false, - refetchOnWindowFocus: false, } ) return { todayRecord: records?.data.recordByDateDtos[0], isLoading, - refetch, } } From e86ad9c778a1e9e6245b64180992ab13cb517770 Mon Sep 17 00:00:00 2001 From: waterglasses Date: Tue, 24 Jan 2023 14:41:19 +0900 Subject: [PATCH 08/16] =?UTF-8?q?[FE-150]=20remove:=20=EC=82=AC=EC=9A=A9?= =?UTF-8?q?=ED=95=98=EC=A7=80=20=EC=95=8A=EB=8A=94=20=EB=B3=80=EC=88=98=20?= =?UTF-8?q?=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/utils/getFormattedDate.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/utils/getFormattedDate.ts b/src/utils/getFormattedDate.ts index 5f231af..9197f17 100644 --- a/src/utils/getFormattedDate.ts +++ b/src/utils/getFormattedDate.ts @@ -1,12 +1,11 @@ const DATE_JOIN_POINT = 'point' -const DATE_JOIN_HYPHEN = 'Hyphen' export const getFormattedDate = (date: Date, type: string) => { const year = date.getFullYear() const month = (date.getMonth() + 1).toString().padStart(2, '0') const day = date.getDate().toString().padStart(2, '0') - if (type === DATE_JOIN_HYPHEN) { + if (type === DATE_JOIN_POINT) { return `${year}.${month}.${day}` } From 0a42c0aa52adcb6e22ba6c51ff478cd00a3e1d38 Mon Sep 17 00:00:00 2001 From: waterglasses Date: Tue, 24 Jan 2023 14:41:35 +0900 Subject: [PATCH 09/16] =?UTF-8?q?[FE-150]=20feat:=20=EB=A7=88=EC=9D=B4?= =?UTF-8?q?=EB=A0=88=EC=BD=94=EB=93=9C=20=EC=BA=98=EB=A6=B0=EB=8D=94=20SVG?= =?UTF-8?q?=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/myRecordIcon/calendar.svg | 3 + src/pages/MyRecord/MyRecord.tsx | 1 - src/pages/MyRecord/MyRecordCalendar.tsx | 11 ++++ src/pages/MyRecord/TodayRecord.tsx | 87 +++++++++++++------------ 4 files changed, 61 insertions(+), 41 deletions(-) create mode 100644 src/assets/myRecordIcon/calendar.svg create mode 100644 src/pages/MyRecord/MyRecordCalendar.tsx diff --git a/src/assets/myRecordIcon/calendar.svg b/src/assets/myRecordIcon/calendar.svg new file mode 100644 index 0000000..014a1c8 --- /dev/null +++ b/src/assets/myRecordIcon/calendar.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/pages/MyRecord/MyRecord.tsx b/src/pages/MyRecord/MyRecord.tsx index 3939870..0759da4 100644 --- a/src/pages/MyRecord/MyRecord.tsx +++ b/src/pages/MyRecord/MyRecord.tsx @@ -26,7 +26,6 @@ export default function MyRecord() {
-

마이 레코드

나만의 추억 레코드 diff --git a/src/pages/MyRecord/MyRecordCalendar.tsx b/src/pages/MyRecord/MyRecordCalendar.tsx new file mode 100644 index 0000000..e689069 --- /dev/null +++ b/src/pages/MyRecord/MyRecordCalendar.tsx @@ -0,0 +1,11 @@ +import React from 'react' +import { ReactComponent as Calendar } from '@assets/myRecordIcon/calendar.svg' + +export default function MyRecordCalendar() { + return ( +
+

마이 레코드

+ +
+ ) +} diff --git a/src/pages/MyRecord/TodayRecord.tsx b/src/pages/MyRecord/TodayRecord.tsx index 983a70a..7bd083b 100644 --- a/src/pages/MyRecord/TodayRecord.tsx +++ b/src/pages/MyRecord/TodayRecord.tsx @@ -1,10 +1,11 @@ -import React, { useEffect } from 'react' +import React from 'react' import { useNavigate } from 'react-router-dom' import { useMyRecord } from '@react-query/hooks/useMyRecord' import { getChipIconName } from '@pages/DetailRecord/getChipIconName' import Chip from '@components/Chip' import recordIcons from '@assets/record_icons' import { getFormattedDate } from '@utils/getFormattedDate' +import MyRecordCalendar from './MyRecordCalendar' export default function TodayRecord() { const navigate = useNavigate() @@ -18,54 +19,60 @@ export default function TodayRecord() { if (!todayRecord) { return ( -
- - 오늘 쓴 레코드가 없어요! -
- 레코드를 쓰고 추억을 공유해보세요. - -
navigate('/record/add')} - > - 레코드 추가하러 가기 + <> + +
+ + 오늘 쓴 레코드가 없어요! +
+ 레코드를 쓰고 추억을 공유해보세요. + +
navigate('/record/add')} + > + 레코드 추가하러 가기 +
-
+ ) } return ( -
navigate(`/record/${todayRecord.recordId}`)} - > -
- {getFormattedDate(new Date(todayRecord.createdAt), 'point')} -
-
-
- + <> + +
navigate(`/record/${todayRecord.recordId}`)} + > +
+ {getFormattedDate(new Date(todayRecord.createdAt), 'point')}
-
-
- +
+
+
-

- {todayRecord.title} -

-
- 댓글 {todayRecord.commentCount}개 +
+
+ +
+

+ {todayRecord.title} +

+
+ 댓글 {todayRecord.commentCount}개 +
-
+ ) } From 91c46a48a660f6843278384bbb5b590d0834a905 Mon Sep 17 00:00:00 2001 From: waterglasses Date: Tue, 24 Jan 2023 14:44:14 +0900 Subject: [PATCH 10/16] =?UTF-8?q?[FE-150]=20feat:=20=EB=8B=AC=EB=A0=A5=20?= =?UTF-8?q?=EC=A4=80=EB=B9=84=EC=A4=91=EC=9D=B8=20=EC=84=9C=EB=B9=84?= =?UTF-8?q?=EC=8A=A4=20=ED=8E=98=EC=9D=B4=EC=A7=80=EB=A1=9C=20=EC=9D=B4?= =?UTF-8?q?=EB=8F=99=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/record.ts | 2 +- src/pages/MyRecord/MemoryRecord.tsx | 2 +- src/pages/MyRecord/MyRecordCalendar.tsx | 8 +++++++- 3 files changed, 9 insertions(+), 3 deletions(-) diff --git a/src/apis/record.ts b/src/apis/record.ts index 592785e..34961bf 100644 --- a/src/apis/record.ts +++ b/src/apis/record.ts @@ -1,4 +1,4 @@ -import { Axios, AxiosResponse } from 'axios' +import { AxiosResponse } from 'axios' import { IMyRecordRequestParam, IRecordByDateList } from 'types/recordData' import { baseInstance } from './instance' diff --git a/src/pages/MyRecord/MemoryRecord.tsx b/src/pages/MyRecord/MemoryRecord.tsx index a5e9bb4..ca38194 100644 --- a/src/pages/MyRecord/MemoryRecord.tsx +++ b/src/pages/MyRecord/MemoryRecord.tsx @@ -1,4 +1,4 @@ -import React, { useEffect } from 'react' +import React from 'react' import { IMemoryRecord } from 'types/recordData' import MemoryRecordItem from './MemoryRecordItem' import { useMemoryRecord } from '@react-query/hooks/useMemoryRecord' diff --git a/src/pages/MyRecord/MyRecordCalendar.tsx b/src/pages/MyRecord/MyRecordCalendar.tsx index e689069..6d5b4f0 100644 --- a/src/pages/MyRecord/MyRecordCalendar.tsx +++ b/src/pages/MyRecord/MyRecordCalendar.tsx @@ -1,11 +1,17 @@ import React from 'react' import { ReactComponent as Calendar } from '@assets/myRecordIcon/calendar.svg' +import { useNavigate } from 'react-router-dom' export default function MyRecordCalendar() { + const navigate = useNavigate() + return (

마이 레코드

- + navigate('/notservice')} + />
) } From 925854129010f6c291e55945549f5a02309d1a6f Mon Sep 17 00:00:00 2001 From: waterglasses Date: Tue, 24 Jan 2023 15:23:34 +0900 Subject: [PATCH 11/16] =?UTF-8?q?[FE-150]=20feat:=20=EB=A7=88=EC=9D=B4?= =?UTF-8?q?=EB=A0=88=EC=BD=94=EB=93=9C=20=ED=81=B4=EB=A6=AD=20=EC=8B=9C=20?= =?UTF-8?q?=EC=83=81=EC=84=B8=20=ED=8E=98=EC=9D=B4=EC=A7=80=EB=A1=9C=20?= =?UTF-8?q?=EC=9D=B4=EB=8F=99=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/MyRecord/TodayRecord.tsx | 17 ++++++++++------- 1 file changed, 10 insertions(+), 7 deletions(-) diff --git a/src/pages/MyRecord/TodayRecord.tsx b/src/pages/MyRecord/TodayRecord.tsx index 7bd083b..530c2b7 100644 --- a/src/pages/MyRecord/TodayRecord.tsx +++ b/src/pages/MyRecord/TodayRecord.tsx @@ -41,21 +41,24 @@ export default function TodayRecord() { return ( <> -
navigate(`/record/${todayRecord.recordId}`)} - > -
+
+
navigate(`/record/${todayRecord.recordId}`)} + > {getFormattedDate(new Date(todayRecord.createdAt), 'point')}
-
+
navigate(`/record/${todayRecord.recordId}`)} + >
-
+
Date: Tue, 24 Jan 2023 15:23:48 +0900 Subject: [PATCH 12/16] =?UTF-8?q?[FE-150]=20fix:=20=EC=B6=94=EC=96=B5=20?= =?UTF-8?q?=EB=A0=88=EC=BD=94=EB=93=9C=20=EC=97=86=EC=9D=84=20=EA=B2=BD?= =?UTF-8?q?=EC=9A=B0=20=EB=B2=84=EA=B7=B8=20=ED=94=BD=EC=8A=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/record.ts | 12 +++++++++--- src/pages/MyRecord/MemoryRecord.tsx | 2 +- src/pages/MyRecord/MemoryRecordItem.tsx | 2 +- src/types/recordData.ts | 5 ++--- 4 files changed, 13 insertions(+), 8 deletions(-) diff --git a/src/apis/record.ts b/src/apis/record.ts index 34961bf..be6dff1 100644 --- a/src/apis/record.ts +++ b/src/apis/record.ts @@ -1,5 +1,9 @@ -import { AxiosResponse } from 'axios' -import { IMyRecordRequestParam, IRecordByDateList } from 'types/recordData' +import { Axios, AxiosResponse } from 'axios' +import { + IMemoryRecordList, + IMyRecordRequestParam, + IRecordByDateList, +} from 'types/recordData' import { baseInstance } from './instance' const MEMORY_RECORD_SIZE = 7 @@ -22,7 +26,9 @@ export const getRecord = async (recordId: string | undefined) => { } } -export const getMemoryRecord = (pageParam: number) => { +export const getMemoryRecord = ( + pageParam: number +): Promise> => { return baseInstance.get(`/record/memory`, { params: { memoryRecordPage: pageParam, diff --git a/src/pages/MyRecord/MemoryRecord.tsx b/src/pages/MyRecord/MemoryRecord.tsx index ca38194..eb8f25c 100644 --- a/src/pages/MyRecord/MemoryRecord.tsx +++ b/src/pages/MyRecord/MemoryRecord.tsx @@ -19,7 +19,7 @@ export default function MemoryRecord() { return <> } - if (!memoryRecord?.pages[0].data) { + if (!memoryRecord?.pages[0].data.totalCount) { return (
navigate(`/record/${recordId}`)} > -

전체보기

+

전체보기

)}
diff --git a/src/types/recordData.ts b/src/types/recordData.ts index ff84667..2db06ae 100644 --- a/src/types/recordData.ts +++ b/src/types/recordData.ts @@ -12,10 +12,9 @@ export interface IRecordDataType { } export interface IMemoryRecordList { - hasNextPage: boolean - isFirstPage: boolean - isLastPage: boolean memoryRecordList: IMemoryRecord[] + totalCount: number + totalPage: number } export interface IMemoryRecord { From 41e4526c3552d99c228b9c69f5077740d949d131 Mon Sep 17 00:00:00 2001 From: waterglasses Date: Tue, 24 Jan 2023 15:27:47 +0900 Subject: [PATCH 13/16] =?UTF-8?q?[FE-150]=20design:=20=EC=A0=84=EC=B2=B4?= =?UTF-8?q?=EB=B3=B4=EA=B8=B0=20=EA=B8=80=EC=9E=90=20=EB=94=94=EC=9E=90?= =?UTF-8?q?=EC=9D=B8=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/MyRecord/MemoryRecordItem.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/MyRecord/MemoryRecordItem.tsx b/src/pages/MyRecord/MemoryRecordItem.tsx index 0a87aaa..ac03054 100644 --- a/src/pages/MyRecord/MemoryRecordItem.tsx +++ b/src/pages/MyRecord/MemoryRecordItem.tsx @@ -77,7 +77,7 @@ export default function MemoryRecordItem({ onClick={() => navigate(`/record/${recordId}`)} > -

전체보기

+

전체보기

)}
From 3ac6dc10d74b20752f6d6659fcfaf89e2d0db141 Mon Sep 17 00:00:00 2001 From: waterglasses Date: Tue, 24 Jan 2023 15:28:42 +0900 Subject: [PATCH 14/16] =?UTF-8?q?[FE-150]=20remove:=20=EC=82=AC=EC=9A=A9?= =?UTF-8?q?=ED=95=98=EC=A7=80=20=EC=95=8A=EB=8A=94=20=EB=B3=80=EC=88=98=20?= =?UTF-8?q?=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/record.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/apis/record.ts b/src/apis/record.ts index be6dff1..ccdd581 100644 --- a/src/apis/record.ts +++ b/src/apis/record.ts @@ -1,4 +1,4 @@ -import { Axios, AxiosResponse } from 'axios' +import { AxiosResponse } from 'axios' import { IMemoryRecordList, IMyRecordRequestParam, From 5d6062f321d925db83a03eb74d15ab86a1d6011e Mon Sep 17 00:00:00 2001 From: waterglasses Date: Tue, 24 Jan 2023 15:29:23 +0900 Subject: [PATCH 15/16] =?UTF-8?q?[FE-150]=20remove:=20=EC=A3=BC=EC=84=9D?= =?UTF-8?q?=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/MyRecord/MemoryRecordItem.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/pages/MyRecord/MemoryRecordItem.tsx b/src/pages/MyRecord/MemoryRecordItem.tsx index ac03054..28803de 100644 --- a/src/pages/MyRecord/MemoryRecordItem.tsx +++ b/src/pages/MyRecord/MemoryRecordItem.tsx @@ -84,4 +84,3 @@ export default function MemoryRecordItem({
) } -// e: React.MouseEvent, From 0eada108d2bb92329c4c2270a57a68a1952fc170 Mon Sep 17 00:00:00 2001 From: waterglasses Date: Tue, 24 Jan 2023 15:34:50 +0900 Subject: [PATCH 16/16] =?UTF-8?q?[FE-150]=20fix:=20=EC=9C=A0=EC=A0=80=20re?= =?UTF-8?q?fetch=20=EC=98=B5=EC=85=98=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/react-query/hooks/useUser.ts | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/react-query/hooks/useUser.ts b/src/react-query/hooks/useUser.ts index e292ec3..885de81 100644 --- a/src/react-query/hooks/useUser.ts +++ b/src/react-query/hooks/useUser.ts @@ -9,9 +9,6 @@ export const useUser = () => { isLoading, } = useQuery([QUERY_KEYS.user], async () => await getUserInfo(), { retry: false, - refetchOnMount: false, - refetchOnReconnect: false, - refetchOnWindowFocus: false, }) return { user, refetch, isLoading }