import { debounce } from "lodash-es";
import { message } from "ant-design-vue";
import { IStory } from "@models/stories";
import { useAutoSaveStore } from "~/stores/autosaveStore";

export const autoSave = async (values: any) => {
	const store = useAutoSaveStore();
	const fid = store.$state.fetchId;
	if (store.$state.fetchId !== fid) return;
	store.$patch({ fetchId: store.$state.fetchId + 1 });
	if (store.$state.draftId == undefined) {
		let b = useApiFetch<{ draftId: number; success: boolean }>("/drafts/new", {
			method: "post",
			body: values,
		}).then(({ data, error }) => {
			console.log("fibberty", data, error);
			if (data.value) {
				store.$patch({ draftId: data.value.draftId });
			}
		});
		console.log("B", b);
	} else {
		useApiFetch<any>(`/drafts/${store.$state.draftId}`, {
			method: "put",
			body: values,
		});
	}
};

export const autoEdit = (
	values: any,
	endpoint: string,
	method: "put" | "post",
) => {
	const [messageApi, contextHolder] = message.useMessage();
	useApiFetch<{ success: boolean; data: IStory }>(endpoint, {
		method,
		body: values,
	}).then(({ data, error }) => {
		if (data.value?.success) {
			messageApi.success("Your work has been saved successfully.");
		} else if (error) {
			messageApi.error("Error saving data.");
		}
	});
};

export const debouncedAutoEdit = debounce(autoEdit, 5000);
export const debouncedAutoSave = debounce(autoSave, 10000);