Tweak orbit/supabase setup

Author: RobbieTheWagner

WARP.md

@@ -43,7 +43,7 @@ Swach is a modern color palette manager built as a menubar/system tray Electron
 - **Build Tool**: Vite (via @embroider/vite for fast dev and optimized production)
 - **Desktop**: Electron with Electron Forge (menubar app using `menubar` package)
 - **Data Layer**: Orbit.js (client-side ORM with sync strategies)
-- **Storage**: IndexedDB (local), AWS Cognito + API Gateway (cloud sync)
+- **Storage**: IndexedDB (local), Supabase (auth + remote database)
 - **Color Picker**: Custom Rust binary for cross-platform pixel sampling
 
 ### Ember + Electron Integration
@@ -88,20 +88,26 @@ Swach uses Orbit.js for sophisticated offline-first data management with three s
 **Data Sources** (`app/data-sources/`):
 - `store` - In-memory cache (primary interface, ember-orbit Store)
 - `backup` - IndexedDB persistence (local backup)
-- `remote` - JSON:API remote sync (AWS API Gateway, authenticated users only)
+- `remote` - Supabase backend (authenticated users only)
 
 **Models** (`app/data-models/`):
 - `palette` - Collection of colors with metadata (name, isColorHistory, isFavorite, isLocked, colorOrder array)
 - `color` - Individual color with RGBA values, computed hex/hsl/rgba getters
 
 **Sync Strategies** (`app/data-strategies/`):
-Coordinate data flow between sources. Key strategies:
-- `store-backup-sync` - Persist all store changes to IndexedDB backup
-- `store-beforequery-remote-query` - Query remote before local queries (when authenticated)
-- `store-beforeupdate-remote-update` - Push local updates to remote (when authenticated)
-- `remote-store-sync` - Pull remote changes to store
+Coordinate data flow between sources. Orbit handles ALL data synchronization:
+- `store-backup-sync` - Persist all store changes to IndexedDB backup (blocking)
+- `store-beforequery-remote-query` - Query remote before local queries when authenticated (non-blocking)
+- `store-beforeupdate-remote-update` - Push local updates to remote when authenticated (non-blocking, optimistic UI)
+- `remote-store-sync` - Pull remote changes to store (blocking)
 - Error handling strategies for remote failures
 
+**Sync Behavior**:
+- Initial sync on app startup fetches all palettes/colors from Supabase
+- Local changes are immediately reflected (optimistic UI), then synced to remote in background
+- Pull-based sync before queries ensures fresh data when needed
+- No realtime subscriptions - sync is handled via Orbit's strategies only
+
 **Data Service** (`app/services/data.ts`):
 - Manages coordinator activation and synchronization
 - Ensures single color history palette exists
@@ -139,20 +145,26 @@ Coordinate data flow between sources. Key strategies:
 
 ### Authentication & Cloud Sync
 
-**AWS Cognito** (`ember-cognito` addon):
-- User pools for authentication
-- Identity pools for AWS credentials
-- Config in `config/environment.js` (poolId, clientId, identityPoolId)
+**Supabase**:
+- Authentication via email OTP (passwordless)
+- Remote database (PostgreSQL) for palettes and colors
+- Row-level security ensures users only access their own data
+- Config in `config/environment.js` (supabaseUrl, supabaseAnonKey)
 
 **Session Service** (`app/services/session.ts`):
-- Wraps ember-simple-auth session
-- Provides `isAuthenticated` state
+- Manages authentication state
+- Provides `isAuthenticated` and `userId` properties
+
+**Supabase Service** (`app/services/supabase.ts`):
+- Provides Supabase client instance
+- Used ONLY for auth and as remote API
+- No realtime subscriptions - all sync is handled by Orbit
 
-**Remote Sync**:
+**Remote Sync** (`app/data-sources/remote.ts`):
 - Only activates when user is authenticated
-- JSON:API communication with AWS API Gateway
-- Coordinates palettes and colors bidirectionally
-- Handles conflict resolution (remote preferred for color history palette)
+- Implements Orbit source interface for Supabase backend
+- Transforms between Orbit records and Supabase rows
+- All synchronization coordinated by Orbit strategies, not Supabase realtime
 
 ### Component Structure
 

app/data-models/color.ts

@@ -8,6 +8,7 @@ import type PaletteModel from '../data-models/palette.ts';
 
 export default class ColorModel extends Model {
   @attr('datetime') createdAt!: string;
+  @attr('datetime') updatedAt!: string;
   @attr('string') name!: string;
   @attr('number') r!: number;
   @attr('number') g!: number;

app/data-models/palette.ts

@@ -4,6 +4,7 @@ import type ColorModel from './color.ts';
 
 export default class PaletteModel extends Model {
   @attr('datetime') createdAt!: string;
+  @attr('datetime') updatedAt!: string;
   @attr('number') index!: number;
   @attr('boolean') isColorHistory!: boolean;
   @attr('boolean') isFavorite!: boolean;

app/data-sources/remote.ts

@@ -12,7 +12,7 @@ import type {
   RecordSchema,
   RecordTransformResult,
 } from '@orbit/records';
-import type { RealtimeChannel, SupabaseClient } from '@supabase/supabase-js';
+import type { SupabaseClient } from '@supabase/supabase-js';
 
 import type SessionService from '../services/session.ts';
 import type SupabaseService from '../services/supabase.ts';
@@ -55,7 +55,6 @@ interface SupabaseSourceInjections {
 export class SupabaseSource extends Source {
   private supabaseService: SupabaseService;
   private session: SessionService;
-  private realtimeChannel: RealtimeChannel | null = null;
 
   constructor(injections: SupabaseSourceInjections) {
     super(injections);
@@ -379,15 +378,10 @@ export class SupabaseSource extends Source {
     relatedRecord: RecordIdentity
   ): Promise<void> {
     if (record.type === 'palette' && relationship === 'colors') {
-      // Colors cannot exist without a palette, so delete the color entirely
-      // The database will handle this via ON DELETE CASCADE when the palette is deleted,
-      // but for explicit removal operations, we delete the color record
-      const { error } = await this.supabase
-        .from('colors')
-        .delete()
-        .eq('id', relatedRecord.id);
-
-      if (error) throw new Error(`Supabase delete error: ${error.message}`);
+      // No-op: Color moves between palettes should use replaceRelatedRecord/replaceRelatedRecords
+      // to update the palette_id FK. Deleting here breaks color-move operations that
+      // call removeFromRelatedRecords then addToRelatedRecords.
+      // Colors are only truly deleted via explicit removeRecord operations.
     }
   }
 
@@ -401,6 +395,7 @@ export class SupabaseSource extends Source {
       type: 'palette',
       attributes: {
         createdAt: palette.created_at,
+        updatedAt: palette.updated_at,
         name: palette.name,
         isColorHistory: palette.is_color_history,
         isFavorite: palette.is_favorite,
@@ -424,6 +419,7 @@ export class SupabaseSource extends Source {
       type: 'color',
       attributes: {
         createdAt: color.created_at,
+        updatedAt: color.updated_at,
         name: color.name,
         r: color.r,
         g: color.g,
@@ -489,35 +485,6 @@ export class SupabaseSource extends Source {
   private getTableName(type: string): string {
     return type === 'palette' ? 'palettes' : 'colors';
   }
-
-  // Set up real-time subscriptions
-  setupRealtimeSync(onUpdate: (type: string, payload: unknown) => void): void {
-    if (this.realtimeChannel) {
-      void this.supabase.removeChannel(this.realtimeChannel);
-    }
-
-    this.realtimeChannel = this.supabase
-      .channel('db-changes')
-      .on(
-        'postgres_changes',
-        { event: '*', schema: 'public', table: 'palettes' },
-        (payload) => onUpdate('palette', payload)
-      )
-      .on(
-        'postgres_changes',
-        { event: '*', schema: 'public', table: 'colors' },
-        (payload) => onUpdate('color', payload)
-      )
-      .subscribe();
-  }
-
-  // Tear down real-time subscriptions
-  teardownRealtimeSync(): void {
-    if (this.realtimeChannel) {
-      void this.supabase.removeChannel(this.realtimeChannel);
-      this.realtimeChannel = null;
-    }
-  }
 }
 
 export default {