🚧 get challenge status

potenday-project · Dec 15, 2023 · 0ebf334 · 0ebf334
1 parent b759c95
commit 0ebf334
Show file tree

Hide file tree

Showing 6 changed files with 32 additions and 4 deletions.
diff --git a/app/(route)/(index)/page.tsx b/app/(route)/(index)/page.tsx
@@ -1,6 +1,16 @@
+'use client'
+
 import Image from 'next/image'
 
+import { useChallengesQuery } from './queries'
+
 export default function HomePage() {
+  const challengesQuery = useChallengesQuery()
+
+  if (!challengesQuery.isSuccess) {
+    return null
+  }
+
   return (
     <div className='relative h-full px-8 py-4 pt-16'>
       <h1 className='text-2xl'>오늘의 도달률</h1>

diff --git a/app/(route)/(index)/queries.ts b/app/(route)/(index)/queries.ts
@@ -0,0 +1,14 @@
+import { useQuery } from '@tanstack/react-query'
+
+import { getChallenges } from '@/app/_service/challenge'
+
+const QUERY_KEY = {
+  challenges: ['challenges'],
+}
+
+export const useChallengesQuery = () => {
+  return useQuery({
+    queryKey: QUERY_KEY.challenges,
+    queryFn: () => getChallenges(),
+  })
+}
diff --git a/app/(route)/layout.tsx b/app/(route)/layout.tsx
@@ -3,9 +3,9 @@ import localFont from 'next/font/local'
 import type { Metadata } from 'next'
 
 import '@/app/_styles/globals.css'
-import Providers from '@/app/_components/providers/QueryClientProvider'
 
-import { cn } from '../_styles/utils'
+import CoreProvider from '@/app/_components/providers/CoreProvider'
+import { cn } from '@/app/_styles/utils'
 
 const myFont = localFont({
   src: '../_assets/fonts/PretendardVariable.woff2',
@@ -25,7 +25,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
         <link rel='icon' href='../../favicon.ico' sizes='any' />
       </head>
       <body className={cn(myFont.className, 'mx-auto max-w-lg text-white')}>
-        <Providers>{children}</Providers>
+        <CoreProvider>{children}</CoreProvider>
       </body>
     </html>
   )

diff --git a/app/_service/challenge/challenge.types.ts b/app/_service/challenge/challenge.types.ts
diff --git a/app/_service/challenge/index.ts b/app/_service/challenge/index.ts
@@ -0,0 +1,5 @@
+import api from '../core/api'
+
+export const getChallenges = () => {
+  return api.get('/challenges')
+}
diff --git a/app/_service/core/api.ts b/app/_service/core/api.ts
@@ -6,7 +6,6 @@ import { getApiEndpoint } from './api.utils'
 const createApi = () => {
   const _api = axios.create({
     baseURL: getApiEndpoint(),
-    // withCredentials: true,
     headers: {
       'Content-Type': 'application/json',
     },