Pass selection options to useRealtme hook

[kachar]

Related to #17

With this update the hook useRealtime accepts both string table name or object { table: string } & UseSelectConfig<Data>

This update is backward compatible so no breaking change is introduced.

Docs are updated with the following example:

import { useRealtime } from 'react-supabase'

function Page() {
  const [result, reexecute] = useRealtime(
    {
      table: 'todos',
      columns: 'id, username, description',
      filter: (query) => query.eq('completed', false),
    },
    (data, payload) => data.username === payload.username,
  )

  return ...
}

[vercel]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/zoo/react-supabase/FMSb3v7TwKf6bt24qbLkNNQpP1Wx
✅ Preview: https://react-supabase-git-fork-kachar-add-realtime-config-arg-zoo.vercel.app

[kachar]

@tmm Any idea why the Size PR check is failing ? It doesn't seem related to the code updates

[tmm]

Can we keep the table as a string and add a new config parameter?

export type UseRealtimeConfig<Data> = {
    select?: Omit<UseSelectConfig<Data>, 'pause'>
}

export function useRealtime<Data = any>(
    table: string,
    config: UseRealtimeConfig<Data>,
    compareFn: UseRealtimeCompareFn<Data> = (a, b) =>
        (<CompareFnDefaultData<Data>>a).id ===
        (<CompareFnDefaultData<Data>>b).id,
): UseRealtimeResponse<Data>

I appreciate wanting to keep things backward compatible, but it's early enough in the project that I'm fine introducing a breaking change for the sake of a better API foundation for the future.

[kachar]

@tmm Code is updated

Indeed this update makes the arguments and the fn api much more explicit and open for extension 🚀