'use client'

import { useEffect } from 'react'

type SmsOtpCredential = Credential & { code: string }

/**
 * Android Chrome Web OTP API. iOS Safari uses keyboard autofill from
 * `autocomplete="one-time-code"` instead and never exposes OTPCredential.
 */
export function useSmsOtpAutofill(enabled: boolean, challengeKey: number, onCode: (code: string) => void) {
  useEffect(() => {
    if (!enabled || typeof window === 'undefined' || !('OTPCredential' in window)) return

    const abort = new AbortController()

    void navigator.credentials
      .get({
        otp: { transport: ['sms'] },
        signal: abort.signal,
      } as CredentialRequestOptions)
      .then((credential) => {
        const code = (credential as SmsOtpCredential | null)?.code

        if (code) onCode(code)
      })
      .catch(() => {
        // Unsupported, timeout, or user dismissed the prompt.
      })

    return () => {
      abort.abort()
    }
  }, [challengeKey, enabled, onCode])
}