Merge pull request #7 from AmorGakCo/feat/login#2

fix: fetch할 때 주소앞에 api 붙임
AmorGakCo · Nov 26, 2024 · 06b012a · 06b012a
2 parents 39b349c + 4d28a10
commit 06b012a
Show file tree

Hide file tree

Showing 7 changed files with 25 additions and 17 deletions.
diff --git a/package.json b/package.json
@@ -10,6 +10,7 @@
   },
   "dependencies": {
     "@hookform/resolvers": "^3.9.0",
+    "@radix-ui/react-alert-dialog": "^1.1.2",
     "@radix-ui/react-avatar": "^1.1.0",
     "@radix-ui/react-checkbox": "^1.1.1",
     "@radix-ui/react-dialog": "^1.1.2",

diff --git a/src/app/(afterLogin)/_lib/FetchWithAuth.ts b/src/app/(afterLogin)/_lib/FetchWithAuth.ts
@@ -17,8 +17,9 @@ export const fetchWithAuth = async <T = any>(endpoint: string, options: ApiFetch
     ...options.headers,
   };
 
-  const response = await fetch(`${process.env.NEXT_PUBLIC_API_LOCATION}${endpoint}`, {
+  const response = await fetch(`${process.env.NEXT_PUBLIC_API_LOCATION}/api/${endpoint}`, {
     ...options,
+    credentials: 'include',
     headers,
   });
 

diff --git a/src/app/(afterLogin)/group/detail/[groupId]/_lib/fetchGroupData.ts b/src/app/(afterLogin)/group/detail/[groupId]/_lib/fetchGroupData.ts
@@ -10,8 +10,8 @@ export async function fetchGroupData({queryKey}:{queryKey:[string,number]}) {
     // if (!response.ok) {
     //   throw new Error(`Error: ${response.statusText}`);
     // }
-
-    return await response.data
+   console.log(response);
+    return await response
   } catch (error) {
     console.error("Failed to fetch data:", error);
   }

diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -7,7 +7,12 @@ import Script from 'next/script';
 import RQProvider from '../components/RQProvider';
 import { Inter as FontSans } from 'next/font/google';
 import { cn } from '@/lib/utils';
+import { cookies } from 'next/headers';
+import { redirect } from 'next/navigation';
+import { Suspense } from 'react';
+import dynamic from 'next/dynamic';
 
+const DynamicHeader = dynamic(() => import('../components/ui/Header'), { ssr: false });
 
 const inter = Inter({ subsets: ['latin'] });
 
@@ -22,14 +27,13 @@ export default function RootLayout({
 }: Readonly<{
   children: React.ReactNode;
 }>) {
-
   return (
     <html lang="en">
       <body
         className={cn('bg-background font-sans antialiased', fontSans.variable)}
       >
         <RQProvider>
-          <Header/>
+          <DynamicHeader/>
           <div className="flex flex-col mt-12 min-h-default relative mb-navbarHeight">
             {children}
           </div> 

diff --git a/src/components/ui/Header/index.tsx b/src/components/ui/Header/index.tsx
@@ -6,19 +6,18 @@ import { pathToTitleMap } from '@/app/constants';
 import Cookies from 'js-cookie';
 import { Button } from '../button';
 import Link from 'next/link';
-import dynamic from 'next/dynamic';
 import DropDown from './DropDown';
 
 export default function Header() {
   const router = useRouter();
   const pathname = usePathname();
   const accessToken = Cookies.get('accessToken');
   const [title, setTitle] = useState(pathToTitleMap[pathname]);
-  const [isClient, setIsClient] = useState(false);
+  // const [isClient, setIsClient] = useState(false);
 
-  useEffect(() => {
-    setIsClient(true); // 클라이언트에서만 동작하도록 설정
-  }, []);
+  // useEffect(() => {
+  //   setIsClient(true); // 클라이언트에서만 동작하도록 설정
+  // }, []);
 
   useEffect(() => {
     const newTitle = pathToTitleMap[pathname];
@@ -33,15 +32,18 @@ export default function Header() {
         <Image
           className="cursor-pointer"
           onClick={() => {
-            router.replace('/home');
+            if (accessToken && pathname !== '/') {
+              router.replace('/home');
+            }
+            router.replace('/');
           }}
           width={106}
           height={32}
           src="/logo.svg"
           alt="뒤로가기"
         />
       )}
-      {isClient && pathname !== '/home' && pathname !== '/' && (
+      {pathname !== '/home' && pathname !== '/' && (
         <Image
           className="cursor-pointer"
           onClick={() => {
@@ -53,13 +55,13 @@ export default function Header() {
           alt="뒤로가기"
         />
       )}
-      {isClient && pathname !== '/home' && (
+      {pathname !== '/home' && (
         <div className="font-bold text-xl absolute top-1/2 left-1/2 -trnaslate-x-1/2 -translate-y-1/2">
           {title}
         </div>
       )}
-      {isClient && accessToken && <DropDown />}
-      {isClient && !accessToken && (
+      {accessToken && <DropDown />}
+      {!accessToken && (
         <Link href="/login" className="mr-2">
           <Button>로그인</Button>
         </Link>

diff --git a/src/lib/fetchLogout.ts b/src/lib/fetchLogout.ts
@@ -2,7 +2,7 @@ import { fetchWithAuth } from "@/app/(afterLogin)/_lib/FetchWithAuth"
 import Cookies from "js-cookie";
 export const fetchLogout = async () => {
   try {
-  await fetch(`${process.env.NEXT_PUBLIC_API_LOCATION}/tokens`, {
+  await fetch(`${process.env.NEXT_PUBLIC_API_LOCATION}/api/tokens`, {
     method: 'DELETE',
     cache: "no-cache",
     credentials:'include',

diff --git a/src/lib/getAccessTokenWithRefreshToken.ts b/src/lib/getAccessTokenWithRefreshToken.ts
@@ -1,5 +1,5 @@
 export const getAccessTokenWithRefreshToken = async () => {
-    const response = await fetch(`${process.env.NEXT_PUBLIC_API_LOCATION}/tokens`, {
+    const response = await fetch(`${process.env.NEXT_PUBLIC_API_LOCATION}/api/tokens`, {
       method: 'POST',
       headers: {
         'Content-Type': 'application/json',