diff --git a/src/api/analysisApi.ts b/src/api/analysisApi.ts
index c5d776e..29b6014 100644
--- a/src/api/analysisApi.ts
+++ b/src/api/analysisApi.ts
@@ -66,6 +66,21 @@ export const useDeleteAnalyses = () => {
});
};
+export const getNumOfAnalysis = async () => {
+ const email = sessionStorage.getItem("verifiedEmail");
+ const response = await api.get("/api/auth/email/credit", {
+ params: { email },
+ });
+ return response.data;
+};
+
+export const useNumOfAnalysis = () => {
+ return useQuery({
+ queryKey: ["numOfAnalysis"],
+ queryFn: getNumOfAnalysis,
+ });
+};
+
// 스트리밍 fetch + EventSorce 방식 사용을 위해 fetch API로 직접 구현
const BASE_URL = process.env.REACT_APP_BASE_URL;
diff --git a/src/pages/input-page/auth/components/EmailVerification.jsx b/src/pages/input-page/auth/components/EmailVerification.jsx
index 64e39df..2669aeb 100644
--- a/src/pages/input-page/auth/components/EmailVerification.jsx
+++ b/src/pages/input-page/auth/components/EmailVerification.jsx
@@ -5,7 +5,6 @@ import successIcon from "assets/icons/인증_성공.svg";
import { useSendVerifyEmail, useVerifyEmailCode } from "api/emailApi";
import EmailSentModal from "./EmailSentModal";
import { SESSION_STORAGE_KEY } from "api/sessionApi";
-import { useUserStore } from "stores/userStore";
const VERIFIED_EMAIL_KEY = "verifiedEmail";
@@ -14,7 +13,6 @@ function EmailVerification({ onEmailSent, onEmailChanged, onCodeVerified }) {
useSendVerifyEmail();
const { mutate: verifyEmailCode, isPending: isVerifying } =
useVerifyEmailCode();
- const { setCount } = useUserStore();
const savedEmail = sessionStorage.getItem(VERIFIED_EMAIL_KEY) || "";
const isAlreadyVerified =
@@ -133,8 +131,7 @@ function EmailVerification({ onEmailSent, onEmailChanged, onCodeVerified }) {
setIsVerified(true);
setCodeError(false);
sessionStorage.setItem(VERIFIED_EMAIL_KEY, email);
- if (data?.data?.count != null) setCount(data.data.count);
- onCodeVerified?.(email);
+onCodeVerified?.(email);
},
onError: () => {
setCodeError(true);
diff --git a/src/pages/input-page/components/AnalysisButton.jsx b/src/pages/input-page/components/AnalysisButton.jsx
index 2a4296e..1727f2a 100644
--- a/src/pages/input-page/components/AnalysisButton.jsx
+++ b/src/pages/input-page/components/AnalysisButton.jsx
@@ -1,32 +1,28 @@
+import cn from "utils/cn";
import Button from "./Button";
-import { useUserStore } from "stores/userStore";
-/**
- * 분석하기 전용 버튼 컴포넌트
- * @param {number} current - 분석 시도 횟수
- * @param {number} total - 최대 분석 횟수 (기본값 3)
- * @param {string} status - 'default' | 'disabled'
- */
-const AnalysisButton = ({
- current = 0,
- total = 3,
- status = "default",
- ...props
-}) => {
- const count = useUserStore((state) => state.count);
+import { useNumOfAnalysis } from "api/analysisApi";
- const countColor =
- status === "disabled" ? "text-[#EEEEEE]" : "text-[#C1D9FF]";
+const AnalysisButton = ({ total = 3, status = "default", ...props }) => {
+ const { data } = useNumOfAnalysis();
+ const count = data?.data.count ?? 0;
return (
diff --git a/src/stores/userStore.ts b/src/stores/userStore.ts
deleted file mode 100644
index 3a15c7e..0000000
--- a/src/stores/userStore.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-import { create } from "zustand";
-import { persist, createJSONStorage } from "zustand/middleware";
-
-interface UserStore {
- count: number | null;
- setCount: (count: number) => void;
- reset: () => void;
-}
-
-export const useUserStore = create()(
- persist(
- (set) => ({
- count: null,
- setCount: (count) => set({ count }),
- reset: () => set({ count: null }),
- }),
- {
- name: "user-store",
- storage: createJSONStorage(() => sessionStorage),
- }
- )
-);