import { router } from '@inertiajs/react';
import { Check, ChevronDown } from 'lucide-react';
import { useState } from 'react';
import { Badge } from '@/components/ui/badge';
import {
    DropdownMenu,
    DropdownMenuContent,
    DropdownMenuItem,
    DropdownMenuTrigger,
} from '@/components/ui/dropdown-menu';
import { ReviewActionDialog } from '@/features/documents/components/review-action-dialog';
import {
    DocumentAccountantStatusBadge,
    accountantStatusBadgeSizeClasses,
    accountantStatusMap,
    type DocumentAccountantStatusBadgeSize,
} from '@/features/documents/components/document-status-badge';
import { canUseReviewAction } from '@/features/documents/lib/review-permissions';
import {
    getAllowedAccountantReviewActions,
    reviewActionReasonRequired,
} from '@/features/documents/lib/review-workflow';
import type { DocumentReviewAction } from '@/features/documents/lib/review-workflow';
import { useDocumentReviewTranslations } from '@/features/documents/lib/use-document-review-translations';
import type { DocumentAccountantStatus, DocumentAiStatus } from '@/features/documents/types';
import { useAuthorization } from '@/hooks/use-authorization';
import { useI18n } from '@/hooks/use-i18n';
import { cn } from '@/lib/utils';

type DocumentStatusBadgeDropdownProps = {
    documentId: number;
    aiStatus: DocumentAiStatus;
    accountantStatus: DocumentAccountantStatus;
    canReview: boolean;
    canValidate: boolean;
    size?: DocumentAccountantStatusBadgeSize;
};

const chevronSizeClasses: Record<DocumentAccountantStatusBadgeSize, string> = {
    sm: 'h-3 w-3',
    md: 'h-3.5 w-3.5',
};

export function DocumentStatusBadgeDropdown({
    documentId,
    aiStatus,
    accountantStatus,
    canReview,
    canValidate,
    size = 'sm',
}: DocumentStatusBadgeDropdownProps) {
    const { t } = useI18n();
    const { labels, dialogPresets } = useDocumentReviewTranslations();
    const { can, hasRole } = useAuthorization();
    const [isUpdating, setIsUpdating] = useState(false);
    const [dialogAction, setDialogAction] = useState<DocumentReviewAction | null>(null);

    const allowedAccountantActions = getAllowedAccountantReviewActions(aiStatus, accountantStatus).filter(
        (action) => {
            if (!canUseReviewAction(action, can, hasRole)) {
                return false;
            }

            if (action === 'validate') {
                return canValidate;
            }

            return canReview;
        },
    );

    const canOpenMenu = canReview && allowedAccountantActions.length > 0;
    const mapped = accountantStatusMap[accountantStatus];

    if (!canOpenMenu) {
        return <DocumentAccountantStatusBadge status={accountantStatus} size={size} />;
    }

    const runImmediate = (action: DocumentReviewAction) => {
        if (isUpdating) {
            return;
        }

        router.post(
            `/admin/documents/${documentId}/review`,
            { action },
            {
                preserveScroll: true,
                preserveState: true,
                onStart: () => setIsUpdating(true),
                onFinish: () => setIsUpdating(false),
            },
        );
    };

    const onPickAction = (action: DocumentReviewAction) => {
        if (action === 'mark_in_review') {
            runImmediate(action);

            return;
        }

        setDialogAction(action);
    };

    const dialogConfig = dialogAction ? dialogPresets[dialogAction] : null;

    return (
        <>
            <DropdownMenu>
                <DropdownMenuTrigger asChild disabled={isUpdating}>
                    <Badge
                        variant={mapped.variant}
                        asChild
                        className={cn(
                            accountantStatusBadgeSizeClasses[size],
                            'cursor-pointer gap-1 shadow-none hover:opacity-90',
                            'focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',
                            isUpdating && 'pointer-events-none opacity-50',
                        )}
                    >
                        <button
                            type="button"
                            className="inline-flex items-center gap-1 focus:outline-none"
                        >
                            <span>{mapped.label}</span>
                            <ChevronDown
                                className={cn('shrink-0 opacity-80', chevronSizeClasses[size])}
                                aria-hidden
                            />
                        </button>
                    </Badge>
                </DropdownMenuTrigger>
                <DropdownMenuContent
                    align="start"
                    className={cn('min-w-[14rem]', size === 'md' && 'min-w-[16rem]')}
                >
                    <div className="px-2 py-1.5 text-[11px] font-medium uppercase tracking-wide text-muted-foreground">
                        {t('documents.admin_show.review.dropdown_heading')}
                    </div>
                    {allowedAccountantActions.map((action) => (
                        <DropdownMenuItem
                            key={action}
                            onClick={() => onPickAction(action)}
                            className="flex items-center justify-between gap-3"
                            disabled={isUpdating}
                        >
                            <span>{labels[action]}</span>
                            {action === 'mark_in_review' && accountantStatus === 'in_review' ? (
                                <Check className="h-4 w-4 text-success-soft-foreground" />
                            ) : null}
                            {action === 'validate' && accountantStatus === 'validated' ? (
                                <Check className="h-4 w-4 text-success-soft-foreground" />
                            ) : null}
                        </DropdownMenuItem>
                    ))}
                </DropdownMenuContent>
            </DropdownMenu>

            <ReviewActionDialog
                documentId={documentId}
                action={dialogAction}
                open={Boolean(dialogAction && dialogConfig)}
                title={dialogConfig?.title ?? ''}
                description={dialogConfig?.description ?? ''}
                reasonLabel={dialogConfig?.reasonLabel ?? ''}
                reasonPlaceholder={dialogConfig?.reasonPlaceholder ?? ''}
                reasonRequired={dialogAction ? reviewActionReasonRequired[dialogAction] : false}
                onOpenChange={(open) => {
                    if (!open) {
                        setDialogAction(null);
                    }
                }}
            />
        </>
    );
}