Supabase•3w ago

How to type any type in subscription on callback

export const systemQueueChannel = supabase
  .channel('system-queue-changes')
  .on('postgres_changes', { event: 'INSERT', schema: 'governance', table: 'system_queue' }, (payload) => {
    handleSystemQueueChange(payload)
  })
  .subscribe()

export const systemQueueChannel = supabase
  .channel('system-queue-changes')
  .on('postgres_changes', { event: 'INSERT', schema: 'governance', table: 'system_queue' }, (payload) => {
    handleSystemQueueChange(payload)
  })
  .subscribe()

How do you guys type these payloads? I've cooked something up but I really feel like this should be properly typed. I'm most likely doing something wrong, but no idea what.

7 Replies

OakRatos•3w ago

@whaley Use a custom TypeScript interface for the payload, like payload: SupabaseInsert <'system_queue'>, to ensure proper typing.

inder•3w ago

I assume you've already generated types using supabase cli. If you haven't follow this guide https://supabase.com/docs/guides/api/rest/generating-types. After this, set type for payload like this

import type { RealtimePostgresChangesPayload } from "@supabase/supabase-js";
// Tables type will be present in the generated types and you have to pass in your table name

supabase
        .channel("custom-channel")
        .on(
          "postgres_changes",
          { event: "*", schema: "public", table: "messages" },
          (payload: RealtimePostgresChangesPayload<Tables<"messages">>) => {
            if ("id" in payload.new) {}
          }
        )
        .subscribe();

import type { RealtimePostgresChangesPayload } from "@supabase/supabase-js";
// Tables type will be present in the generated types and you have to pass in your table name

supabase
        .channel("custom-channel")
        .on(
          "postgres_changes",
          { event: "*", schema: "public", table: "messages" },
          (payload: RealtimePostgresChangesPayload<Tables<"messages">>) => {
            if ("id" in payload.new) {}
          }
        )
        .subscribe();

whaleyOP•3w ago

hmm, unfortunately that's not working for me. i have generated the types. however i was able to do this using my drizzle schemas instead:

type SystemQueueRow = typeof systemQueue.$inferSelect
type Payload = RealtimePostgresInsertPayload<SystemQueueRow>

type SystemQueueRow = typeof systemQueue.$inferSelect
type Payload = RealtimePostgresInsertPayload<SystemQueueRow>

However I think I'd like to stay in supabase world for this file rather than dipping into the drizzle types. But maybe it's not so bad..

whaleyOP•3w ago

oh ik why actually, mb, i have multiple schemas in this db, and i need to dip into that first, but i'm not sure if that's possible with supabase types tables seems to only pull in the public schema type info

whaleyOP•3w ago

snippet from supabase type def.. i'll have to stick with drizzle schemas for now -- it might actually be better because i won't have to re-generate types

inder•3w ago

You can pass in a --schema flag when generating types https://supabase.com/docs/reference/cli/supabase-gen-types

Gaming

Programming

How to type any type in subscription on callback

Did you find this page helpful?