From a67d8790ca9c98c6f2fdf533464d978d5017cbf2 Mon Sep 17 00:00:00 2001 From: a-honey Date: Wed, 7 Feb 2024 01:03:57 +0900 Subject: [PATCH 01/13] =?UTF-8?q?chore:=20=EB=A1=9C=EA=B7=B8=EC=9D=B8=20?= =?UTF-8?q?=EC=9D=B4=EB=AF=B8=EC=A7=80=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/images/img_login_google.svg | 8 +++ src/assets/images/img_login_kakao.svg | 11 +++++ src/assets/images/img_login_monsters.svg | 63 ++++++++++++++++++++++++ 3 files changed, 82 insertions(+) create mode 100644 src/assets/images/img_login_google.svg create mode 100644 src/assets/images/img_login_kakao.svg create mode 100644 src/assets/images/img_login_monsters.svg diff --git a/src/assets/images/img_login_google.svg b/src/assets/images/img_login_google.svg new file mode 100644 index 0000000..373a445 --- /dev/null +++ b/src/assets/images/img_login_google.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/src/assets/images/img_login_kakao.svg b/src/assets/images/img_login_kakao.svg new file mode 100644 index 0000000..507950a --- /dev/null +++ b/src/assets/images/img_login_kakao.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/assets/images/img_login_monsters.svg b/src/assets/images/img_login_monsters.svg new file mode 100644 index 0000000..9af49a3 --- /dev/null +++ b/src/assets/images/img_login_monsters.svg @@ -0,0 +1,63 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + From 6ecf80d9b5ee7a8e18922818d5ac89d0141b2e67 Mon Sep 17 00:00:00 2001 From: a-honey Date: Wed, 7 Feb 2024 01:31:32 +0900 Subject: [PATCH 02/13] =?UTF-8?q?feat:=20=EB=A1=9C=EA=B7=B8=EC=9D=B8=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20=EB=A7=88=ED=81=AC=EC=97=85=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/login/index.tsx | 32 ++++++++++++++++++++++++++++++++ 1 file changed, 32 insertions(+) create mode 100644 src/pages/login/index.tsx diff --git a/src/pages/login/index.tsx b/src/pages/login/index.tsx new file mode 100644 index 0000000..eb05092 --- /dev/null +++ b/src/pages/login/index.tsx @@ -0,0 +1,32 @@ +import MonstersImg from '@/assets/images/img_login_monsters.svg'; +import KaKaoImg from '@/assets/images/img_login_kakao.svg'; +import GoogleImg from '@/assets/images/img_login_google.svg'; +import { type NextPage } from 'next'; + +const LoginPage: NextPage = () => { + return ( +
+
+ +
+ 냉장고 관리, 얼른 시작해봐요 +
+
로고
+
+
+
+
+
SNS 계정으로 로그인
+
+
+
+ + +
+
+
+ ); +}; +export default LoginPage; From 895ea3d29dc3b73c4a6c8dacad35c79f0f530d00 Mon Sep 17 00:00:00 2001 From: a-honey Date: Wed, 7 Feb 2024 01:32:48 +0900 Subject: [PATCH 03/13] =?UTF-8?q?chore:=20=ED=99=98=EA=B2=BD=EB=B3=80?= =?UTF-8?q?=EC=88=98=20.gitignore=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .gitignore | 1 + 1 file changed, 1 insertion(+) diff --git a/.gitignore b/.gitignore index fd3dbb5..00bba9b 100644 --- a/.gitignore +++ b/.gitignore @@ -27,6 +27,7 @@ yarn-error.log* # local env files .env*.local +.env # vercel .vercel From 81cd9d5797ae30278957e15e0a03c8a1aa1e70c0 Mon Sep 17 00:00:00 2001 From: a-honey Date: Wed, 7 Feb 2024 01:35:02 +0900 Subject: [PATCH 04/13] =?UTF-8?q?feat:=20=EC=B9=B4=EC=B9=B4=EC=98=A4=20?= =?UTF-8?q?=EB=A1=9C=EA=B7=B8=EC=9D=B8=20=EC=BD=94=EB=93=9C=20=EB=B0=9B?= =?UTF-8?q?=EC=95=84=EC=98=A4=EA=B8=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/login/index.tsx | 17 ++++++++++++++++- 1 file changed, 16 insertions(+), 1 deletion(-) diff --git a/src/pages/login/index.tsx b/src/pages/login/index.tsx index eb05092..f258a1c 100644 --- a/src/pages/login/index.tsx +++ b/src/pages/login/index.tsx @@ -2,8 +2,23 @@ import MonstersImg from '@/assets/images/img_login_monsters.svg'; import KaKaoImg from '@/assets/images/img_login_kakao.svg'; import GoogleImg from '@/assets/images/img_login_google.svg'; import { type NextPage } from 'next'; +import { useEffect } from 'react'; + +const kakaoURL = `https://kauth.kakao.com/oauth/authorize?client_id=${process.env.NEXT_PUBLIC_KAKAO_API_KEY}&redirect_uri=${process.env.NEXT_PUBLIC_KAKAO_REDIRECT_URI}&response_type=code`; const LoginPage: NextPage = () => { + const handleKaKaoClick: () => void = () => { + window.location.href = kakaoURL; + }; + + useEffect(() => { + const urlParams = new URLSearchParams(window.location.search); + const code = urlParams.get('code'); + + if (code) { + console.log('받아온 코드:', code); + } + }, []); return (
{
- +
From f71f82b89aaad597604434c61b9f86f23512a3f2 Mon Sep 17 00:00:00 2001 From: a-honey Date: Wed, 7 Feb 2024 01:36:32 +0900 Subject: [PATCH 05/13] =?UTF-8?q?feat:=20=EB=A1=9C=EA=B7=B8=EC=9D=B8=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20=EC=9D=B4=EB=8F=99=20HOC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/templates/withLogin.tsx | 28 ++++++++++++++++++++++++++ 1 file changed, 28 insertions(+) create mode 100644 src/components/templates/withLogin.tsx diff --git a/src/components/templates/withLogin.tsx b/src/components/templates/withLogin.tsx new file mode 100644 index 0000000..1ad69e5 --- /dev/null +++ b/src/components/templates/withLogin.tsx @@ -0,0 +1,28 @@ +import React, { useEffect } from 'react'; +import { useRouter } from 'next/router'; + +const withLogin = (InnerComponent: React.FC) => { + return () => { + const router = useRouter(); + const token = localStorage.getItem('token'); + + const redirectToLogin: () => Promise = async () => { + if (!token) { + alert('로그인이 필요합니다.'); + try { + await router.push('/login'); + } catch (error) { + console.error('로그인 체크 에러', error); + } + } + }; + + useEffect(() => { + void redirectToLogin(); + }, [token]); + + return token ? : null; + }; +}; + +export default withLogin; From 04dad8071aa6fe2c13cf08989fb0839e7bc4d780 Mon Sep 17 00:00:00 2001 From: a-honey Date: Wed, 7 Feb 2024 01:37:59 +0900 Subject: [PATCH 06/13] =?UTF-8?q?feat:=20=EA=B5=AC=EA=B8=80=20=EB=A1=9C?= =?UTF-8?q?=EA=B7=B8=EC=9D=B8=20URL=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/login/index.tsx | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/src/pages/login/index.tsx b/src/pages/login/index.tsx index f258a1c..23038ad 100644 --- a/src/pages/login/index.tsx +++ b/src/pages/login/index.tsx @@ -4,13 +4,18 @@ import GoogleImg from '@/assets/images/img_login_google.svg'; import { type NextPage } from 'next'; import { useEffect } from 'react'; -const kakaoURL = `https://kauth.kakao.com/oauth/authorize?client_id=${process.env.NEXT_PUBLIC_KAKAO_API_KEY}&redirect_uri=${process.env.NEXT_PUBLIC_KAKAO_REDIRECT_URI}&response_type=code`; - const LoginPage: NextPage = () => { + const kakaoURL = `https://kauth.kakao.com/oauth/authorize?client_id=${process.env.NEXT_PUBLIC_KAKAO_API_KEY}&redirect_uri=${process.env.NEXT_PUBLIC_KAKAO_REDIRECT_URI}&response_type=code`; + const googleURL = `https://accounts.google.com/o/oauth2/v2/auth?client_id=${process.env.NEXT_PUBLIC_GOOGLE_API_KEY}&redirect_uri=${process.env.NEXT_PUBLIC_GOOGLE_REDIRECT_URI}&response_type=code&scope=email&access_type=offline`; + const handleKaKaoClick: () => void = () => { window.location.href = kakaoURL; }; + const handleGoogleClick: () => void = () => { + window.location.href = googleURL; + }; + useEffect(() => { const urlParams = new URLSearchParams(window.location.search); const code = urlParams.get('code'); @@ -38,7 +43,7 @@ const LoginPage: NextPage = () => {
- +
From c4ee632d26bc3792d500894f3e7568831b49f156 Mon Sep 17 00:00:00 2001 From: a-honey Date: Wed, 7 Feb 2024 01:41:18 +0900 Subject: [PATCH 07/13] =?UTF-8?q?feat:=20=EC=A0=84=EC=97=AD=20QueryClientP?= =?UTF-8?q?rovider=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 1 + src/pages/_app.tsx | 28 ++++++++++++++++++++-------- yarn.lock | 12 ++++++++++++ 3 files changed, 33 insertions(+), 8 deletions(-) diff --git a/package.json b/package.json index cb988cd..319d0ef 100644 --- a/package.json +++ b/package.json @@ -24,6 +24,7 @@ "@commitlint/config-conventional": "^18.4.3", "@emotion/react": "^11.11.3", "@emotion/styled": "^11.11.0", + "@tanstack/react-query": "^5.18.1", "@typescript-eslint/parser": "^6.19.0", "axios": "^1.6.5", "dayjs": "^1.11.10", diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx index 02f0d7c..47fa34c 100644 --- a/src/pages/_app.tsx +++ b/src/pages/_app.tsx @@ -3,6 +3,7 @@ import Layout from '@/components/templates/Layout'; import '@/styles/globals.css'; import type { AppProps } from 'next/app'; import { RecoilRoot } from 'recoil'; +import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; import 'dayjs/locale/ko'; import dayjs from 'dayjs'; dayjs.locale('ko'); @@ -13,15 +14,26 @@ const theme = extendTheme({ }, }); +const queryClient = new QueryClient({ + defaultOptions: { + queries: { + retry: false, + refetchOnWindowFocus: false, + }, + }, +}); + export default function App({ Component, pageProps }: AppProps): JSX.Element { return ( - - - - - - - - + + + + + + + + + + ); } diff --git a/yarn.lock b/yarn.lock index 53be205..bd2ca0c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3966,6 +3966,18 @@ resolved "https://registry.yarnpkg.com/@swc/types/-/types-0.1.5.tgz#043b731d4f56a79b4897a3de1af35e75d56bc63a" integrity sha512-myfUej5naTBWnqOCc/MdVOLVjXUXtIA+NpDrDBKJtLLg2shUjBu3cZmB/85RyitKc55+lUUyl7oRfLOvkr2hsw== +"@tanstack/query-core@5.18.1": + version "5.18.1" + resolved "https://registry.yarnpkg.com/@tanstack/query-core/-/query-core-5.18.1.tgz#b653ee354b7f4712d53565ccc5c6d8fb83ec866c" + integrity sha512-fYhrG7bHgSNbnkIJF2R4VUXb4lF7EBiQjKkDc5wOlB7usdQOIN4LxxHpDxyE3qjqIst1WBGvDtL48T0sHJGKCw== + +"@tanstack/react-query@^5.18.1": + version "5.18.1" + resolved "https://registry.yarnpkg.com/@tanstack/react-query/-/react-query-5.18.1.tgz#fd4e7b87260e82c5277355ad64f0e431a9302e02" + integrity sha512-PdI07BbsahZ+04PxSuDQsQvBWe008eWFk/YYWzt8fvzt2sALUM0TpAJa/DFpqa7+SSo7j1EQR6Jx6znXNHyaXw== + dependencies: + "@tanstack/query-core" "5.18.1" + "@testing-library/dom@^9.3.1": version "9.3.4" resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-9.3.4.tgz#50696ec28376926fec0a1bf87d9dbac5e27f60ce" From 51eb41d0ee1da387e8600fea6b444dcbab20bc2e Mon Sep 17 00:00:00 2001 From: a-honey Date: Wed, 7 Feb 2024 02:32:49 +0900 Subject: [PATCH 08/13] =?UTF-8?q?feat:=20=EC=B9=B4=EC=B9=B4=EC=98=A4=20?= =?UTF-8?q?=EB=A1=9C=EA=B7=B8=EC=9D=B8=20api=20=EC=9A=94=EC=B2=AD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Network Error --- src/api/login/getToken.ts | 31 +++++++++++++++++++++++++++++++ src/pages/login/index.tsx | 23 ++++++++++++++++------- 2 files changed, 47 insertions(+), 7 deletions(-) create mode 100644 src/api/login/getToken.ts diff --git a/src/api/login/getToken.ts b/src/api/login/getToken.ts new file mode 100644 index 0000000..9a752f5 --- /dev/null +++ b/src/api/login/getToken.ts @@ -0,0 +1,31 @@ +import axiosInstance from '../axiosInstance'; + +interface LoginResponseType { + data: { accessToken: string; refreshToken: string; email: string }; +} + +const fetchKaKao = async (code: string): Promise => + await axiosInstance.get(`/users/kakao-login?code=${code}`); + +export const getKaKaoToken: (code: string) => Promise = async (code) => { + fetchKaKao(code) + .then((response: LoginResponseType) => { + localStorage.setItem('token', response.data.accessToken); + }) + .catch((error) => { + console.error(error); + }); +}; + +const fetchGoogle = async (code: string): Promise => + await axiosInstance.get(`/users/google-login?code=${code}`); + +export const getGoogleToken: (code: string) => Promise = async (code) => { + fetchGoogle(code) + .then((response: LoginResponseType) => { + localStorage.setItem('token', response.data.accessToken); + }) + .catch((error) => { + console.error(error); + }); +}; diff --git a/src/pages/login/index.tsx b/src/pages/login/index.tsx index 23038ad..946d9b7 100644 --- a/src/pages/login/index.tsx +++ b/src/pages/login/index.tsx @@ -3,27 +3,36 @@ import KaKaoImg from '@/assets/images/img_login_kakao.svg'; import GoogleImg from '@/assets/images/img_login_google.svg'; import { type NextPage } from 'next'; import { useEffect } from 'react'; +import { getKaKaoToken } from '@/api/login/getToken'; const LoginPage: NextPage = () => { const kakaoURL = `https://kauth.kakao.com/oauth/authorize?client_id=${process.env.NEXT_PUBLIC_KAKAO_API_KEY}&redirect_uri=${process.env.NEXT_PUBLIC_KAKAO_REDIRECT_URI}&response_type=code`; const googleURL = `https://accounts.google.com/o/oauth2/v2/auth?client_id=${process.env.NEXT_PUBLIC_GOOGLE_API_KEY}&redirect_uri=${process.env.NEXT_PUBLIC_GOOGLE_REDIRECT_URI}&response_type=code&scope=email&access_type=offline`; const handleKaKaoClick: () => void = () => { - window.location.href = kakaoURL; + window.location.href = `${kakaoURL}&type=kakao`; }; const handleGoogleClick: () => void = () => { - window.location.href = googleURL; + window.location.href = `${googleURL}&type=google`; }; useEffect(() => { - const urlParams = new URLSearchParams(window.location.search); - const code = urlParams.get('code'); + const fetchData = async (): Promise => { + const urlParams = new URLSearchParams(window.location.search); + const code = urlParams.get('code'); + // const type = urlParams.get('type'); + // 구글 추가시 타입 redirect_uri 변경 - if (code) { - console.log('받아온 코드:', code); - } + if (code) { + await getKaKaoToken(code); + } + }; + + // eslint-disable-next-line @typescript-eslint/no-floating-promises + fetchData(); }, []); + return (
Date: Wed, 7 Feb 2024 02:42:29 +0900 Subject: [PATCH 09/13] =?UTF-8?q?feat:=20=EC=8B=9D=EC=9E=90=EC=9E=AC=20?= =?UTF-8?q?=EB=B6=88=EB=9F=AC=EC=98=A4=EA=B8=B0=20api=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Network Error --- .../queries/fridge/useGetIngredientList.ts | 26 +++++++++++++++++++ src/pages/fridge/index.tsx | 4 +++ src/types/fridge/index.d.ts | 4 +++ 3 files changed, 34 insertions(+) create mode 100644 src/hooks/queries/fridge/useGetIngredientList.ts create mode 100644 src/types/fridge/index.d.ts diff --git a/src/hooks/queries/fridge/useGetIngredientList.ts b/src/hooks/queries/fridge/useGetIngredientList.ts new file mode 100644 index 0000000..2afddf4 --- /dev/null +++ b/src/hooks/queries/fridge/useGetIngredientList.ts @@ -0,0 +1,26 @@ +import axiosInstance from '@/api/axiosInstance'; +import type { IngredientType } from '@/types/fridge'; +import { useQuery } from '@tanstack/react-query'; +import useToast from '../../useToast'; + +interface IngredientListResponse { + data: IngredientType[]; +} + +export const fetchIngredientList = async (): Promise => + await axiosInstance.get(`/ingrs`); + +export const useGetIngredientList: () => any = () => { + const { showToast } = useToast(); + const { data, isLoading } = useQuery({ + queryKey: ['ingredientList'], + queryFn: async () => + await fetchIngredientList() + .then((res) => res.data) + .catch(() => { + showToast('식자재 불러오기에 실패했습니다.', 'success'); + }), + }); + + return { data, isLoading }; +}; diff --git a/src/pages/fridge/index.tsx b/src/pages/fridge/index.tsx index 8b8f527..0b9c57d 100644 --- a/src/pages/fridge/index.tsx +++ b/src/pages/fridge/index.tsx @@ -7,12 +7,16 @@ import { } from '@/components/organisms'; import { type NextPage } from 'next'; import { useState } from 'react'; +import { useGetIngredientList } from '@/hooks/queries/fridge/useGetIngredientList'; const FridgePage: NextPage = () => { const [isOpenIngredientAddModal, setIsOpenIngredientAddModal] = useState(false); const [isOpenFridgeListModal, setIsOpenFridgeListModal] = useState(false); + const data = useGetIngredientList(); + console.log('받아올 데이터', data); + const toggleIsOpenIngredientAddModal: () => void = () => { setIsOpenIngredientAddModal((prev) => !prev); }; diff --git a/src/types/fridge/index.d.ts b/src/types/fridge/index.d.ts new file mode 100644 index 0000000..dce6cc7 --- /dev/null +++ b/src/types/fridge/index.d.ts @@ -0,0 +1,4 @@ +export interface IngredientType { + name: string; + category: string; +} From bc63ad77df124e3fdced860d8be420bad4d5f87e Mon Sep 17 00:00:00 2001 From: a-honey Date: Wed, 7 Feb 2024 02:44:50 +0900 Subject: [PATCH 10/13] =?UTF-8?q?fix:=20=EC=BF=BC=EB=A6=AC=20=ED=82=A4=20?= =?UTF-8?q?=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/hooks/queries/fridge/useGetIngredientList.ts | 3 ++- src/hooks/queries/queryKeys.ts | 5 +++++ 2 files changed, 7 insertions(+), 1 deletion(-) create mode 100644 src/hooks/queries/queryKeys.ts diff --git a/src/hooks/queries/fridge/useGetIngredientList.ts b/src/hooks/queries/fridge/useGetIngredientList.ts index 2afddf4..242627d 100644 --- a/src/hooks/queries/fridge/useGetIngredientList.ts +++ b/src/hooks/queries/fridge/useGetIngredientList.ts @@ -2,6 +2,7 @@ import axiosInstance from '@/api/axiosInstance'; import type { IngredientType } from '@/types/fridge'; import { useQuery } from '@tanstack/react-query'; import useToast from '../../useToast'; +import { queryKeys } from '../queryKeys'; interface IngredientListResponse { data: IngredientType[]; @@ -13,7 +14,7 @@ export const fetchIngredientList = async (): Promise => export const useGetIngredientList: () => any = () => { const { showToast } = useToast(); const { data, isLoading } = useQuery({ - queryKey: ['ingredientList'], + queryKey: queryKeys.INGREDIENT(), queryFn: async () => await fetchIngredientList() .then((res) => res.data) diff --git a/src/hooks/queries/queryKeys.ts b/src/hooks/queries/queryKeys.ts new file mode 100644 index 0000000..d4896fc --- /dev/null +++ b/src/hooks/queries/queryKeys.ts @@ -0,0 +1,5 @@ +export const queryKeys = { + INGREDIENT: (id?: number) => ['ingredient', id] as const, +} as const; + +export type QueryKeys = (typeof queryKeys)[keyof typeof queryKeys]; From 56d67694d3b5e226d015ebe2e8c88ad9820f9cb7 Mon Sep 17 00:00:00 2001 From: a-honey Date: Wed, 7 Feb 2024 03:01:07 +0900 Subject: [PATCH 11/13] =?UTF-8?q?feat:=20=EA=B8=B0=EB=B3=B8=20useBaseQuery?= =?UTF-8?q?=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/hooks/queries/fridge/index.ts | 1 + .../queries/fridge/useGetIngredientList.ts | 28 ++++--------------- src/hooks/queries/useBaseQuery.ts | 19 +++++++++++++ src/pages/fridge/index.tsx | 2 +- 4 files changed, 26 insertions(+), 24 deletions(-) create mode 100644 src/hooks/queries/fridge/index.ts create mode 100644 src/hooks/queries/useBaseQuery.ts diff --git a/src/hooks/queries/fridge/index.ts b/src/hooks/queries/fridge/index.ts new file mode 100644 index 0000000..8c602e7 --- /dev/null +++ b/src/hooks/queries/fridge/index.ts @@ -0,0 +1 @@ +export { default as useGetIngredientList } from './useGetIngredientList'; diff --git a/src/hooks/queries/fridge/useGetIngredientList.ts b/src/hooks/queries/fridge/useGetIngredientList.ts index 242627d..d3e126e 100644 --- a/src/hooks/queries/fridge/useGetIngredientList.ts +++ b/src/hooks/queries/fridge/useGetIngredientList.ts @@ -1,27 +1,9 @@ -import axiosInstance from '@/api/axiosInstance'; import type { IngredientType } from '@/types/fridge'; -import { useQuery } from '@tanstack/react-query'; -import useToast from '../../useToast'; import { queryKeys } from '../queryKeys'; +import { useBaseQuery } from '../useBaseQuery'; -interface IngredientListResponse { - data: IngredientType[]; -} - -export const fetchIngredientList = async (): Promise => - await axiosInstance.get(`/ingrs`); - -export const useGetIngredientList: () => any = () => { - const { showToast } = useToast(); - const { data, isLoading } = useQuery({ - queryKey: queryKeys.INGREDIENT(), - queryFn: async () => - await fetchIngredientList() - .then((res) => res.data) - .catch(() => { - showToast('식자재 불러오기에 실패했습니다.', 'success'); - }), - }); - - return { data, isLoading }; +const useGetIngredientList = () => { + return useBaseQuery(queryKeys.INGREDIENT(), '/ingrs'); }; + +export default useGetIngredientList; diff --git a/src/hooks/queries/useBaseQuery.ts b/src/hooks/queries/useBaseQuery.ts new file mode 100644 index 0000000..c3cf378 --- /dev/null +++ b/src/hooks/queries/useBaseQuery.ts @@ -0,0 +1,19 @@ +import axiosInstance from '@/api/axiosInstance'; +import { useQuery } from '@tanstack/react-query'; + +export const fetchData = async (url: string) => { + const response = await axiosInstance.get<{ data: T }>(url); + return response.data; +}; + +export const useBaseQuery = (queryKey: any, url: string) => { + return useQuery({ + queryKey, + queryFn: async () => + await fetchData(url) + .then((res) => res.data) + .catch((error) => { + console.error(error); + }), + }); +}; diff --git a/src/pages/fridge/index.tsx b/src/pages/fridge/index.tsx index 0b9c57d..73d827c 100644 --- a/src/pages/fridge/index.tsx +++ b/src/pages/fridge/index.tsx @@ -7,7 +7,7 @@ import { } from '@/components/organisms'; import { type NextPage } from 'next'; import { useState } from 'react'; -import { useGetIngredientList } from '@/hooks/queries/fridge/useGetIngredientList'; +import { useGetIngredientList } from '@/hooks/queries/fridge'; const FridgePage: NextPage = () => { const [isOpenIngredientAddModal, setIsOpenIngredientAddModal] = From 39dfed6ae38e7c54ee206f91c80d215e311db619 Mon Sep 17 00:00:00 2001 From: a-honey Date: Wed, 7 Feb 2024 03:11:00 +0900 Subject: [PATCH 12/13] =?UTF-8?q?chore:=20=ED=94=84=EB=A1=9C=ED=95=84=20?= =?UTF-8?q?=EA=B2=BD=EA=B3=A0=EB=A9=94=EC=8B=9C=EC=A7=80=20atom=20?= =?UTF-8?q?=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/atoms/ExclamationAlertSpan.tsx | 23 +++++++++++++++++++ src/components/atoms/index.ts | 1 + src/pages/mypage/profile/index.tsx | 10 ++++---- 3 files changed, 28 insertions(+), 6 deletions(-) create mode 100644 src/components/atoms/ExclamationAlertSpan.tsx diff --git a/src/components/atoms/ExclamationAlertSpan.tsx b/src/components/atoms/ExclamationAlertSpan.tsx new file mode 100644 index 0000000..4260a5b --- /dev/null +++ b/src/components/atoms/ExclamationAlertSpan.tsx @@ -0,0 +1,23 @@ +import React from 'react'; +import { ExclamationIcon } from '@/assets/icons'; + +interface AlertMessageProps { + message: string; + className?: string; +} + +const ExclamationAlertSpan: React.FC = ({ + message, + className, +}) => { + return ( + + + {message} + + ); +}; + +export default ExclamationAlertSpan; diff --git a/src/components/atoms/index.ts b/src/components/atoms/index.ts index c3e68bf..cedd6a3 100644 --- a/src/components/atoms/index.ts +++ b/src/components/atoms/index.ts @@ -15,3 +15,4 @@ export { default as SortButton } from './SortButton'; export { default as RadioButtonField } from './RadioButtonField'; export { default as Input } from './Input'; export { default as MiniButton } from './MiniButton'; +export { default as ExclamationAlertSpan } from './ExclamationAlertSpan'; diff --git a/src/pages/mypage/profile/index.tsx b/src/pages/mypage/profile/index.tsx index 5f84358..423f798 100644 --- a/src/pages/mypage/profile/index.tsx +++ b/src/pages/mypage/profile/index.tsx @@ -1,9 +1,8 @@ import { type NextPage } from 'next'; import Image from 'next/image'; import ProfileImg from '@/assets/profile.png'; -import { Button } from '@/components/atoms'; +import { Button, ExclamationAlertSpan } from '@/components/atoms'; import React, { useCallback, useState } from 'react'; -import { ExclamationIcon } from '@/assets/icons'; import Header from '@/components/organisms/Header'; import { debounceFunction } from '@/utils/debounceUtil'; @@ -70,10 +69,9 @@ const FriendsListPage: NextPage = () => { 사용가능한 닉네임입니다. ) : ( -
- - 중복되는 닉네임이에요. 다시 작성해주세요. -
+ ))}
From 4b626c1c2c6f8fdee4ad6efc793461a11e7c2a0f Mon Sep 17 00:00:00 2001 From: a-honey Date: Wed, 7 Feb 2024 03:21:21 +0900 Subject: [PATCH 13/13] =?UTF-8?q?chore:=20=EC=9B=8C=ED=81=AC=ED=94=8C?= =?UTF-8?q?=EB=A1=9C=EC=9A=B0=20=ED=99=98=EA=B2=BD=EB=B3=80=EC=88=98=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .github/workflows/workflow-pr.yml | 8 ++++++++ .github/workflows/workflow.yml | 8 ++++++++ 2 files changed, 16 insertions(+) diff --git a/.github/workflows/workflow-pr.yml b/.github/workflows/workflow-pr.yml index 0f73331..bdb7386 100644 --- a/.github/workflows/workflow-pr.yml +++ b/.github/workflows/workflow-pr.yml @@ -26,5 +26,13 @@ jobs: - name: Install Dependencies run: yarn install --frozen-lockfile + # 환경 변수 추가 + - name: Set Environment Variables + run: | + echo "NEXT_PUBLIC_KAKAO_API_KEY=${{ secrets.NEXT_PUBLIC_KAKAO_API_KEY }}" >> .env + echo "NEXT_PUBLIC_KAKAO_REDIRECT_URI=${{ secrets.NEXT_PUBLIC_KAKAO_REDIRECT_URI }}" >> .env + echo "NEXT_PUBLIC_GOOGLE_API_KEY=${{ secrets.NEXT_PUBLIC_GOOGLE_API_KEY }}" >> .env + echo "NEXT_PUBLIC_GOOGLE_REDIRECT_URI=${{ secrets.NEXT_PUBLIC_GOOGLE_REDIRECT_URI }}" >> .env + - name: Build run: yarn build diff --git a/.github/workflows/workflow.yml b/.github/workflows/workflow.yml index 40b845e..599122f 100644 --- a/.github/workflows/workflow.yml +++ b/.github/workflows/workflow.yml @@ -29,6 +29,14 @@ jobs: - name: Install Dependencies run: yarn install --frozen-lockfile + # 환경 변수 추가 + - name: Set Environment Variables + run: | + echo "NEXT_PUBLIC_KAKAO_API_KEY=${{ secrets.NEXT_PUBLIC_KAKAO_API_KEY }}" >> .env + echo "NEXT_PUBLIC_KAKAO_REDIRECT_URI=${{ secrets.NEXT_PUBLIC_KAKAO_REDIRECT_URI }}" >> .env + echo "NEXT_PUBLIC_GOOGLE_API_KEY=${{ secrets.NEXT_PUBLIC_GOOGLE_API_KEY }}" >> .env + echo "NEXT_PUBLIC_GOOGLE_REDIRECT_URI=${{ secrets.NEXT_PUBLIC_GOOGLE_REDIRECT_URI }}" >> .env + - name: Build run: yarn build