import { ref } from "vue"
import { isUnauthorized } from "~/utils/auth"

export function useServers() {
  const servers = ref([])
  const loading = ref(false)
  const error = ref("")

  const { apiFetch } = useApi()

  async function loadServers() {
    loading.value = true
    error.value = ""

    const result = await apiFetch("/servers")

    if (isUnauthorized(result)) {
      loading.value = false
      return result
    }

    servers.value = result
    loading.value = false
    return result
  }

  async function createServer(hostname: string, description: string, owner_id: number | null) {
    const payload = {
                hostname: hostname,
                description: description,
                owner_id: owner_id
            }
    loading.value = true
    error.value = ""

    const result = await apiFetch("/servers", {
      method: "POST",
      body: payload
    })

    if (isUnauthorized(result)) {
      loading.value = false
      return result
    }

    // Optional: direkt in die Liste einfügen
    servers.value.push(result)

    loading.value = false
    return result
  }

  return {
    servers,
    loading,
    error,
    loadServers,
    createServer
  }
}