diff --git a/public/blacklogo.png b/public/blacklogo.png deleted file mode 100644 index 23bdbf3..0000000 Binary files a/public/blacklogo.png and /dev/null differ diff --git a/public/index.html b/public/index.html index 94d6f71..b79d2a8 100644 --- a/public/index.html +++ b/public/index.html @@ -5,26 +5,27 @@ - - - + + + - + + - + - - + + - + - 읽어보새(Readbird) + 읽어보새 | Readbird diff --git a/public/manifest.json b/public/manifest.json index 61a23dd..8961f16 100644 --- a/public/manifest.json +++ b/public/manifest.json @@ -1,17 +1,17 @@ { - "name": "ReadBird", - "short_name": "ReadBird", + "name": "Readbird", + "short_name": "Readbird", "description": "Reading Book, Catching Birds", "icons": [ { - "src": "blacklogo.png", - "sizes": "64x64 32x32 24x24 16x16", + "src": "readbird.png", + "sizes": "512x512", "type": "image/png" } ], "start_url": "/", "display": "standalone", - "theme_color": "#000000", + "theme_color": "#E3CCF2", "background_color": "#ffffff", "orientation": "portrait", "filename": "manifest.json" diff --git a/public/readbird.png b/public/readbird.png new file mode 100644 index 0000000..a61d2e1 Binary files /dev/null and b/public/readbird.png differ diff --git a/public/whitelogo.png b/public/whitelogo.png deleted file mode 100644 index cc468fb..0000000 Binary files a/public/whitelogo.png and /dev/null differ diff --git a/src/assets/images/Images.tsx b/src/assets/images/Images.tsx index 89285d2..e48711d 100644 --- a/src/assets/images/Images.tsx +++ b/src/assets/images/Images.tsx @@ -1,4 +1,4 @@ -import noImage from '@assets/images/noImage.jpeg'; +import NOT_IMAGE from '@assets/images/noImage.jpeg'; import { SyntheticEvent, memo, useCallback } from 'react'; import styled, { CSSObject } from 'styled-components'; @@ -8,24 +8,30 @@ type TProps = { imgWidth?: number; imgHeight?: number; imgStyle?: CSSObject; + noImage?: string; }; -export const Images = memo(({ imgUrl, imgAlt, imgWidth, imgHeight, imgStyle }: TProps) => { - const handleError = useCallback((e: SyntheticEvent) => { - e.currentTarget.src = noImage; - }, []); +export const Images = memo( + ({ imgUrl, imgAlt, imgWidth, imgHeight, imgStyle, noImage = NOT_IMAGE }: TProps) => { + const handleError = useCallback( + (e: SyntheticEvent) => { + e.currentTarget.src = noImage; + }, + [noImage] + ); - return ( - - ); -}); + return ( + + ); + } +); type TImageProps = { $imgStyle?: CSSObject; diff --git a/public/purplelogo.png b/src/assets/images/purplelogo.png similarity index 100% rename from public/purplelogo.png rename to src/assets/images/purplelogo.png diff --git a/src/components/templates/HomeTemplate/Plan/Stamp/Stamp.tsx b/src/components/templates/HomeTemplate/Plan/Stamp/Stamp.tsx index e62881d..9ae5638 100644 --- a/src/components/templates/HomeTemplate/Plan/Stamp/Stamp.tsx +++ b/src/components/templates/HomeTemplate/Plan/Stamp/Stamp.tsx @@ -114,6 +114,7 @@ export const Stamp = ({ setRecordStatus({ planId, recordStatus: ERecordStatus.success, + planStatus: ERecordStatus.inProgress, currentPage: maxPage }) ); @@ -164,6 +165,7 @@ export const Stamp = ({ setRecordStatus({ planId, recordStatus: ERecordStatus.failed, + planStatus: ERecordStatus.failed, currentPage: page }) ); @@ -173,6 +175,7 @@ export const Stamp = ({ setRecordStatus({ planId, recordStatus: ERecordStatus.failed, + planStatus: ERecordStatus.inProgress, currentPage: page }) ); diff --git a/src/components/templates/MyPageTemplate/MyEncyclopediaTemplate/MyEncyclopediaTemplate.tsx b/src/components/templates/MyPageTemplate/MyEncyclopediaTemplate/MyEncyclopediaTemplate.tsx index a0b2646..8c2524c 100644 --- a/src/components/templates/MyPageTemplate/MyEncyclopediaTemplate/MyEncyclopediaTemplate.tsx +++ b/src/components/templates/MyPageTemplate/MyEncyclopediaTemplate/MyEncyclopediaTemplate.tsx @@ -87,6 +87,7 @@ export const MyEncyclopediaTemplate = () => { const Wrap = styled.div` width: 100%; padding: 0 13px; + overflow: hidden; `; const StyledUl = styled.ul` diff --git a/src/components/templates/MyPageTemplate/MyRestoreTemplate/MyRestoreTemplate.tsx b/src/components/templates/MyPageTemplate/MyRestoreTemplate/MyRestoreTemplate.tsx index f4c00a1..1d9e836 100644 --- a/src/components/templates/MyPageTemplate/MyRestoreTemplate/MyRestoreTemplate.tsx +++ b/src/components/templates/MyPageTemplate/MyRestoreTemplate/MyRestoreTemplate.tsx @@ -69,8 +69,6 @@ export const MyRestoreTemplate = () => { methods.setValue('endDate', dayjs().format('YYYY-MM-DD')); methods.setValue('publisher', restoreData.publisher); methods.setValue('title', restoreData.title); - methods.setValue('endDate', restoreData.endDate); - methods.setValue('startDate', restoreData.startDate); methods.setValue('totalPage', restoreData.totalPage); methods.setValue('currentPage', restoreData.currentPage); methods.setValue('coverImage', restoreData.coverImage); diff --git a/src/components/templates/MyPageTemplate/MyUserInfo/MyUser.tsx b/src/components/templates/MyPageTemplate/MyUserInfo/MyUser.tsx index e30e992..5917959 100644 --- a/src/components/templates/MyPageTemplate/MyUserInfo/MyUser.tsx +++ b/src/components/templates/MyPageTemplate/MyUserInfo/MyUser.tsx @@ -1,5 +1,6 @@ import { TRootState } from '@/store/state'; import { Images } from '@assets/images'; +import NOT_IMAGE from '@assets/images/purplelogo.png'; import { useSelector } from 'react-redux'; import styled from 'styled-components'; @@ -14,6 +15,7 @@ export const MyUserInfo = () => { imgAlt={`${userInfo?.nickname}의 이미지`} imgWidth={45} imgHeight={45} + noImage={NOT_IMAGE} />
@@ -35,8 +37,8 @@ const StyledUserWrap = styled.div` width: 45px; height: 45px; border-radius: 16px; - background: #fff; overflow: hidden; + img { width: 100%; height: 100%; diff --git a/src/components/templates/PlanModalTemplate/RegisterModal/RegisterModal.tsx b/src/components/templates/PlanModalTemplate/RegisterModal/RegisterModal.tsx index c4a2999..9a4e7e0 100644 --- a/src/components/templates/PlanModalTemplate/RegisterModal/RegisterModal.tsx +++ b/src/components/templates/PlanModalTemplate/RegisterModal/RegisterModal.tsx @@ -1,5 +1,5 @@ import { addPlanData, setPlanData } from '@/store/reducers'; -import { Alert, convertError, debounce, go, lastDayMonth } from '@/utils'; +import { Alert, convertError, debounce, go, isPastDate, lastDayMonth } from '@/utils'; import { axiosFetch } from '@api/axios'; import { EAchievementStatus, @@ -130,7 +130,7 @@ export const RegisterModal = ({ setIsOpen, planId, isRestore }: TProps) => { const props = getValues(); if (!planId) { // 시작일이 오늘보다 이전날짜 - if (dayjs(props.startDate).format('YYYY-MM-DD') < dayjs().format('YYYY-MM-DD')) { + if (isPastDate(props.startDate, new Date())) { setError('startDate', { message: '* 오늘보다 이전 날짜를 설정할 수 없습니다.' }); @@ -139,7 +139,7 @@ export const RegisterModal = ({ setIsOpen, planId, isRestore }: TProps) => { } // 종료일이 시작일보다 이전날짜 - if (dayjs(props.endDate).format('YYYY-MM-DD') < dayjs(props.startDate).format('YYYY-MM-DD')) { + if (isPastDate(props.endDate, props.startDate)) { setError('endDate', { message: '* 시작일보다 이전 날짜를 설정할 수 없습니다.' }); @@ -147,10 +147,7 @@ export const RegisterModal = ({ setIsOpen, planId, isRestore }: TProps) => { } // 종료일이 1년초과 - if ( - dayjs(props.startDate).add(1, 'year').format('YYYY-MM-DD') < - dayjs(props.endDate).format('YYYY-MM-DD') - ) { + if (isPastDate(dayjs(props.startDate).add(1, 'year').format('YYYY-MM-DD'), props.endDate)) { setError('endDate', { message: '* 시작일에서 1년이 초과하는 날짜를 설정할 수 없습니다.' }); diff --git a/src/declare.d.ts b/src/declare.d.ts index 086c0ab..0e505e9 100644 --- a/src/declare.d.ts +++ b/src/declare.d.ts @@ -1,3 +1,4 @@ declare module '*.jpg'; declare module '*.jpeg'; +declare module '*.png'; declare module '*.svg'; diff --git a/src/store/reducers/userPlan.ts b/src/store/reducers/userPlan.ts index 2d467ec..1b5144b 100644 --- a/src/store/reducers/userPlan.ts +++ b/src/store/reducers/userPlan.ts @@ -67,7 +67,8 @@ const planSlice = createSlice({ ...data, currentPage: data.totalPage, target: 0, - recordStatus: ERecordStatus.success + recordStatus: ERecordStatus.success, + planStatus: ERecordStatus.success }; } return data; @@ -85,7 +86,12 @@ const planSlice = createSlice({ }, setRecordStatus: ( state, - action: PayloadAction<{ planId: number; recordStatus: ERecordStatus; currentPage: number }> + action: PayloadAction<{ + planId: number; + recordStatus: ERecordStatus; + currentPage: number; + planStatus: ERecordStatus; + }> ) => { state.planData = state.planData.map((plan) => { if (plan.planId === action.payload.planId) { diff --git a/src/utils/function.ts b/src/utils/function.ts index d9e468a..b7433df 100644 --- a/src/utils/function.ts +++ b/src/utils/function.ts @@ -82,3 +82,28 @@ export const isSameDate = (currentDate: string, compareDate: string) => { return true; }; + +export const isPastDate = (currentDate: string, compareDate: string | Date) => { + const current = new Date(currentDate); + const compare = new Date(compareDate); + + if (current.getFullYear() < compare.getFullYear()) { + return true; + } else if (current.getFullYear() > compare.getFullYear()) { + return false; + } + + if (current.getMonth() < compare.getMonth()) { + return true; + } else if (current.getMonth() > compare.getMonth()) { + return false; + } + + if (current.getDate() < compare.getDate()) { + return true; + } else if (current.getDate() > compare.getDate()) { + return false; + } + + return false; +};