Realtime not receiving events

 useEffect(() => {
  const subscription = supabase
    .channel('public:messages')
    .on(
      'postgres_changes',
      {
        event: 'INSERT',
        schema: 'public',
        table: 'messages',
        // filter: 'team_id.eq.' + teamId,
      },
      async (payload: any) => {
        onInsert && onInsert();
      }
    )
    .subscribe((status: string) => {
      console.log('status', status);
      status === 'SUBSCRIBED' && onConnection && onConnection();
    });

  return () => {
    subscription.unsubscribe();
  };
}, [teamId]);

 useEffect(() => {
  const subscription = supabase
    .channel('public:messages')
    .on(
      'postgres_changes',
      {
        event: 'INSERT',
        schema: 'public',
        table: 'messages',
        // filter: 'team_id.eq.' + teamId,
      },
      async (payload: any) => {
        onInsert && onInsert();
      }
    )
    .subscribe((status: string) => {
      console.log('status', status);
      status === 'SUBSCRIBED' && onConnection && onConnection();
    });

  return () => {
    subscription.unsubscribe();
  };
}, [teamId]);