From c8141ed50d8321adb56fd016b006d9e820c68c36 Mon Sep 17 00:00:00 2001
From: sounmind <devleesche@gmail.com>
Date: Wed, 13 Nov 2024 21:37:32 -0500
Subject: [PATCH] feat: add sample hook call in pages

---
 src/components/Certificate/Certificate.tsx | 11 +++++++++--
 src/components/Leaderboard/Leaderboard.tsx | 14 ++++++++++----
 src/components/Progress/Progress.tsx       | 11 +++++++++--
 3 files changed, 28 insertions(+), 8 deletions(-)

diff --git a/src/components/Certificate/Certificate.tsx b/src/components/Certificate/Certificate.tsx
index 0c6f40be..e25b392b 100644
--- a/src/components/Certificate/Certificate.tsx
+++ b/src/components/Certificate/Certificate.tsx
@@ -1,8 +1,15 @@
-import styles from "./Certificate.module.css";
-import Header from "../Header/Header";
+import { getMembers } from "../../api/services/store/storeService";
+import useMembers from "../../hooks/useMembers";
+
 import Footer from "../Footer/Footer";
+import Header from "../Header/Header";
+
+import styles from "./Certificate.module.css";
 
 export default function Certificate() {
+  const { members, isLoading, error } = useMembers({ getMembers });
+  console.log({ members, isLoading, error });
+
   const member = new URL(location.href).searchParams.get("member");
 
   /**
diff --git a/src/components/Leaderboard/Leaderboard.tsx b/src/components/Leaderboard/Leaderboard.tsx
index 64e64093..084bbad9 100644
--- a/src/components/Leaderboard/Leaderboard.tsx
+++ b/src/components/Leaderboard/Leaderboard.tsx
@@ -1,9 +1,15 @@
-import styles from "./Leaderboard.module.css";
-import Header from "../Header/Header";
 import Footer from "../Footer/Footer";
+import Header from "../Header/Header";
 
+import { getMembers } from "../../api/services/store/storeService";
+import useMembers from "../../hooks/useMembers";
+
+import styles from "./Leaderboard.module.css";
 export default function Leaderboard() {
-  const members = [
+  const { members, isLoading, error } = useMembers({ getMembers });
+  console.log({ members, isLoading, error });
+
+  const mockMembers = [
     { name: "DaleSeo", solved: 71, rank: "새싹" },
     { name: "sounmind", solved: 69, rank: "나무" },
     { name: "yolophg", solved: 65, rank: "새싹" },
@@ -20,7 +26,7 @@ export default function Leaderboard() {
       <article aria-labelledby="leaderboard">
         <h2 id="leaderboard">Members List</h2>
         <ul>
-          {members.map((member) => (
+          {mockMembers.map((member) => (
             <li key={member.name}>
               <div>등급: {member.rank}</div>
               <div>진행 상황: {member.solved}</div>
diff --git a/src/components/Progress/Progress.tsx b/src/components/Progress/Progress.tsx
index a1f42b15..cb7603a8 100644
--- a/src/components/Progress/Progress.tsx
+++ b/src/components/Progress/Progress.tsx
@@ -1,8 +1,15 @@
-import styles from "./Progress.module.css";
-import Header from "../Header/Header";
 import Footer from "../Footer/Footer";
+import Header from "../Header/Header";
+
+import { getMembers } from "../../api/services/store/storeService";
+import useMembers from "../../hooks/useMembers";
+
+import styles from "./Progress.module.css";
 
 export default function Progress() {
+  const { members, isLoading, error } = useMembers({ getMembers });
+  console.log({ members, isLoading, error });
+
   const tasks = [
     { id: 128, title: "Longest Consecutive Sequence", difficulty: "Med." },
     { id: 1, title: "Two Sum", difficulty: "Easy" },