export type StoredImage = {
  id: string
  name: string
  dataUrl: string
  createdAt: number
}

const IMAGE_LIBRARY_KEY = 'GRAPHFX_UI_IMAGE_LIBRARY'

export function loadImageLibrary(): StoredImage[] {
  try {
    const raw = localStorage.getItem(IMAGE_LIBRARY_KEY)
    if (!raw) return []
    const parsed = JSON.parse(raw)
    return Array.isArray(parsed)
      ? parsed.filter((item) => item?.id && item?.name && item?.dataUrl)
      : []
  } catch {
    return []
  }
}

export function saveImageLibrary(images: StoredImage[]) {
  localStorage.setItem(IMAGE_LIBRARY_KEY, JSON.stringify(images))
}

function fileToDataUrl(file: File): Promise<string> {
  return new Promise((resolve, reject) => {
    const reader = new FileReader()
    reader.onerror = () => reject(reader.error || new Error(`Could not read ${file.name}`))
    reader.onload = () => resolve(String(reader.result || ''))
    reader.readAsDataURL(file)
  })
}

export async function filesToStoredImages(files: FileList | File[]): Promise<StoredImage[]> {
  const imageFiles = Array.from(files).filter((file) => file.type.startsWith('image/'))
  return Promise.all(imageFiles.map(async (file) => ({
    id: crypto.randomUUID(),
    name: file.name,
    dataUrl: await fileToDataUrl(file),
    createdAt: Date.now(),
  })))
}

export function loadHtmlImage(dataUrl: string): Promise<HTMLImageElement> {
  return new Promise((resolve, reject) => {
    const image = new Image()
    image.onload = () => resolve(image)
    image.onerror = () => reject(new Error('Could not decode selected image.'))
    image.src = dataUrl
  })
}