From ae209509e6617f433f0a6fe1178db2738f1d4734 Mon Sep 17 00:00:00 2001
From: solar3070 <>
Date: Thu, 17 Aug 2023 20:03:35 +0900
Subject: [PATCH 1/3] =?UTF-8?q?fix:=20=EC=98=A4=ED=83=88=EC=9E=90=20?=
=?UTF-8?q?=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/components/consumer/ConsumerIntro.tsx | 2 +-
src/types/remote.ts | 2 +-
2 files changed, 2 insertions(+), 2 deletions(-)
diff --git a/src/components/consumer/ConsumerIntro.tsx b/src/components/consumer/ConsumerIntro.tsx
index e55c47e..6a8af23 100644
--- a/src/components/consumer/ConsumerIntro.tsx
+++ b/src/components/consumer/ConsumerIntro.tsx
@@ -42,7 +42,7 @@ function ConsumerIntro() {
/>
-
+
diff --git a/src/types/remote.ts b/src/types/remote.ts
index 8950d1c..92ca804 100644
--- a/src/types/remote.ts
+++ b/src/types/remote.ts
@@ -1,7 +1,7 @@
export type GetCardInfo = {
providerName: string;
cardImageUrl: string;
- cardMeesage: string;
+ cardMessage: string;
};
export type GetTargetInfo = {
From 7f95e5fb5a41d1f48a8a68312b5fb47a728cab3d Mon Sep 17 00:00:00 2001
From: solar3070 <>
Date: Thu, 17 Aug 2023 20:06:01 +0900
Subject: [PATCH 2/3] =?UTF-8?q?feat:=20=ED=83=80=EA=B2=9F=20=EC=83=9D?=
=?UTF-8?q?=EC=84=B1=20API=20=EC=97=B0=EA=B2=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/api/consumer.ts | 2 ++
src/api/provider.ts | 16 ++++++++++++++++
src/components/provider/ProviderIntro.tsx | 12 ++++++++++--
src/hooks/queries/usePostTarget.tsx | 8 ++++++++
src/types/remote.ts | 5 +++++
5 files changed, 41 insertions(+), 2 deletions(-)
create mode 100644 src/hooks/queries/usePostTarget.tsx
diff --git a/src/api/consumer.ts b/src/api/consumer.ts
index eefab28..776279c 100644
--- a/src/api/consumer.ts
+++ b/src/api/consumer.ts
@@ -1,6 +1,7 @@
import axios from "axios";
import { GetCardInfo, GetTargetInfo } from "types/remote";
+// 타겟 조회
export const getCardInfo = async (targetId: number): Promise => {
const response = await axios.get(
`${process.env.REACT_APP_BASE_URL}/target/${targetId}`,
@@ -8,6 +9,7 @@ export const getCardInfo = async (targetId: number): Promise => {
return response.data;
};
+// 타겟 최종 결정된 선물 조회
export const getTargetInfo = async (
targetId: number,
): Promise => {
diff --git a/src/api/provider.ts b/src/api/provider.ts
index 86eec00..3bed2c0 100644
--- a/src/api/provider.ts
+++ b/src/api/provider.ts
@@ -1,4 +1,5 @@
import axios from "axios";
+import { PostTarget } from "types/remote";
// 선물 조회
export const getGiftList = async (targetId: number) => {
@@ -33,3 +34,18 @@ export const putGiftItem = async (formData: FormData) => {
},
);
};
+
+// 타겟 생성
+export const postTarget = async ({
+ consumerName,
+ providerName,
+}: PostTarget) => {
+ const response = await axios.post(
+ `${process.env.REACT_APP_BASE_URL}/target`,
+ {
+ consumerName,
+ providerName,
+ },
+ );
+ return response.data;
+};
diff --git a/src/components/provider/ProviderIntro.tsx b/src/components/provider/ProviderIntro.tsx
index 38bf27b..272b2c6 100644
--- a/src/components/provider/ProviderIntro.tsx
+++ b/src/components/provider/ProviderIntro.tsx
@@ -2,6 +2,7 @@ import Button from "components/common/Button";
import Icon from "components/common/Icon";
import Input from "components/common/Input";
import Text from "components/common/Text";
+import usePostTarget from "hooks/queries/usePostTarget";
import useInputFormValidation from "hooks/useInputValidation";
import { useEffect, useState } from "react";
import { useNavigate } from "react-router-dom";
@@ -12,6 +13,7 @@ function ProviderIntro() {
const navigate = useNavigate();
const [form, errors, handleFormChange] = useInputFormValidation();
const [showContent, setShowContent] = useState(false);
+ const { mutate } = usePostTarget();
useEffect(() => {
const timer = setTimeout(() => {
@@ -22,14 +24,20 @@ function ProviderIntro() {
}, []);
const handleClick = () => {
- if (!form.providerName || !form.consumerName) {
+ const { providerName, consumerName } = form;
+ if (!providerName || !consumerName) {
handleFormChange({
...form,
type: "all",
});
return;
}
- navigate("/gift");
+ mutate(
+ { consumerName, providerName },
+ {
+ onSuccess: data => navigate(`/gift/${data}`),
+ },
+ );
};
return (
diff --git a/src/hooks/queries/usePostTarget.tsx b/src/hooks/queries/usePostTarget.tsx
new file mode 100644
index 0000000..a8da3e3
--- /dev/null
+++ b/src/hooks/queries/usePostTarget.tsx
@@ -0,0 +1,8 @@
+import { postTarget } from "api/provider";
+import { useMutation } from "react-query";
+
+export const usePostTarget = () => {
+ return useMutation(postTarget);
+};
+
+export default usePostTarget;
diff --git a/src/types/remote.ts b/src/types/remote.ts
index 92ca804..9086ea2 100644
--- a/src/types/remote.ts
+++ b/src/types/remote.ts
@@ -11,3 +11,8 @@ export type GetTargetInfo = {
giftImageUrl: string;
};
};
+
+export type PostTarget = {
+ providerName: string;
+ consumerName: string;
+};
From b39f540986b33a7a736a5dc5aa076f005e2ca86e Mon Sep 17 00:00:00 2001
From: solar3070 <>
Date: Thu, 17 Aug 2023 20:06:38 +0900
Subject: [PATCH 3/3] =?UTF-8?q?fix:=20=EC=B9=B4=EB=93=9C=20=EC=83=9D?=
=?UTF-8?q?=EC=84=B1=20=EA=B2=BD=EB=A1=9C=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/App.tsx | 2 +-
src/components/provider/ProviderCard.tsx | 5 +++--
src/pages/Card.tsx | 7 ++++---
3 files changed, 8 insertions(+), 6 deletions(-)
diff --git a/src/App.tsx b/src/App.tsx
index 86faf4e..2f9b767 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -23,7 +23,7 @@ function App() {
} />
} />
} />
- } />
+ } />
} />
} />
} />
diff --git a/src/components/provider/ProviderCard.tsx b/src/components/provider/ProviderCard.tsx
index 4438607..828dcce 100644
--- a/src/components/provider/ProviderCard.tsx
+++ b/src/components/provider/ProviderCard.tsx
@@ -1,4 +1,4 @@
-import { useNavigate } from "react-router-dom";
+import { useNavigate, useParams } from "react-router-dom";
import { useRecoilValue } from "recoil";
import styled from "styled-components";
import Icon from "components/common/Icon";
@@ -6,10 +6,11 @@ import { imgUrlSelector } from "stores/cardAtom";
function ProviderCard() {
const navigate = useNavigate();
+ const { targetId } = useParams();
const imgUrl = useRecoilValue(imgUrlSelector);
const handleNextToPage = () => {
- navigate("/card");
+ navigate(`/card/${targetId}`);
};
return (
diff --git a/src/pages/Card.tsx b/src/pages/Card.tsx
index b5b7492..701d120 100644
--- a/src/pages/Card.tsx
+++ b/src/pages/Card.tsx
@@ -1,5 +1,5 @@
import { useState, ChangeEvent } from "react";
-import { useNavigate } from "react-router-dom";
+import { useNavigate, useParams } from "react-router-dom";
import COLOR from "style/color";
import styled from "styled-components";
import Button from "components/common/Button";
@@ -12,6 +12,7 @@ import CardBasic from "components/provider/CardBasic";
function Card() {
const navigate = useNavigate();
+ const { targetId } = useParams();
const [toggleType, setToggleType] = useState<"basic" | "custom">("basic");
const [cardTxt, setCardTxt] = useState("");
const [imageURL, setImageURL] = useState("");
@@ -45,11 +46,11 @@ function Card() {
};
const handleCancel = () => {
- navigate("/gift");
+ navigate(`/gift/${targetId}`);
};
const handleSuccess = () => {
- navigate("/gift");
+ navigate(`/gift/${targetId}`);
};
return (