GPT

Real-Time Subscriptions

import { useEffect, useState } from 'react' import { supabase } from './supabaseClient' import { RealtimeChannel } from '@supabase/supabase-js' export function useRealtimeSubscription ( table: string, schema = 'public

Prompt text

Original English text. Replace placeholders with your own details.

import { useEffect, useState } from 'react'
import { supabase } from './supabaseClient'
import { RealtimeChannel } from '@supabase/supabase-js'

export function useRealtimeSubscription<T>(
 table: string,
 schema = 'public'
) {
 const [data, setData] = useState<T[]>([])
 const [channel, setChannel] = useState<RealtimeChannel | null>(null)

 useEffect(() => {
 const channel = supabase
 .channel('table_db_changes')
 .on(
 'postgres_changes',
 { event: '*', schema, table },
 (payload) => {
 // Handle different change types
 switch (payload.eventType) {
 case 'INSERT':
 setData(prev => [...prev, payload.new as T])
 break
 case 'UPDATE':
 setData(prev => prev.map(item => 
 item.id === payload.new.id ? payload.new : item
 ))
 break
 case 'DELETE':
 setData(prev => prev.filter(item => item.id !== payload.old.id))
 break
 }
 }
 )
 .subscribe()

 setChannel(channel)

 return () => {
 channel.unsubscribe()
 }
 }, [table, schema])

 return { data }
}

Source & attribution

Instructa AI Prompts · Instructa AI Prompts

Source-listed license: CC-BY-4.0. Prompt text is preserved; titles and previews may be shortened for display. Source examples are not NexGateHub test results.

View original source ↗ · Source credits & licenses

Explore more prompts →