@fluxbase/sdk-react 0.0.1-rc.6 → 0.0.1-rc.60

package/src/use-auth.ts

@@ -2,132 +2,149 @@
  * Authentication hooks for Fluxbase SDK
  */
 
-import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
-import { useFluxbaseClient } from './context'
-import type { SignInCredentials, SignUpCredentials, User, AuthSession } from '@fluxbase/sdk'
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import { useFluxbaseClient } from "./context";
+import type {
+  SignInCredentials,
+  SignUpCredentials,
+  User,
+  AuthSession,
+} from "@fluxbase/sdk";
 
 /**
  * Hook to get the current user
  */
 export function useUser() {
-  const client = useFluxbaseClient()
+  const client = useFluxbaseClient();
 
   return useQuery({
-    queryKey: ['fluxbase', 'auth', 'user'],
+    queryKey: ["fluxbase", "auth", "user"],
     queryFn: async () => {
-      const session = client.auth.getSession()
-      if (!session) {
-        return null
+      const { data } = await client.auth.getSession();
+      if (!data?.session) {
+        return null;
       }
 
       try {
-        return await client.auth.getCurrentUser()
+        const result = await client.auth.getCurrentUser();
+        return result.data?.user ?? null;
       } catch {
-        return null
+        return null;
       }
     },
     staleTime: 1000 * 60 * 5, // 5 minutes
-  })
+  });
 }
 
 /**
  * Hook to get the current session
  */
 export function useSession() {
-  const client = useFluxbaseClient()
+  const client = useFluxbaseClient();
 
   return useQuery<AuthSession | null>({
-    queryKey: ['fluxbase', 'auth', 'session'],
-    queryFn: () => client.auth.getSession(),
+    queryKey: ["fluxbase", "auth", "session"],
+    queryFn: async () => {
+      const { data } = await client.auth.getSession();
+      return data?.session ?? null;
+    },
     staleTime: 1000 * 60 * 5, // 5 minutes
-  })
+  });
 }
 
 /**
  * Hook for signing in
  */
 export function useSignIn() {
-  const client = useFluxbaseClient()
-  const queryClient = useQueryClient()
+  const client = useFluxbaseClient();
+  const queryClient = useQueryClient();
 
   return useMutation({
     mutationFn: async (credentials: SignInCredentials) => {
-      return await client.auth.signIn(credentials)
+      return await client.auth.signIn(credentials);
     },
     onSuccess: (session) => {
-      queryClient.setQueryData(['fluxbase', 'auth', 'session'], session)
+      queryClient.setQueryData(["fluxbase", "auth", "session"], session);
       // Only set user if this is a complete auth session (not 2FA required)
-      if ('user' in session) {
-        queryClient.setQueryData(['fluxbase', 'auth', 'user'], session.user)
+      if ("user" in session) {
+        queryClient.setQueryData(["fluxbase", "auth", "user"], session.user);
       }
     },
-  })
+  });
 }
 
 /**
  * Hook for signing up
  */
 export function useSignUp() {
-  const client = useFluxbaseClient()
-  const queryClient = useQueryClient()
+  const client = useFluxbaseClient();
+  const queryClient = useQueryClient();
 
   return useMutation({
     mutationFn: async (credentials: SignUpCredentials) => {
-      return await client.auth.signUp(credentials)
+      return await client.auth.signUp(credentials);
     },
-    onSuccess: (session) => {
-      queryClient.setQueryData(['fluxbase', 'auth', 'session'], session)
-      queryClient.setQueryData(['fluxbase', 'auth', 'user'], session.user)
+    onSuccess: (response) => {
+      if (response.data) {
+        queryClient.setQueryData(
+          ["fluxbase", "auth", "session"],
+          response.data.session,
+        );
+        queryClient.setQueryData(
+          ["fluxbase", "auth", "user"],
+          response.data.user,
+        );
+      }
     },
-  })
+  });
 }
 
 /**
  * Hook for signing out
  */
 export function useSignOut() {
-  const client = useFluxbaseClient()
-  const queryClient = useQueryClient()
+  const client = useFluxbaseClient();
+  const queryClient = useQueryClient();
 
   return useMutation({
     mutationFn: async () => {
-      await client.auth.signOut()
+      await client.auth.signOut();
     },
     onSuccess: () => {
-      queryClient.setQueryData(['fluxbase', 'auth', 'session'], null)
-      queryClient.setQueryData(['fluxbase', 'auth', 'user'], null)
-      queryClient.invalidateQueries({ queryKey: ['fluxbase'] })
+      queryClient.setQueryData(["fluxbase", "auth", "session"], null);
+      queryClient.setQueryData(["fluxbase", "auth", "user"], null);
+      queryClient.invalidateQueries({ queryKey: ["fluxbase"] });
     },
-  })
+  });
 }
 
 /**
  * Hook for updating the current user
  */
 export function useUpdateUser() {
-  const client = useFluxbaseClient()
-  const queryClient = useQueryClient()
+  const client = useFluxbaseClient();
+  const queryClient = useQueryClient();
 
   return useMutation({
-    mutationFn: async (data: Partial<Pick<User, 'email' | 'metadata'>>) => {
-      return await client.auth.updateUser(data)
+    mutationFn: async (data: Partial<Pick<User, "email" | "metadata">>) => {
+      return await client.auth.updateUser(data);
     },
     onSuccess: (user) => {
-      queryClient.setQueryData(['fluxbase', 'auth', 'user'], user)
+      queryClient.setQueryData(["fluxbase", "auth", "user"], user);
     },
-  })
+  });
 }
 
 /**
  * Combined auth hook with all auth state and methods
  */
 export function useAuth() {
-  const { data: user, isLoading: isLoadingUser } = useUser()
-  const { data: session, isLoading: isLoadingSession } = useSession()
-  const signIn = useSignIn()
-  const signUp = useSignUp()
-  const signOut = useSignOut()
-  const updateUser = useUpdateUser()
+  const { data: user, isLoading: isLoadingUser } = useUser();
+  const { data: session, isLoading: isLoadingSession } = useSession();
+  const signIn = useSignIn();
+  const signUp = useSignUp();
+  const signOut = useSignOut();
+  const updateUser = useUpdateUser();
 
   return {
     user,
@@ -142,5 +159,5 @@ export function useAuth() {
     isSigningUp: signUp.isPending,
     isSigningOut: signOut.isPending,
     isUpdating: updateUser.isPending,
-  }
+  };
 }

package/src/use-realtime.ts

@@ -2,99 +2,113 @@
  * Realtime subscription hooks for Fluxbase SDK
  */
 
-import { useEffect, useRef } from 'react'
-import { useQueryClient } from '@tanstack/react-query'
-import { useFluxbaseClient } from './context'
-import type { RealtimeCallback, RealtimeChangePayload } from '@fluxbase/sdk'
+import { useEffect, useRef } from "react";
+import { useQueryClient } from "@tanstack/react-query";
+import { useFluxbaseClient } from "./context";
+import type {
+  RealtimeCallback,
+  RealtimePostgresChangesPayload,
+} from "@fluxbase/sdk";
 
 export interface UseRealtimeOptions {
   /**
    * The channel name (e.g., 'table:public.products')
    */
-  channel: string
+  channel: string;
 
   /**
    * Event type to listen for ('INSERT', 'UPDATE', 'DELETE', or '*' for all)
    */
-  event?: 'INSERT' | 'UPDATE' | 'DELETE' | '*'
+  event?: "INSERT" | "UPDATE" | "DELETE" | "*";
 
   /**
    * Callback function when an event is received
    */
-  callback?: RealtimeCallback
+  callback?: RealtimeCallback;
 
   /**
    * Whether to automatically invalidate queries for the table
    * Default: true
    */
-  autoInvalidate?: boolean
+  autoInvalidate?: boolean;
 
   /**
    * Custom query key to invalidate (if autoInvalidate is true)
    * Default: ['fluxbase', 'table', tableName]
    */
-  invalidateKey?: unknown[]
+  invalidateKey?: unknown[];
 
   /**
    * Whether the subscription is enabled
    * Default: true
    */
-  enabled?: boolean
+  enabled?: boolean;
 }
 
 /**
  * Hook to subscribe to realtime changes for a channel
  */
 export function useRealtime(options: UseRealtimeOptions) {
-  const client = useFluxbaseClient()
-  const queryClient = useQueryClient()
-  const channelRef = useRef<ReturnType<typeof client.realtime.channel> | null>(null)
+  const client = useFluxbaseClient();
+  const queryClient = useQueryClient();
+  const channelRef = useRef<ReturnType<typeof client.realtime.channel> | null>(
+    null,
+  );
 
   const {
     channel: channelName,
-    event = '*',
+    event = "*",
     callback,
     autoInvalidate = true,
     invalidateKey,
     enabled = true,
-  } = options
+  } = options;
 
   useEffect(() => {
     if (!enabled) {
-      return
+      return;
     }
 
     // Create channel and subscribe
-    const channel = client.realtime.channel(channelName)
-    channelRef.current = channel
+    const channel = client.realtime.channel(channelName);
+    channelRef.current = channel;
 
-    const handleChange = (payload: RealtimeChangePayload) => {
+    const handleChange = (payload: RealtimePostgresChangesPayload) => {
       // Call user callback
       if (callback) {
-        callback(payload)
+        callback(payload);
       }
 
       // Auto-invalidate queries if enabled
       if (autoInvalidate) {
         // Extract table name from channel (e.g., 'table:public.products' -> 'public.products')
-        const tableName = channelName.replace(/^table:/, '')
+        const tableName = channelName.replace(/^table:/, "");
 
-        const key = invalidateKey || ['fluxbase', 'table', tableName]
-        queryClient.invalidateQueries({ queryKey: key })
+        const key = invalidateKey || ["fluxbase", "table", tableName];
+        queryClient.invalidateQueries({ queryKey: key });
       }
-    }
+    };
 
-    channel.on(event, handleChange).subscribe()
+    channel.on(event, handleChange).subscribe();
 
     return () => {
-      channel.unsubscribe()
-      channelRef.current = null
-    }
-  }, [client, channelName, event, callback, autoInvalidate, invalidateKey, queryClient, enabled])
+      channel.unsubscribe();
+      channelRef.current = null;
+    };
+  }, [
+    client,
+    channelName,
+    event,
+    callback,
+    autoInvalidate,
+    invalidateKey,
+    queryClient,
+    enabled,
+  ]);
 
   return {
     channel: channelRef.current,
-  }
+  };
 }
 
 /**
@@ -104,12 +118,12 @@ export function useRealtime(options: UseRealtimeOptions) {
  */
 export function useTableSubscription(
   table: string,
-  options?: Omit<UseRealtimeOptions, 'channel'>
+  options?: Omit<UseRealtimeOptions, "channel">,
 ) {
   return useRealtime({
     ...options,
     channel: `table:${table}`,
-  })
+  });
 }
 
 /**
@@ -117,15 +131,15 @@ export function useTableSubscription(
  */
 export function useTableInserts(
   table: string,
-  callback: (payload: RealtimeChangePayload) => void,
-  options?: Omit<UseRealtimeOptions, 'channel' | 'event' | 'callback'>
+  callback: (payload: RealtimePostgresChangesPayload) => void,
+  options?: Omit<UseRealtimeOptions, "channel" | "event" | "callback">,
 ) {
   return useRealtime({
     ...options,
     channel: `table:${table}`,
-    event: 'INSERT',
+    event: "INSERT",
     callback,
-  })
+  });
 }
 
 /**
@@ -133,15 +147,15 @@ export function useTableInserts(
  */
 export function useTableUpdates(
   table: string,
-  callback: (payload: RealtimeChangePayload) => void,
-  options?: Omit<UseRealtimeOptions, 'channel' | 'event' | 'callback'>
+  callback: (payload: RealtimePostgresChangesPayload) => void,
+  options?: Omit<UseRealtimeOptions, "channel" | "event" | "callback">,
 ) {
   return useRealtime({
     ...options,
     channel: `table:${table}`,
-    event: 'UPDATE',
+    event: "UPDATE",
     callback,
-  })
+  });
 }
 
 /**
@@ -149,13 +163,13 @@ export function useTableUpdates(
  */
 export function useTableDeletes(
   table: string,
-  callback: (payload: RealtimeChangePayload) => void,
-  options?: Omit<UseRealtimeOptions, 'channel' | 'event' | 'callback'>
+  callback: (payload: RealtimePostgresChangesPayload) => void,
+  options?: Omit<UseRealtimeOptions, "channel" | "event" | "callback">,
 ) {
   return useRealtime({
     ...options,
     channel: `table:${table}`,
-    event: 'DELETE',
+    event: "DELETE",
     callback,
-  })
+  });
 }