Supabase payload datatype in TypeScript

Question

I am attempting to use supabase on my ReactJS Typescript project but not sure what is the data type of channel payload response and i wish to get the eventType and new data.

 const handleInserts = () => {
    console.log("Change Insert");
    (payload ) => {
      const eventType = payload.eventType
    };
  };

  supabase
    .channel("example")
    .on(
      "postgres_changes",
      { event: "*", schema: "public", table: "example" },
      handleInserts
    )
    .subscribe();

As much as possible i don't want to use type any for this

Answer 1

Your callback subscribed function is wrong and it is not typed.

It should look like this:

type MyType = {
  name: string;
  age: number;
};

const handleInserts = (payload: RealtimePostgresChangesPayload<MyType>) => {
  if (payload.eventType === 'INSERT') {
    // do your stuff
  }
};

Here is a link to a typed playground: