From e4720ba32f252be648d0bddea2a92f03300626c9 Mon Sep 17 00:00:00 2001 From: myeongheonhong Date: Thu, 21 Dec 2023 17:20:49 +0900 Subject: [PATCH 1/7] =?UTF-8?q?[=20refactor=20]=20API=20=ED=95=A8=EC=88=98?= =?UTF-8?q?=20=EB=A6=AC=EC=95=A1=ED=8A=B8=EC=BF=BC=EB=A6=AC=EB=A1=9C=20?= =?UTF-8?q?=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- api/auth.ts | 17 ++ api/cakes.ts | 35 ++++ api/cakes/cakesAPI.ts | 53 ------ api/common/axios.ts | 1 - api/file.ts | 25 +++ api/letters/getCakeLetters.ts | 20 -- api/letters/getCakesCount.ts | 16 -- api/links/deleteWishLinks.ts | 20 -- api/links/getOneWish.ts | 17 -- api/links/getWishLinks.ts | 17 -- api/login/sendCodeToServer.ts | 19 -- api/main/getProgressData.ts | 17 -- api/mypage/mypageAPI.ts | 45 ----- api/path.ts | 40 ++++ api/user.ts | 54 ++++++ api/wishes.ts | 174 ++++++++++++++++++ api/wishes/wishesAPI.ts | 122 ------------ hooks/{ => common}/useDate.ts | 0 hooks/{ => common}/useKakaoShare.ts | 0 .../{login/useAuthKakao.ts => auth.ts} | 6 +- hooks/queries/cakes.ts | 53 ++++++ hooks/queries/cakes/useRequestPayReady.ts | 11 -- hooks/queries/letters/useGetCakeLetters.ts | 24 --- hooks/queries/letters/useGetCakesCount.ts | 33 ---- hooks/queries/links/useDeleteWishLinks.ts | 8 - hooks/queries/links/useGetOneWish.ts | 23 --- hooks/queries/links/useGetWishLinks.ts | 27 --- hooks/queries/main/useGetProgressData.ts | 26 --- hooks/queries/mypage/useEditWishesInfo.tsx | 16 -- hooks/queries/user.ts | 22 +++ hooks/queries/wishes.ts | 127 +++++++++++++ hooks/queries/wishes/useCreateWishesLink.ts | 21 --- hooks/queries/wishes/useGetItemInfo.ts | 29 --- .../api/request.ts | 0 types/api/response.ts | 18 ++ types/mypage/editWishesInfoDataType.ts | 13 -- types/wishesType.ts | 33 ++++ utils/common/token.ts | 6 + 38 files changed, 607 insertions(+), 581 deletions(-) create mode 100644 api/auth.ts create mode 100644 api/cakes.ts delete mode 100644 api/cakes/cakesAPI.ts create mode 100644 api/file.ts delete mode 100644 api/letters/getCakeLetters.ts delete mode 100644 api/letters/getCakesCount.ts delete mode 100644 api/links/deleteWishLinks.ts delete mode 100644 api/links/getOneWish.ts delete mode 100644 api/links/getWishLinks.ts delete mode 100644 api/login/sendCodeToServer.ts delete mode 100644 api/main/getProgressData.ts delete mode 100644 api/mypage/mypageAPI.ts create mode 100644 api/path.ts create mode 100644 api/user.ts create mode 100644 api/wishes.ts delete mode 100644 api/wishes/wishesAPI.ts rename hooks/{ => common}/useDate.ts (100%) rename hooks/{ => common}/useKakaoShare.ts (100%) rename hooks/queries/{login/useAuthKakao.ts => auth.ts} (86%) create mode 100644 hooks/queries/cakes.ts delete mode 100644 hooks/queries/cakes/useRequestPayReady.ts delete mode 100644 hooks/queries/letters/useGetCakeLetters.ts delete mode 100644 hooks/queries/letters/useGetCakesCount.ts delete mode 100644 hooks/queries/links/useDeleteWishLinks.ts delete mode 100644 hooks/queries/links/useGetOneWish.ts delete mode 100644 hooks/queries/links/useGetWishLinks.ts delete mode 100644 hooks/queries/main/useGetProgressData.ts delete mode 100644 hooks/queries/mypage/useEditWishesInfo.tsx create mode 100644 hooks/queries/user.ts create mode 100644 hooks/queries/wishes.ts delete mode 100644 hooks/queries/wishes/useCreateWishesLink.ts delete mode 100644 hooks/queries/wishes/useGetItemInfo.ts rename hooks/queries/wishes/useGetUserAccount.tsx => types/api/request.ts (100%) create mode 100644 types/api/response.ts delete mode 100644 types/mypage/editWishesInfoDataType.ts create mode 100644 types/wishesType.ts create mode 100644 utils/common/token.ts diff --git a/api/auth.ts b/api/auth.ts new file mode 100644 index 00000000..99107af8 --- /dev/null +++ b/api/auth.ts @@ -0,0 +1,17 @@ +import { API_VERSION_01, PATH_AUTH } from './path'; +import { client } from './common/axios'; + +export const postAuthKakao = async (code: string) => { + const data = await client.post( + `${API_VERSION_01}${PATH_AUTH.KAKAO}?redirectUri=${process.env.NEXT_PUBLIC_KAKAO_REDIRECT_URI}`, + {}, + { + headers: { + 'Content-Type': 'application/json', + code: `${code}`, + }, + }, + ); + + return data.data.data; +}; diff --git a/api/cakes.ts b/api/cakes.ts new file mode 100644 index 00000000..0aef6936 --- /dev/null +++ b/api/cakes.ts @@ -0,0 +1,35 @@ +import { getAccessToken } from '@/utils/common/token'; +import { client } from './common/axios'; +import { API_VERSION_01, PATH_CAKES } from './path'; + +const ACCESS_TOKEN = getAccessToken(); + +/** + * 해당 소원에 대한 케이크 조회 + */ +export const getCakesInfo = async ( + wishId: string | string[] | undefined, + cakeId: string | string[] | undefined, +) => { + const data = await client.get(`${API_VERSION_01}${PATH_CAKES.GET_CAKES_INFO(wishId, cakeId)}`, { + headers: { + 'Content-Type': 'application/json', + Authorization: `Bearer ${ACCESS_TOKEN}`, + }, + }); + + return data.data.data; +}; + +/** + * 해당 소원에 대한 모든 케이크 리스트 결과 조회 + */ +export const getCakesResult = async (wishId: string | string[] | undefined) => { + const data = await client.get(`${API_VERSION_01}${PATH_CAKES.GET_CAKES_RESULT(wishId)}`, { + headers: { + 'Content-Type': 'application/json', + Authorization: `Bearer ${ACCESS_TOKEN}`, + }, + }); + return data.data.data; +}; diff --git a/api/cakes/cakesAPI.ts b/api/cakes/cakesAPI.ts deleted file mode 100644 index aa85129a..00000000 --- a/api/cakes/cakesAPI.ts +++ /dev/null @@ -1,53 +0,0 @@ -import PATH from '../../constant/path'; -import { client } from '../common/axios'; -import { CakesDataType } from '@/types/cakes/cakesDataType'; - -export const getWishesData = async () => { - const pathname = window.location.pathname.replace('/cakes/', ''); - const wishesNumber = pathname.replace('/wishes/', ''); - - const data = await client.get( - `${PATH.API}/${PATH.V1}/${PATH.PUBLIC}/${PATH.WISHES}/${wishesNumber}`, - ); - return data.data.data; -}; - -export const requestPayApprove = async (cakesData: CakesDataType | undefined) => { - const data = await client.post( - `${PATH.API}/${PATH.V1}/${PATH.PUBLIC}/${PATH.PAY}/${PATH.APPROVE}`, - { - pgToken: cakesData?.pgToken, - tid: cakesData?.tid, - partnerOrderId: process.env.NEXT_PUBLIC_ORDER_ID, - partnerUserId: process.env.NEXT_PUBLIC_USER_ID, - name: cakesData?.giverName, - cakeId: cakesData?.selectedCake.cakeNumber, - message: cakesData?.message, - wishId: cakesData?.wishId, - }, - { - headers: {}, - }, - ); - - return data.data.data; -}; - -export const requestPayReady = async (wishId: number, cakeNumber: number) => { - return await client.post( - `${PATH.API}/${PATH.V1}/${PATH.PUBLIC}/${PATH.PAY}/${PATH.READY}`, - { - partnerOrderId: process.env.NEXT_PUBLIC_ORDER_ID, - partnerUserId: process.env.NEXT_PUBLIC_USER_ID, - cake: cakeNumber, - taxFreeAmount: '200', - vatAmount: '1', - approvalUrl: `${process.env.NEXT_PUBLIC_KAKAOPAY_REDIRECT_URI}`, - cancelUrl: `https://sunmulzu.store/cakes/${wishId}`, - failUrl: `https://sunmulzu.store/cakes/${wishId}`, - }, - { - headers: {}, - }, - ); -}; diff --git a/api/common/axios.ts b/api/common/axios.ts index 30fbc359..594e4019 100644 --- a/api/common/axios.ts +++ b/api/common/axios.ts @@ -1,4 +1,3 @@ -import PATH from '@/constant/path'; import axios from 'axios'; //서버통신 함수 diff --git a/api/file.ts b/api/file.ts new file mode 100644 index 00000000..f326622a --- /dev/null +++ b/api/file.ts @@ -0,0 +1,25 @@ +import axios from 'axios'; +import { client } from './common/axios'; +import { API_VERSION_01 } from './path'; +import { getAccessToken } from '@/utils/common/token'; + +export const uploadPresignedURL = async (signedURL: string, file: File | Blob | null) => { + const data = await axios.put(signedURL, file, { + headers: { + 'Content-Type': file?.type, + }, + }); + + return data; +}; + +export const getPresignedURL = async (fileName: string | undefined) => { + const data = await client.get(`${API_VERSION_01}/file?fileName=${fileName}`, { + headers: { + 'Content-Type': 'application/json', + Authorization: `Bearer ${getAccessToken()}`, + }, + }); + + return data; +}; diff --git a/api/letters/getCakeLetters.ts b/api/letters/getCakeLetters.ts deleted file mode 100644 index 1a5ebf0d..00000000 --- a/api/letters/getCakeLetters.ts +++ /dev/null @@ -1,20 +0,0 @@ -import { client } from '@/api/common/axios'; -import PATH from '@/constant/path'; - -export const getCakesLetters = async ( - wishId: string | string[] | undefined, - cakeId: string | string[] | undefined, -) => { - const accessToken = localStorage.getItem('accessToken'); - - const url = `${PATH.API}/${PATH.V1}/${PATH.CAKES}/${wishId}/${cakeId}`; - - const data = await client.get(url, { - headers: { - 'Content-Type': 'application/json', - Authorization: `Bearer ${accessToken}`, - }, - }); - - return data.data.data; -}; diff --git a/api/letters/getCakesCount.ts b/api/letters/getCakesCount.ts deleted file mode 100644 index a3dcbc02..00000000 --- a/api/letters/getCakesCount.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { client } from '@/api/common/axios'; -import PATH from '@/constant/path'; - -export const getCakesCount = async (wishId: string | string[] | undefined) => { - const accessToken = localStorage.getItem('accessToken'); - - const url = `${PATH.API}/${PATH.V1}/${PATH.CAKES}/${wishId}`; - - const data = await client.get(url, { - headers: { - 'Content-Type': 'application/json', - Authorization: `Bearer ${accessToken}`, - }, - }); - return data.data.data; -}; diff --git a/api/links/deleteWishLinks.ts b/api/links/deleteWishLinks.ts deleted file mode 100644 index 7725bb3c..00000000 --- a/api/links/deleteWishLinks.ts +++ /dev/null @@ -1,20 +0,0 @@ -import { client } from '@/api/common/axios'; -import PATH from '@/constant/path'; - -export const deleteWishLinks = async (wishesData: number[]) => { - const accessToken = localStorage.getItem('accessToken'); - - const url = `${PATH.API}/${PATH.V1}/${PATH.WISHES}`; - - const data = await client.delete(url, { - headers: { - 'Content-Type': 'application/json', - Authorization: `Bearer ${accessToken}`, - }, - data: { - wishes: wishesData, - }, - }); - - return data; -}; diff --git a/api/links/getOneWish.ts b/api/links/getOneWish.ts deleted file mode 100644 index c5598ad9..00000000 --- a/api/links/getOneWish.ts +++ /dev/null @@ -1,17 +0,0 @@ -import { client } from '@/api/common/axios'; -import PATH from '@/constant/path'; - -export const getOneWish = async (wishId: string | string[] | undefined) => { - const accessToken = localStorage.getItem('accessToken'); - - const url = `${PATH.API}/${PATH.V1}/${PATH.WISHES}/${wishId}`; - - const data = await client.get(url, { - headers: { - 'Content-Type': 'application/json', - Authorization: `Bearer ${accessToken}`, - }, - }); - - return data.data.data; -}; diff --git a/api/links/getWishLinks.ts b/api/links/getWishLinks.ts deleted file mode 100644 index 356bd3cc..00000000 --- a/api/links/getWishLinks.ts +++ /dev/null @@ -1,17 +0,0 @@ -import { client } from '@/api/common/axios'; -import PATH from '@/constant/path'; - -export const getWishLinks = async () => { - const accessToken = localStorage.getItem('accessToken'); - - const url = `${PATH.API}/${PATH.V1}/${PATH.WISHES}`; - - const data = await client.get(url, { - headers: { - 'Content-Type': 'application/json', - Authorization: `Bearer ${accessToken}`, - }, - }); - - return data.data.data.wishes; -}; diff --git a/api/login/sendCodeToServer.ts b/api/login/sendCodeToServer.ts deleted file mode 100644 index eeae44c4..00000000 --- a/api/login/sendCodeToServer.ts +++ /dev/null @@ -1,19 +0,0 @@ -import { client } from '@/api/common/axios'; -import PATH from '../../constant/path'; - -export const sendCodeToServer = async (code: string) => { - const url = `${PATH.API}/${PATH.V1}/${PATH.AUTH}/${PATH.KAKAO}/${PATH.CALLBACK}?${PATH.REDIRECT_URI}=${process.env.NEXT_PUBLIC_KAKAO_REDIRECT_URI}`; - - const data = await client.post( - url, - {}, - { - headers: { - 'Content-Type': 'application/json', - code: `${code}`, - }, - }, - ); - - return data.data.data; -}; diff --git a/api/main/getProgressData.ts b/api/main/getProgressData.ts deleted file mode 100644 index b0054204..00000000 --- a/api/main/getProgressData.ts +++ /dev/null @@ -1,17 +0,0 @@ -import PATH from '../../constant/path'; -import { client } from '../common/axios'; - -export const getProgressData = async () => { - const accessToken = localStorage.getItem('accessToken'); - - const url = `${PATH.API}/${PATH.V1}/${PATH.WISHES}/${PATH.MAIN}`; - - const data = await client.get(url, { - headers: { - 'Content-Type': 'application/json', - Authorization: `Bearer ${accessToken}`, - }, - }); - - return data.data.data; -}; diff --git a/api/mypage/mypageAPI.ts b/api/mypage/mypageAPI.ts deleted file mode 100644 index ce121fe7..00000000 --- a/api/mypage/mypageAPI.ts +++ /dev/null @@ -1,45 +0,0 @@ -import { client } from '../common/axios'; -import PATH from '../../constant/path'; -import { EditWishesInfoDataType } from '@/types/mypage/editWishesInfoDataType'; - -export const getEditWishesInfo = async () => { - const accessToken = localStorage.getItem('accessToken'); - - const data = await client.get(`${PATH.API}/${PATH.V1}/${PATH.WISHES}/${PATH.PROGRESS}`, { - headers: { - 'Content-Type': 'application/json', - Authorization: `Bearer ${accessToken}`, - }, - }); - - return data.data.data; -}; - -export const editWishesInfo = async (editWishesInfoData: EditWishesInfoDataType) => { - const accessToken = localStorage.getItem('accessToken'); - - const data = await client.put( - `${PATH.API}/${PATH.V1}/${PATH.WISHES}/${PATH.PROGRESS}`, - editWishesInfoData, - { - headers: { - Authorization: `Bearer ${accessToken}`, - }, - }, - ); - - return data.data.data; -}; - -export const deleteUserInfo = async () => { - const accessToken = localStorage.getItem('accessToken'); - - const data = await client.delete(`${PATH.API}/${PATH.V1}/${PATH.USER}`, { - headers: { - 'Content-Type': 'application/json', - Authorization: `Bearer ${accessToken}`, - }, - }); - - return data; -}; diff --git a/api/path.ts b/api/path.ts new file mode 100644 index 00000000..f97855bf --- /dev/null +++ b/api/path.ts @@ -0,0 +1,40 @@ +export const API_VERSION_01 = '/api/v1'; + +const PATH = { + auth: '/auth', + user: '/user', + wishes: '/wishes', + public: '/public', + cakes: '/cakes', +}; + +export const PATH_AUTH = { + TOKEN: `${PATH.auth}/token`, + KAKAO: `${PATH.auth}/kakao/callback`, +}; + +export const PATH_USER = { + DEFAULT: PATH.user, + ACCOUNT: `${PATH.user}/account`, + ACCOUNT_VERIFY: `${PATH.user}/verify-account`, + ABUSE: `${PATH.user}/abuse`, +}; + +export const PATH_WISHES = { + DEFAULT: PATH.wishes, + PROGRESS: `${PATH.wishes}/progress`, + GET_SINGLE_WISH_INFO: (wishId: string | string[] | undefined) => `${PATH.wishes}/${wishId}`, + PRESENT_LINK_INFO: `${PATH.wishes}/present/info`, + MAIN: `${PATH.wishes}/main`, +}; + +export const PATH_PUBLIC = { + CAKES: `${PATH.public}/cakes`, + GET_INFO: (wishId: number) => `${PATH.public}${PATH.wishes}/${wishId}`, +}; + +export const PATH_CAKES = { + GET_CAKES_RESULT: (wishId: string | string[] | undefined) => `${PATH.cakes}/${wishId}`, + GET_CAKES_INFO: (wishId: string | string[] | undefined, cakeId: string | string[] | undefined) => + `${PATH.cakes}/${wishId}/${cakeId}`, +}; diff --git a/api/user.ts b/api/user.ts new file mode 100644 index 00000000..cde5ecbb --- /dev/null +++ b/api/user.ts @@ -0,0 +1,54 @@ +import { getAccessToken } from '@/utils/common/token'; +import { client } from './common/axios'; +import { API_VERSION_01, PATH_USER } from './path'; +import { UseFormReturn } from 'react-hook-form'; +import { WishesDataInputType } from '@/types/common/input/wishesInput'; +import { UserAccountDataResponseType } from '@/types/api/response'; + +const ACCESS_TOKEN = getAccessToken(); + +export const patchUserAccount = async ( + methods: UseFormReturn, +) => { + const data = await client.put( + `${API_VERSION_01}${PATH_USER.ACCOUNT}`, + { + accountInfo: { + name: methods.getValues('name'), + bank: methods.getValues('bank'), + account: methods.getValues('account'), + }, + }, + { + headers: { + 'Content-Type': 'application/json', + Authorization: `Bearer ${ACCESS_TOKEN}`, + }, + }, + ); + return data; +}; + +export const getUserAccount = async () => { + const data = await client.get( + `${API_VERSION_01}${PATH_USER.ACCOUNT}`, + { + headers: { + 'Content-Type': 'application/json', + Authorization: `Bearer ${ACCESS_TOKEN}`, + }, + }, + ); + return data?.data.data; +}; + +export const deleteUserInfo = async () => { + const data = await client.delete(`${API_VERSION_01}${PATH_USER.DEFAULT}`, { + headers: { + 'Content-Type': 'application/json', + Authorization: `Bearer ${ACCESS_TOKEN}`, + }, + }); + + return data; +}; diff --git a/api/wishes.ts b/api/wishes.ts new file mode 100644 index 00000000..64c53e12 --- /dev/null +++ b/api/wishes.ts @@ -0,0 +1,174 @@ +import { MainProgressDataResponseType, WishesProgressDataResponseType } from '@/types/api/response'; +import { client } from './common/axios'; +import { getAccessToken } from '@/utils/common/token'; +import { API_VERSION_01, PATH_WISHES } from './path'; +import { WishesDataInputType } from '@/types/common/input/wishesInput'; +import { UseFormReturn } from 'react-hook-form'; +import { SiteDataType } from '@/types/siteDataType'; + +const ACCESS_TOKEN = getAccessToken(); + +/** + * 진행중인 소원 조회 + */ +export const getMainProgressData = async () => { + const data = await client.get( + `${API_VERSION_01}${PATH_WISHES.MAIN}`, + { + headers: { + 'Content-Type': 'application/json', + Authorization: `Bearer ${ACCESS_TOKEN}`, + }, + }, + ); + + return data.data.data; +}; + +/** + * 모든 소원리스트 조회 + */ +export const getWishes = async () => { + const data = await client.get(`${API_VERSION_01}${PATH_WISHES.DEFAULT}`, { + headers: { + 'Content-Type': 'application/json', + Authorization: `Bearer ${ACCESS_TOKEN}`, + }, + }); + + return data.data.data.wishes; +}; + +/** + * 소원링크 생성 + */ +export const postWishes = async (methods: UseFormReturn) => { + const data = await client.post( + `${API_VERSION_01}${PATH_WISHES.DEFAULT}`, + { + imageUrl: methods.getValues('imageUrl'), + price: methods.getValues('price'), + title: methods.getValues('title'), + hint: methods.getValues('hint'), + initial: methods.getValues('initial'), + startDate: methods.getValues('startDate'), + endDate: methods.getValues('endDate'), + }, + { + headers: { + 'Content-Type': 'application/json', + Authorization: `Bearer ${ACCESS_TOKEN}`, + }, + }, + ); + return data; +}; + +/** + * 소원링크 삭제 + */ +export const deleteWishes = async (wishesData: number[]) => { + const data = await client.delete(`${API_VERSION_01}${PATH_WISHES.DEFAULT}`, { + headers: { + 'Content-Type': 'application/json', + Authorization: `Bearer ${ACCESS_TOKEN}`, + }, + data: { + wishes: wishesData, + }, + }); + + return data; +}; + +/** + * 29cm에서 파싱한 데이터 + */ +export const getPresentLinkInfo = async (link: string, siteData: SiteDataType | undefined) => { + const imageTag = + siteData && + (await client.get( + `${API_VERSION_01}${PATH_WISHES.PRESENT_LINK_INFO}?url=${link}&tag=${siteData.IMAGE_TAG}`, + { + headers: { + 'Content-Type': 'application/json', + Authorization: `Bearer ${ACCESS_TOKEN}`, + }, + }, + )); + + const priceTag = + siteData && + (await client.get( + `${API_VERSION_01}${PATH_WISHES.PRESENT_LINK_INFO}?url=${link}&tag=${siteData.PRICE_TAG}`, + { + headers: { + 'Content-Type': 'application/json', + Authorization: `Bearer ${ACCESS_TOKEN}`, + }, + }, + )); + return { imageTag, priceTag }; +}; + +/** + * 진행중인 소원 정보 조회 + */ +export const getProgressWishInfo = async () => { + const data = await client.get( + `${API_VERSION_01}${PATH_WISHES.PROGRESS}`, + { + headers: { + 'Content-Type': 'application/json', + Authorization: `Bearer ${ACCESS_TOKEN}`, + }, + }, + ); + + return data.data.data; +}; + +/** + * 진행중인 소원 정보 수정 + */ +export const patchProgressWishInfo = async ( + methods: UseFormReturn, +) => { + const data = await client.put( + `${API_VERSION_01}${PATH_WISHES.PROGRESS}`, + { + title: methods.getValues('title'), + hint: methods.getValues('hint'), + initial: methods.getValues('initial'), + imageUrl: methods.getValues('imageUrl'), + phone: methods.getValues('phone'), + account: methods.getValues('account'), + bank: methods.getValues('bank'), + name: methods.getValues('name'), + startDate: methods.getValues('startDate'), + endDate: methods.getValues('endDate'), + }, + { + headers: { + 'Content-Type': 'application/json', + Authorization: `Bearer ${ACCESS_TOKEN}`, + }, + }, + ); + + return data.data.data; +}; + +/** + * 소원 단건 조회 + */ +export const getSingleWishInfo = async (wishId: string | string[] | undefined) => { + const data = await client.get(`${API_VERSION_01}${PATH_WISHES.GET_SINGLE_WISH_INFO(wishId)}`, { + headers: { + 'Content-Type': 'application/json', + Authorization: `Bearer ${ACCESS_TOKEN}`, + }, + }); + + return data.data.data; +}; diff --git a/api/wishes/wishesAPI.ts b/api/wishes/wishesAPI.ts deleted file mode 100644 index a397291d..00000000 --- a/api/wishes/wishesAPI.ts +++ /dev/null @@ -1,122 +0,0 @@ -import PATH from '../../constant/path'; -import { client } from '../common/axios'; -import axios from 'axios'; -import { SiteDataType } from '@/types/siteDataType'; -import { - AccountInfoType, - BankInfoInputsType, - WishesDataInputType, -} from '@/types/common/input/wishesInput'; -import { UseFormReturn } from 'react-hook-form'; - -const ACCESS_TOKEN = localStorage.getItem('accessToken'); - -export const createWishesLink = async (wishesData: WishesDataInputType) => { - const data = await client.post( - `${PATH.API}/${PATH.V1}/${PATH.WISHES}`, - { - imageUrl: wishesData.imageURL, - price: wishesData.price, - title: wishesData.title, - hint: wishesData.hint, - initial: wishesData.initial, - startDate: wishesData.startDate, - endDate: wishesData.endDate, - }, - { - headers: { - 'Content-Type': 'application/json', - Authorization: `Bearer ${ACCESS_TOKEN}`, - }, - }, - ); - return data; -}; - -export const editUserAccount = async ( - methods: UseFormReturn, -) => { - const data = await client.put( - `${PATH.API}/${PATH.V1}/${PATH.USER}/${PATH.ACCOUNT}`, - { - accountInfo: { - name: methods.getValues('name'), - bank: methods.getValues('bankName'), - account: methods.getValues('account'), - }, - }, - { - headers: { - 'Content-Type': 'application/json', - Authorization: `Bearer ${ACCESS_TOKEN}`, - }, - }, - ); - return data; -}; - -export const getItemInfo = async (link: string, siteData: SiteDataType | undefined) => { - const accessToken = localStorage.getItem('accessToken'); - - const imageTag = - siteData && - (await client.get( - `${PATH.API}/${PATH.V1}/${PATH.WISHES}/${PATH.PRESENT}/${PATH.INFO}?url=${link}&tag=${siteData.IMAGE_TAG}`, - { - headers: { - 'Content-Type': 'application/json', - Authorization: `Bearer ${accessToken}`, - }, - }, - )); - - const priceTag = - siteData && - (await client.get( - `${PATH.API}/${PATH.V1}/${PATH.WISHES}/${PATH.PRESENT}/${PATH.INFO}?url=${link}&tag=${siteData.PRICE_TAG}`, - { - headers: { - 'Content-Type': 'application/json', - Authorization: `Bearer ${accessToken}`, - }, - }, - )); - return { imageTag, priceTag }; -}; - -export const getUserAccount = async () => { - const accessToken = localStorage.getItem('accessToken'); - - const data = await client.get(`${PATH.API}/${PATH.V1}/${PATH.USER}/${PATH.ACCOUNT}`, { - headers: { - 'Content-Type': 'application/json', - Authorization: `Bearer ${accessToken}`, - }, - }); - return data?.data; -}; - -export const getPresignedURL = async (fileName: string | undefined) => { - const accessToken = localStorage.getItem('accessToken'); - const data = await client.get( - `${PATH.API}/${PATH.V1}/${PATH.FILE}?${PATH.FILE_NAME}=${fileName}`, - { - headers: { - 'Content-Type': 'application/json', - Authorization: `Bearer ${accessToken}`, - }, - }, - ); - - return data; -}; - -export const uploadPresignedURL = async (signedURL: string, file: File | Blob | null) => { - const data = await axios.put(signedURL, file, { - headers: { - 'Content-Type': file?.type, - }, - }); - - return data; -}; diff --git a/hooks/useDate.ts b/hooks/common/useDate.ts similarity index 100% rename from hooks/useDate.ts rename to hooks/common/useDate.ts diff --git a/hooks/useKakaoShare.ts b/hooks/common/useKakaoShare.ts similarity index 100% rename from hooks/useKakaoShare.ts rename to hooks/common/useKakaoShare.ts diff --git a/hooks/queries/login/useAuthKakao.ts b/hooks/queries/auth.ts similarity index 86% rename from hooks/queries/login/useAuthKakao.ts rename to hooks/queries/auth.ts index cefd2069..0425339d 100644 --- a/hooks/queries/login/useAuthKakao.ts +++ b/hooks/queries/auth.ts @@ -1,11 +1,11 @@ import { useRouter } from 'next/router'; import { useEffect, useState } from 'react'; -import { sendCodeToServer } from '@/api/login/sendCodeToServer'; import { useMutation } from 'react-query'; import { useSetRecoilState } from 'recoil'; import { LoginUserInfo } from '@/recoil/auth/loginUserInfo'; +import { postAuthKakao } from '@/api/auth'; -export default function useAuthKakao() { +export function useAuthKakao() { const [accessToken, setAccessToken] = useState(''); const [refreshToken, setRefreshToken] = useState(''); const [nickName, setNickname] = useState(''); @@ -15,7 +15,7 @@ export default function useAuthKakao() { const router = useRouter(); const { code: authCode } = router.query; - const { mutate: kakaoLoginMutate } = useMutation(() => sendCodeToServer(authCode as string), { + const { mutate: kakaoLoginMutate } = useMutation(() => postAuthKakao(authCode as string), { onSuccess: (data) => { const { nickName, accessToken, refreshToken } = data; diff --git a/hooks/queries/cakes.ts b/hooks/queries/cakes.ts new file mode 100644 index 00000000..bda08be4 --- /dev/null +++ b/hooks/queries/cakes.ts @@ -0,0 +1,53 @@ +import { getCakesInfo, getCakesResult } from '@/api/cakes'; +import { QUERY_KEY } from '@/constant/queryKey'; +import { CakeLettersType } from '@/types/letters/cakeLettersType'; +import { useState } from 'react'; +import { useQuery } from 'react-query'; + +/** + * 해당 소원에 대한 케이크 조회 + */ +export function useGetCakesInfo( + wishId: string | string[] | undefined, + cakeId: string | string[] | undefined, +) { + const [lettersData, setLettersData] = useState([]); + + const { data } = useQuery(QUERY_KEY.CAKE_LETTERS, async () => getCakesInfo(wishId, cakeId), { + onSuccess: (data) => { + setLettersData(data); + }, + enabled: wishId !== '' && cakeId !== '', + }); + + const lettersSum = lettersData ? lettersData.length : 0; + + return { data, lettersData, lettersSum }; +} + +/** + * 해당 소원에 대한 모든 케이크 리스트 결과 조회 + */ + +export function useGetCakesResult(wishId: string | string[] | undefined) { + const [total, setTotal] = useState(0); + // const setCakesCountData = useSetRecoilState(CakesCountData); + + const { data: cakesCount } = useQuery(QUERY_KEY.CAKES_COUNT, async () => getCakesResult(wishId), { + onSuccess: (data) => { + // setCakesCountData(data); + if (Array.isArray(data)) { + const cakesTotal = calculateTotal(data.map((cake: { count: number }) => cake.count)); + setTotal(cakesTotal); + } + }, + enabled: wishId !== '', + }); + + const calculateTotal = (cakeCounts: number[]): number => { + const total = cakeCounts.reduce((sum, count) => sum + count, 0); + return total; + }; + + return { cakesCount, total }; +} diff --git a/hooks/queries/cakes/useRequestPayReady.ts b/hooks/queries/cakes/useRequestPayReady.ts deleted file mode 100644 index 3f2b1b81..00000000 --- a/hooks/queries/cakes/useRequestPayReady.ts +++ /dev/null @@ -1,11 +0,0 @@ -import { requestPayReady } from '@/api/cakes/cakesAPI'; -import { QUERY_KEY } from '@/constant/queryKey'; -import { useMutation } from 'react-query'; - -export default function useRequestPayReady(wishId: number, cakeNumber: number) { - const { data, mutate, isSuccess } = useMutation(QUERY_KEY.PAYREADY, () => - requestPayReady(wishId, cakeNumber), - ); - - return { data, mutate, isSuccess }; -} diff --git a/hooks/queries/letters/useGetCakeLetters.ts b/hooks/queries/letters/useGetCakeLetters.ts deleted file mode 100644 index 18dc8609..00000000 --- a/hooks/queries/letters/useGetCakeLetters.ts +++ /dev/null @@ -1,24 +0,0 @@ -import { useQuery } from 'react-query'; -import { QUERY_KEY } from '@/constant/queryKey'; -import { CakeLettersType } from '@/types/letters/cakeLettersType'; -import { getCakesLetters } from '@/api/letters/getCakeLetters'; -import { useState } from 'react'; - -export function useGetCakesLetters(wishId: string | string[] | undefined, cakeId: string | string[] | undefined) { - const [lettersData, setLettersData] = useState([]); - - const { data } = useQuery( - QUERY_KEY.CAKE_LETTERS, - async () => getCakesLetters(wishId, cakeId), - { - onSuccess: (data) => { - setLettersData(data); - }, - enabled: wishId !== '' && cakeId !== '' - } - ); - - const lettersSum = lettersData ? lettersData.length : 0; - - return { data, lettersData, lettersSum }; -} \ No newline at end of file diff --git a/hooks/queries/letters/useGetCakesCount.ts b/hooks/queries/letters/useGetCakesCount.ts deleted file mode 100644 index 90567b1d..00000000 --- a/hooks/queries/letters/useGetCakesCount.ts +++ /dev/null @@ -1,33 +0,0 @@ -import { useQuery } from 'react-query'; -import { QUERY_KEY } from '@/constant/queryKey'; -import { getCakesCount } from '@/api/letters/getCakesCount'; -// import { CakesCountData } from '@/recoil/cakesCountData'; -// import { useSetRecoilState } from 'recoil'; -import { useState } from 'react'; - -export function useGetCakesCount(wishId: string | string[] | undefined) { - const [total, setTotal] = useState(0); - // const setCakesCountData = useSetRecoilState(CakesCountData); - - const { data: cakesCount } = useQuery( - QUERY_KEY.CAKES_COUNT, - async () => getCakesCount(wishId), - { - onSuccess: (data) => { - // setCakesCountData(data); - if (Array.isArray(data)) { - const cakesTotal = calculateTotal(data.map((cake: { count: number }) => cake.count)); - setTotal(cakesTotal); - } - }, - enabled: wishId !== '', - } - ); - - const calculateTotal = (cakeCounts: number[]): number => { - const total = cakeCounts.reduce((sum, count) => sum + count, 0); - return total; - }; - - return { cakesCount, total }; -} diff --git a/hooks/queries/links/useDeleteWishLinks.ts b/hooks/queries/links/useDeleteWishLinks.ts deleted file mode 100644 index 7e51e25a..00000000 --- a/hooks/queries/links/useDeleteWishLinks.ts +++ /dev/null @@ -1,8 +0,0 @@ -import { deleteWishLinks } from '@/api/links/deleteWishLinks'; -import { useMutation } from 'react-query'; - -export function useDeleteWishLinks() { - const mutation = useMutation((wishesData: number[]) => deleteWishLinks(wishesData)); - - return mutation; -} \ No newline at end of file diff --git a/hooks/queries/links/useGetOneWish.ts b/hooks/queries/links/useGetOneWish.ts deleted file mode 100644 index b0fcba8b..00000000 --- a/hooks/queries/links/useGetOneWish.ts +++ /dev/null @@ -1,23 +0,0 @@ -import { useQuery } from 'react-query'; -import { QUERY_KEY } from '@/constant/queryKey'; -import { getOneWish } from '@/api/links/getOneWish'; -import router from 'next/router'; - -export function useGetOneWish(wishId: string | string[] | undefined) { - const { data: wishData } = useQuery( - QUERY_KEY.ONE_WISH, - async () => getOneWish(wishId), - { - onError: (error: any) => { - if (error.response && error.response.status === 403) { - alert('해당 소원에 접근할 수 없습니다.'); - router.back(); - } - }, - enabled: wishId !== '', - } - ); - - - return { wishData }; -} diff --git a/hooks/queries/links/useGetWishLinks.ts b/hooks/queries/links/useGetWishLinks.ts deleted file mode 100644 index 27b8651e..00000000 --- a/hooks/queries/links/useGetWishLinks.ts +++ /dev/null @@ -1,27 +0,0 @@ -import { useQuery } from 'react-query'; -import { QUERY_KEY } from '@/constant/queryKey'; -import { getWishLinks } from '@/api/links/getWishLinks'; -import { WishLinksType } from '@/types/links/wishLinksType'; -import { useState } from 'react'; - -export function useGetWishLinks() { - const [noWishes, setNoWishes] = useState(true); - const [wishLinks, setWishLinks] = useState([]); - - const { data, isSuccess } = useQuery( - QUERY_KEY.WISH_LINKS, - async () => getWishLinks(), - { - onSuccess: (wishLinks) => { - if (wishLinks.length > 0) { - setNoWishes(false); - } - - setWishLinks(wishLinks); - }, - } - ); - - - return { wishLinks, isSuccess, noWishes }; -} diff --git a/hooks/queries/main/useGetProgressData.ts b/hooks/queries/main/useGetProgressData.ts deleted file mode 100644 index a56349b5..00000000 --- a/hooks/queries/main/useGetProgressData.ts +++ /dev/null @@ -1,26 +0,0 @@ -import { getProgressData } from '@/api/main/getProgressData'; -import { QUERY_KEY } from '@/constant/queryKey'; -import { useState } from 'react'; -import { useQuery } from 'react-query'; - -export default function useGetProgressData() { - const [wishStatus, setWishStatus] = useState(''); - - const { data: progressData, isSuccess } = useQuery(QUERY_KEY.PROGRESS, getProgressData, { - onSuccess: (data) => { - if (data) { - if (data.status === 'WHILE') { - setWishStatus('while'); - } else if (data.status === 'END') { - setWishStatus('end'); - } else if (data.status === 'BEFORE') { - setWishStatus('before'); - } - } else { - setWishStatus('none'); - } - }, - }); - - return { progressData, wishStatus, isSuccess }; -} diff --git a/hooks/queries/mypage/useEditWishesInfo.tsx b/hooks/queries/mypage/useEditWishesInfo.tsx deleted file mode 100644 index 6f45cff3..00000000 --- a/hooks/queries/mypage/useEditWishesInfo.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import { editWishesInfo } from '@/api/mypage/mypageAPI'; -import { EditWishesInfoDataType } from '@/types/mypage/editWishesInfoDataType'; -import { useRouter } from 'next/router'; -import { useMutation } from 'react-query'; - -export default function useEditWishesInfo(editWishesInfoData: EditWishesInfoDataType) { - const router = useRouter(); - const { mutate: editWishesData } = useMutation(() => editWishesInfo(editWishesInfoData), { - onSuccess: () => { - alert('수정성공'); - router.back(); - }, - }); - - return { editWishesData }; -} diff --git a/hooks/queries/user.ts b/hooks/queries/user.ts new file mode 100644 index 00000000..57ef46d9 --- /dev/null +++ b/hooks/queries/user.ts @@ -0,0 +1,22 @@ +import { getUserAccount, patchUserAccount } from '@/api/user'; +import { QUERY_KEY } from '@/constant/queryKey'; +import { WishesDataInputType } from '@/types/common/input/wishesInput'; +import router from 'next/router'; +import { UseFormReturn } from 'react-hook-form'; +import { useMutation, useQuery } from 'react-query'; + +export function usePatchUserAccount(methods: UseFormReturn) { + const { mutate: patchUserAccountData } = useMutation(() => patchUserAccount(methods), { + onSuccess: () => { + router.push('/wishes/share'); + }, + }); + + return { patchUserAccountData }; +} + +export function useGetUserAccount() { + const { data: userAccountData } = useQuery(QUERY_KEY.ITEM_DATA, getUserAccount); + + return { userAccountData }; +} diff --git a/hooks/queries/wishes.ts b/hooks/queries/wishes.ts new file mode 100644 index 00000000..0535637c --- /dev/null +++ b/hooks/queries/wishes.ts @@ -0,0 +1,127 @@ +import { + deleteWishes, + getMainProgressData, + getProgressWishInfo, + getSingleWishInfo, + getWishes, + patchProgressWishInfo, + postWishes, +} from '@/api/wishes'; +import { QUERY_KEY } from '@/constant/queryKey'; +import { LoginUserInfo } from '@/recoil/auth/loginUserInfo'; +import { WishesDataInputType } from '@/types/common/input/wishesInput'; +import { WishLinksType } from '@/types/links/wishLinksType'; +import router from 'next/router'; +import { useState } from 'react'; +import { UseFormReturn } from 'react-hook-form'; +import { useMutation, useQuery } from 'react-query'; +import { useSetRecoilState } from 'recoil'; + +/** + * 모든 소원리스트 조회 + */ +export function useGetWishes() { + const { data } = useQuery(QUERY_KEY.WISHES_DATA, getWishes); + + return data; +} + +/** + * 진행중인 소원 정보 수정 + */ +export function usePatchWishes(methods: UseFormReturn) { + const { mutate: patchWishesData } = useMutation(() => patchProgressWishInfo(methods), { + onSuccess: () => { + alert('수정성공'); + router.back(); + }, + }); + + return { patchWishesData }; +} + +/** + * 소원링크 생성 + */ +export function usePostWishes(methods: UseFormReturn) { + const setLoginUserInfo = useSetRecoilState(LoginUserInfo); + + const { mutate: postWishesData } = useMutation(() => postWishes(methods), { + onSuccess: (data) => { + setLoginUserInfo((prevData) => ({ + ...prevData, + wishesId: data.data.data, + })); + }, + }); + + return { postWishesData }; +} + +/** + * 소원링크 삭제 + */ +export function useDeleteWishes() { + const mutation = useMutation((wishesData: number[]) => deleteWishes(wishesData)); + + return mutation; +} + +/** + * 진행중인 소원 정보 조회 + */ +export function useGetWishesProgress() { + const { data: wishesProgressData, ...restProps } = useQuery( + QUERY_KEY.PROGRESS, + getProgressWishInfo, + ); + + return { wishesProgressData, ...restProps }; +} + +/** + * 진행중인 소원 조회(메인화면) + */ +export function useGetMainProgressData() { + const { data: progressData, ...restProps } = useQuery(QUERY_KEY.PROGRESS, getMainProgressData); + + return { progressData, ...restProps }; +} + +/** + * 소원 단건 조회 + */ +export function useGetSingleWishInfo(wishId: string | string[] | undefined) { + const { data: wishData } = useQuery(QUERY_KEY.ONE_WISH, async () => getSingleWishInfo(wishId), { + onError: (error: any) => { + if (error.response && error.response.status === 403) { + alert('해당 소원에 접근할 수 없습니다.'); + router.back(); + } + }, + enabled: wishId !== '', + }); + + return { wishData }; +} + +export function useGetWishLinks() { + const [noWishes, setNoWishes] = useState(true); + const [wishLinks, setWishLinks] = useState([]); + + const { data, isSuccess } = useQuery( + QUERY_KEY.WISH_LINKS, + async () => getWishes(), + { + onSuccess: (wishLinks) => { + if (wishLinks.length > 0) { + setNoWishes(false); + } + + setWishLinks(wishLinks); + }, + }, + ); + + return { wishLinks, isSuccess, noWishes }; +} diff --git a/hooks/queries/wishes/useCreateWishesLink.ts b/hooks/queries/wishes/useCreateWishesLink.ts deleted file mode 100644 index ed9caf3d..00000000 --- a/hooks/queries/wishes/useCreateWishesLink.ts +++ /dev/null @@ -1,21 +0,0 @@ -import { createWishesLink } from '@/api/wishes/wishesAPI'; -import { LoginUserInfo } from '@/recoil/auth/loginUserInfo'; -import { WishesData } from '@/recoil/formPage/wishesData'; -import { useMutation } from 'react-query'; -import { useRecoilValue, useSetRecoilState } from 'recoil'; - -export function useCreateWishesLink() { - const wishesData = useRecoilValue(WishesData); - const setLoginUserInfo = useSetRecoilState(LoginUserInfo); - - const { mutate: postWishesData, isSuccess } = useMutation(() => createWishesLink(wishesData), { - onSuccess: (data) => { - setLoginUserInfo((prevData) => ({ - ...prevData, - wishesId: data.data.data, - })); - }, - }); - - return { postWishesData }; -} diff --git a/hooks/queries/wishes/useGetItemInfo.ts b/hooks/queries/wishes/useGetItemInfo.ts deleted file mode 100644 index 479aa467..00000000 --- a/hooks/queries/wishes/useGetItemInfo.ts +++ /dev/null @@ -1,29 +0,0 @@ -import useInput from '@/hooks/common/useInput'; -import { useState } from 'react'; - -//링크 타입을 유니온으로 설정해야됨 -export function useGetItemInfo() { - const [linkURL, handleChangeLinkURL, setLinkURL] = useInput(''); - const [imageURL, setImageURL] = useState(''); - const [price, setPrice] = useState(0); - - const changeLinkURL = (input: string) => { - setLinkURL(input); - }; - const changeImageURL = (input: string) => { - setImageURL(input); - }; - const changePrice = (input: number) => { - setPrice(input); - }; - - return { - linkURL, - changeLinkURL, - handleChangeLinkURL, - imageURL, - changeImageURL, - price, - changePrice, - }; -} diff --git a/hooks/queries/wishes/useGetUserAccount.tsx b/types/api/request.ts similarity index 100% rename from hooks/queries/wishes/useGetUserAccount.tsx rename to types/api/request.ts diff --git a/types/api/response.ts b/types/api/response.ts new file mode 100644 index 00000000..d4f2ed6b --- /dev/null +++ b/types/api/response.ts @@ -0,0 +1,18 @@ +import { AccountInfoType } from '../common/input/wishesInput'; +import { MainProgressDataType, WishesProgressDataType } from '../wishesType'; + +export type DefaultResponseType = { + success: boolean; + message: string; + data: T; +}; + +export type MainProgressDataResponseType = DefaultResponseType; + +export type WishesProgressDataResponseType = DefaultResponseType; + +export type UserAccountDataResponseType = DefaultResponseType<{ + accountInfo: AccountInfoType; + id: number; + phone: string | number; +}>; diff --git a/types/mypage/editWishesInfoDataType.ts b/types/mypage/editWishesInfoDataType.ts deleted file mode 100644 index 67d02730..00000000 --- a/types/mypage/editWishesInfoDataType.ts +++ /dev/null @@ -1,13 +0,0 @@ -export interface EditWishesInfoDataType { - startDate: Date; - endDate: Date; - name: string; - bankName: string; - account: string; - phone: string; - imageUrl: string; - price: number; - title: string; - hint: string; - initial: string; -} diff --git a/types/wishesType.ts b/types/wishesType.ts new file mode 100644 index 00000000..eec5dc85 --- /dev/null +++ b/types/wishesType.ts @@ -0,0 +1,33 @@ +export type MainProgressDataType = { + wishId: string; + cakeCount: number; + dayCount: number; + price: number; + percent: number; + status: 'WHILE' | 'BEFORE' | 'END'; +}; + +export interface WishesProgressDataType extends WishesDataInputType { + accountInfo: AccountInfoType; +} + +export interface WishesDataInputType extends BankInfoInputsType { + linkURL: string; + imageUrl: string; + price: string | number; + initial: string; + title: string; + hint: string; + startDate: Date; + endDate: Date; +} + +export interface BankInfoInputsType extends AccountInfoType { + phone: string; +} + +export interface AccountInfoType { + name: string; + bank: string; + account: string; +} diff --git a/utils/common/token.ts b/utils/common/token.ts new file mode 100644 index 00000000..0c7eb814 --- /dev/null +++ b/utils/common/token.ts @@ -0,0 +1,6 @@ +export const getAccessToken = (): string | null => { + if (typeof window !== 'undefined') { + return localStorage.getItem('accessToken'); + } + return null; +}; From 2ad59a84fbfa19fcba55145e1803a81900796590 Mon Sep 17 00:00:00 2001 From: myeongheonhong Date: Thu, 21 Dec 2023 17:22:40 +0900 Subject: [PATCH 2/7] =?UTF-8?q?[=20refactor=20]=20=EB=B3=80=EA=B2=BD?= =?UTF-8?q?=EB=90=9C=20API=20=EC=A0=81=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/mypage/letters/[id].tsx | 4 +- components/mypage/letters/cakeListButton.tsx | 40 ++++++++--------- components/mypage/letters/lettersMain.tsx | 4 +- components/mypage/links/[id].tsx | 2 +- components/mypage/links/index.tsx | 5 +-- components/mypage/links/wishLists.tsx | 2 +- components/wishes/[id].tsx | 15 ++----- components/wishes/wishesForm/BankInfo.tsx | 45 ++++++++----------- components/wishes/wishesForm/Preview.tsx | 13 ++++-- .../{UploadGift.tsx => UploadPresent.tsx} | 29 +++++++----- components/wishes/wishesForm/WisehsStep2.tsx | 23 +--------- components/wishes/wishesForm/WishesStep1.tsx | 19 ++++---- components/wishes/wishesForm/index.tsx | 20 +++++++-- components/wishes/wishesForm/itemLink.tsx | 17 ++++--- hooks/wishes/useUploadItemInfo.ts | 10 ++--- 15 files changed, 115 insertions(+), 133 deletions(-) rename components/wishes/wishesForm/{UploadGift.tsx => UploadPresent.tsx} (76%) diff --git a/components/mypage/letters/[id].tsx b/components/mypage/letters/[id].tsx index 39954bda..a41cde62 100644 --- a/components/mypage/letters/[id].tsx +++ b/components/mypage/letters/[id].tsx @@ -6,8 +6,8 @@ import { BorderImg } from '@/public/assets/images'; import { useEffect, useState } from 'react'; import { ArrowLeftIc, ArrowRightIc, BackBtnIc } from '@/public/assets/icons'; import { useRouter } from 'next/router'; -import { useGetCakesLetters } from '@/hooks/queries/letters/useGetCakeLetters'; import { CAKE_LIST } from '@/constant/cakeList'; +import { useGetCakesInfo } from '@/hooks/queries/cakes'; export default function LettersContainer() { const [wishId, setWishId] = useState(''); @@ -26,7 +26,7 @@ export default function LettersContainer() { const cakeData = CAKE_LIST.find((cake) => cake.cakeNumber === Number(cakeId)); // 편지 - const { lettersData, lettersSum } = useGetCakesLetters(wishId, cakeId); + const { lettersData, lettersSum } = useGetCakesInfo(wishId, cakeId); const handleNameBoxClick = (index: number) => { setClickedBox(index); diff --git a/components/mypage/letters/cakeListButton.tsx b/components/mypage/letters/cakeListButton.tsx index 97bfc5c1..05f7d60a 100644 --- a/components/mypage/letters/cakeListButton.tsx +++ b/components/mypage/letters/cakeListButton.tsx @@ -2,7 +2,6 @@ import theme from '@/styles/theme'; import styled from 'styled-components'; import Image, { StaticImageData } from 'next/image'; - interface CakeListButtonProps { image?: string | StaticImageData; backgroundColor: string; @@ -17,35 +16,32 @@ export default function CakeListButton(props: CakeListButtonProps) { const { image, backgroundColor, fonts, fontColor, handleClick, cakeName, cakeNum } = props; return ( - {image && ( - 케이크 이미지 - )} + {image && 케이크 이미지} {/* */} {cakeName} X {cakeNum}개 - ); } const Styled = { - Container: styled.button<{ backgroundColor: string } >` - width: 100%; - height: 6rem; + Container: styled.button<{ backgroundColor: string }>` + width: 100%; + height: 6rem; - display: flex; - justify-content: left; - align-items: center; + display: flex; + justify-content: left; + align-items: center; - padding: 0 2rem 0; - border-radius: 1rem; + padding: 0 2rem 0; + border-radius: 1rem; - color: ${theme.colors.gray4}; - background-color: ${(props) => props.backgroundColor}; - border-color: transparent; - margin: 0 0 1rem; -`, + color: ${theme.colors.gray4}; + background-color: ${(props) => props.backgroundColor}; + border-color: transparent; + margin: 0 0 1rem; + `, // TextContainer: styled.div<{ fonts: string; fontColor: string }>` // padding: 0.2rem 0.5rem 0 1rem; @@ -54,10 +50,10 @@ const Styled = { // `, TextContainer: styled.div<{ fontColor: string }>` - padding: 0.2rem 0.5rem 0 1rem; + padding: 0.2rem 0.5rem 0 1rem; `, NumText: styled.span` -color: ${theme.colors.main_blue}; -` -}; \ No newline at end of file + color: ${theme.colors.main_blue}; + `, +}; diff --git a/components/mypage/letters/lettersMain.tsx b/components/mypage/letters/lettersMain.tsx index 25640788..ba48c4a9 100644 --- a/components/mypage/letters/lettersMain.tsx +++ b/components/mypage/letters/lettersMain.tsx @@ -2,12 +2,12 @@ import theme from '@/styles/theme'; import styled from 'styled-components'; import { useRouter } from 'next/router'; import CakeListButton from './cakeListButton'; -import { useGetCakesCount } from '@/hooks/queries/letters/useGetCakesCount'; import { useRecoilValue } from 'recoil'; import { LoginUserInfo } from '@/recoil/auth/loginUserInfo'; import { useEffect, useState } from 'react'; import MainHeader from '@/components/common/mainHeader'; import { CAKE_LIST } from '@/constant/cakeList'; +import { useGetCakesResult } from '@/hooks/queries/cakes'; export default function LettersMainContainer() { const [wishId, setWishId] = useState(''); @@ -27,7 +27,7 @@ export default function LettersMainContainer() { }, [loginUserInfo]); // cake 개수, 합 - const { cakesCount, total } = useGetCakesCount(wishId); + const { cakesCount, total } = useGetCakesResult(wishId); const getCakeNum = (cakeId: number, cakesCount: any[]): number => { if (!cakesCount) { diff --git a/components/mypage/links/[id].tsx b/components/mypage/links/[id].tsx index 1512f839..4845a709 100644 --- a/components/mypage/links/[id].tsx +++ b/components/mypage/links/[id].tsx @@ -5,7 +5,7 @@ import theme from '@/styles/theme'; import { LinkBeefCakeImg } from '@/public/assets/images'; import { useEffect, useState } from 'react'; import { useGetOneWish } from '@/hooks/queries/links/useGetOneWish'; -import { convertDateFormat } from '@/hooks/useDate'; +import { convertDateFormat } from '@/hooks/common/useDate'; import VerticalProgressBar from '@/components/common/verticalProgressBar'; export default function LinksContainer() { diff --git a/components/mypage/links/index.tsx b/components/mypage/links/index.tsx index 846aeeb2..d5b9acae 100644 --- a/components/mypage/links/index.tsx +++ b/components/mypage/links/index.tsx @@ -4,19 +4,18 @@ import useModal from '@/hooks/common/useModal'; import Modal from '@/components/common/modal'; import DeleteModal from '@/components/common/modal/DeleteModal'; import { useState } from 'react'; -import { useGetWishLinks } from '@/hooks/queries/links/useGetWishLinks'; import WishLists from './wishLists'; import NoWishLists from './noWishLists'; -import { useDeleteWishLinks } from '@/hooks/queries/links/useDeleteWishLinks'; import { useQueryClient } from 'react-query'; import { QUERY_KEY } from '@/constant/queryKey'; +import { useDeleteWishes, useGetWishLinks } from '@/hooks/queries/wishes'; export default function LinksMainContainer() { const [selectedLinks, setSelectedLinks] = useState([]); const { isOpen, handleToggle } = useModal(); const queryClient = useQueryClient(); - const deleteWishesMutation = useDeleteWishLinks(); + const deleteWishesMutation = useDeleteWishes(); const { wishLinks, noWishes } = useGetWishLinks(); diff --git a/components/mypage/links/wishLists.tsx b/components/mypage/links/wishLists.tsx index fc7d1169..085ffb24 100644 --- a/components/mypage/links/wishLists.tsx +++ b/components/mypage/links/wishLists.tsx @@ -1,6 +1,6 @@ import LinksBox from './linksBox'; import { WishLinksType } from '@/types/links/wishLinksType'; -import { convertDateFormat } from '@/hooks/useDate'; +import { convertDateFormat } from '@/hooks/common/useDate'; import router from 'next/router'; interface WishListsProps { diff --git a/components/wishes/[id].tsx b/components/wishes/[id].tsx index 29ae46f0..7b713055 100644 --- a/components/wishes/[id].tsx +++ b/components/wishes/[id].tsx @@ -4,7 +4,7 @@ import { useRouter } from 'next/router'; import { useQuery } from 'react-query'; import Button from '../common/button'; import MainView from '../common/mainView'; -import { getWishesData } from '@/api/cakes/cakesAPI'; +import { useGetSingleWishInfo } from '@/hooks/queries/wishes'; export default function WishesContainer() { const [wishesId, setWishesId] = useState(''); @@ -15,16 +15,7 @@ export default function WishesContainer() { setWishesId(router.query.id); }, [router.isReady]); - const { data } = useQuery('wished', getWishesData); - - // const { data } = useQuery('wished', async () => getWishesData(Number(wishesId)), { - // onError: (error: any) => { - // console.error("에러 발생:", error); - // alert("해당 소원의 펀딩이 아직 가능하지 않습니다. 펀딩 기간을 확인해주세요."); - // router.back(); - // }, - // enabled: wishesId !== '', - // }); + const { wishData } = useGetSingleWishInfo(wishesId); const handleMoveToCakes = () => { router.push(`/cakes/${wishesId}`); @@ -36,7 +27,7 @@ export default function WishesContainer() { return ( - + - + */} ); } diff --git a/components/common/box/itemImageBox.tsx b/components/common/box/itemImageBox.tsx index ca351500..daab16d3 100644 --- a/components/common/box/itemImageBox.tsx +++ b/components/common/box/itemImageBox.tsx @@ -1,6 +1,5 @@ import Image from 'next/image'; import ImageBox from './imageBox'; -import styled from 'styled-components'; interface ItemImageBoxProps { src: string; @@ -9,6 +8,7 @@ interface ItemImageBoxProps { export default function ItemImageBox(props: ItemImageBoxProps) { const { src, alt } = props; + return ( {alt} diff --git a/components/common/button/iconButton.tsx b/components/common/button/iconButton.tsx deleted file mode 100644 index 6457c6e7..00000000 --- a/components/common/button/iconButton.tsx +++ /dev/null @@ -1,23 +0,0 @@ -import Image from 'next/image'; - -interface IconButtonProps { - src: string; - alt: string; - onClick?: () => void; -} - -export default function IconButton(props: IconButtonProps) { - const { src, alt, onClick } = props; - - const handleClick = () => { - if (onClick) { - onClick(); - } - }; - - return ( - - ); -} diff --git a/components/common/calendar/calendar.tsx b/components/common/calendar/calendar.tsx index b36f0d87..c02d1564 100644 --- a/components/common/calendar/calendar.tsx +++ b/components/common/calendar/calendar.tsx @@ -15,13 +15,11 @@ import { getDate } from '@/utils/common/getDate'; interface CalendarProps { date: Date; methods: UseFormReturn; - disable: boolean; - colorSystem: ColorSystemType; - readOnly: boolean; + readOnly?: boolean; } export default function Calendar(props: CalendarProps) { - const { date, methods, disable, colorSystem, readOnly } = props; + const { date, methods, readOnly } = props; const handleChangeDate = (selectedDate: Date) => { methods.setValue('startDate', selectedDate); @@ -29,7 +27,10 @@ export default function Calendar(props: CalendarProps) { }; return ( - + ( @@ -46,7 +47,7 @@ export default function Calendar(props: CalendarProps) { /> {/* */} - 캘린더 아이콘 + 캘린더 아이콘 ); } diff --git a/components/common/input/textareaBox.tsx b/components/common/input/textareaBox.tsx index ea1d1b92..e4f695d6 100644 --- a/components/common/input/textareaBox.tsx +++ b/components/common/input/textareaBox.tsx @@ -8,7 +8,6 @@ import ImageBox from '../box/imageBox'; interface TextareaBoxProps { placeholder?: string; - value?: string; inputLength: number; limitLength: number; readOnly?: boolean; @@ -16,11 +15,11 @@ interface TextareaBoxProps { } export default function TextareaBox(props: TextareaBoxProps) { - const { placeholder, value, inputLength, limitLength, readOnly, register } = props; + const { placeholder, inputLength, limitLength, readOnly, register } = props; return ( - + {limitLength && } diff --git a/components/common/modal/BankInput.tsx b/components/common/modal/BankInput.tsx index d45e4053..ed90d96f 100644 --- a/components/common/modal/BankInput.tsx +++ b/components/common/modal/BankInput.tsx @@ -5,7 +5,7 @@ import styled from 'styled-components'; import Button from '../button'; import { UseFormReturn } from 'react-hook-form'; import Input from '../input/input'; -import { BankInfoInputsType } from '@/types/common/input/wishesInput'; +import { WishesDataInputType } from '@/types/common/input/wishesInput'; import { ArrowDownIc } from '@/public/assets/icons'; import Image from 'next/image'; import { StyledBox } from '../box'; @@ -13,7 +13,7 @@ import theme from '@/styles/theme'; import AlertTextBox from '../alertTextBox'; interface BankInputProps { - methods: UseFormReturn; + methods: UseFormReturn; } export default function BankInput(props: BankInputProps) { @@ -31,7 +31,7 @@ export default function BankInput(props: BankInputProps) { - + 더 보기 diff --git a/components/common/modal/BankModal.tsx b/components/common/modal/BankModal.tsx index d661f859..67969096 100644 --- a/components/common/modal/BankModal.tsx +++ b/components/common/modal/BankModal.tsx @@ -13,8 +13,8 @@ interface BankModalProps { export default function BankModal(props: BankModalProps) { const { handleToggle, methods } = props; - const handleChangeBankName = (input: string) => { - methods.setValue('bankName', input); + const handleChangeBank = (input: string) => { + methods.setValue('bank', input); handleToggle(); }; @@ -24,7 +24,7 @@ export default function BankModal(props: BankModalProps) { {BANK_LIST.map((bank) => ( - handleChangeBankName(bank.name)}> + handleChangeBank(bank.name)}> {`${bank.name} diff --git a/components/common/modal/DeleteModal.tsx b/components/common/modal/DeleteModal.tsx index 673f8c91..5dc486d1 100644 --- a/components/common/modal/DeleteModal.tsx +++ b/components/common/modal/DeleteModal.tsx @@ -3,7 +3,6 @@ import Image from 'next/image'; import theme from '@/styles/theme'; import { CloseSmallIc } from '@/public/assets/icons'; -import IconButton from '@/components/common/button/iconButton'; import { MainCakeImg } from '@/public/assets/images'; import Button from '../button'; @@ -24,7 +23,7 @@ export default function DeleteModal(props: DeleteModalProps) { return ( - + 닫기 diff --git a/components/common/modal/GuideModal.tsx b/components/common/modal/GuideModal.tsx index 0638e8ec..fc175a56 100644 --- a/components/common/modal/GuideModal.tsx +++ b/components/common/modal/GuideModal.tsx @@ -1,9 +1,7 @@ import styled from 'styled-components'; import Image from 'next/image'; -import IconButton from '@/components/common/button/iconButton'; import { CloseWhiteIc } from '@/public/assets/icons'; import { GuideContentImg, GuideBoxImg } from '@/public/assets/images'; -import Button from '../button'; interface GuideModalProps { clickModal: () => void; @@ -22,22 +20,13 @@ export default function GuideModal(props: GuideModalProps) { - + 닫기 { 서비스 가이드 설명 - - - } @@ -104,9 +93,4 @@ const Styled = { position: relative; margin: 2.3rem 0rem 2.9rem; `, - - ButtonContainer2: styled.div` - position: relative; - margin: 2.3rem 2.1rem 0; - `, }; diff --git a/components/common/modal/index.tsx b/components/common/modal/index.tsx index e8dcc5f2..f7968f63 100644 --- a/components/common/modal/index.tsx +++ b/components/common/modal/index.tsx @@ -4,14 +4,15 @@ import styled from 'styled-components'; interface ModalProps { isOpen: boolean; handleToggle: () => void; + bgNone?: boolean; } export default function Modal(props: PropsWithChildren) { - const { isOpen, handleToggle, children } = props; + const { isOpen, handleToggle, bgNone, children } = props; return ( <> {isOpen && ( - + e.stopPropagation()}> {children} @@ -22,7 +23,7 @@ export default function Modal(props: PropsWithChildren) { } const Styled = { - ModalOverlay: styled.div` + ModalOverlay: styled.div<{ bgNone?: boolean }>` display: flex; justify-content: center; align-items: center; @@ -34,7 +35,7 @@ const Styled = { position: fixed; top: 0; left: 0; - background: rgba(0, 0, 0, 0.7); + background: ${(props) => (props.bgNone ? 'transparent' : 'rgba(0, 0, 0, 0.7)')}; display: flex; justify-content: center; align-items: center; diff --git a/components/login/redirect.tsx b/components/login/redirect.tsx index cdda5b27..de079eec 100644 --- a/components/login/redirect.tsx +++ b/components/login/redirect.tsx @@ -1,7 +1,7 @@ import { useRouter } from 'next/router'; -import useAuthKakao from '@/hooks/queries/login/useAuthKakao'; import { useEffect } from 'react'; import Loading from '../common/loading'; +import { useAuthKakao } from '@/hooks/queries/auth'; export default function Redirect() { const router = useRouter(); @@ -14,7 +14,5 @@ export default function Redirect() { } }, [accessToken, refreshToken, nickName]); - return ( - - ); -} \ No newline at end of file + return ; +} diff --git a/public/assets/images/guideContentImg.svg b/public/assets/images/guideContentImg.svg index 5fe7b827..970d2d35 100644 --- a/public/assets/images/guideContentImg.svg +++ b/public/assets/images/guideContentImg.svg @@ -1,4 +1,4 @@ - + @@ -9,10 +9,6 @@ - - - - @@ -139,7 +135,6 @@ - @@ -173,16 +168,15 @@ - - - - + + + - + @@ -205,16 +199,16 @@ - + - + - - - - + + + + @@ -222,76 +216,76 @@ - + - + - - - - - - + + + + + + - - - - - + + + + + - - - - - + + + + + - - - - - + + + + + - - - - - + + + + + - - - - - + + + + + - - - - - + + + + + - - - - - + + + + + - - - - - + + + + + - - - + + + - + diff --git a/public/assets/images/index.ts b/public/assets/images/index.ts index 954782c8..c2b1477e 100644 --- a/public/assets/images/index.ts +++ b/public/assets/images/index.ts @@ -2,6 +2,7 @@ export { default as MainLoginImg } from '../images/mainLoginImg.png'; export { default as MainCakeImg } from '../images/mainCakeImg.png'; export { default as LogoImg } from '../images/logoImg.svg'; +export { default as MainPageCakeImg } from '../images/mainPageCakeImg.png'; export { default as BeefCakeDetailImg } from '../images/cakes/beefCakeDetailImg.png'; export { default as ChickenCakeDetailImg } from '../images/cakes/chickenCakeDetailImg.png'; diff --git a/public/assets/images/mainCakeImg.png b/public/assets/images/mainCakeImg.png index db60b0bb55fad5ac5b70c676ab8f1cb478de04fb..dcc989f309003eae04cc6f9b9ca63d1234f60468 100644 GIT binary patch literal 7656 zcmeHMhf`CDw+_O>x>7_CkWdtOfPxeO=|orBu7V;>dKJ`AqzHr-kOe{$qZ>7JL8Syj z6GBM{t^`7nh?EfNU23Exp(Zcx@6G(?&70-NAMi4BPbT-yotvERobUV2Ny;rtGrnKM ze*pjhe7~6+-v$7V!G9b-bFzKtD@2n z=cy9UCI0jB=X{u)vCRG3%AynPixYfgX0E!Jw}^( zkT)bD4)*u^|JPv|X!Rx@D|q*IMC8Q=6H`)J*9Vy#pv=v=`(3;!rS~T(?543r1-1S&W@zPO(~W5;b$({A8;Jfo z6U%rZ&~}Gt6tiNeaFgphE5$qxR|vZXw-wlyQpgQMMPrjaCA@>w;_$7DegMF;6!U)w zXVy8Z%(fzN#2RIKmI0}#9>)MD#2d@CN(BY&L<@5c%|cYevgbAzj@`@arvLzQLhQEu z=b)i*Dy;ekf`#v}iUFDGU)nCy1Y&$|8rDZ&Hl5r`=y>VLWwZy9PGjvRR@$K$cmiNv1Bz3q>vEI$Oj8>YXyz0o|w$P~^5>tJFCe57F+l2)QtX zXEofvtBFC!j|<6KrF%;Y2&0`5sPOaITDNFTBOoni5{)tSH=*|$D2+SdeEuXU zHPCZ|f<=Yt?OTeW6l@IiIA`k7-0Tmn0qf-Q0j^vU zJbp;1QI1P_A3E~amjW$_U?$hgoe$)33D8znwh~!_0uoxaqZJUXKJ7WVQW`>08*_pC z_j4foi<7}1+*ViD-hyxO%xP7Sc+ux&dZFSHNn{ltkzdw?Cru-)_+h;~g~WoXDwmb5JJ zL<$isHGNikj|3GKwbS;Jz;0f|5LPkcC!;>SUgj65t28Y{j6GVR<{F&&ek}UbVVV0o zuQir{Dg|#Oi4QHOnktrP*(_OfYYS6+&ojG;!(L8?gAQ9mcwSI2`8+arZRZ!=P4YA0QD~zLuBGptoU!P1q609h&_0<8P}LL z=iE+*ao?g6&OH4{+-2!mTO+`!SeR=ib9S|&qC$+|O58LMhtCDZ%rY_dm6V*=?I%%E zuKaWf!Q(g53t53)A+qwnfnl(mT*}T=zcWQ`uONE!i?MM)Ksf_CWOw7~4CIAmrQ=gl zD2a~G{e>=3T+0D4mzOy#_*lx_DCrlF0`;-N6vKv#K`g`wlp%nZa?UL+UF_Q91LX5o zgz3L4_ANx0YZ>K_y&uVCUbZlE>DTBFr)Qd7w<2w@yK?7>nw7EKjk3Z9{hB-Jl3`oK z_{k*;zJ^o3JbyiyiI;y2&I#4aeU+V`$t|I(`qQoJBEEZWCbNG89f{fh65Aa=yFRVJ zt?ZPZ6^U~#N26`f4sLE~DbMcqiL13XOVl{`5)-UOMn}^Ps02$To+7vKv8gVtIRH(* zyaH{CA!j(IW`)Q%%1fAd7~s%Qr&LM1Sx6`b!&6S#5ye_5@t9$NksOJ_cdxt%91nBs z%dF{zagV*^(EXMK%G}u z*kyN#Prbc_g6glpWiWgJGEj}fNp>%g2#T8O3I=HnQ{ijSJ$$M2K&ooXs(tLT8;{pD z<6l$DnYNxuw~bdt;W%aBLxOmNUDv{VNnWl{IB(~4QrBLZ-#Ia*qcmHN`L;%}G&ZD_ zILa-*M6alF56>g8x=W zq)=y@{=w&U!nbzMfq}8{RI6`uJFQv}D`WMxCaZ55oil(W`>o7#JAWLk`oQZ@Yk_-{ z;1!s;yqosgqVy$ddX|bS_T-EwI7FjqY*mbB#HlC+T%ddRisgU_-|kNo=(4k}AND07 zRL#!D@Gt=WhNmaRyZm1$blj$uP0zb`NDONWRk|45Zk%uKUOsR-K!#$*_6uL-wrqHm zE*WJ7jeIim^g@Lb_O$Dp)`y?7rPNG7wXIL~1Om*j(!*u10KVIY%qnxXo;BHu94i6G z2Dq_Us2!w@$g1577yCNzG7VZ*zqEd=L0PUYJ@2{iWB5a3A1s0cd0OBna!pVQ` zAxtr167$|<0D8iQWu_HSGS;Q+SlbNeEG7rr}Hc%a55{n zfm$%pvo#Q!{uh|}r7vQAiqnd`5~?p2IM>R^kLX4fqJxKZ$abjyCzO&rs*a(CkTvHM z*<8zmKNVAD*pyg=4vy0+l9f3F209&7b(;#o=O)K~yVMhS_w#9`tc_=)7PLT`?6Y-y z)7j+!L-89e!Dk`hvfV#sM@L&;A;)%30NBDuX#?(fYF3IyXCB2L-AX|P?~XG}g8n0xx&wGzm; zJ)J*>R_xwPhHlxjx~V_aow?jQ*y&Zu67g0K`}#9aM?DXhz3Z&HW!DwIyW>2^^cQXq z^R>hcZ4;-HnEFgA%JFvSbjVfNqov(>p6%IgnhJ-v^Dnc>pO7ZXjiwBb!cyROIeoP) zEi4#;)*P+hlOhd?o)=Pw?d#rrHp*E4?NDy{S84w~eF=vJI@pl({OXqQEaEQ6>oe*8 zqpy97wj`ULO;^?nGnZUTjar~n1qZ%4ENU`L)C7XUTUe|VztgPF{QY^o1^q*BjfJXm zx1+kd_v*vUw@|eQOX1G;>H~$>om?8{{PXj*OpSw)X$!p!7C(wC(X{q(H6fr`+Io&u zy4>iSpD{SNP=tPo-Fhb`ic(UlrnEk#$;aX?&hvD?{P=kJUR~Eh&m(n}7o>dP_A#*Z zN;z&9EBZI^r80~c67ecA~_en(z^V`-5*5iIZ}E9t*!S;6}dBik$P|8 zAk_cdt06`$oh@i$iDL}{Nmgq`!EUx^e6oFf$};cI(6Qp4&$$DvAyx_Ue{M$WTMv4j zjv8CLwdWz{NFY0!EaUAjp0C-z`PdX@u2LKLI;X#BljjdCwAIDm9p(?23=sIa?SMys zF3_Z*&R>67+bbsK;?h@4pog42MRDftBjb-rW_1=8s|oT+YXV-{YY85HbcVIiH3s9N za+{(i4J+PWQh&cp`e`lXQ5AXt%;^R7-iVm(U=m8B*lcnniCk09Z)QneKM3c)ZVR@v z&&S6IUn`G-NLeT*Pw|V3jJByw1;1Kr-;Ero8>;}NH`o}xu;PuC%H9dQc7Z1(Fu;Z+ z@?HRqTU}j^PiSn$1!#K2_-obzvm;&kylh4W28_hs?CU@9j$k$L8cxU>&q{@yKU+J^ zX$$7Y0Wz~M$&7HKdp|!=lrhsXj}QX_X$fK47m|lFAAl%4_LaOutJUJ5-Ddx;fRT5X zWQvQkVZ=TctK&cXNy9JyX|B68)OD`gg7>?NBE3WIyzjS1n@b#Q_n{$sCe$!J05d|o zHH|``BO zJl9U2ZNb!k$<78^F&swMK;xy{QdBi4Pa?-e)C-t*`DuvJ_cD=>#LZ4U;-hZSVUBeJ z7gO)_WbEsM_jPp?qWiWyZ>>PmB~wAlve`%hYC^MGI{V9gnpnZnY8_dv{je}AoZ!W+KC@zJlaiq)mY*F|67xnh7|T;EE! z{1c72{T}(esF|&t^M%`6Vd^o34?eBA&O$anuAVxA1>yxRTvCmpxk>6=*;?#ig@*Ytb;7I8^S3Cv59CEH zrMNSWW^#|!A+D7(+*mawVA^OuJRFk{I%o81JiH*-0;O>pU?B*<;=lJq0vC!}?qtzM zWHv5*k~R`gb~Do88K!7>{-0Iv0g#8MnhwQcsd@Cbu<^u)sW3=DJHoDi_y(-i7^fWftQ>B^fU0Tbc zc^ROcCDDX##9q_rg8phohwI?P1eMP{eDf%3n(~LsiqixHy}`8e)e{jFRU#{^s=74| z#wyO4>P*mw50-~;Adp~k6i$HLiUfgs- zfP3={fffcYuI}x&G8=WOKKImfl9OQUM|=Vupb!kzix&w(Hw~;B=Vv>g2a#REOWL2g#BT-(u33p>W~b#LF>luZ@)b^ zXuF1Ej5jRgMLk{*n{G>q2X{?v+6p?fI4JTw`7zY|o|9ON2Wk}K#bwt&f}{X!ugyizL7pIWjB4X0i$0%-8|yq;g?inq z$B0?)OqDG6C>S|GSk&B|kJ~(~jr?}S=#>_{bY%jScKeC7jt`^XhaJ{k;^MP zO5U%rdMEwRJN(K$ zZcVn8$TX`nTcgcyVB8UB62OEb{I)YygeQ=-QiTiD{48V!CwW55SwFDlfG=n*yybSI zPc!XCd3cN9jh36SvoDL#cIrYWMkb^IMk$9bj{n{$>%!HNHvBXqD^95MM^+$SDTaht zVcFt+y=IeSk`tw3>haktWtqR@&6$@AKBce#z>gkMe@|iB`ElD9MRZzN?f*4~0N0QX z?A{wOkYb6^tzJmYIbhCUZxP4j(F#Dmo!!0LfvlNs1UNu1Qf@rLuQiVP604a?##aY- zQuCRS(R+(a@w3pGiOXccX-doMEqj*iE$mFSJwYK8hY7Y=&l*u3 zE8Cx!h8i$Gincg4&Yxi5ltcmyPCeqSwV>{f1fGJo4j+x4H;&aL7b*7g-w6r#CcFj! z=yHOccU@WGRA>Whb*fCuZMSWYx&md(U6t9kHAvGhTT|T_3RVj;ma9VjX+`HL#!D5cm9coxhyc(@ zjJ9?mT6=$m=jKn%PmVIVDV%yGrY&iB>IcbHlO={hqJSAw<6}Z|?|_+H0P<0`0BJioL#2(Cx*WC&bLdk*h-{vl6RrqO4^ReMNP#U71Bx}AgrQj&CAF4LhV z(ffQ<=47cm>1c=t+olp@&v&O@;}kIz*76VZZ|e#naRELmr5cD^@t?}vjvjm#Yo5bL zf1~W49K9$+RXrBhY1`%k`o1QR#~Zo z06=xznS*;L005q|I_kGfgQ?c0!(U|)Lb-pS)@N|%vI`Y&9@C@JNu#|LeECzCwB*U? z27}k#GMoC!4kNd8truk691{$g+NG{$f7DHj3Fq_Sa5edI4whaR%b9rzb3=nlF%aSN zk%6~eV2MUslgYazm*`H!RW9gne$jr&yK>pnpg+No7v^^N~mYyUJo;V{6&9i_2)mF46p5l5C5pHTk_ zs0o7GpvtJ&IwHJuwV_V5Rk&qFuCDd#-tNQ~?fcV1oK$CG7-$D!;LS#tBwNKf@K|po znqFg=EXJrtq`6y;Hfvm*z$3RN`%tKDR%w(EuXJ@;V>au%_J*vp|HLoNbR?vb*5&P-ppmCg1w*<5!l{WSL&)cDq3Lpe zo51ZzXL}!c_P^k%)IpA5-G3=?_pPBckSo|qPN0@1mdYvPB zRdKpb4xgTAEYf$lrE0x>PwpZ)fI~fu_Eg{&TKL(d9Qm!z$gVrD@+P>e@zdY^)^g@Y zNzP!EzJbl|v00l{4!x{}-pZdv;zE0cDJ@qx7U-(kbC$W1)rnDLBdSm>C|mfLmsVLJ z+=IIUVQd~8dLVh_x`pR!sl|o>``(=)VQF!QC<=&=!ZJ%qSI_UWBTxTMu2T$<7_rts zS8#PFnWG$fyAv6!!h~6pMkR6fi8(?mULKsX-va)qtcf0gd=x|aY5j^&(GLubyS>;z zbjM1f5SYeZHnrwID)pcG3m0`9o8<_aEyk{e_T-^~!W#@B#p2kQMRDD#dIe^2rIZ}E z0D(Ga|Kd|Jy=Hl{ta8obMCANfSC;ouK}lWGcJ8&6W7Bt5n~Nh0d$GN6r%7sscELa4 z#9xh$S3icNaf0+JUT*r=Sl~?KoX6)~l}FzrhA+}NU{A#Zwr`awwU`Oyyx+=+{2o*Y zQn6MB)mn z#UxrQFh~$IfJ`tmfAUo3)k)fT$AxnldwWBCOPkrjSZ;fV}ASr}iLf3`OKBj(ES z?K+5;5vo&@lTFgaRuv|Dw(8X?OU*SKFw6In%G(DTI6_hX(NTHRh?Mv=gXDoT7<*7M zvhoc0aOS`oP?O3)n}y%Yosj-|0Fo#kH=qZ~Sss_lH*=nD5m1(@Q*5!%?YLX0V%nPf z9$|bJezqq27fz%gH}=_b`@#dC-qIii=h-sxl!0=E!>I)lxd7GG%8NtYHW%|eE}=}x zjJ?-H3`65gY`D3;*l>V-TZOLkC%DBAHloD zyFYBkv}zkvq_@9=x<+PVQPPXTMbR8Qr=ao!WVjpW0oAD*b87K`ZA&4Q{cjLEG z%$$72dpFYpqpOr^i|D3v?H@ig%61a0XYRUWdZ2V zejA_rb%c}uWQL6|_om70TQM9e-&Q9w=2?xPdd>`8{It7(y(-zVBgfrw=3-bW8&6vf z$0HOeBIDy~DeaieEVO2`QZ+KkoB&4LUf5C`mO=rO4m9)fuqv&-4|VcFIta6~CVve1 zn`LZBB7ire@|iXa`VW@Fn?(~e4e2`K$A+c2$yJQ*vo|(LA6poM4o#6KW7{r9kzl&M z#Va7_8#;B!K&zr-PZu6Zrsr2Y4oU=)e1S^)j_`|zAK70ftmv^`FkbFt=Y7CDiz;15 zZ+_Dnwo3#akXouYpUfH!OhKmOEo(n8wyW}~9}~P#qT4!FTq4Y`=(b*DZ!$GC$?8KY zjT&1aY=!!3OAbfoGt(Cl3~s#T*-SBioW*-(tJ{@-hf@c*l#y^}^diOm>x+25gcW1X ztD)uX^jKM%zg;*x>51vmm2-dlVZmLX zTwnqOM<{z3+3>xd!XtP#vw^XVudU0nr%bw3q&PGreImu|77mzJuoUwh^xTD#|meEswo?w?Zdl5!>O&jZvUI9JwD*hHYr#)`35QUe$ zq}wI8dsZ}BBG>xEWoVMTe~)CO-3nsuB!PLut`v`3?dL?-tL%&~AeX&VFZt{yUpA^} zYC<>3<~eQ*Ts+Dai#KWcQT--|x#rU-XJ`*08Puj+H}m7k0Ka8qn3af zIpeu12vk4?Y@>NDX9210dD-C_BhS5)Xx@|gOqq@ugd900*6@Nt?dA)YjX2J3C509k zIPJQA2?`NtiId8Zt>IG-n^TNVSlM6;cJg?%vY#kbz1SK#zkOBx+M^&TbpgXWWnY^4 z)VbugcY;fgiXZQFeE0YZzWonO{Yj9)JaYjP=Hhjl{Od7+=Oyc>!Y{Xwm#7(KvoD^>)~4)8FulfH zxYADbJJWfrCjmo2&&dbL{U4hJ)UTJ|KeXO2X3ESr(0Dgk+v-+qCZGZm9Z$2bT8-Jo z3@mitm!w6dl#AQgbMdeO$D13kyG(t{i`-Yu;@FE%oMcasDndB-LoFZ6=wr^XKJR`s z@H@HjUCc;AqwYdy@l{Og>v?n4qyF9Y64fLwg#+D=r~*kK$5ob2Z<^ju7G_%cB11|O zt~VS*{N-w+m%zYnaguE6ht$@6LEarPSlyJLUWb825s35vzQ5xjx*#O;uxN2(Q`R~jp<<0Y~3zeCkmPNzNh)TqweLru7<@nfNSsr3EUQYpky5!IT0e%Gi3|d=6!pS-zD2o?SsATGMXM&Z=5Ba2i@w~STs@YpVHikVvIeg( z8D~UVL2srfc@i8U+vC1|5?*%1_Nva#@Iwdi()Vdeb`FsTo4P}sBNc7e!+iDF*x6wD zX>zWuyTu~&adj$56B@R}JO~D}&mCR&;n>1w3a71`8lltooI#!6BNPw?$84Ugz{QAv z;2{YYR{~lmB}T@Pb&w}>$vc9Mt_GRkaeg|ClU`+JGBkcEzu-AP$zoD0^JEwFtZ}sB zU8&?q0`${jy_ao(liQWOeXpa<1#ppdto0b4C~Np)6gb#dR)9++aT zwR`33VtXprE`L`(duYm|dQ0 zq=HG~3v>s1$~~C}%5#YH3Q*$Oz(rf-p{dia-;hRxHZK&s=<;|_IzFN#&}30KR&sM( z@~!*Ey(dgOtWSCDwZ%U#9FR*|vu(piV5knGum^hj^`mFTpsur)JtWx~KlhNe!+J!y z_nO@htvE3-pFafZ(I~4hcgINW&U5be->GXb&tk*B)yu*w9&H6@*UshLotN}oAwJ)l zqYIdKY#S^0AQ{(q4(4du*jm&O`JBA9JJHqd{fP0qCj5KTv0kvQ1pXmd9$EzRmfk)& zD;?@|-CVi0C`lS*o>^7h!Y{U3W!EeaSY?x$#l~jIA(8sVD0{vR9lh3H6YK}ro@j%N zL==P*^IQ?`(NMV=^b9aLI#URbkH^~}xK;cSZyl8SRVX%Ald7|aV4tToIB*X)(!OLI z?Xw#eCN5b#44>_ZZ7Ydft49lGK9leJ9kYA8sIZTZ_8>M1DeO<>N~7Ye7PIsAWm+~bQwjYUPRFtr zezDboazB3L(9kCSa#S=9Cv*Ls95%s_BQXy>63#8bUOV=#H)fKuRLi0;{ZxSeaS5Y* zG^AC4ZXJ~iclg)o086iXm*(P1M$2M%H6==f*nxmLX($ii^|O>if_Q~t1#4&bW-es1 z#GV!_`aAUcj~>Xo-##voGG=miL3*ht0IO_lup_@+?GG!;h?F&>a~_eDk!a)3v=4!m z8&xI-HO{pQRS=)QC&u=C1rtU$9qj#nLC`wsC5NwKAO!_I=@0nxS&{(`VeFU2ke?S$ z#b=48czOzj)>`9DL%q*R%*NjEe=H?$LQ!1*T6g>t{rHpm^PdE<|DA^LV` z8b)ZEF{wFTJrV{!Gn4i(Q`QT%Hd(Kwc;2{8Wk50;zx>tG|C3*tdGE#TEK`cy{Fk!t ze~RX~9MU)UU_o$RmOD&Ne!H7Dj&CeC7!%b%7`4#@rLiT-BZ$*Mvpp0+Q4Zm6GIUkN zs?1D|^9!;wX|}+f zoqC!*0lz8x{oz!{5Z9~4lQfl&ynI8);d)M;Ww^z8=Yu`AXeSw0>GDxs7Z~TIs4h!L z8zOP2DPK_7P63#%sAR+X_{`3l*FL(c$~-!!l)ln$nuzT4*>P1ao@CpA^C`@2J&Smn zzPXzz9vj~Rae}vySdBCV5Bl`XJ3R)cr{KE1B;dhv-bMBt^6dNtFIA}rE%)Q=LaSi0 z8ck455AuM#NIlJ&jNgk>;`J%l4p%=ttBLQp8+TiORI6%N9(j5NO*NIOrZo*5t<6RS zwh#xacdI`OI_A07ss^U|-{hJM&u=^{2-4gifLhkMej?oOPi=*WM;0E1y=mmsM$st; zNjQdJ&LP%|?5gn*sV9*vGlcXcuyF_8Vr>iDGOsn8VY>kwX6~B_c994YYr;TX$BG~{ z^PE++N1jrCI^*B#NKs(AHkphpA#;NCtXPwvEpUR_XU{4gUyHRnA2A|Tu-}z%g~^5e z7pQ4^(0)VV-5Y|4c~pAf2ZimpC+R`u=25AvV&$oan{)p1Rt3feqr?wclg!3^=O*R* z39MQ?xbEQgW?uDAH%J$zV~{+=@@21w)eaOINNxl3%iqO|$2p?qd(vsH$zM1xIDGn* zg%a1hZ@;Pg4;s^O?|M*hgmR`}5gy(=mm(%?xSC_shNk$7k(DRdK*% zm1ULYNUh|Y1|kS$w1#nh+$=pU&9xD%G%gCH?DWJIc>v^H>M6gnF2Sr0HfDPl|~ zpjC>-E1Y@CK#LUSg%CUDy;^S++mx(FaIX^Azb4uO{jI(56>_}t%r@p4wu6eBV39ZE zh(AmzO$_LWSzI}KhaSMg83p7KOY;Z3#ay7 z*wv1K#Rz~@eoX6ftd|-zgq2sZ02?aBYop&}w_feivu>YUKNWF~ndb@2nv&C0MFVax zyMt1nch63-ZccfF1%|Kq;&)v+9<6!%VyO|}gjwzFt*y%4*~KC?=RV8!gWr^`0Z5fu z1s0!4N{U8-)rZo&8&&M%)Mg?4CZ%Xye9mZM);KA;4AY*@+-AqZ{{kxkq#TeURS?mU z7F{D!QGmUmWhY#yDZDA)L@%P98Z@eV+qwPeuZbi;Vg2nHNa6~0?0Un}pk?8O9`xqs z=9|&s+++^x8P2Ml?DZ(6;js&`>a5Ns!eLNsI3dBjU~8B+O@Ts%IEf-{2WmZp@Xcgi zpOtWVhP7p!Rg!Hup7U^1i`~d*AV#!QM$H-70G5*Cu8gBWvi#nOR8Nw;OwPLaN~w84 z$?^uv>#0Q692V{)T#X~V#d|&f;+k&i&0>-Ml7UUIGBiJJ2Vq>%fnB)CA9zClDML>Z zn~<(O=F(Y;z?_tt8q}HF=Hw>ISI|E;s400EPe@OutS%n;+AmCNS-piKxaWj#sb7}nleP?+S@JjDb1gf_SSICLh^*9H3 oFAa5+`2YUJ!2g-~?;er4Az3;C_mp_H{+N`GhM{`pZHK4-0;}@|qyPW_ diff --git a/public/assets/images/mainPageCakeImg.png b/public/assets/images/mainPageCakeImg.png new file mode 100644 index 0000000000000000000000000000000000000000..62f950a25318e43e0b5d08c7b95c63acd1caab4e GIT binary patch literal 6434 zcma)Ac{G&o+n>IqC{&a!sfd)NB!eMI(U=C=cM37~ee8-NTUkeTvhUd$#zgj=v1FMU zVKBzN4P)@?Tfg(Zf4uKG?{m(5p7Y%2dhYwVujjfx*XMJEsHrG1GH@~g002ht^QYDBqp<;OrCO4S9$^{>AOlid7!nFhspy0 zWuMPcU!4X3*lWN~Q&0wHDnn~>%AEtX3y{25h@*&ixzI4hj1 ze8KYOdCsdGvtYq(<{URec7CwI@&GJGY^5dR$Gr>6b8`Cn&8)eE>=eN&!-?1{bdxDJ z9!E2saWZ~>^+tDeQH)9r)>74bqJFX-izgcIX02JyFOOhxFmmO=^49WN4Z5nOW%d*A z+YpctmpV{~6r@o(+r+IrZfDXV*%Lq{Xy~qV|0Q(KAKd=2Zc&?l{*C7?vc{-}yukpxd zTrY}d_NECEY;Gb=d7%18v@DtPa%Yjj(S8Wq(^aW@staL_%m3NjszV&QGzw2%6?oRC z64bx7{wNAl%8HH;1by{4AxIBjqLv)4J@_

K+esa6(3rKlobedM92HcjfKtYe~`p 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 a$Po{A0{a5RKAiH~2>eXtX~`4Qfd2vn^{dGM literal 0 HcmV?d00001 diff --git a/public/assets/images/sns/twitterLogoImg.svg b/public/assets/images/sns/twitterLogoImg.svg index c47c30bc..9971b50f 100644 --- a/public/assets/images/sns/twitterLogoImg.svg +++ b/public/assets/images/sns/twitterLogoImg.svg @@ -2,8 +2,8 @@ - + - + From bdc1a1495d77db2ed33a3c6d15c43f3f4e4df647 Mon Sep 17 00:00:00 2001 From: myeongheonhong Date: Thu, 21 Dec 2023 17:26:17 +0900 Subject: [PATCH 4/7] =?UTF-8?q?[=20refactor=20]=20=EB=A9=94=EC=9D=B8?= =?UTF-8?q?=ED=99=94=EB=A9=B4=20=EB=A6=AC=ED=8C=A9=ED=86=A0=EB=A7=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/main/cake.tsx | 128 ------------------------- components/main/header.tsx | 130 -------------------------- components/main/index.tsx | 86 ++--------------- components/main/mainBtn.tsx | 56 +++++++++++ components/main/mainCenterContent.tsx | 107 +++++++++++++++++++++ components/main/mainTopContent.tsx | 106 +++++++++++++++++++++ 6 files changed, 275 insertions(+), 338 deletions(-) delete mode 100644 components/main/cake.tsx delete mode 100644 components/main/header.tsx create mode 100644 components/main/mainBtn.tsx create mode 100644 components/main/mainCenterContent.tsx create mode 100644 components/main/mainTopContent.tsx diff --git a/components/main/cake.tsx b/components/main/cake.tsx deleted file mode 100644 index 1a7f9b76..00000000 --- a/components/main/cake.tsx +++ /dev/null @@ -1,128 +0,0 @@ -import styled from 'styled-components'; -import theme from '@/styles/theme'; -import router from 'next/router'; -import Image from 'next/image'; -import { - MainChatImg, - MainEndCakeImg, - MainEndChatImg, - MainWishChatImg, - MainCakeImg, -} from '@/public/assets/images'; -import { LoginUserInfo } from '@/recoil/auth/loginUserInfo'; -import { useRecoilValue } from 'recoil'; -import { convertMoneyText } from '@/utils/common/convertMoneyText'; -import VerticalProgressBar from '../common/verticalProgressBar'; - -interface CakeProps { - wishStatus: string; - percent?: number; - price?: number; -} - -export default function Cake(props: CakeProps) { - const { wishStatus, percent, price } = props; - const loginUserInfo = useRecoilValue(LoginUserInfo); - - const handleMoveToLetters = () => { - router.push(`/mypage/letters/${loginUserInfo.wishesId}`); - }; - - const ChatImg = () => { - return wishStatus === 'before' || wishStatus === 'while' - ? MainWishChatImg - : wishStatus === 'end' - ? MainEndChatImg - : MainChatImg; - }; - - const priceData = wishStatus === 'while' || wishStatus === 'end' ? price : '???'; - - const CakeImg = () => (wishStatus === 'end' ? MainEndCakeImg : MainCakeImg); - - return ( - - - - 말풍선 - - 케이크 - - - {wishStatus === 'while' || wishStatus === 'end' ? ( - - 모인 케이크 보러가기 {'>'} - - ) : ( - 모인 케이크 금액 - )} - - {typeof priceData === 'number' ? ( - 총 {convertMoneyText(String(priceData))}원 - ) : ( - 총 {priceData}원 - )} - - - - - - {(wishStatus === 'while' || wishStatus === 'end') && ( - - {`펀딩 종료 후 3일내에 송금이 완료됩니다.\n계좌번호를 확인해주세요!`} - - )} - - ); -} - -const Styled = { - Container: styled.div` - margin: 9rem 0 0; - `, - - ImageContainer: styled.div` - width: 100%; - text-align: center; - `, - - AboutButton: styled.button` - width: 100%; - margin: 0 0 1rem; - ${theme.fonts.headline24_100}; - color: ${theme.colors.main_blue}; - `, - - AboutSmall: styled.div` - display: flex; - justify-content: center; - align-items: center; - ${theme.fonts.headline24_100}; - margin: 0 0 5.4rem; - `, - - Warning: styled.div` - display: flex; - justify-content: center; - text-align: center; - ${theme.fonts.body14}; - color: ${theme.colors.warning_red}; - margin: 0 0 3rem; - - white-space: pre-line; - `, - - CenterContainer: styled.div` - width: 100%; - display: flex; - justify-content: right; - align-items: center; - padding: 0 1rem 0 0; - `, - - ContentContainer: styled.div` - display: flex; - flex-direction: column; - justify-content: center; - `, -}; diff --git a/components/main/header.tsx b/components/main/header.tsx deleted file mode 100644 index 044c944f..00000000 --- a/components/main/header.tsx +++ /dev/null @@ -1,130 +0,0 @@ -import styled, { css } from 'styled-components'; -import theme from '@/styles/theme'; -import { SideBarIc } from '@/public/assets/icons'; -import IconButton from '@/components/common/button/iconButton'; -import MainHeader from '../common/mainHeader'; -import { useRecoilValue } from 'recoil'; -import { LoginUserInfo } from '@/recoil/auth/loginUserInfo'; -import router from 'next/router'; -import { useEffect, useState } from 'react'; - -interface HeaderProps { - wishStatus: string; - dayCount?: number; - cakeCount?: number; -} - -export default function Header(props: HeaderProps) { - const { wishStatus, dayCount, cakeCount } = props; - - const [nickName, setNicknameState] = useState(''); - const loginUserInfo = useRecoilValue(LoginUserInfo); - - useEffect(() => { - setNicknameState(loginUserInfo.nickName); - }, [loginUserInfo]); - - const handleMoveToMypage = () => { - router.push('/mypage'); - }; - - const getTitleContent = () => { - if (wishStatus === 'none') { - return ( - - {nickName}님, -
- 소원 링크를 생성하고 -
- 케이크를 모아봐요! - - ); - } else if (wishStatus === 'while' || wishStatus === 'end') { - return ( - - {nickName}님에게 -
- {cakeCount}개의 조각 케이크가 -
- 도착했어요! - - ); - } else if (wishStatus === 'before') { - return ( - - {nickName}님, -
- {dayCount}일 뒤 부터 소원링크를 -
- 공유해봐요! - - ); - } else { - - {nickName}님, -
- 소원 링크를 생성하고 -
- 케이크를 모아봐요! - ; - } - }; - - const getDdayText = () => { - if (wishStatus === 'while') { - if (dayCount === 0) { - return '-DAY'; - } - return `-${dayCount}`; - } else if (wishStatus === 'end') { - return dayCount !== undefined ? `+${Math.abs(dayCount)}` : '?'; - } else { - return '-?'; - } - }; - - const sideContent = ( - <> - - D{getDdayText()} - - ); - - return ( - <> - - - ); -} - -const Styled = { - Title: styled.div` - ${theme.fonts.headline24_130}; - `, - - TitleColor: styled.span` - color: ${theme.colors.main_blue}; - `, - - DaysText: styled.span<{ wishStatus: string }>` - ${theme.fonts.headline20}; - color: ${theme.colors.main_blue}; - display: flex; - justify-content: center; - margin-top: 1.5rem; - - color: ${theme.colors.main_blue}; - - ${({ wishStatus }) => - wishStatus === 'end' && - css` - color: ${theme.colors.warning_red}; - `} - - ${({ wishStatus }) => - wishStatus === 'before' && - css` - color: ${theme.colors.gray2}; - `} - `, -}; diff --git a/components/main/index.tsx b/components/main/index.tsx index 96a1836f..270fd384 100644 --- a/components/main/index.tsx +++ b/components/main/index.tsx @@ -1,88 +1,14 @@ -import Header from './header'; +import MainTopContent from './mainTopContent'; -import Cake from './cake'; -import useGetProgressData from '@/hooks/queries/main/useGetProgressData'; -import { ReactNode, useEffect, useState } from 'react'; -import { useSetRecoilState } from 'recoil'; -import { LoginUserInfo } from '@/recoil/auth/loginUserInfo'; -import styled from 'styled-components'; -import Button from '../common/button'; -import { BtnBoxTypes, ColorSystemType } from '@/types/common/box/boxStyleType'; -import useModal from '@/hooks/common/useModal'; -import router from 'next/router'; -import Modal from '../common/modal'; -import ShareModal from '../common/modal/ShareModal'; +import MainBtn from './mainBtn'; +import MainCenterContent from './mainCenterContent'; export default function MainContainer() { - const [status, setStatus] = useState('none'); - const setLoginUserInfo = useSetRecoilState(LoginUserInfo); - - const { progressData, wishStatus } = useGetProgressData(); - - const { isOpen, handleToggle } = useModal(); - - const handleMovePage = () => { - router.push('/wishes'); - }; - - useEffect(() => { - setStatus(wishStatus); - progressData && - setLoginUserInfo((prev) => ({ - ...prev, - wishesId: progressData.wishId, - })); - }, [progressData, wishStatus]); - - const getButton = (): ReactNode | null => { - if (wishStatus === 'end') return null; - - let colorSystem: ColorSystemType = 'mainBlue_white'; - let handleClickFn = handleMovePage; - let btnText = '소원 링크 생성하기'; - - if (wishStatus === 'before') { - btnText = '내 소원 링크 공유하기'; - } - - if (wishStatus === 'while') { - handleClickFn = handleToggle; - colorSystem = 'pastelBlue_white'; - } - - return ( - - ); - }; - return ( <> -

- - - - {getButton()} - {isOpen && ( - - - - )} + + + ); } - -const Styled = { - ButtonWrapper: styled.div` - margin-bottom: 10.4rem; - `, -}; diff --git a/components/main/mainBtn.tsx b/components/main/mainBtn.tsx new file mode 100644 index 00000000..5787003e --- /dev/null +++ b/components/main/mainBtn.tsx @@ -0,0 +1,56 @@ +import router from 'next/router'; +import Button from '../common/button'; +import styled from 'styled-components'; +import useModal from '@/hooks/common/useModal'; +import Modal from '../common/modal'; +import ShareModalConent from '../common/modal/share/ShareModalConent'; +import { useGetMainProgressData } from '@/hooks/queries/wishes'; +import ModalContainer from '../common/modal/ModalContainer'; +import ShareModal from '../common/modal/share'; + +export default function MainBtn() { + const { progressData } = useGetMainProgressData(); + const progressStatus = progressData?.status; + + const { isOpen, handleToggle } = useModal(); + + const handleMoveWishesPage = () => { + router.push('/wishes'); + }; + + return ( + + {progressStatus ? ( + progressStatus !== 'END' && ( + + ) + ) : ( + + )} + {isOpen && ( + + + + )} + + ); +} + +const Styled = { + ButtonWrapper: styled.div` + margin-top: 7.1rem; + margin: 7.1rem 0 10.4rem; + `, +}; diff --git a/components/main/mainCenterContent.tsx b/components/main/mainCenterContent.tsx new file mode 100644 index 00000000..d01bb6b0 --- /dev/null +++ b/components/main/mainCenterContent.tsx @@ -0,0 +1,107 @@ +import Image from 'next/image'; +import styled from 'styled-components'; +import VerticalProgressBar from '../common/verticalProgressBar'; +import { MainCakeImg, MainChatImg, MainEndChatImg, MainWishChatImg } from '@/public/assets/images'; +import theme from '@/styles/theme'; +import { useGetMainProgressData } from '@/hooks/queries/wishes'; + +export default function MainCenterContent() { + const { progressData } = useGetMainProgressData(); + + const ChatImg = () => { + if (!progressData) { + return MainChatImg; + } + + if (progressData?.status === 'BEFORE' || progressData?.status === 'WHILE') { + return MainWishChatImg; + } + + if (progressData?.status === 'END') { + return MainEndChatImg; + } + }; + + return ( + + + + 말풍선 + + 메인 케이크 이미지 + + + + + + + + {progressData === undefined || progressData.status === 'BEFORE' ? ( + <> + {'모인 케이크\n'} + 총 ???개 + + ) : ( + <> + {'예상 케이크 금액 >\n'} + {`총 ${progressData.price}원`} + + )} + + + ); +} + +const Styled = { + Container: styled.div` + display: flex; + flex-direction: column; + align-items: center; + `, + + ImageWrapper: styled.div` + display: flex; + flex-direction: column; + + width: 100%; + `, + + CakeImageWrapper: styled.div` + display: flex; + justify-content: center; + width: 100%; + margin-top: -1rem; + margin-left: 2rem; + `, + + CenterContentWrapper: styled.div` + display: flex; + justify-content: space-between; + + width: 100%; + + margin-top: 10rem; + padding-right: 2.2rem; + `, + + CakeTextWrapper: styled.div` + text-align: center; + + ${theme.fonts.headline24_130}; + color: ${theme.colors.main_blue}; + + margin-top: -5.8rem; + + white-space: pre-line; + `, + + CakeText: styled.span` + color: ${theme.colors.black}; + `, + + ProgressBarWrapper: styled.div` + display: flex; + + margin-top: 3.4rem; + `, +}; diff --git a/components/main/mainTopContent.tsx b/components/main/mainTopContent.tsx new file mode 100644 index 00000000..03d6474c --- /dev/null +++ b/components/main/mainTopContent.tsx @@ -0,0 +1,106 @@ +import { useGetMainProgressData } from '@/hooks/queries/wishes'; +import { SideBarIc } from '@/public/assets/icons'; +import { LoginUserInfo } from '@/recoil/auth/loginUserInfo'; +import theme from '@/styles/theme'; +import Image from 'next/image'; +import router from 'next/router'; +import { useEffect, useState } from 'react'; +import { useRecoilValue } from 'recoil'; +import styled from 'styled-components'; + +export default function MainTopContent() { + const { progressData } = useGetMainProgressData(); + const loginUserInfo = useRecoilValue(LoginUserInfo); + const [nickName, setNickName] = useState(''); + + const handleMoveToMypage = () => { + router.push('/mypage'); + }; + + const getDayText = () => { + if (!progressData) return 'D-?'; + + if (progressData?.dayCount === 0) { + return 'D-Day'; + } else { + return `D-${progressData?.dayCount}`; + } + }; + + useEffect(() => { + setNickName(loginUserInfo.nickName); + }, [loginUserInfo]); + + return ( + + + {progressData ? ( + progressData.status === 'BEFORE' ? ( + <> + {`${nickName}님\n`} + {`${progressData.dayCount}일 뒤 `} + {`부터 소원링크를\n공유할 수 있어요!`} + + ) : ( + //소원 진행 중 + <> + {`${nickName}님에게\n`} + {`${progressData.cakeCount}개 `} + {`의 조각 케이크가\n도착했어요!`} + + ) + ) : ( + <> + {`${nickName}님\n`} + {'소원 링크 '} + {`를 생성하고\n케이크를 모아봐요!`} + + )} + + + + 설정 + {getDayText()} + + + ); +} + +const Styled = { + Container: styled.header` + display: flex; + justify-content: space-between; + + margin-top: 2rem; + `, + + TextWrapper: styled.div` + ${theme.fonts.headline24_130}; + color: ${theme.colors.black}; + white-space: pre-line; + `, + + Text: styled.span` + color: ${theme.colors.main_blue}; + `, + + RigthSideWrapper: styled.div` + display: flex; + flex-direction: column; + + gap: 2.3rem; + `, + + DayText: styled.span` + ${theme.fonts.headline20}; + color: ${theme.colors.main_blue}; + + &.BEFORE { + color: ${theme.colors.gray2}; + } + + &.END { + color: ${theme.colors.warning_red}; + } + `, +}; From b5b14aa8fb536b0eff80f94682b276629cf08633 Mon Sep 17 00:00:00 2001 From: myeongheonhong Date: Thu, 21 Dec 2023 17:27:37 +0900 Subject: [PATCH 5/7] =?UTF-8?q?[=20chore=20]=20=EB=B3=80=EA=B2=BD=EB=90=9C?= =?UTF-8?q?=20=EC=BD=94=EB=93=9C=EB=A1=9C=20=EC=9D=B8=ED=95=9C=20=EC=BD=94?= =?UTF-8?q?=EB=93=9C=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/mypage/EditWishes/index.tsx | 112 +++++++++++++++---------- components/mypage/index.tsx | 30 +++++-- components/wishes/share/index.tsx | 40 +++++---- hooks/wishes/useWisehsStep.ts | 2 +- pages/main/index.tsx | 2 +- pages/mypage/letters/[id]/[cakeId].tsx | 3 +- recoil/formPage/wishesData.ts | 2 +- types/common/input/wishesInput.ts | 5 +- validation/rules.ts | 17 ++-- 9 files changed, 125 insertions(+), 88 deletions(-) diff --git a/components/mypage/EditWishes/index.tsx b/components/mypage/EditWishes/index.tsx index 9dd8ffd5..b00290c3 100644 --- a/components/mypage/EditWishes/index.tsx +++ b/components/mypage/EditWishes/index.tsx @@ -4,55 +4,75 @@ import InputContainer from '@/components/common/input/inputContainer'; import TextareaBox from '@/components/common/input/textareaBox'; import UploadTypeToggleBtn from '@/components/common/uploadTypeToggleBtn'; import ItemLink from '@/components/wishes/wishesForm/itemLink'; -import { WISHES_STATUS } from '@/constant/wishesStatus'; -import useEditWishesInfo from '@/hooks/queries/mypage/useEditWishesInfo'; import { CalendarGreyIc, CalendarIc } from '@/public/assets/icons'; import theme from '@/styles/theme'; import styled from 'styled-components'; import { useEffect, useState } from 'react'; -import { validation } from '@/validation/input'; -import AlertTextBox from '@/components/common/alertTextBox'; import { convertMoneyText } from '@/utils/common/convertMoneyText'; -import UploadGift from '@/components/wishes/wishesForm/UploadGift'; +import UploadPresent from '@/components/wishes/wishesForm/UploadPresent'; import Input from '@/components/common/input/input'; import useUploadItemInfo from '@/hooks/wishes/useUploadItemInfo'; import { useForm } from 'react-hook-form'; -import { BankInfoInputsType, WishesDataInputType } from '@/types/common/input/wishesInput'; +import { WishesDataInputType } from '@/types/common/input/wishesInput'; import BankInput from '@/components/common/modal/BankInput'; +import { + useGetMainProgressData, + useGetWishesProgress, + usePatchWishes, +} from '@/hooks/queries/wishes'; +import SiteList from '@/components/wishes/wishesForm/SiteList'; +import { usePatchUserAccount } from '@/hooks/queries/user'; +import { LIMIT_TEXT } from '@/constant/limitText'; +import { getDate } from '@/utils/common/getDate'; export default function EditWishesContainer() { - const { imageFile, preSignedImageURL, uploadImageFile } = useUploadItemInfo(); + const { imageFile, preSignedImageUrl, uploadImageFile } = useUploadItemInfo(); const [isLinkLoadType, setIsLinkLoadType] = useState(true); //false : 링크 불러오기 true : 직접 - const handleLoadTypeToggle = (state: boolean) => { - setIsLinkLoadType(state); - }; - const methods = useForm({ defaultValues: { linkURL: '', - imageURL: '', - price: 0, + imageUrl: '', + price: '', initial: '', title: '', hint: '', + startDate: new Date(), + endDate: getDate(new Date(), 7), phone: '', - mobileCode: '', name: '', - bankName: '', + bank: '', account: '', }, }); - const bankMethods = useForm({ - defaultValues: { - phone: '', - mobileCode: '', - name: '', - bankName: '', - account: '', - }, - }); + const { wishesProgressData } = useGetWishesProgress(); + const { progressData } = useGetMainProgressData(); + + const { patchUserAccountData } = usePatchUserAccount(methods); + const { patchWishesData } = usePatchWishes(methods); + + useEffect(() => { + if (wishesProgressData) { + methods.setValue('account', wishesProgressData?.accountInfo.account); + methods.setValue('name', wishesProgressData?.accountInfo.name); + methods.setValue('bank', wishesProgressData?.accountInfo.bank); + methods.setValue('phone', wishesProgressData.phone); + + methods.setValue('title', wishesProgressData.title); + methods.setValue('imageUrl', wishesProgressData.imageUrl); + methods.setValue('hint', wishesProgressData.hint); + methods.setValue('price', wishesProgressData.price); + methods.setValue('initial', wishesProgressData.initial); + + methods.setValue('startDate', new Date(wishesProgressData.startDate)); + methods.setValue('endDate', new Date(wishesProgressData.endDate)); + } + }, [wishesProgressData]); + + const handleLoadTypeToggle = (state: boolean) => { + setIsLinkLoadType(state); + }; return ( <> @@ -66,14 +86,15 @@ export default function EditWishesContainer() { /> {isLinkLoadType ? ( - + + ) : ( <> - @@ -85,48 +106,47 @@ export default function EditWishesContainer() { - + - {/* Caledar */} {/* 시작일 */} - - {/* - {/* 종료일 */} - {/* */} + {/* BankInfo */} - + - + - + - */} + ); } const Styled = { + Header: styled.header` + display: flex; + justify-content: space-between; + + width: 100%; + + color: ${theme.colors.main_blue}; + ${theme.fonts.headline20}; + `, + Container: styled.div` display: flex; flex-direction: column; @@ -135,6 +140,15 @@ const Styled = { margin: 2.4rem 0 3rem; `, + HintBox: styled(StyledBox)` + width: 100%; + height: 12.6rem; + + ${theme.fonts.body14}; + + padding: 1.2rem 1rem 1.2rem 1.2rem; + `, + ButtonWrapper: styled.div` padding-bottom: 4.6rem; `, diff --git a/components/wishes/[id].tsx b/components/wishes/[id].tsx index 7b713055..9b801b0f 100644 --- a/components/wishes/[id].tsx +++ b/components/wishes/[id].tsx @@ -1,10 +1,11 @@ import { useEffect, useState } from 'react'; import styled from 'styled-components'; import { useRouter } from 'next/router'; -import { useQuery } from 'react-query'; import Button from '../common/button'; import MainView from '../common/mainView'; import { useGetSingleWishInfo } from '@/hooks/queries/wishes'; +import { getPublicWishes } from '@/api/public'; +import { useGetPublicWishes } from '@/hooks/queries/public'; export default function WishesContainer() { const [wishesId, setWishesId] = useState(''); @@ -15,7 +16,7 @@ export default function WishesContainer() { setWishesId(router.query.id); }, [router.isReady]); - const { wishData } = useGetSingleWishInfo(wishesId); + const { publicWishesData } = useGetPublicWishes(wishesId); const handleMoveToCakes = () => { router.push(`/cakes/${wishesId}`); @@ -27,7 +28,7 @@ export default function WishesContainer() { return ( - + )} {isOpen && ( - - - + + + )} ); diff --git a/pages/cakes/[id].tsx b/pages/cakes/[id].tsx index 1b74a94b..4ed3e746 100644 --- a/pages/cakes/[id].tsx +++ b/pages/cakes/[id].tsx @@ -3,7 +3,7 @@ import Layout from '@/components/layout'; export default function CakesPage() { return ( - + ); diff --git a/types/api/response.ts b/types/api/response.ts index d4f2ed6b..2255da6e 100644 --- a/types/api/response.ts +++ b/types/api/response.ts @@ -16,3 +16,10 @@ export type UserAccountDataResponseType = DefaultResponseType<{ id: number; phone: string | number; }>; + +export type PublicWishesDataResponseType = DefaultResponseType<{ + name: string; + dayCount: number; + title: string; + hint: string; +}>;