fronted แก้ layout build dev&proc

frontend/lib/auth.js

@@ -1,38 +1,82 @@
 // frontend/lib/auth.js
-import { cookies } from "next/headers";
+// frontend/lib/auth.js
+
+'use client';
+
+import { createContext, useState, useContext, useEffect } from 'react';
+import api from './api';
+// 1. Import cookieDriver ที่คุณมีอยู่แล้ว ซึ่งเป็นวิธีที่ถูกต้อง
+import { cookieDriver } from '@/app/_auth/drivers/cookieDriver';
+
+const AuthContext = createContext(null);
 
 const COOKIE_NAME = "access_token";
 
-/**
- * Server-side session fetcher (ใช้ใน Server Components/Layouts)
- * - อ่านคุกกี้แบบ async: await cookies()
- * - ถ้าไม่มี token → return null
- * - ถ้ามี → เรียก /api/auth/me ที่ backend เพื่อตรวจสอบ
- */
-export async function getSession() {
-  // ✅ ต้อง await
-  const cookieStore = await cookies();
-  const token = cookieStore.get(COOKIE_NAME)?.value;
+export function AuthProvider({ children }) {
+  const [user, setUser] = useState(null);
+  const [loading, setLoading] = useState(true);
 
-  if (!token) return null;
+  useEffect(() => {
+    const initializeAuth = async () => {
+      // 2. อ่าน token จาก cookie ด้วย cookieDriver.get()
+      const token = cookieDriver.get(COOKIE_NAME); 
+      
+      if (token) {
+        try {
+          api.defaults.headers.Authorization = `Bearer ${token}`;
+          // สมมติว่ามี endpoint /auth/me สำหรับดึงข้อมูลผู้ใช้
+          const response = await api.get('/auth/me');
+          setUser(response.data.user || response.data); // รองรับทั้งสองรูปแบบ
+        } catch (error) {
+          console.error("Failed to initialize auth from cookie:", error);
+          cookieDriver.remove(COOKIE_NAME);
+          delete api.defaults.headers.Authorization;
+        }
+      }
+      setLoading(false);
+    };
 
-  // เรียก backend ตรวจ session (ปรับ endpoint ให้ตรงของคุณ)
-  const res = await fetch(`${process.env.NEXT_PUBLIC_API_BASE}/api/auth/me`, {
-    // ส่งต่อคุกกี้ไป backend (เลือกอย่างใดอย่างหนึ่ง)
-    // วิธี A: ส่ง header Cookie โดยตรง
-    headers: { Cookie: `${COOKIE_NAME}=${token}` },
-    // วิธี B: ถ้า proxy ผ่าน nginx ในโดเมนเดียวกัน ใช้ credentials รวมคุกกี้อัตโนมัติได้
-    // credentials: "include",
-    cache: "no-store",
-  });
+    initializeAuth();
+  }, []);
 
-  if (!res.ok) return null;
-
-  const data = await res.json();
-  // คาดหวังโครงสร้าง { user, permissions } จาก backend
-  return {
-    user: data.user,
-    permissions: data.permissions || [],
-    token,
+  const login = async (credentials) => {
+    const response = await api.post('/auth/login', credentials);
+    const { token, user } = response.data;
+    
+    // 3. ตั้งค่า token ใน cookie ด้วย cookieDriver.set()
+    cookieDriver.set(COOKIE_NAME, token, { expires: 7, secure: true, sameSite: 'strict' });
+    api.defaults.headers.Authorization = `Bearer ${token}`;
+    setUser(user);
+    return user;
   };
+
+  const logout = () => {
+    // 4. ลบ token ออกจาก cookie ด้วย cookieDriver.remove()
+    cookieDriver.remove(COOKIE_NAME);
+    delete api.defaults.headers.Authorization;
+    setUser(null);
+    window.location.href = '/login';
+  };
+
+  const value = {
+    user,
+    isAuthenticated: !!user,
+    loading,
+    login,
+    logout
+  };
+
+  return (
+    <AuthContext.Provider value={value}>
+      {!loading && children}
+    </AuthContext.Provider>
+  );
 }
+
+export const useAuth = () => {
+  const context = useContext(AuthContext);
+  if (context === undefined) {
+    throw new Error('useAuth must be used within an AuthProvider');
+  }
+  return context;
+};