import { uploadToHuggingFace } from "@gradio/utils";
import type { GalleryData } from "../types";
import { getMediaFile } from "../types";

export async function format_gallery_for_sharing(
	value: GalleryData[] | null
): Promise<string> {
	if (!value) return "";
	let urls = await Promise.all(
		value.map(async (item) => {
			const file = getMediaFile(item);
			if (!file || !file.url) return "";
			return await uploadToHuggingFace(file.url, "url");
		})
	);

	return `<div style="display: flex; flex-wrap: wrap; gap: 16px">${urls
		.filter(url => url)
		.map((url) => `<img src="${url}" style="height: 400px" />`)
		.join("")}</div>`;
}