feat: 리팩토링을 왜...

src/app/log/Score.tsx

@@ -0,0 +1,32 @@
+import { useState } from "react";
+import styles from "./page.module.scss";
+import { usePersonalGoals } from "@/lib/firebase/api/personalGoalAPI";
+
+export default function Score() {
+  const [score, setScore] = useState(100);
+  const { data, isLoading, isError } = usePersonalGoals();
+
+  // /////
+  // try {
+  //   const response_score = await axios.post(
+  //     'https://castberry.kr:3650/api/open', {
+  //       "goal": {},
+  //       "status": {},
+  //     }
+  //   );
+  //   setScore(JSON.parse(response_score.data).score);
+  // } catch (error) {
+  //   console.error(error);
+  // }
+  /////
+
+  return (
+    <div className={styles.today_score_frame}>
+      <div className={styles.today_score_text}>
+        <div className={styles.today_score_text_in}>오늘의 점수</div>
+        <div>오늘도 열심히 활동했어요!</div>
+      </div>
+      <div className={styles.today_score}>{score}점</div>
+    </div>
+  );
+}

src/app/log/page.tsx

@@ -1,15 +1,14 @@
-"use client"
+"use client";
 
 import DietLog from "./DietLog";
 import SleepLog from "./SleepLog";
 import WorkoutLog from "./WorkoutLog";
 
-import styles from './page.module.scss'
+import styles from "./page.module.scss";
 
 import Header from "../_common/header";
 import NavBar from "../_common/navBar";
-import { useState } from "react";
-import axios from "axios";
+import Score from "./Score";
 
 export function logInput() {
   console.log("log input select");
@@ -18,37 +17,18 @@ export function logInput() {
       <input type="text"></input>
       <input type="submit">완료</input>
     </div>
-  )
+  );
 }
 
-export default async function LogPage() {
-  const [ score, setScore ] = useState(100);
-
-  // /////
-  // try {
-  //   const response_score = await axios.post(
-  //     'https://castberry.kr:3650/api/open', {
-  //       "goal": {},
-  //       "status": {},
-  //     }
-  //   );
-  //   setScore(JSON.parse(response_score.data).score);
-  // } catch (error) {
-  //   console.error(error);
-  // }
-
-  /////
+export default function LogPage() {
   return (
     <div>
       <div className={styles.log_frame}>
-        <Header pageName="활동기록" info="오늘 활동한 기록을 추가해봐요!"></Header>
-        <div className={styles.today_score_frame}>
-          <div className={styles.today_score_text}>
-            <div className={styles.today_score_text_in}>오늘의 점수</div>
-            <div>오늘도 열심히 활동했어요!</div>
-          </div>
-          <div className={styles.today_score}>{score}점</div>
-        </div>
+        <Header
+          pageName="활동기록"
+          info="오늘 활동한 기록을 추가해봐요!"
+        ></Header>
+        <Score />
         <SleepLog />
         <DietLog />
         <WorkoutLog />

src/app/mypage/page.tsx

@@ -21,7 +21,7 @@ export default function MyPage() {
           ? "목표를 설정해주세요"
           : data.diet?.calories}
       </div>
-      <Link href="/mypage/personalGoals">식단 목표 설정하기</Link>
+      <Link href="/mypage/personalGoals">목표 설정하기</Link>
       <NavBar currentPage={"mypage"}></NavBar>
     </div>
   );

src/lib/hooks/useLogStatus.ts

@@ -0,0 +1,15 @@
+import { useMemo } from "react";
+import { useDietOfDay } from "../firebase/api/dietAPI"
+import { useWorkoutOfDay } from "../firebase/api/workoutAPI";
+
+export const useLogStatus = () => {
+   const { data: diets, isLoading: dietIsLoading, isError: dietIsError } = useDietOfDay(new Date());
+   const { data: workouts, isLoading: workoutIsLoading, isError: workoutIsError } = useWorkoutOfDay(new Date());
+   const { data: sleeps, isLoading: sleepIsLoading, isError: sleepIsError } = useWorkoutOfDay(new Date());
+
+   const isRender = useMemo(() => {
+      if (dietIsLoading || workoutIsLoading || sleepIsLoading) return false;
+      if (dietIsError || workoutIsError || sleepIsError) return false;
+      return true;
+   }, [dietIsLoading, workoutIsLoading, sleepIsLoading, dietIsError, workoutIsError, sleepIsError]);
+}