import { listPinnedMessages, type PinnedMessage } from '@chat-app/shared/chat';
import { useEffect, useState } from 'react';

import { supabase } from './supabase';

// Live list of pinned messages for one conversation. Subscribes to the
// `pinned_messages` realtime channel for the conv so the header pill +
// side-panel update without a refetch.
export function usePinnedMessages(conversationId: string | undefined): PinnedMessage[] {
  const [pins, setPins] = useState<PinnedMessage[]>([]);

  useEffect(() => {
    if (!conversationId) {
      setPins([]);
      return;
    }
    let cancelled = false;

    void listPinnedMessages(supabase, conversationId).then((rows) => {
      if (!cancelled) setPins(rows);
    });

    const channel = supabase
      .channel('pinned_messages:' + conversationId)
      .on(
        'postgres_changes',
        {
          event: '*',
          schema: 'public',
          table: 'pinned_messages',
          filter: 'conversation_id=eq.' + conversationId,
        },
        () => {
          void listPinnedMessages(supabase, conversationId).then((rows) => {
            if (!cancelled) setPins(rows);
          });
        },
      )
      .subscribe();

    return () => {
      cancelled = true;
      void supabase.removeChannel(channel);
    };
  }, [conversationId]);

  return pins;
}