Using the supabase plugin - ASSIGN doesn't post to supabase but sends PATCH instead. Any idea?

[mianala]

Although fetching and updates are working fine, inserting data doesn't go through to sync.
Here's my code:

export const supabase = createClient<Database>(supabaseUrl!, supabaseAnonKey!, {
  auth: {
    storage: AsyncStorage,
    autoRefreshToken: true,
    persistSession: true,
    detectSessionInUrl: false,
  },
});

// Create a configured sync function
export const customSynced = configureSynced(syncedSupabase, {
  // Use React Native Async Storage
  supabase,
  persist: {
    plugin: observablePersistAsyncStorage({
      AsyncStorage,
    }),
  },
  actions: ['read', 'create', 'update', 'delete'],
  generateId,
  fieldCreatedAt: 'createdAt',
  fieldUpdatedAt: 'updatedAt',
  fieldDeleted: 'deleted',
  changesSince: 'last-sync',
  debounceSet: 1000,
});

export const categories$ = observable(
  customSynced({
    collection: 'categories',
    filter: (query) => query.eq('userId', user$.get()?.id!),
    // Persist data and pending changes locally
    persist: {
      name: 'categories',
    },
  })
);

    onSuccess: ([data]) => {
      categories$[data.id].assign(data);
    },

[mianala]

Tried to overwrite the create function but after testing it looks like the create function isn't called at all whether I use SET or ASSIGN

[mianala]

I'm on 3.0.0-beta.19
"expo": "^52.0.17",

[jmeistrich]

Is it possible to share your repo? These snippets look ok so it may be something else that's causing the problem.

[mianala]

The repo is private so I can't but I can share the whole SupaLegend file. I can provide anything else you need. Thanks you.

import 'react-native-url-polyfill/auto';
import AsyncStorage from '@react-native-async-storage/async-storage';
import { createClient } from '@supabase/supabase-js';
import { AppState } from 'react-native';
import uuid from 'react-native-uuid';
import { observablePersistAsyncStorage } from '@legendapp/state/persist-plugins/async-storage';
import { Database } from '~/types/supabase';
import { syncedSupabase } from '@legendapp/state/sync-plugins/supabase';
import { observable } from '@legendapp/state';
import { configureSynced } from '@legendapp/state/sync';
import { user$ } from '~/stores/data';
import { SelectCategory } from '~/db/schema';

const supabaseUrl = '';
const supabaseAnonKey = '';

// provide a function to generate ids locally
export const generateId = () => uuid.v4();

export const supabase = createClient<Database>(supabaseUrl!, supabaseAnonKey!, {
  auth: {
    storage: AsyncStorage,
    autoRefreshToken: true,
    persistSession: true,
    detectSessionInUrl: false,
  },
});

// Create a configured sync function
export const customSynced = configureSynced(syncedSupabase, {
  // Use React Native Async Storage
  supabase,
  persist: {
    plugin: observablePersistAsyncStorage({
      AsyncStorage,
    }),
  },
  actions: ['read', 'create', 'update', 'delete'],
  generateId,
  fieldCreatedAt: 'createdAt',
  fieldUpdatedAt: 'updatedAt',
  fieldDeleted: 'deleted',
  changesSince: 'last-sync',
  debounceSet: 1000,
});


export const categories$ = observable(
  customSynced({
    collection: 'categories',
    filter: (query) => query.eq('userId', user$.get()?.id!),
    // Persist data and pending changes locally
    persist: {
      name: 'categories',
    },
  })
);

//... other observables

[mianala]

I assign like this:

export const useCategoryMutations = () => {
  const userId = user$.get().id;
  const newCategory = useMutation({
    mutationFn: async ({ name }: { name: string }) => {
      await analytics().logEvent('new_category', {
        name,
      });
      const id = generateId();

      return await db
        .insert(categories)
        .values({
          id,
          name,
          userId: userId!,
        })
        .returning();
    },
    onSuccess: ([data]) => {
      categories$[data.id].assign(data); // set also does not work
    },
  });
...

[mianala]

Solved, it appears that passing createdAt into assign changes it into update