/**
 * FieldsFooter — bottom of the deal form:
 * special-instructions, server error, autosave status + save draft + star toggle,
 * submit, archive button.
 *
 * Extracted from AddDealShell as part of arch spec 06.
 */
'use client';

import { useState } from 'react';
import type { UseFormReturn } from 'react-hook-form';
import { Button } from '@/components/ui/primitives/Button';
import {
  AlertDialog,
  AlertDialogAction,
  AlertDialogCancel,
  AlertDialogContent,
  AlertDialogDescription,
  AlertDialogFooter,
  AlertDialogHeader,
  AlertDialogTitle,
} from '@/components/ui/overlays/AlertDialog';
import { IconButton } from '@/components/ui/primitives/IconButton';
import { Textarea } from '@/components/ui/primitives/Textarea';
import { FormField } from '@/components/ui/primitives/FormField';
import { Icon } from '@/components/ui/icons/Icon';
import { formatTime } from '@/lib/format';
import { useLocale, useT } from '@/lib/i18n/react';
import type { AddDealFormValues } from '../useAddDeal';

export type AutosaveState = 'idle' | 'saving' | 'saved' | 'error';

export interface FieldsFooterProps {
  form: UseFormReturn<AddDealFormValues>;
  serverError: string | null | undefined;
  isVeteran: boolean;
  isEditMode: boolean;
  isSubmitting: boolean;

  /** Autosave + draft UI is only shown when the shell determined autosave is enabled. */
  showAutosave: boolean;
  autosaveState: AutosaveState;
  savedAt: Date | null;
  onSaveDraft: () => void;
  starred: boolean;
  starPending: boolean;
  onToggleStar: () => void;

  /** Archive button shown only on ACTIVE/PAUSED edit-mode deals. */
  showArchive: boolean;
  archivePending: boolean;
  onArchive: () => void;

  /** Submit-for-review button shown only on REJECTED edit-mode deals. */
  showSubmitForReview?: boolean;
  submitPending?: boolean;
  onSubmitForReview?: () => void;
}

export function FieldsFooter({
  form,
  serverError,
  isVeteran,
  isEditMode,
  isSubmitting,
  showAutosave,
  autosaveState,
  savedAt,
  onSaveDraft,
  starred,
  starPending,
  onToggleStar,
  showArchive,
  archivePending,
  onArchive,
  showSubmitForReview,
  submitPending,
  onSubmitForReview,
}: FieldsFooterProps) {
  const t = useT('vendor_add_deal');
  const tDrafts = useT('vendorDrafts');
  const tCommon = useT('common');
  const { locale } = useLocale();
  const { register } = form;
  const [archiveConfirmOpen, setArchiveConfirmOpen] = useState(false);

  return (
    <>
      {/* Special instructions */}
      <FormField htmlFor="deal-instructions" label={t('special_instructions')}>
        <Textarea id="deal-instructions" rows={2} {...register('specialInstructions')} />
      </FormField>

      {/* Server error */}
      {serverError && (
        <div role="alert" data-testid="error-notice" className="text-danger-600 text-sm">
          {serverError}
        </div>
      )}

      {/* Autosave status + draft controls — new-deal flow only. */}
      {showAutosave && (
        <div className="flex items-center justify-between gap-2">
          {autosaveState === 'error' ? (
            <div role="alert" aria-live="assertive" className="caption text-danger-600 text-xs">
              {tDrafts('savingError')}
            </div>
          ) : (
            <span aria-live="polite" className="caption text-text-muted text-xs">
              {autosaveState === 'saving'
                ? tDrafts('savingInProgress')
                : autosaveState === 'saved' && savedAt
                  ? tDrafts('savingSaved').replace('{time}', formatTime(savedAt, locale))
                  : ''}
            </span>
          )}
          <div className="flex items-center gap-2">
            <Button
              type="button"
              variant="ghost"
              size="sm"
              onClick={onSaveDraft}
              disabled={autosaveState === 'saving'}
              data-testid="deal-form-savedraft"
            >
              {tDrafts('saveDraft')}
            </Button>
            <IconButton
              variant="ghost"
              size="sm"
              shape="square"
              aria-label={starred ? tDrafts('unstar') : tDrafts('starToggle')}
              aria-pressed={starred}
              aria-busy={starPending}
              disabled={starPending}
              data-testid="deal-form-star"
              onClick={onToggleStar}
            >
              <Icon name="Bookmark" size="sm" aria-hidden={true} />
            </IconButton>
          </div>
        </div>
      )}

      {/* Submit */}
      <Button
        type="submit"
        variant="primary"
        size="lg"
        loading={isSubmitting}
        className="w-full"
        data-testid="deal-form-submit"
      >
        {isEditMode
          ? t('save_changes')
          : isVeteran
            ? t('submit_publish')
            : t('submit_for_approval')}
      </Button>

      {showSubmitForReview && (
        <Button
          type="button"
          variant="primary"
          size="lg"
          loading={submitPending}
          onClick={onSubmitForReview}
          className="w-full"
          data-testid="deal-form-submit-for-review"
        >
          {t('submit_for_review')}
        </Button>
      )}

      {showArchive && (
        <>
          <Button
            type="button"
            variant="ghost"
            size="md"
            loading={archivePending}
            onClick={() => setArchiveConfirmOpen(true)}
            className="w-full"
            data-testid="deal-form-archive"
          >
            {t('archive_deal')}
          </Button>
          <AlertDialog open={archiveConfirmOpen} onOpenChange={setArchiveConfirmOpen}>
            <AlertDialogContent>
              <AlertDialogHeader>
                <AlertDialogTitle>{t('archive_deal')}</AlertDialogTitle>
                <AlertDialogDescription>{t('archive_confirm')}</AlertDialogDescription>
              </AlertDialogHeader>
              <AlertDialogFooter>
                <AlertDialogCancel>{tCommon('cancel')}</AlertDialogCancel>
                <AlertDialogAction
                  onClick={() => {
                    void onArchive();
                    setArchiveConfirmOpen(false);
                  }}
                >
                  {t('archive_deal')}
                </AlertDialogAction>
              </AlertDialogFooter>
            </AlertDialogContent>
          </AlertDialog>
        </>
      )}

      <p className="text-text-muted text-center text-xs">
        {isEditMode
          ? t('approval_note_edit')
          : isVeteran
            ? t('approval_note_veteran')
            : t('approval_note')}
      </p>
    </>
  );
}