'use client'

import { useEffect } from 'react'
import { useAuthReady } from '@/lib/api/use-auth-ready'
import { useMailSignatures } from '@/lib/api/hooks/use-mail-signatures'
import { useMailSignaturesStore } from '@/lib/stores/mail-signatures-store'

/** Hydrate signature library from server for compose and settings. */
export function MailSignaturesSync() {
  const { ready, authenticated } = useAuthReady()
  const { data: signatures = [], isSuccess } = useMailSignatures()

  useEffect(() => {
    if (!ready || !authenticated) {
      useMailSignaturesStore.getState().clear()
      return
    }
    if (!isSuccess) return
    useMailSignaturesStore.getState().hydrateFromApi(signatures)
  }, [ready, authenticated, isSuccess, signatures])

  return null
}