import { http, useForm } from '@inertiajs/vue3';
import { computed, ref, watch } from 'vue';
import type { AuctionFormImage } from '@/components/online-auctions/AuctionImageUploadFields.vue';
import { useOnlineAuctionUploadLimits } from '@/composables/useOnlineAuctionUploadLimits';
import { usePlateGeneratorPreviewUrl } from '@/composables/usePlateGeneratorPreviewUrl';
import { AuctionFormat, type AuctionFormat as AuctionFormatValue } from '@/enums/auctionFormat';
import type { AuctionEnquiryOption, AuctionFormLookups } from '@/types/adminAuctionForm';
import type { EnquiryDetail } from '@/types/onlineAuctionEnquiry';
import {
    auctionFormLabels,
    buildAuctionCreateFormData,
    prefillAuctionFormFromEnquiry,
} from '@/utils/auctionAdminForm';
import {
    pendingUploadFiles,
    persistedUploadIds,
    revokeAuctionImagePreviews,
} from '@/utils/auctionFormUploads';
import { adminDashboardBreadcrumb } from '@/utils/adminBreadcrumbs';
import { isPlatePreviewReady } from '@/utils/platePreview';

export function useAuctionCreateForm(
    format: AuctionFormatValue,
    props: {
        storeUrl: string;
        enquiryOptions: AuctionEnquiryOption[];
        selectedEnquiryId: number | null;
        lookups: AuctionFormLookups;
        enquiryDetailUrlTemplate: string;
        platePreviewUrl: string;
    },
) {
    const labels = auctionFormLabels(format);
    const isOnline = computed(() => format === AuctionFormat.Online);

    const breadcrumbData = [
        adminDashboardBreadcrumb(),
        { name: labels.listName, href: route(labels.indexRoute) },
        { name: 'Create Auction', href: '/', disabled: true },
    ];

    const selectedEnquiry = ref<EnquiryDetail | null>(null);
    const loadingEnquiry = ref(false);
    const auctionImages = ref<AuctionFormImage[]>([]);
    const vehicleHistoryReportFile = ref<File | null>(null);

    const form = useForm(buildAuctionCreateFormData(format, props.selectedEnquiryId));

    const activeCategory = computed(() => selectedEnquiry.value?.category ?? null);
    const showForm = computed(() => selectedEnquiry.value !== null);
    const uploadMaxFiles = useOnlineAuctionUploadLimits(activeCategory);

    const selectedEnquiryOption = computed(
        () => props.enquiryOptions.find((option) => option.id === form.auction_enquiry_id) ?? null,
    );

    const platePreviewFields = computed(() => ({
        combination: form.combination,
        state: form.state,
        background_id: form.background_id,
        characters_id: form.characters_id,
        category_id: form.category_id,
        frame: form.frame,
        display_state: form.display_state,
        display_position: form.display_position,
        width: form.width,
    }));

    const platePreviewReady = computed(
        () => activeCategory.value === 'plate' && isPlatePreviewReady(platePreviewFields.value),
    );

    const { previewUrl: livePlatePreviewUrl, isPreviewLoading: isPlatePreviewLoading } =
        usePlateGeneratorPreviewUrl(platePreviewFields, props.platePreviewUrl);

    const plateDisplayUrl = computed(() =>
        platePreviewReady.value ? livePlatePreviewUrl.value : null,
    );

    const formErrorMessages = computed(() => Object.values(form.errors).filter(Boolean) as string[]);

    async function loadEnquiry(enquiryId: number | null): Promise<void> {
        if (!enquiryId) {
            revokeAuctionImagePreviews(auctionImages.value);
            selectedEnquiry.value = null;
            auctionImages.value = [];
            vehicleHistoryReportFile.value = null;
            form.upload_ids = [];
            return;
        }

        loadingEnquiry.value = true;

        try {
            const url = props.enquiryDetailUrlTemplate.replace('__AUCTION_ENQUIRY_ID__', String(enquiryId));
            const response = await http.getClient().request({
                method: 'get',
                url,
                headers: { Accept: 'application/json' },
            });
            const result = JSON.parse(response.data) as { data: EnquiryDetail };

            selectedEnquiry.value = result.data;
            auctionImages.value = result.data.uploads.map((upload) => ({
                upload_id: upload.upload_id,
                path: upload.path,
                name: upload.name,
                type: upload.type,
                url: upload.url,
            }));
            form.upload_ids = auctionImages.value.map((upload) => upload.upload_id);
            prefillAuctionFormFromEnquiry(form, result.data);
        } catch (error) {
            console.error('Failed to load enquiry detail', error);
        } finally {
            loadingEnquiry.value = false;
        }
    }

    watch(
        () => form.auction_enquiry_id,
        (enquiryId) => {
            void loadEnquiry(enquiryId);
        },
        { immediate: true },
    );

    watch(
        () => form.combination,
        (combination) => {
            if (activeCategory.value === 'plate') {
                form.title = combination;
            }
        },
    );

    watch(
        auctionImages,
        (images) => {
            form.upload_ids = persistedUploadIds(images);
        },
        { deep: true },
    );

    function submit(): void {
        if (activeCategory.value === 'plate') {
            form.title = form.combination;
        }

        if (activeCategory.value === 'car_parts_memorabilia') {
            form.item_description = form.description;
            form.item_specifications = form.specifications;
            form.item_condition = form.condition;
        }

        form
            .transform((data) => ({
                ...data,
                upload_ids: persistedUploadIds(auctionImages.value),
                upload_files: pendingUploadFiles(auctionImages.value),
                vehicle_history_report_file: vehicleHistoryReportFile.value,
                vehicle_history_report_id: vehicleHistoryReportFile.value ? null : data.vehicle_history_report_id,
                body_type: data.body_type || null,
                transmission: data.transmission || null,
                drive_side: data.drive_side || null,
            }))
            .post(props.storeUrl, {
                forceFormData: true,
                preserveScroll: false,
                onError: () => {
                    window.scrollTo({ top: 0, behavior: 'smooth' });
                },
            });
    }

    return {
        labels,
        isOnline,
        breadcrumbData,
        form,
        selectedEnquiry,
        loadingEnquiry,
        auctionImages,
        vehicleHistoryReportFile,
        activeCategory,
        showForm,
        uploadMaxFiles,
        selectedEnquiryOption,
        platePreviewReady,
        isPlatePreviewLoading,
        plateDisplayUrl,
        formErrorMessages,
        submit,
        lookups: props.lookups,
        enquiryOptions: props.enquiryOptions,
    };
}