Fix: 마이페이지 온도 동적 스타일링 버그 해결

Related to: #408
TeamTheGenius · Jul 9, 2024 · 5d2502b · 5d2502b
1 parent c0d42b0
commit 5d2502b
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 9 deletions.
diff --git a/src/components/MyPage/MyPage/Temperature/Temperature.tsx b/src/components/MyPage/MyPage/Temperature/Temperature.tsx
@@ -5,14 +5,6 @@ interface Props {
 }
 
 function Temperature({ temperature }: Props) {
-  temperature += 36.5;
-
-  if (temperature <= 0) {
-    temperature = 0;
-  } else if (temperature >= 100) {
-    temperature = 100;
-  }
-
   const temperatureColorConditions = [
     { max: 10, color: "#7EC7FC" },
     { max: 20, color: "#72EF86" },

diff --git a/src/hooks/queries/useProfileQuery.tsx b/src/hooks/queries/useProfileQuery.tsx
@@ -21,9 +21,20 @@ import { useMutation, useQuery } from "react-query";
 import { useNavigate } from "react-router-dom";
 
 export const useGetMyProfile = () => {
+  const adjustTemperature = (data: MyProfileDataType) => {
+    let progressBar = data.progressBar + 36.5;
+    if (progressBar < 0) {
+      progressBar = 0;
+    } else if (progressBar > 100) {
+      progressBar = 100;
+    }
+    return { ...data, progressBar };
+  };
+
   const { data, isLoading } = useQuery<MyProfileDataType>({
     queryKey: [QUERY_KEY.MY_PROFILE],
-    queryFn: () => getMyPageProfile(),
+    queryFn: getMyPageProfile,
+    select: adjustTemperature,
   });
 
   return { data, isLoading };