"use client"

// The enablement controls of the organization's settings page: the current state, the enable
// button with its typed refusal reasons (plan, policy, quota), and disable — which preserves
// every collection, document and vector.

import { useTransport } from "@conusai-kit/ui"
import { type ReactElement, useId, useState } from "react"

export interface SettingsSectionLabels {
  readonly heading: string
  readonly state: string
  readonly stateOn: string
  readonly stateOff: string
  readonly backend: string
  readonly backendVectors: string
  readonly source: string
  readonly sourceOperator: string
  readonly sourceManaged: string
  readonly endpoint: string
  readonly enable: string
  readonly enabling: string
  readonly disable: string
  readonly disabling: string
  readonly enabledDone: string
  readonly disabledDone: string
  readonly planRequired: string
  readonly featureDisabled: string
  readonly quotaExhausted: string
  readonly upgrade: string
  readonly hint: string
  readonly failed: string
}

type View = { kind: "idle" } | { kind: "busy" } | { kind: "message"; text: string; alert: boolean }

export function SettingsSection({
  org,
  initial,
  labels,
}: {
  org: string
  initial: { enabled: boolean; backend: string | null; source: string | null; url: string | null }
  labels: SettingsSectionLabels
}): ReactElement {
  const { call, describe } = useTransport()
  const id = useId()
  const [enabled, setEnabled] = useState(initial.enabled)
  const [view, setView] = useState<View>({ kind: "idle" })

  const enable = async (): Promise<void> => {
    setView({ kind: "busy" })
    try {
      await call("knowledge.settings.enableDocumentAi", { org })
      setEnabled(true)
      setView({ kind: "message", text: labels.enabledDone, alert: false })
    } catch (error) {
      const code = (error as { code?: string }).code ?? "unknown"
      if (code === "plan_required") {
        setView({ kind: "message", text: `${labels.planRequired} ${labels.upgrade}`, alert: true })
      } else if (code === "quota_exhausted") {
        setView({ kind: "message", text: labels.quotaExhausted, alert: true })
      } else if (code === "feature_disabled") {
        setView({ kind: "message", text: labels.featureDisabled, alert: true })
      } else {
        setView({ kind: "message", text: describe(error), alert: true })
      }
    }
  }

  const disable = async (): Promise<void> => {
    setView({ kind: "busy" })
    try {
      await call("knowledge.settings.disableDocumentAi", { org })
      setEnabled(false)
      setView({ kind: "message", text: labels.disabledDone, alert: false })
    } catch (error) {
      setView({ kind: "message", text: describe(error), alert: true })
    }
  }

  return (
    <section aria-labelledby={`${id}-heading`}>
      <h2 id={`${id}-heading`}>{labels.heading}</h2>
      <p>{labels.hint}</p>
      <dl>
        <dt>{labels.state}</dt>
        <dd>{enabled ? labels.stateOn : labels.stateOff}</dd>
        {initial.backend !== null ? (
          <>
            <dt>{labels.backend}</dt>
            <dd>{initial.backend === "vectors" ? labels.backendVectors : initial.backend}</dd>
          </>
        ) : null}
        {initial.source !== null ? (
          <>
            <dt>{labels.source}</dt>
            <dd>{initial.source === "operator" ? labels.sourceOperator : labels.sourceManaged}</dd>
          </>
        ) : null}
        {initial.url !== null ? (
          <>
            <dt>{labels.endpoint}</dt>
            <dd>{initial.url}</dd>
          </>
        ) : null}
      </dl>
      {view.kind === "message" ? <p role={view.alert ? "alert" : "status"}>{view.text}</p> : null}
      {enabled ? (
        <button type="button" disabled={view.kind === "busy"} onClick={() => void disable()}>
          {view.kind === "busy" ? labels.disabling : labels.disable}
        </button>
      ) : (
        <button type="button" disabled={view.kind === "busy"} onClick={() => void enable()}>
          {view.kind === "busy" ? labels.enabling : labels.enable}
        </button>
      )}
    </section>
  )
}