Skip to content

Commit 5cb9304

Browse files
[feat/reward-update] 리워드 페이지 수정 (#21)
* feat: 로그인 시 유저 이름, 포인트 받기 * feat: 토큰 만료 시 유저 유저 포인트 새로 받기 * feat: api 함수 전달인자 형태 수정 * feat: 타입 수정 * feat: api 수정 * fix: type 에러 수정
1 parent c9a8acd commit 5cb9304

11 files changed

Lines changed: 81 additions & 41 deletions

File tree

index.html

Lines changed: 23 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,23 @@
1-
<!doctype html>
2-
<html lang="en">
3-
<head>
4-
<meta charset="UTF-8" />
5-
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
6-
<link href="/dist/styles.css" rel="stylesheet" />
7-
<link
8-
rel="stylesheet"
9-
href="https://cdn.jsdelivr.net/gh/orioncactus/[email protected]/dist/web/static/pretendard.min.css"
10-
/>
11-
12-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
13-
<title>Check Locatiion</title>
14-
</head>
15-
<body>
16-
<div id="root"></div>
17-
<script type="module" src="/src/main.tsx"></script>
18-
<script
19-
type="text/javascript"
20-
src="//dapi.kakao.com/v2/maps/sdk.js?appkey=%VITE_KAKAO_API%&libraries=services,clusterer"
21-
></script>
22-
</body>
23-
</html>
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
6+
<link href="/dist/styles.css" rel="stylesheet" />
7+
<link
8+
rel="stylesheet"
9+
href="https://cdn.jsdelivr.net/gh/orioncactus/[email protected]/dist/web/static/pretendard.min.css"
10+
/>
11+
12+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
13+
<title>Check Locatiion</title>
14+
</head>
15+
<body>
16+
<div id="root"></div>
17+
<script type="module" src="/src/main.tsx"></script>
18+
<script
19+
type="text/javascript"
20+
src="//dapi.kakao.com/v2/maps/sdk.js?appkey=%VITE_KAKAO_API%&libraries=services,clusterer"
21+
></script>
22+
</body>
23+
</html>

src/features/auth/routes/GoogleCallback.tsx

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,15 @@ import { Spinner } from "@/components/ui/spinner";
44
import { useCallback, useEffect, useState } from "react";
55

66
import { postGoogleLogin } from "@/features/auth/api/auth";
7+
import { getPoint } from "@/features/reward/api/reward";
78
import { useNavigate, useSearchParams } from "react-router";
89

910
import { useAuthStore } from "@/stores/auth-store";
11+
import { useUserStore } from "@/stores/user";
1012
import { paths } from "@/config/paths";
1113

1214
const GoogleCallback = (): JSX.Element | null => {
15+
const { setUserName, setPoint } = useUserStore();
1316
const [searchParams] = useSearchParams();
1417
const navigate = useNavigate();
1518
const setTokens = useAuthStore((state) => state.setTokens);
@@ -25,9 +28,13 @@ const GoogleCallback = (): JSX.Element | null => {
2528
throw new Error("구글 인증에 실패했습니다.");
2629
}
2730

28-
const { accessToken, refreshToken, userId } = response.data;
31+
const { accessToken, refreshToken, username, userId } = response.data;
2932

3033
setTokens(accessToken, refreshToken, userId);
34+
setUserName(username);
35+
36+
const { totalPoints } = await getPoint({ pathParams: { userId } });
37+
setPoint(totalPoints);
3138

3239
navigate(paths.home.path);
3340
} catch (error) {
@@ -37,7 +44,7 @@ const GoogleCallback = (): JSX.Element | null => {
3744
setIsLoading(false);
3845
}
3946
},
40-
[navigate, setTokens]
47+
[navigate, setTokens, setUserName, setPoint]
4148
);
4249

4350
useEffect(() => {

src/features/auth/routes/KakaoCallback.tsx

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,15 @@ import { Spinner } from "@/components/ui/spinner";
44
import { useCallback, useEffect, useState } from "react";
55

66
import { postKakaoLogin } from "@/features/auth/api/auth";
7+
import { getPoint } from "@/features/reward/api/reward";
78
import { useNavigate, useSearchParams } from "react-router";
89

910
import { useAuthStore } from "@/stores/auth-store";
11+
import { useUserStore } from "@/stores/user";
1012
import { paths } from "@/config/paths";
1113

1214
const KakaoCallback = (): JSX.Element | null => {
15+
const { setUserName, setPoint } = useUserStore();
1316
const [searchParams] = useSearchParams();
1417
const navigate = useNavigate();
1518
const setTokens = useAuthStore((state) => state.setTokens);
@@ -27,9 +30,13 @@ const KakaoCallback = (): JSX.Element | null => {
2730
throw new Error("카카오 인증에 실패했습니다.");
2831
}
2932

30-
const { accessToken, refreshToken, userId } = response.data;
33+
const { accessToken, refreshToken, username, userId } = response.data;
3134

3235
setTokens(accessToken, refreshToken, userId);
36+
setUserName(username);
37+
38+
const { totalPoints } = await getPoint({ pathParams: { userId } });
39+
setPoint(totalPoints);
3340

3441
navigate(paths.home.path);
3542
} catch (error) {
@@ -39,7 +46,7 @@ const KakaoCallback = (): JSX.Element | null => {
3946
setIsLoading(false);
4047
}
4148
},
42-
[navigate, setTokens]
49+
[navigate, setTokens, setUserName, setPoint]
4350
);
4451

4552
useEffect(() => {

src/features/reward/api/path.ts

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,5 +2,7 @@ import { generatePathByBase, genreateBasePath } from "@/lib/axios/utils";
22

33
export const BASE_PATH = genreateBasePath("points", "v1");
44

5-
export const POINT_DEDUC = (socialId) =>
6-
generatePathByBase(BASE_PATH, socialId, "deduc");
5+
export const POINTS = (userId: string) => generatePathByBase(BASE_PATH, userId);
6+
7+
export const POINT_DEDUC = (userId: string) =>
8+
generatePathByBase(BASE_PATH, userId, "deduc");

src/features/reward/api/reward.ts

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,17 @@
11
import type { R } from "@/types/common";
2-
import { POST } from "@/lib/axios";
2+
import { GET, POST } from "@/lib/axios";
33
import type { RoOnlyPathParamsType } from "@/lib/axios/utils";
4-
import { POINT_DEDUC } from "./path";
4+
import type { Point } from "../types";
5+
import { POINT_DEDUC, POINTS } from "./path";
56

67
export function postRewards({
7-
pathParams: { socialId }
8-
}: RoOnlyPathParamsType<{ socialId: number }>): R<{ point: number }> {
9-
return POST({ url: POINT_DEDUC(socialId) });
8+
pathParams: { userId }
9+
}: RoOnlyPathParamsType<{ userId: string }>): R<{ point: number }> {
10+
return POST({ url: POINT_DEDUC(userId) });
11+
}
12+
13+
export function getPoint({
14+
pathParams: { userId }
15+
}: RoOnlyPathParamsType<{ userId: string }>): R<Point> {
16+
return GET({ url: POINTS(userId) });
1017
}

src/features/reward/components/reward.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,10 +10,10 @@ import { generateCoupons } from "./index.const";
1010
import SuccessToast from "./success-toast";
1111

1212
export default function Reward() {
13-
const { point, setPoint } = useUserStore();
13+
const { point, setPoint, userId } = useUserStore();
1414

1515
const { mutate, isPending } = useMutation({
16-
...generate_qo_postRewards(1),
16+
...generate_qo_postRewards(userId),
1717
onSuccess: (data) => {
1818
setPoint(data.point);
1919
toast(<SuccessToast />, {

src/features/reward/types/index.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
export interface Point {
2+
userId: number;
3+
socialId: string;
4+
totalPoints: number;
5+
}

src/lib/axios/index.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import { postRefreshAccessToken } from "@/features/auth/api/auth";
2+
import { getPoint } from "@/features/reward/api/reward";
23
import type {
34
AxiosRequestConfig,
45
AxiosResponse,
@@ -10,6 +11,7 @@ import { get, isArray } from "es-toolkit/compat";
1011

1112
import { Nullable } from "@/types/common";
1213
import { useAuthStore } from "@/stores/auth-store";
14+
import { useUserStore } from "@/stores/user";
1315
import { ENDPOINT_URL, MEDIUM_REQUEST_TIMEOUT } from "@/config/envs";
1416
import { paths } from "@/config/paths";
1517
import { generateQueryParams } from "@/lib/axios/utils";
@@ -58,6 +60,12 @@ export const handleTokenExpiration = async (
5860

5961
axios.defaults.headers.common["Authorization"] =
6062
`Bearer ${response.data.accessToken}`;
63+
64+
const { totalPoints } = await getPoint({
65+
pathParams: { userId: response.data.userId }
66+
});
67+
useUserStore.setState({ point: totalPoints });
68+
6169
return axios.request(config);
6270
} catch (error) {
6371
window.location.href = paths.auth.login.path;

src/lib/react-query/queryOptions/reward.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,9 @@ import { AxiosError } from "axios";
44

55
interface UseMutationRewardsOptions
66
extends UseMutationOptions<{ point: number }, AxiosError, void, unknown> {}
7-
type GenerateQoPostRewards = (id: number) => UseMutationRewardsOptions;
8-
export const generate_qo_postRewards: GenerateQoPostRewards = (socialId) => {
7+
type GenerateQoPostRewards = (userId: string) => UseMutationRewardsOptions;
8+
export const generate_qo_postRewards: GenerateQoPostRewards = (userId) => {
99
return {
10-
mutationFn: () => postRewards({ pathParams: { socialId } })
10+
mutationFn: () => postRewards({ pathParams: { userId } })
1111
};
1212
};

src/stores/user.ts

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,15 @@ import { create } from "zustand";
33
interface UserState {
44
userName: string;
55
point: number;
6+
userId: string;
67
setPoint: (point: number) => void;
8+
setUserName: (userName: string) => void;
79
}
810

911
export const useUserStore = create<UserState>((set) => ({
1012
userName: "park",
1113
point: 100000,
12-
setPoint: (point) => set({ point })
14+
userId: "0",
15+
setPoint: (point) => set({ point }),
16+
setUserName: (userName) => set({ userName })
1317
}));

0 commit comments

Comments
 (0)