'use client'

import { useState, useEffect } from 'react'
import { Component, ComponentFormData, LibraryComponent, EnergySource, buildTree } from '../_components/types'

export function useComponents(projectId: string) {
  const [components, setComponents] = useState<Component[]>([])
  const [loading, setLoading] = useState(true)

  useEffect(() => {
    fetchComponents()
  }, [projectId]) // eslint-disable-line react-hooks/exhaustive-deps

  async function fetchComponents() {
    try {
      const res = await fetch(`/api/sdk/v1/iace/projects/${projectId}/components`)
      if (res.ok) {
        const json = await res.json()
        setComponents(json.components || json || [])
      }
    } catch (err) {
      console.error('Failed to fetch components:', err)
    } finally {
      setLoading(false)
    }
  }

  async function handleSubmit(data: ComponentFormData, editingId?: string) {
    try {
      const url = editingId
        ? `/api/sdk/v1/iace/projects/${projectId}/components/${editingId}`
        : `/api/sdk/v1/iace/projects/${projectId}/components`
      const method = editingId ? 'PUT' : 'POST'

      const res = await fetch(url, {
        method,
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify(data),
      })
      if (res.ok) {
        await fetchComponents()
        return true
      }
    } catch (err) {
      console.error('Failed to save component:', err)
    }
    return false
  }

  async function handleDelete(id: string) {
    if (!confirm('Komponente wirklich loeschen? Unterkomponenten werden ebenfalls entfernt.')) return
    try {
      const res = await fetch(`/api/sdk/v1/iace/projects/${projectId}/components/${id}`, { method: 'DELETE' })
      if (res.ok) await fetchComponents()
    } catch (err) {
      console.error('Failed to delete component:', err)
    }
  }

  async function handleAddFromLibrary(libraryComps: LibraryComponent[], energySrcs: EnergySource[]) {
    const energySourceIds = energySrcs.map(e => e.id)
    for (const comp of libraryComps) {
      try {
        await fetch(`/api/sdk/v1/iace/projects/${projectId}/components`, {
          method: 'POST',
          headers: { 'Content-Type': 'application/json' },
          body: JSON.stringify({
            name: comp.name_de,
            type: comp.maps_to_component_type,
            description: comp.description_de,
            safety_relevant: false,
            library_component_id: comp.id,
            energy_source_ids: energySourceIds,
            tags: comp.tags,
          }),
        })
      } catch (err) {
        console.error(`Failed to add component ${comp.id}:`, err)
      }
    }
    await fetchComponents()
  }

  return {
    components,
    loading,
    tree: buildTree(components),
    handleSubmit,
    handleDelete,
    handleAddFromLibrary,
  }
}
