"use client";
import { API_URL } from "@/lib/constants";
import { ApiResponse } from "@/types/types";
import { getApiUrl } from "@/utils/api";
import { getCookie } from "cookies-next";
import { useState, useRef, useCallback } from "react";

interface UseFileUploadReturn {
	progress: number;
	isUploading: boolean;
	error: string | null;
	uploadFile: (
		file: File,
		url: string,
		onSuccess?: (response: any) => void,
	) => void;
	cancelUpload: () => void;
}

const useFileUpload = (): UseFileUploadReturn => {
	const [progress, setProgress] = useState<number>(0);
	const [isUploading, setIsUploading] = useState<boolean>(false);
	const [error, setError] = useState<string | null>(null);
	const xhrRef = useRef<XMLHttpRequest | null>(null);

	const uploadFile = useCallback(
		(file: File, url: string, onSuccess?: (response: any) => void) => {
			url = `${getApiUrl()}${url}`;
			if (!file || !url) {
				setError("File and upload URL are required.");
				return;
			}
			const token = getCookie("auth_token");
			if (!token) {
				setError("You're not logged in.");
				return;
			}

			fetch(`${getApiUrl()}/media/verify`, {
				method: "POST",
				body: JSON.stringify({
					name: file.name,
					size: file.size,
					type: file.type,
				}),
				headers: { Authorization: `Bearer ${token}` },
			})
				.then(async (r) => {
					const res: ApiResponse<undefined> = await r.json();
					if (res.status === "Error" || r.status !== 200) {
						setError(res.message);
						return;
					}

					const xhr = new XMLHttpRequest();
					xhrRef.current = xhr;

					xhr.open("POST", url);

					// Optional: Add headers if needed
					xhr.setRequestHeader("Authorization", `Bearer ${token}`);

					xhr.upload.onprogress = (event) => {
						if (event.lengthComputable) {
							const percentComplete = Math.round(
								(event.loaded / event.total) * 100,
							);
							setProgress(percentComplete);
						}
					};

					xhr.onload = () => {
						if (xhr.status >= 200 && xhr.status < 300) {
							setProgress(100);
							setIsUploading(false);
							setError(null);
							if (onSuccess) onSuccess(xhr.response);
						} else {
							setIsUploading(false);
							setError(
								`Upload failed with status ${xhr.status}: ${xhr.statusText}`,
							);
						}
					};

					xhr.onerror = () => {
						setIsUploading(false);
						setError("An error occurred during the upload.");
					};

					xhr.onabort = () => {
						setIsUploading(false);
						setError("Upload aborted.");
					};

					setIsUploading(true);
					setError(null);
					setProgress(0);

					const formData = new FormData();
					formData.append("file", file);

					xhr.send(formData);
				})
				.catch((err) => {
					setError(err.message);
				});
		},
		[],
	);

	const cancelUpload = useCallback(() => {
		if (xhrRef.current) {
			xhrRef.current.abort();
		}
	}, []);

	return { progress, isUploading, error, uploadFile, cancelUpload };
};

export default useFileUpload;