import { ListGridType } from "ant-design-vue/es/list";
import { FavPayload, HidePayload, SubPayload } from "./types/form/favSub";
import { useRoute, useRouter } from "#app";

const base = `/user/me`;

export const favourites = (values: (any & { _id: number })[], id: number, remove: boolean, type: "story" | "author") => {
	values?.splice(
		values!.findIndex((a) => a._id == id),
		1,
	);
	const key = type === "story" ? "stories" : "authors";
	const todo = [id];
	useApiFetch(`${base}/favs`, {
		method: "put",
		body: {
			[key]: {
				pull: remove ? todo : [],
				push: !remove ? todo : [],
			},
		} as FavPayload,
	});
};

export const subscriptions = (
	values: ((any & { _id: number }) | number)[],
	id: number,
	action: "hide" | "subscribe" | "unsubscribe",
	type: "bands" | "authors",
) => {
	const rtr = useRouter();
	console.log("subby", values);

	if (action == "hide") {
		values?.splice(
			values!.findIndex((a) => a._id == id || a == id),
			1,
		);
		useApiFetch(`${base}/${action}`, {
			body: {
				push: {
					[type]: [id],
				},
				pull: {},
			} as HidePayload,
			method: "put",
		});
	} else if (action == "subscribe") {
		useApiFetch(`${base}/subscriptions`, {
			body: {
				push: {
					[type]: [id],
				},
				pull: {},
			} as SubPayload,
			method: "put",
		});
	} else if (action == "unsubscribe") {
		useApiFetch(`${base}/subscriptions`, {
			body: {
				pull: {
					[type]: [id],
				},
				push: {},
			} as SubPayload,
			method: "put",
		});
	}
};
export const bp: ListGridType = {
	gutter: 1,
	xs: 1,
	sm: 2,
	md: 3,
	lg: 4,
	xl: 5,
};