suparisma 1.0.4 → 1.0.5

package/README.md

@@ -21,6 +21,8 @@ A powerful, typesafe React hook generator for Supabase, driven by your Prisma sc
   - [Basic CRUD Operations](#basic-crud-operations)
   - [Realtime Updates](#realtime-updates)
   - [Filtering Data](#filtering-data)
+  - [⚠️ IMPORTANT: Using Dynamic Filters with React](#️-important-using-dynamic-filters-with-react)
+  - [Array Filtering](#array-filtering)
   - [Sorting Data](#sorting-data)
   - [Pagination](#pagination)
   - [Search Functionality](#search-functionality)
@@ -58,7 +60,7 @@ Suparisma bridges this gap by:
 - 🚀 **Auto-generated React hooks** based on your Prisma schema
 - 🔄 **Real-time updates by default** for all tables (with opt-out capability)
 - 🔒 **Type-safe interfaces** for all database operations
-- 🔍 **Full-text search** with configurable annotations
+- 🔍 **Full-text search** with configurable annotations *(currently under maintenance)*
 - 🔢 **Pagination and sorting** built into every hook
 - 🧩 **Prisma-like API** that feels familiar if you already use Prisma
 - 📱 **Works with any React framework** including Next.js, Remix, etc.
@@ -303,6 +305,83 @@ const { data } = useSuparisma.thing({
 });
 ```
 
+### ⚠️ IMPORTANT: Using Dynamic Filters with React
+
+**You MUST use `useMemo` for dynamic where filters to prevent constant re-subscriptions!**
+
+When creating `where` filters based on state variables, React will create a new object reference on every render, causing the realtime subscription to restart constantly and **breaking realtime updates**.
+
+❌ **WRONG - This breaks realtime:**
+```tsx
+function MyComponent() {
+  const [filter, setFilter] = useState("active");
+  
+  const { data } = useSuparisma.thing({
+    where: filter ? { status: filter } : undefined // ❌ New object every render!
+  });
+}
+```
+
+✅ **CORRECT - Use useMemo:**
+```tsx
+import { useMemo } from 'react';
+
+function MyComponent() {
+  const [filter, setFilter] = useState("active");
+  const [arrayFilter, setArrayFilter] = useState(["item1"]);
+  
+  // Create stable object reference that only changes when dependencies change
+  const whereFilter = useMemo(() => {
+    if (filter) {
+      return { status: filter };
+    }
+    return undefined;
+  }, [filter]); // Only recreate when filter actually changes
+  
+  const { data } = useSuparisma.thing({
+    where: whereFilter // ✅ Stable reference!
+  });
+}
+```
+
+✅ **Complex example with multiple filters:**
+```tsx
+const whereFilter = useMemo(() => {
+  if (arrayFilterValue && arrayOperator) {
+    return {
+      tags: arrayOperator === 'has' 
+        ? { has: [arrayFilterValue] }
+        : arrayOperator === 'hasEvery'
+        ? { hasEvery: ["required", "tag", arrayFilterValue] }
+        : { isEmpty: false }
+    };
+  } else if (statusFilter) {
+    return { status: statusFilter };
+  }
+  return undefined;
+}, [arrayFilterValue, arrayOperator, statusFilter]); // Dependencies
+
+const { data } = useSuparisma.thing({ where: whereFilter });
+```
+
+**Why this matters:**
+- Without `useMemo`, the subscription restarts on EVERY render
+- This causes realtime events to be lost during reconnection
+- You'll see constant "Unsubscribing/Subscribing" messages in the console
+- Realtime updates will appear to be broken
+
+**The same applies to `orderBy` if it's dynamic:**
+```tsx
+const orderByConfig = useMemo(() => ({
+  [sortField]: sortDirection
+}), [sortField, sortDirection]);
+
+const { data } = useSuparisma.thing({ 
+  where: whereFilter,
+  orderBy: orderByConfig
+});
+```
+
 ### Array Filtering
 
 Suparisma provides powerful operators for filtering array fields (e.g., `String[]`, `Int[]`, etc.):
@@ -543,6 +622,8 @@ const { data, count } = useSuparisma.thing();
 
 ### Search Functionality
 
+> ⚠️ **MAINTENANCE NOTICE**: Search functionality is currently under maintenance and may not work as expected. We're working on improvements and will update the documentation once it's fully operational.
+
 For fields annotated with `// @enableSearch`, you can use full-text search:
 
 ```tsx

package/dist/generators/coreGenerator.js

@@ -912,24 +912,52 @@ export function createSuparismaHook<
       
       const channelId = channelName || \`changes_to_\${tableName}_\${Math.random().toString(36).substring(2, 15)}\`;
       
-      // Use a dynamic filter string builder inside the event handler or rely on Supabase
-      // For the subscription filter, we must use the initial computedFilter or a stable one.
-      // However, for client-side logic (sorting, adding/removing from list), we use refs.
-      const initialComputedFilter = where ? buildFilterString(where) : realtimeFilter;
-      console.log(\`Setting up subscription for \${tableName} with initial filter: \${initialComputedFilter}\`);
+      // Check if we have complex array filters that should be handled client-side only
+      let hasComplexArrayFilters = false;
+      if (where) {
+        for (const [key, value] of Object.entries(where)) {
+          if (typeof value === 'object' && value !== null) {
+            const advancedOps = value as any;
+            // Check for complex array operators
+            if ('has' in advancedOps || 'hasEvery' in advancedOps || 'hasSome' in advancedOps || 'isEmpty' in advancedOps) {
+              hasComplexArrayFilters = true;
+              break;
+            }
+          }
+        }
+      }
+      
+      // For complex array filters, use no database filter and rely on client-side filtering
+      // For simple filters, use database-level filtering
+      let subscriptionConfig: any = {
+        event: '*',
+        schema: 'public',
+        table: tableName,
+      };
+      
+      if (hasComplexArrayFilters) {
+        // Don't include filter at all for complex array operations
+        console.log(\`Setting up subscription for \${tableName} with NO FILTER (complex array filters detected) - will receive ALL events\`);
+      } else if (where) {
+        // Include filter for simple operations
+        const filter = buildFilterString(where);
+        if (filter) {
+          subscriptionConfig.filter = filter;
+        }
+        console.log(\`Setting up subscription for \${tableName} with database filter: \${filter}\`);
+      } else if (realtimeFilter) {
+        // Use custom realtime filter if provided
+        subscriptionConfig.filter = realtimeFilter;
+        console.log(\`Setting up subscription for \${tableName} with custom filter: \${realtimeFilter}\`);
+      }
       
       const channel = supabase
         .channel(channelId)
         .on(
           'postgres_changes',
-          {
-            event: '*',
-            schema: 'public',
-            table: tableName,
-            filter: initialComputedFilter, // Subscription filter uses initial state
-          },
+          subscriptionConfig,
           (payload) => {
-            console.log(\`Received \${payload.eventType} event for \${tableName}\`, payload);
+            console.log(\`🔥 REALTIME EVENT RECEIVED for \${tableName}:\`, payload.eventType, payload);
             
             // Access current options via refs inside the event handler
             const currentWhere = whereRef.current;
@@ -938,7 +966,10 @@ export function createSuparismaHook<
             const currentOffset = offsetRef.current; // Not directly used in handlers but good for consistency
 
             // Skip realtime updates when search is active
-            if (isSearchingRef.current) return;
+            if (isSearchingRef.current) {
+              console.log('⏭️ Skipping realtime update - search is active');
+              return;
+            }
             
             if (payload.eventType === 'INSERT') {
               // Process insert event
@@ -947,14 +978,46 @@ export function createSuparismaHook<
                   const newRecord = payload.new as TWithRelations;
                   console.log(\`Processing INSERT for \${tableName}\`, { newRecord });
                   
-                  // Check if this record matches our filter if we have one
+                  // ALWAYS check if this record matches our filter client-side
+                  // This is especially important for complex array filters
                   if (currentWhere) { // Use ref value
                     let matchesFilter = true;
                     
-                    // Check each filter condition
+                    // Check each filter condition client-side for complex filters
                     for (const [key, value] of Object.entries(currentWhere)) {
                       if (typeof value === 'object' && value !== null) {
-                        // Complex filter - this is handled by Supabase, assume it matches
+                        // Handle complex array filters client-side
+                        const advancedOps = value as any;
+                        const recordValue = newRecord[key as keyof typeof newRecord] as any;
+                        
+                        // Array-specific operators validation
+                        if ('has' in advancedOps && advancedOps.has !== undefined) {
+                          // Array contains ANY of the specified items
+                          if (!Array.isArray(recordValue) || !advancedOps.has.some((item: any) => recordValue.includes(item))) {
+                            matchesFilter = false;
+                            break;
+                          }
+                        } else if ('hasEvery' in advancedOps && advancedOps.hasEvery !== undefined) {
+                          // Array contains ALL of the specified items
+                          if (!Array.isArray(recordValue) || !advancedOps.hasEvery.every((item: any) => recordValue.includes(item))) {
+                            matchesFilter = false;
+                            break;
+                          }
+                        } else if ('hasSome' in advancedOps && advancedOps.hasSome !== undefined) {
+                          // Array contains ANY of the specified items
+                          if (!Array.isArray(recordValue) || !advancedOps.hasSome.some((item: any) => recordValue.includes(item))) {
+                            matchesFilter = false;
+                            break;
+                          }
+                        } else if ('isEmpty' in advancedOps && advancedOps.isEmpty !== undefined) {
+                          // Array is empty or not empty
+                          const isEmpty = !Array.isArray(recordValue) || recordValue.length === 0;
+                          if (isEmpty !== advancedOps.isEmpty) {
+                            matchesFilter = false;
+                            break;
+                          }
+                        }
+                        // Add other complex filter validations as needed
                       } else if (newRecord[key as keyof typeof newRecord] !== value) {
                         matchesFilter = false;
                         console.log(\`Filter mismatch on \${key}\`, { expected: value, actual: newRecord[key as keyof typeof newRecord] });
@@ -1035,12 +1098,68 @@ export function createSuparismaHook<
                 // Access current options via refs
                 const currentOrderBy = orderByRef.current; 
                 const currentLimit = limitRef.current; // If needed for re-fetch logic on update
+                const currentWhere = whereRef.current;
 
                 // Skip if search is active
                 if (isSearchingRef.current) {
                   return prev;
                 }
                 
+                const updatedRecord = payload.new as TWithRelations;
+                
+                // Check if the updated record still matches our current filter
+                if (currentWhere) {
+                  let matchesFilter = true;
+                  
+                  for (const [key, value] of Object.entries(currentWhere)) {
+                    if (typeof value === 'object' && value !== null) {
+                      // Handle complex array filters client-side
+                      const advancedOps = value as any;
+                      const recordValue = updatedRecord[key as keyof typeof updatedRecord] as any;
+                      
+                      // Array-specific operators validation
+                      if ('has' in advancedOps && advancedOps.has !== undefined) {
+                        // Array contains ANY of the specified items
+                        if (!Array.isArray(recordValue) || !advancedOps.has.some((item: any) => recordValue.includes(item))) {
+                          matchesFilter = false;
+                          break;
+                        }
+                      } else if ('hasEvery' in advancedOps && advancedOps.hasEvery !== undefined) {
+                        // Array contains ALL of the specified items
+                        if (!Array.isArray(recordValue) || !advancedOps.hasEvery.every((item: any) => recordValue.includes(item))) {
+                          matchesFilter = false;
+                          break;
+                        }
+                      } else if ('hasSome' in advancedOps && advancedOps.hasSome !== undefined) {
+                        // Array contains ANY of the specified items
+                        if (!Array.isArray(recordValue) || !advancedOps.hasSome.some((item: any) => recordValue.includes(item))) {
+                          matchesFilter = false;
+                          break;
+                        }
+                      } else if ('isEmpty' in advancedOps && advancedOps.isEmpty !== undefined) {
+                        // Array is empty or not empty
+                        const isEmpty = !Array.isArray(recordValue) || recordValue.length === 0;
+                        if (isEmpty !== advancedOps.isEmpty) {
+                          matchesFilter = false;
+                          break;
+                        }
+                      }
+                    } else if (updatedRecord[key as keyof typeof updatedRecord] !== value) {
+                      matchesFilter = false;
+                      break;
+                    }
+                  }
+                  
+                  // If the updated record doesn't match the filter, remove it from the list
+                  if (!matchesFilter) {
+                    console.log('Updated record no longer matches filter, removing from list');
+                    return prev.filter((item) =>
+                      // @ts-ignore: Supabase typing issue
+                      !('id' in item && 'id' in updatedRecord && item.id === updatedRecord.id)
+                    );
+                  }
+                }
+                
                 const newData = prev.map((item) =>
                   // @ts-ignore: Supabase typing issue
                   'id' in item && 'id' in payload.new && item.id === payload.new.id 
@@ -1092,7 +1211,10 @@ export function createSuparismaHook<
               });
             } else if (payload.eventType === 'DELETE') {
               // Process delete event
+              console.log('🗑️ Processing DELETE event for', tableName);
               setData((prev) => {
+                console.log('🗑️ DELETE: Current data before deletion:', prev.length, 'items');
+                
                 // Access current options via refs
                 const currentWhere = whereRef.current;
                 const currentOrderBy = orderByRef.current;
@@ -1101,6 +1223,7 @@ export function createSuparismaHook<
 
                 // Skip if search is active
                 if (isSearchingRef.current) {
+                  console.log('⏭️ DELETE: Skipping - search is active');
                   return prev;
                 }
                 
@@ -1110,15 +1233,21 @@ export function createSuparismaHook<
                 // Filter out the deleted item
                 const filteredData = prev.filter((item) => {
                   // @ts-ignore: Supabase typing issue
-                  return !('id' in item && 'id' in payload.old && item.id === payload.old.id);
+                  const shouldKeep = !('id' in item && 'id' in payload.old && item.id === payload.old.id);
+                  if (!shouldKeep) {
+                    console.log('🗑️ DELETE: Removing item with ID:', item.id);
+                  }
+                  return shouldKeep;
                 });
                 
+                console.log('🗑️ DELETE: Data after deletion:', filteredData.length, 'items (was', currentSize, ')');
+                
                 // Fetch the updated count after the data changes
                 setTimeout(() => fetchTotalCount(), 0);
                 
                 // If we need to maintain the size with a limit
                 if (currentLimit && currentLimit > 0 && filteredData.length < currentSize && currentSize === currentLimit) { // Use ref value
-                  console.log(\`Record deleted with limit \${currentLimit}, will fetch additional record to maintain size\`);
+                  console.log(\`🗑️ DELETE: Record deleted with limit \${currentLimit}, will fetch additional record to maintain size\`);
                   
                   // Use setTimeout to ensure this state update completes first
                   setTimeout(() => {
@@ -1195,7 +1324,7 @@ export function createSuparismaHook<
           searchTimeoutRef.current = null;
         }
       };
-    }, [realtime, channelName, tableName, initialLoadRef]); // Removed where, orderBy, limit, offset from deps
+    }, [realtime, channelName, tableName, where, initialLoadRef]); // Added 'where' back so subscription updates when filter changes
 
     // Create a memoized options object to prevent unnecessary re-renders
     const optionsRef = useRef({ where, orderBy, limit, offset });

package/dist/parser.js

@@ -12,6 +12,16 @@ function parsePrismaSchema(schemaPath) {
     const schema = fs_1.default.readFileSync(schemaPath, 'utf-8');
     const modelRegex = /model\s+(\w+)\s+{([^}]*)}/gs;
     const models = [];
+    // Extract enum names from the schema
+    const enumRegex = /enum\s+(\w+)\s+{[^}]*}/gs;
+    const enumNames = [];
+    let enumMatch;
+    while ((enumMatch = enumRegex.exec(schema)) !== null) {
+        const enumName = enumMatch[1];
+        if (enumName) {
+            enumNames.push(enumName);
+        }
+    }
     let match;
     while ((match = modelRegex.exec(schema)) !== null) {
         const modelName = match[1] || '';
@@ -45,7 +55,7 @@ function parsePrismaSchema(schemaPath) {
                 continue;
             }
             // Parse field definition - Updated to handle array types
-            const fieldMatch = line.match(/\s*(\w+)\s+(\w+)(\[\])?\??(\?)?\s*(?:@[^)]+)?/);
+            const fieldMatch = line.match(/\s*(\w+)\s+(\w+)(\[\])?(\?)?\s*(?:@[^)]+)?/);
             if (fieldMatch) {
                 const fieldName = fieldMatch[1];
                 const baseFieldType = fieldMatch[2]; // e.g., "String" from "String[]"
@@ -67,9 +77,13 @@ function parsePrismaSchema(schemaPath) {
                         defaultValue = defaultMatch[1];
                     }
                 }
+                // Improved relation detection
+                const primitiveTypes = ['String', 'Int', 'Float', 'Boolean', 'DateTime', 'Json', 'Bytes', 'Decimal', 'BigInt'];
                 const isRelation = line.includes('@relation') ||
                     (!!fieldName &&
-                        (fieldName.endsWith('_id') || fieldName === 'userId' || fieldName === 'user_id'));
+                        (fieldName.endsWith('_id') || fieldName === 'userId' || fieldName === 'user_id')) ||
+                    // Also detect relation fields by checking if the type is not a primitive type and not an enum
+                    (!!baseFieldType && !primitiveTypes.includes(baseFieldType) && !enumNames.includes(baseFieldType));
                 // Check for inline @enableSearch comment
                 if (line.includes('// @enableSearch')) {
                     searchFields.push({

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "suparisma",
-	"version": "1.0.4",
+	"version": "1.0.5",
 	"description": "Opinionated typesafe React realtime CRUD hooks generator for all your Supabase tables, powered by Prisma.",
 	"main": "dist/index.js",
 	"repository": {

package/prisma/schema.prisma

@@ -19,6 +19,14 @@ enum SomeEnum {
   THREE
 }
 
+model User {
+  id        String   @id @default(uuid())
+  name      String
+  email     String   @unique
+  things    Thing[]  // One-to-many relation
+  createdAt DateTime @default(now())
+  updatedAt DateTime @updatedAt
+}
 
 model Thing {
   id        String   @id @default(uuid())
@@ -27,6 +35,8 @@ model Thing {
   stringArray String[]
   someEnum  SomeEnum @default(ONE)
   someNumber Int?
+  userId    String?
+  user      User?    @relation(fields: [userId], references: [id])
   createdAt DateTime @default(now())
   updatedAt DateTime @updatedAt
 }