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

export const autoSave = debounce((values: any) => {
	const store = useAutoSaveStore();
	if (store.$state.draftId == undefined) {
		useApiFetch<{ draftId: number; success: boolean }>("/drafts/new", {
			method: "post",
			body: values,
		}).then(({ data, error }) => {
			if (data.value) {
				store.$patch({ draftId: data.value.draftId });
			}
		});
	} else {
		useApiFetch<any>(`/drafts/${store.$state.draftId}`, {
			method: "put",
			body: values,
		});
	}
}, 3000);

export const autoEdit = debounce(
	(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.");
			}
		});
	},
	10000,
);