import { useState, useCallback, useEffect, type FormEvent } from 'react'
import { useNostrAuth } from '@/hooks/useNostrAuth'
import { useAuthorPresentation } from '@/hooks/useAuthorPresentation'
import { ArticleField } from './ArticleField'
import { ArticleFormButtons } from './ArticleFormButtons'
import { CreateAccountModal } from './CreateAccountModal'
import { RecoveryStep } from './CreateAccountModalSteps'
import { UnlockAccountModal } from './UnlockAccountModal'
import { ImageUploadField } from './ImageUploadField'
import { PresentationFormHeader } from './PresentationFormHeader'
import { t } from '@/lib/i18n'

interface AuthorPresentationDraft {
  authorName: string
  presentation: string
  contentDescription: string
  mainnetAddress: string
  pictureUrl?: string
}

const ADDRESS_PATTERN = /^(1|3|bc1)[a-zA-Z0-9]{25,62}$/

function SuccessNotice() {
  return (
    <div className="border border-neon-green/50 rounded-lg p-6 bg-neon-green/10">
      <h3 className="text-lg font-semibold text-neon-green mb-2">{t('presentation.success')}</h3>
      <p className="text-cyber-accent">
        {t('presentation.successMessage')}
      </p>
    </div>
  )
}

function ValidationError({ message }: { message: string | null }) {
  if (!message) {
    return null
  }
  return (
    <div className="bg-red-500/10 border border-red-500/50 rounded-lg p-3">
      <p className="text-sm text-red-400">{message}</p>
    </div>
  )
}

function PresentationField({
  draft,
  onChange,
}: {
  draft: AuthorPresentationDraft
  onChange: (next: AuthorPresentationDraft) => void
}) {
  return (
    <ArticleField
      id="presentation"
      label={t('presentation.field.presentation')}
      value={draft.presentation}
      onChange={(value) => onChange({ ...draft, presentation: value as string })}
      required
      type="textarea"
      rows={6}
      placeholder={t('presentation.field.presentation.placeholder')}
      helpText={t('presentation.field.presentation.help')}
    />
  )
}

function ContentDescriptionField({
  draft,
  onChange,
}: {
  draft: AuthorPresentationDraft
  onChange: (next: AuthorPresentationDraft) => void
}) {
  return (
    <ArticleField
      id="contentDescription"
      label={t('presentation.field.contentDescription')}
      value={draft.contentDescription}
      onChange={(value) => onChange({ ...draft, contentDescription: value as string })}
      required
      type="textarea"
      rows={6}
      placeholder={t('presentation.field.contentDescription.placeholder')}
      helpText={t('presentation.field.contentDescription.help')}
    />
  )
}

function MainnetAddressField({
  draft,
  onChange,
}: {
  draft: AuthorPresentationDraft
  onChange: (next: AuthorPresentationDraft) => void
}) {
  return (
    <ArticleField
      id="mainnetAddress"
      label={t('presentation.field.mainnetAddress')}
      value={draft.mainnetAddress}
      onChange={(value) => onChange({ ...draft, mainnetAddress: value as string })}
      required
      type="text"
      placeholder={t('presentation.field.mainnetAddress.placeholder')}
      helpText={t('presentation.field.mainnetAddress.help')}
    />
  )
}

function AuthorNameField({
  draft,
  onChange,
}: {
  draft: AuthorPresentationDraft
  onChange: (next: AuthorPresentationDraft) => void
}) {
  return (
    <ArticleField
      id="authorName"
      label={t('presentation.field.authorName')}
      value={draft.authorName}
      onChange={(value) => onChange({ ...draft, authorName: value as string })}
      required
      type="text"
      placeholder={t('presentation.field.authorName.placeholder')}
      helpText={t('presentation.field.authorName.help')}
    />
  )
}

function PictureField({
  draft,
  onChange,
}: {
  draft: AuthorPresentationDraft
  onChange: (next: AuthorPresentationDraft) => void
}) {
  return (
    <ImageUploadField
      id="picture"
      value={draft.pictureUrl}
      onChange={(url) => onChange({ ...draft, pictureUrl: url })}
    />
  )
}

const PresentationFields = ({
  draft,
  onChange,
}: {
  draft: AuthorPresentationDraft
  onChange: (next: AuthorPresentationDraft) => void
}) => (
  <div className="space-y-4">
    <AuthorNameField draft={draft} onChange={onChange} />
    <PictureField draft={draft} onChange={onChange} />
    <PresentationField draft={draft} onChange={onChange} />
    <ContentDescriptionField draft={draft} onChange={onChange} />
    <MainnetAddressField draft={draft} onChange={onChange} />
  </div>
)

function PresentationForm({
  draft,
  setDraft,
  validationError,
  error,
  loading,
  handleSubmit,
  userName,
}: {
  draft: AuthorPresentationDraft
  setDraft: (next: AuthorPresentationDraft) => void
  validationError: string | null
  error: string | null
  loading: boolean
  handleSubmit: (e: FormEvent<HTMLFormElement>) => Promise<void>
  userName: string
}) {
  return (
    <form
      onSubmit={(e: FormEvent<HTMLFormElement>) => {
        void handleSubmit(e)
      }}
      className="border border-neon-cyan/20 rounded-lg p-6 bg-cyber-dark space-y-4"
    >
      <PresentationFormHeader userName={userName} />
      <PresentationFields draft={draft} onChange={setDraft} />
      <ValidationError message={validationError ?? error} />
      <ArticleFormButtons loading={loading} />
    </form>
  )
}

function useAuthorPresentationState(pubkey: string | null, existingAuthorName?: string) {
  const { loading, error, success, publishPresentation } = useAuthorPresentation(pubkey)
  const [draft, setDraft] = useState<AuthorPresentationDraft>({
    authorName: existingAuthorName ?? '',
    presentation: '',
    contentDescription: '',
    mainnetAddress: '',
  })
  const [validationError, setValidationError] = useState<string | null>(null)

  // Update authorName when profile changes
  useEffect(() => {
    if (existingAuthorName && existingAuthorName !== draft.authorName) {
      setDraft((prev) => ({ ...prev, authorName: existingAuthorName }))
    }
  }, [existingAuthorName])

  const handleSubmit = useCallback(
    async (e: FormEvent<HTMLFormElement>) => {
      e.preventDefault()
      const address = draft.mainnetAddress.trim()
      if (!ADDRESS_PATTERN.test(address)) {
        setValidationError(t('presentation.validation.invalidAddress'))
        return
      }
      if (!draft.authorName.trim()) {
        setValidationError('Author name is required')
        return
      }
      setValidationError(null)
      await publishPresentation(draft)
    },
    [draft, publishPresentation]
  )

  return { loading, error, success, draft, setDraft, validationError, handleSubmit }
}

function NoAccountActionButtons({
  onGenerate,
  onImport,
}: {
  onGenerate: () => void
  onImport: () => void
}) {
  return (
    <div className="flex flex-col gap-3 w-full max-w-xs">
      <button
        onClick={onGenerate}
        className="px-6 py-2 bg-neon-cyan/20 hover:bg-neon-cyan/30 text-neon-cyan rounded-lg font-medium transition-all border border-neon-cyan/50 hover:shadow-glow-cyan"
      >
        Générer un nouveau compte
      </button>
      <button
        onClick={onImport}
        className="px-6 py-2 bg-gray-100 hover:bg-gray-200 text-gray-700 rounded-lg font-medium transition-colors"
      >
        Importer une clé existante
      </button>
    </div>
  )
}

function NoAccountView() {
  const [showImportModal, setShowImportModal] = useState(false)
  const [showRecoveryStep, setShowRecoveryStep] = useState(false)
  const [showUnlockModal, setShowUnlockModal] = useState(false)
  const [recoveryPhrase, setRecoveryPhrase] = useState<string[]>([])
  const [npub, setNpub] = useState('')
  const [generating, setGenerating] = useState(false)
  const [error, setError] = useState<string | null>(null)

  const handleGenerate = async () => {
    setGenerating(true)
    setError(null)
    try {
      const { nostrAuthService } = await import('@/lib/nostrAuth')
      const result = await nostrAuthService.createAccount()
      setRecoveryPhrase(result.recoveryPhrase)
      setNpub(result.npub)
      setShowRecoveryStep(true)
    } catch (e) {
      setError(e instanceof Error ? e.message : 'Failed to create account')
    } finally {
      setGenerating(false)
    }
  }

  const handleRecoveryContinue = () => {
    setShowRecoveryStep(false)
    setShowUnlockModal(true)
  }

  const handleUnlockSuccess = () => {
    setShowUnlockModal(false)
    setRecoveryPhrase([])
    setNpub('')
  }

  return (
    <div className="border border-neon-cyan/20 rounded-lg p-6 bg-cyber-dark/50">
      <div className="flex flex-col items-center gap-4">
        <p className="text-center text-cyber-accent mb-2">
          Créez un compte ou importez votre clé secrète pour commencer
        </p>
        {error && <p className="text-sm text-red-400">{error}</p>}
        <NoAccountActionButtons
          onGenerate={handleGenerate}
          onImport={() => setShowImportModal(true)}
        />
        {generating && (
          <p className="text-cyber-accent text-sm">Génération du compte...</p>
        )}
        {showImportModal && (
          <CreateAccountModal
            onSuccess={() => {
              setShowImportModal(false)
              setShowUnlockModal(true)
            }}
            onClose={() => setShowImportModal(false)}
            initialStep="import"
          />
        )}
        {showRecoveryStep && (
          <RecoveryStep
            recoveryPhrase={recoveryPhrase}
            npub={npub}
            onContinue={handleRecoveryContinue}
          />
        )}
        {showUnlockModal && (
          <UnlockAccountModal
            onSuccess={handleUnlockSuccess}
            onClose={() => setShowUnlockModal(false)}
          />
        )}
      </div>
    </div>
  )
}

function AuthorPresentationFormView({
  pubkey,
  profile,
}: {
  pubkey: string | null
  profile: { name?: string; pubkey: string } | null
}) {
  const state = useAuthorPresentationState(pubkey, profile?.name)

  if (!pubkey) {
    return <NoAccountView />
  }
  if (state.success) {
    return <SuccessNotice />
  }

  // Get user name or fallback to shortened pubkey
  const userName = profile?.name ?? (pubkey ? `${pubkey.substring(0, 16)}...` : t('presentation.fallback.user'))

  return (
    <PresentationForm
      draft={state.draft}
      setDraft={state.setDraft}
      validationError={state.validationError}
      error={state.error}
      loading={state.loading}
      handleSubmit={state.handleSubmit}
      userName={userName}
    />
  )
}

function useAutoLoadPubkey(accountExists: boolean | null, pubkey: string | null, connect: () => Promise<void>) {
  useEffect(() => {
    if (accountExists === true && !pubkey) {
      void connect()
    }
  }, [accountExists, pubkey, connect])
}

export function AuthorPresentationEditor() {
  const { pubkey, profile, accountExists, connect } = useNostrAuth()
  useAutoLoadPubkey(accountExists, pubkey ?? null, connect)
  return <AuthorPresentationFormView pubkey={pubkey ?? null} profile={profile} />
}