@lastbrain/ai-ui-react 1.0.63 → 1.0.65

package/src/context/LBAuthProvider.tsx

@@ -10,6 +10,7 @@ import {
   useContext,
   useEffect,
   useCallback,
+  useMemo,
   useState,
   type ReactNode,
 } from "react";
@@ -21,6 +22,7 @@ import type {
   LBSessionResult,
   AiStatus,
 } from "@lastbrain/ai-ui-core";
+import { createLBClient } from "@lastbrain/ai-ui-core";
 
 interface LBProviderProps {
   children: ReactNode;
@@ -100,69 +102,81 @@ export function LBProvider({
   const [isLoadingStorage, setIsLoadingStorage] = useState(false);
   const [storageLastFetch, setStorageLastFetch] = useState<number>(0);
 
+  const lbClient = useMemo(
+    () =>
+      createLBClient({
+        baseUrl: proxyUrl,
+        mode: process.env.LB_API_KEY ? "env-key" : "auto",
+        selectedApiKeyId: state.selectedKey?.id,
+      }),
+    [proxyUrl, state.selectedKey?.id]
+  );
+
   /**
    * Vérifie si une session existe au chargement
    */
   const checkSession = useCallback(async () => {
     try {
-      const response = await fetch(`${proxyUrl}/auth/session/verify`, {
-        credentials: "include",
-      });
-
-      if (response.ok) {
-        const session: LBSession = await response.json();
-
-        // Récupérer les infos utilisateur depuis /auth/status
-        try {
-          const statusResponse = await fetch(`${proxyUrl}/auth/status`, {
-            credentials: "include",
-          });
-
-          if (statusResponse.ok) {
-            const statusData = await statusResponse.json();
-            setState({
-              status: "ready",
-              session,
-              user: {
-                id: session.userId,
-                email: statusData.user?.email || "",
-              },
-            });
-          } else {
-            // Fallback sans email
-            setState({
-              status: "ready",
-              session,
-              user: {
-                id: session.userId,
-                email: "",
-              },
-            });
-          }
-        } catch (statusError) {
-          console.error("[LBProvider] Failed to fetch status:", statusError);
-          // Fallback sans email
+      const session = await lbClient.verifySession();
+      if (session) {
+        const userData = await lbClient.getUser().catch(() => null);
+        const activeKey = userData?.apiKeyActive
+          ? {
+              id: userData.apiKeyActive.id,
+              name: userData.apiKeyActive.name,
+              keyPrefix: userData.apiKeyActive.prefix,
+              scopes: userData.apiKeyActive.scopes || [],
+              isActive: true,
+              createdAt: "",
+            }
+          : undefined;
+        setApiKeys(userData?.apiKeys || []);
+        setState({
+          status: "ready",
+          session,
+          user: {
+            id: session.userId,
+            email: userData?.user?.email || "",
+          },
+          selectedKey: activeKey,
+        });
+        onStatusChange?.("ready");
+      } else {
+        // Supabase session mode (no lb_session cookie): try user endpoint directly
+        const userData = await lbClient.getUser().catch(() => null);
+        if (userData?.user?.id) {
+          const activeKey = userData?.apiKeyActive
+            ? {
+                id: userData.apiKeyActive.id,
+                name: userData.apiKeyActive.name,
+                keyPrefix: userData.apiKeyActive.prefix,
+                scopes: userData.apiKeyActive.scopes || [],
+                isActive: true,
+                createdAt: "",
+              }
+            : undefined;
+
+          setApiKeys(userData.apiKeys || []);
           setState({
             status: "ready",
-            session,
             user: {
-              id: session.userId,
-              email: "",
+              id: userData.user.id,
+              email: userData.user.email || "",
             },
+            selectedKey: activeKey,
           });
+          onStatusChange?.("ready");
+        } else {
+          setState({ status: "needs_auth" });
+          onStatusChange?.("needs_auth");
         }
-
-        onStatusChange?.("ready");
-      } else {
-        setState({ status: "needs_auth" });
-        onStatusChange?.("needs_auth");
       }
     } catch (error) {
       console.error("[LBProvider] Session check failed:", error);
       setState({ status: "needs_auth" });
       onStatusChange?.("needs_auth");
     }
-  }, [proxyUrl, onStatusChange]);
+  }, [lbClient, onStatusChange]);
 
   useEffect(() => {
     checkSession();
@@ -174,31 +188,8 @@ export function LBProvider({
   const fetchApiKeys = useCallback(
     async (token: string): Promise<LBApiKey[]> => {
       try {
-        console.log(
-          "[LBProvider] Fetching API keys with token:",
-          token.substring(0, 20) + "..."
-        );
-
-        const response = await fetch(`${proxyUrl}/public/user/api-keys`, {
-          headers: {
-            Authorization: `Bearer ${token}`,
-            "Content-Type": "application/json",
-          },
-          credentials: "include",
-        });
-
-        console.log("[LBProvider] API keys response status:", response.status);
-
-        if (!response.ok) {
-          const errorData = await response.json().catch(() => ({}));
-          console.error("[LBProvider] Failed to fetch API keys:", errorData);
-          throw new Error(errorData.message || "Failed to fetch API keys");
-        }
-
-        const data = await response.json();
-        console.log("[LBProvider] API keys received:", data);
-
-        const keys: LBApiKey[] = data.apiKeys || data;
+        const data = await lbClient.getUser(token);
+        const keys: LBApiKey[] = data.apiKeys || [];
         setApiKeys(keys);
         return keys;
       } catch (error) {
@@ -206,7 +197,7 @@ export function LBProvider({
         throw error;
       }
     },
-    [proxyUrl]
+    [lbClient]
   );
 
   /**
@@ -217,26 +208,10 @@ export function LBProvider({
       try {
         console.log("[LBProvider] Selecting API key:", apiKeyId);
         setState((prev: LBAuthState) => ({ ...prev, status: "loading" }));
-
-        const response = await fetch(`${proxyUrl}/auth/session`, {
-          method: "POST",
-          headers: {
-            "Content-Type": "application/json",
-            Authorization: `Bearer ${token}`,
-          },
-          body: JSON.stringify({ api_key_id: apiKeyId }),
-          credentials: "include",
-        });
-
-        console.log("[LBProvider] Session response status:", response.status);
-
-        if (!response.ok) {
-          const errorData = await response.json().catch(() => ({}));
-          console.error("[LBProvider] Failed to create session:", errorData);
-          throw new Error(errorData.message || "Failed to create session");
-        }
-
-        const sessionResult: LBSessionResult = await response.json();
+        const sessionResult: LBSessionResult = await lbClient.selectApiKey(
+          apiKeyId,
+          token
+        );
         console.log(
           "[LBProvider] Session created successfully:",
           sessionResult
@@ -268,7 +243,7 @@ export function LBProvider({
         throw error;
       }
     },
-    [proxyUrl, state.user, onStatusChange, onAuthChange]
+    [lbClient, state.user, onStatusChange, onAuthChange]
   );
 
   /**
@@ -289,27 +264,7 @@ export function LBProvider({
         console.log("[LBProvider] Login attempt:", email);
         setState((prev: LBAuthState) => ({ ...prev, status: "loading" }));
 
-        const response = await fetch(`${proxyUrl}/auth/login`, {
-          method: "POST",
-          headers: { "Content-Type": "application/json" },
-          body: JSON.stringify({ email, password }),
-          credentials: "include",
-        });
-
-        console.log("[LBProvider] Login response status:", response.status);
-
-        if (!response.ok) {
-          const error = await response.json();
-          const errorMessage = error.message || "Login failed";
-          console.error("[LBProvider] Login failed:", errorMessage);
-          setState({
-            status: "needs_auth",
-            error: errorMessage,
-          });
-          return { success: false, error: errorMessage };
-        }
-
-        const result: LBLoginResult = await response.json();
+        const result: LBLoginResult = await lbClient.login(email, password);
         console.log("[LBProvider] Login successful:", result.user?.email);
         console.log(
           "[LBProvider] Access token received:",
@@ -403,7 +358,7 @@ export function LBProvider({
         return { success: false, error: message };
       }
     },
-    [proxyUrl, fetchApiKeys, selectApiKey]
+    [lbClient, fetchApiKeys, selectApiKey]
   );
 
   /**
@@ -418,30 +373,50 @@ export function LBProvider({
 
     setIsLoadingStatus(true);
     try {
-      const response = await fetch(`${proxyUrl}/auth/status?fast=true`, {
-        credentials: "include",
-      });
-
-      if (response.ok) {
-        const data = await response.json();
-        setBasicStatus(data);
-
-        // Combiner avec le storage existant si disponible
-        const combinedStatus = {
-          ...data,
-          storage: storageStatus?.storage || data.storage,
+      let data: any;
+      try {
+        data = await lbClient.getStatus();
+      } catch {
+        // Backward compatibility: older backends may not expose /auth/status
+        const userData = await lbClient.getUser();
+        data = {
+          authType: userData.authType,
+          user: userData.user,
+          apiKey: userData.apiKeyActive,
+          api_key: userData.apiKeyActive,
+          balance: {
+            used: 0,
+            total: userData.balance?.sellValueUsd || 0,
+            percentage: 0,
+          },
         };
-        setApiStatus(combinedStatus);
-      } else {
-        setBasicStatus(null);
       }
+      const normalizedStatus = {
+        ...data,
+        authType: data?.authType,
+        user: data?.user,
+        apiKey: data?.apiKey || data?.api_key,
+        api_key: data?.api_key || data?.apiKey,
+        balance: data?.balance || {
+          used: 0,
+          total: 0,
+          percentage: 0,
+        },
+      };
+      setBasicStatus(normalizedStatus);
+
+      const combinedStatus = {
+        ...normalizedStatus,
+        storage: storageStatus?.storage,
+      };
+      setApiStatus(combinedStatus as any);
     } catch (error) {
       console.error("[LBProvider] Failed to fetch basic status:", error);
       setBasicStatus(null);
     } finally {
       setIsLoadingStatus(false);
     }
-  }, [proxyUrl, state.status, storageStatus]);
+  }, [lbClient, state.status, storageStatus]);
 
   /**
    * Récupère le storage - LENT avec cache (5 minutes)
@@ -467,42 +442,17 @@ export function LBProvider({
 
       setIsLoadingStorage(true);
       try {
-        // Essayer l'endpoint spécialisé storage d'abord
-        let response = await fetch(`${proxyUrl}/auth/status/storage`, {
-          credentials: "include",
-        });
+        const data = await lbClient.getStorageStatus();
+        const storageData = data?.storage ? { storage: data.storage } : data;
+        setStorageStatus(storageData);
+        setStorageLastFetch(now);
 
-        // Si 404, faire un fallback vers l'endpoint normal (backward compatibility)
-        if (!response.ok && response.status === 404) {
-          console.log("[LBProvider] Storage endpoint not available, using fallback");
-          response = await fetch(`${proxyUrl}/auth/status`, {
-            credentials: "include",
-          });
-        }
-
-        if (response.ok) {
-          const data = await response.json();
-          
-          // Si c'est la réponse complète (fallback), extraire juste le storage
-          const storageData = data.storage ? { storage: data.storage } : data;
-          
-          setStorageStatus(storageData);
-          setStorageLastFetch(now);
-
-          // Combiner avec le basic status
-          const combinedStatus = {
-            ...basicStatus,
-            storage: storageData.storage,
-          };
-          setApiStatus(combinedStatus);
-        } else {
-          console.warn(
-            "[LBProvider] Failed to fetch storage status:",
-            response.status
-          );
-          // Arrêter les tentatives répétées si échec persistant
-          setStorageLastFetch(now); // Marquer comme essayé pour éviter la boucle
-        }
+        // Combiner avec le basic status
+        const combinedStatus = {
+          ...basicStatus,
+          storage: storageData?.storage,
+        };
+        setApiStatus(combinedStatus);
       } catch (error) {
         console.error("[LBProvider] Failed to fetch storage status:", error);
         // Arrêter les tentatives répétées si erreur persistante
@@ -511,7 +461,7 @@ export function LBProvider({
         setIsLoadingStorage(false);
       }
     },
-    [proxyUrl, state.status, basicStatus, storageLastFetch]
+    [lbClient, state.status, basicStatus, storageLastFetch]
   );
 
   /**
@@ -532,39 +482,41 @@ export function LBProvider({
    */
   const switchApiKey = useCallback(
     async (apiKeyId: string): Promise<void> => {
-      if (state.status === "ready") {
-        // Utiliser la route de switch avec session
-        const response = await fetch(
-          `${proxyUrl}/auth/session/switch-api-key`,
-          {
-            method: "POST",
-            credentials: "include",
-            headers: { "Content-Type": "application/json" },
-            body: JSON.stringify({ api_key_id: apiKeyId }),
+      if (state.status === "ready" || accessToken) {
+        // lb_session / login token flow: persist selection server-side when possible.
+        // api_key flow may legitimately reject this route; we still support local selection
+        // via x-lb-api-key-selected header on subsequent requests.
+        if (accessToken || state.session?.sessionToken) {
+          await lbClient.selectApiKey(apiKeyId, accessToken);
+        } else {
+          try {
+            await lbClient.selectApiKey(apiKeyId, accessToken);
+          } catch (error) {
+            console.warn(
+              "[LBProvider] selectApiKey API call failed, applying local switch only",
+              error
+            );
           }
-        );
-
-        if (!response.ok) {
-          const errorData = await response.json().catch(() => ({}));
-          throw new Error(errorData.error || "Failed to switch API key");
         }
-
-        // Refresh le status après le changement
+        const selectedKey = apiKeys.find((key) => key.id === apiKeyId);
+        if (selectedKey) {
+          setState((prev) => ({
+            ...prev,
+            selectedKey,
+          }));
+        }
         await refreshBasicStatus();
-        // Refresh storage en arrière-plan
         setTimeout(() => refreshStorageStatus(), 100);
-      } else if (accessToken) {
-        // Utiliser la méthode avec access token
-        await selectApiKey(accessToken, apiKeyId);
       } else {
         throw new Error("No valid authentication method available");
       }
     },
     [
       state.status,
-      proxyUrl,
+      state.session?.sessionToken,
       accessToken,
-      selectApiKey,
+      apiKeys,
+      lbClient,
       refreshBasicStatus,
       refreshStorageStatus,
     ]
@@ -575,20 +527,22 @@ export function LBProvider({
    */
   const logout = useCallback(async (): Promise<void> => {
     try {
-      await fetch(`${proxyUrl}/auth/session/logout`, {
-        method: "POST",
-        credentials: "include",
-      });
+      await lbClient.logout();
     } catch (error) {
       console.error("[LBProvider] Logout failed:", error);
     } finally {
       setState({ status: "needs_auth" });
       setApiKeys([]);
       setAccessToken(undefined);
+      // Reset tous les statuts après logout
+      setApiStatus(null);
+      setBasicStatus(null);
+      setStorageStatus(null);
+      setStorageLastFetch(0);
       onStatusChange?.("needs_auth");
       onAuthChange?.(); // Refresh provider after logout
     }
-  }, [proxyUrl, onStatusChange, onAuthChange]);
+  }, [lbClient, onStatusChange, onAuthChange]);
 
   /**
    * Recharge la session
@@ -607,24 +561,13 @@ export function LBProvider({
     }
 
     try {
-      console.log("[LBProvider] Fetching API keys with session...");
-      const response = await fetch(`${proxyUrl}/auth/api-keys`, {
-        credentials: "include",
-      });
-
-      if (response.ok) {
-        const data = await response.json();
-        console.log("[LBProvider] API keys received:", data);
-        setApiKeys(data.apiKeys || []);
-      } else {
-        console.warn("[LBProvider] Failed to fetch API keys:", response.status);
-        setApiKeys([]);
-      }
+      const data = await lbClient.getUser();
+      setApiKeys(data.apiKeys || []);
     } catch (error) {
       console.error("[LBProvider] Failed to fetch API keys:", error);
       setApiKeys([]);
     }
-  }, [proxyUrl, state.status]);
+  }, [lbClient, state.status]);
 
   // Refresh status quand la session devient ready
   useEffect(() => {

package/src/hooks/usePrompts.ts

@@ -59,6 +59,13 @@ export function usePrompts(): UsePromptsReturn {
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState<string | null>(null);
 
+  const isAuthTokenCandidate = (value?: string): boolean => {
+    if (!value) return false;
+    const token = value.trim();
+    if (!token) return false;
+    return token.startsWith("lb_") || token.split(".").length === 3;
+  };
+
   const fetchPrompts = useCallback(
     async (options?: UsePromptsOptions) => {
       try {
@@ -133,7 +140,7 @@ export function usePrompts(): UsePromptsReturn {
 
         const headers: HeadersInit = {};
         // Ajouter l'API key pour les appels publics directs (pas de proxy externe ni auth interne)
-        if (isPublicApi && apiKeyId) {
+        if (isPublicApi && isAuthTokenCandidate(apiKeyId)) {
           headers["Authorization"] = `Bearer ${apiKeyId}`;
         }
 
@@ -179,7 +186,7 @@ export function usePrompts(): UsePromptsReturn {
           : "/api/ai/auth/prompts";
 
         const headers: HeadersInit = { "Content-Type": "application/json" };
-        if (!isExternalProxy && apiKeyId) {
+        if (!isExternalProxy && isAuthTokenCandidate(apiKeyId)) {
           headers["Authorization"] = `Bearer ${apiKeyId}`;
         }
 
@@ -225,7 +232,7 @@ export function usePrompts(): UsePromptsReturn {
               : "/api/ai/auth/prompts";
 
         const headers: HeadersInit = { "Content-Type": "application/json" };
-        if (isPublicApi && apiKeyId) {
+        if (isPublicApi && isAuthTokenCandidate(apiKeyId)) {
           headers["Authorization"] = `Bearer ${apiKeyId}`;
         }
 
@@ -271,7 +278,7 @@ export function usePrompts(): UsePromptsReturn {
               : `/api/ai/auth/prompts?id=${id}`;
 
         const headers: HeadersInit = {};
-        if (isPublicApi && apiKeyId) {
+        if (isPublicApi && isAuthTokenCandidate(apiKeyId)) {
           headers["Authorization"] = `Bearer ${apiKeyId}`;
         }
 

package/src/utils/modelManagement.ts

@@ -7,6 +7,14 @@ export interface ModelToggleOptions {
   baseUrl?: string; // URL de base de l'API
 }
 
+function isAuthTokenCandidate(value?: string): boolean {
+  if (!value) return false;
+  const token = value.trim();
+  if (!token) return false;
+  // Raw API key or JWT access token
+  return token.startsWith("lb_") || token.split(".").length === 3;
+}
+
 /**
  * Active ou désactive un modèle pour l'utilisateur courant
  */
@@ -22,7 +30,7 @@ export async function toggleUserModel(
   };
 
   // Ajouter la clé API si fournie
-  if (apiKey) {
+  if (isAuthTokenCandidate(apiKey)) {
     headers["Authorization"] = `Bearer ${apiKey}`;
   }
 
@@ -77,12 +85,12 @@ export async function getAvailableModels(
   const isPublicApi = baseUrl && baseUrl.includes("/api/public/v1");
 
   const endpoint = isExternalProxy
-    ? `${baseUrl}/ai/models/available` // Proxy routes to public API
+    ? `${baseUrl}/auth/models` // Proxy routes to /api/ai/auth/models
     : isPublicApi
-      ? `${baseUrl}/ai/models/available` // → /api/public/v1/ai/models/available
+      ? `${baseUrl}/gateway-models` // → /api/public/v1/gateway-models
       : baseUrl
-        ? `${baseUrl}/auth/ai-models-available` // → /api/ai/auth/ai-models-available
-        : `/api/ai/auth/ai-models-available`; // fallback
+        ? `${baseUrl}/auth/models` // → /api/ai/auth/models
+        : `/api/ai/auth/models`; // fallback
 
   console.log(
     "[getAvailableModels] isExternalProxy:",
@@ -96,7 +104,7 @@ export async function getAvailableModels(
   const headers: Record<string, string> = {};
 
   // Ajouter la clé API pour les appels publics directs
-  if (isPublicApi && apiKey) {
+  if (isPublicApi && isAuthTokenCandidate(apiKey)) {
     headers["Authorization"] = `Bearer ${apiKey}`;
   }
 
@@ -113,7 +121,16 @@ export async function getAvailableModels(
   }
 
   const data = await response.json();
-  return data.models || [];
+
+  if (Array.isArray(data?.models)) {
+    return data.models;
+  }
+  if (Array.isArray(data?.providers)) {
+    return data.providers.flatMap((provider: any) =>
+      Array.isArray(provider.models) ? provider.models : []
+    );
+  }
+  return [];
 }
 
 /**
@@ -148,7 +165,7 @@ export async function getUserModels(
   const headers: Record<string, string> = {};
 
   // Ajouter la clé API pour tous les types d'appels si disponible
-  if (apiKey) {
+  if (isAuthTokenCandidate(apiKey)) {
     if (isPublicApi) {
       headers["Authorization"] = `Bearer ${apiKey}`;
     } else {