"use client";
import { useMemo, useState } from "react";
import type { ValuationResponse } from "@/types/api";
import { deltaClass, fmtCurrency, fmtLarge, fmtPct } from "@/lib/format";
import { computeDcf } from "@/lib/dcf";

type Props = { data: ValuationResponse };

function pctVsCurrent(implied?: number | null, current?: number | null): number | null {
  if (implied == null || current == null || current === 0) return null;
  return (implied - current) / current;
}

function SummaryChip({
  label,
  price,
  current,
  accent = false,
  customised = false,
}: {
  label: string;
  price?: number | null;
  current?: number | null;
  accent?: boolean;
  customised?: boolean;
}) {
  const pct = pctVsCurrent(price, current);
  return (
    <div className={`psm-val-chip${accent ? " accent" : ""}`}>
      <span className="psm-val-chip-label">
        {label}
        {customised && <span className="psm-val-chip-dot" />}
      </span>
      <span className="psm-val-chip-price">{price != null ? fmtCurrency(price) : "—"}</span>
      {pct != null && (
        <span className={`psm-val-chip-pct ${deltaClass(pct)}`}>{fmtPct(pct, 1, true)}</span>
      )}
    </div>
  );
}

function MultipleRow({
  label,
  multiple,
  price,
  current,
}: {
  label: string;
  multiple?: number | null;
  price?: number | null;
  current?: number | null;
}) {
  const pct = pctVsCurrent(price, current);
  return (
    <div className="psm-val-mult-row">
      <span className="psm-val-mult-label">{label}</span>
      <span className="psm-val-mult-x">{multiple != null ? `${multiple.toFixed(1)}×` : "—"}</span>
      <span className="psm-val-mult-price">{price != null ? fmtCurrency(price) : "—"}</span>
      <span className={`psm-val-mult-pct ${pct != null ? deltaClass(pct) : "neutral"}`}>
        {pct != null ? fmtPct(pct, 1, true) : "—"}
      </span>
    </div>
  );
}

function DCFSlider({
  label,
  value,
  min,
  max,
  step,
  fmt,
  onChange,
}: {
  label: string;
  value: number;
  min: number;
  max: number;
  step: number;
  fmt: (v: number) => string;
  onChange: (v: number) => void;
}) {
  return (
    <div className="psm-val-slider-row">
      <div className="psm-val-slider-header">
        <span className="psm-val-slider-label">{label}</span>
        <span className="psm-val-slider-value">{fmt(value)}</span>
      </div>
      <input
        type="range"
        className="psm-val-range"
        min={min}
        max={max}
        step={step}
        value={value}
        onChange={(e) => onChange(parseFloat(e.target.value))}
      />
      <div className="psm-val-slider-ticks">
        <span className="psm-val-slider-tick">{fmt(min)}</span>
        <span className="psm-val-slider-tick">{fmt(max)}</span>
      </div>
    </div>
  );
}

export function ValuationCard({ data }: Props) {
  const { dcf, ev_ebitda, ev_revenue, price_to_book, current_price } = data;

  // Slider defaults captured once from the initial API response
  const [defaults] = useState(() => ({
    wacc: dcf.wacc,
    terminalGrowth: dcf.terminal_growth,
    projectionYears: dcf.projection_years,
    growthRate: dcf.growth_rate_used ?? 0.05,
  }));

  const [wacc, setWacc] = useState(defaults.wacc);
  const [terminalGrowth, setTerminalGrowth] = useState(defaults.terminalGrowth);
  const [projectionYears, setProjectionYears] = useState(defaults.projectionYears);
  const [growthRate, setGrowthRate] = useState(defaults.growthRate);

  const isCustomised =
    wacc !== defaults.wacc ||
    terminalGrowth !== defaults.terminalGrowth ||
    projectionYears !== defaults.projectionYears ||
    growthRate !== defaults.growthRate;

  function handleReset() {
    setWacc(defaults.wacc);
    setTerminalGrowth(defaults.terminalGrowth);
    setProjectionYears(defaults.projectionYears);
    setGrowthRate(defaults.growthRate);
  }

  // equityBridge = net_debt + preferred equity + minority interest.
  // Derived as enterprise_value - equity_value (both from API); stays fixed while sliders move.
  const equityBridge =
    dcf.enterprise_value != null && dcf.equity_value != null
      ? dcf.enterprise_value - dcf.equity_value
      : (dcf.net_debt ?? 0);

  const computed = useMemo(() => {
    if (!dcf.available || dcf.error || !dcf.base_fcf || !data.shares_outstanding) return null;
    return computeDcf(
      { baseFcf: dcf.base_fcf, equityBridge, sharesOutstanding: data.shares_outstanding },
      { wacc, terminalGrowth, projectionYears, growthRate }
    );
  }, [wacc, terminalGrowth, projectionYears, growthRate, equityBridge, dcf, data.shares_outstanding]);

  const livePrice =
    computed && !("error" in computed) ? computed.intrinsicValuePerShare : null;

  const hasMultiples = ev_ebitda.available || ev_revenue.available || price_to_book.available;

  return (
    <section className="psm-card psm-val-card">
      {/* Summary strip */}
      <div className="psm-val-strip">
        <div className="psm-val-chip accent">
          <span className="psm-val-chip-label">Market Price</span>
          <span className="psm-val-chip-price">
            {current_price != null ? fmtCurrency(current_price) : "—"}
          </span>
        </div>
        <SummaryChip
          label="DCF"
          price={livePrice}
          current={current_price}
          customised={isCustomised}
        />
        <SummaryChip
          label="EV / EBITDA"
          price={ev_ebitda.available ? ev_ebitda.implied_price_per_share : null}
          current={current_price}
        />
        <SummaryChip
          label="EV / Revenue"
          price={ev_revenue.available ? ev_revenue.implied_price_per_share : null}
          current={current_price}
        />
        <SummaryChip
          label="P / Book"
          price={price_to_book.available ? price_to_book.implied_price_per_share : null}
          current={current_price}
        />
      </div>

      {/* DCF detail */}
      <div className="psm-val-section">
        <div className="psm-val-dcf-section-head">
          <span className="psm-eyebrow">Discounted Cash Flow</span>
          {dcf.available && !dcf.error && isCustomised && (
            <button className="psm-val-reset-btn" onClick={handleReset}>
              Reset
            </button>
          )}
        </div>

        {!dcf.available && (
          <p className="psm-muted-copy">Insufficient free cash flow history for DCF.</p>
        )}
        {dcf.available && dcf.error && (
          <p className="psm-val-dcf-error">{dcf.error}</p>
        )}
        {dcf.available && !dcf.error && (
          <div className="psm-val-dcf-body">
            {/* Left: sliders */}
            <div className="psm-val-dcf-assumptions">
              <div className="psm-val-dcf-col-label">Assumptions</div>
              <DCFSlider
                label="WACC"
                value={wacc}
                min={0.03}
                max={0.20}
                step={0.005}
                fmt={(v) => `${(v * 100).toFixed(1)}%`}
                onChange={setWacc}
              />
              <DCFSlider
                label="Terminal Growth"
                value={terminalGrowth}
                min={0}
                max={0.06}
                step={0.0025}
                fmt={(v) => `${(v * 100).toFixed(2)}%`}
                onChange={setTerminalGrowth}
              />
              <DCFSlider
                label="FCF Growth"
                value={growthRate}
                min={0}
                max={0.50}
                step={0.01}
                fmt={(v) => `${(v * 100).toFixed(0)}%`}
                onChange={setGrowthRate}
              />
              <DCFSlider
                label="Horizon"
                value={projectionYears}
                min={3}
                max={15}
                step={1}
                fmt={(v) => `${v} yr`}
                onChange={(v) => setProjectionYears(Math.round(v))}
              />
            </div>

            {/* Divider */}
            <div className="psm-val-dcf-divider" />

            {/* Right: results */}
            <div className="psm-val-dcf-results">
              <div className="psm-val-dcf-col-label">Results</div>

              {computed && "error" in computed ? (
                <p className="psm-val-dcf-error">{computed.error}</p>
              ) : (
                <>
                  <div className="psm-val-kv-list">
                    <div className="psm-val-kv-row">
                      <span className="psm-val-kv-label">Base FCF (TTM)</span>
                      <span className="psm-val-kv-val">
                        {dcf.base_fcf != null ? fmtLarge(dcf.base_fcf) : "—"}
                      </span>
                    </div>
                    <div className="psm-val-kv-row">
                      <span className="psm-val-kv-label">Historical growth</span>
                      <span className="psm-val-kv-val">
                        {dcf.growth_rate_used != null ? fmtPct(dcf.growth_rate_used) : "—"}
                      </span>
                    </div>
                    <div className="psm-val-kv-row is-divider">
                      <span className="psm-val-kv-label">FCF PV Sum</span>
                      <span className="psm-val-kv-val">
                        {computed ? fmtLarge(computed.fcfPvSum) : "—"}
                      </span>
                    </div>
                    <div className="psm-val-kv-row">
                      <span className="psm-val-kv-label">Terminal Value PV</span>
                      <span className="psm-val-kv-val">
                        {computed ? fmtLarge(computed.terminalValuePv) : "—"}
                      </span>
                    </div>
                    <div className="psm-val-kv-row">
                      <span className="psm-val-kv-label">Enterprise Value</span>
                      <span className="psm-val-kv-val">
                        {computed ? fmtLarge(computed.enterpriseValue) : "—"}
                      </span>
                    </div>
                    <div className="psm-val-kv-row is-total">
                      <span className="psm-val-kv-label">Net Debt</span>
                      <span className="psm-val-kv-val">
                        {dcf.net_debt != null ? fmtLarge(dcf.net_debt) : "—"}
                      </span>
                    </div>
                  </div>
                  <div className="psm-val-intrinsic">
                    <span className="psm-val-intrinsic-label">Intrinsic Value</span>
                    <span className="psm-val-intrinsic-price">
                      {livePrice != null ? fmtCurrency(livePrice) : "—"}
                    </span>
                    {data.shares_outstanding != null && (
                      <span className="psm-val-intrinsic-shares">
                        {fmtLarge(data.shares_outstanding)} shares
                      </span>
                    )}
                  </div>
                </>
              )}
            </div>
          </div>
        )}
      </div>

      {/* Multiples */}
      {hasMultiples && (
        <div className="psm-val-section">
          <div className="psm-val-section-head">
            <span className="psm-eyebrow">Multiples — at current market multiple</span>
          </div>
          <div className="psm-val-mult-list">
            {ev_ebitda.available && (
              <MultipleRow
                label="EV / EBITDA"
                multiple={ev_ebitda.multiple_used}
                price={ev_ebitda.implied_price_per_share}
                current={current_price}
              />
            )}
            {ev_revenue.available && (
              <MultipleRow
                label="EV / Revenue"
                multiple={ev_revenue.multiple_used}
                price={ev_revenue.implied_price_per_share}
                current={current_price}
              />
            )}
            {price_to_book.available && (
              <MultipleRow
                label="P / Book"
                multiple={price_to_book.multiple_used}
                price={price_to_book.implied_price_per_share}
                current={current_price}
              />
            )}
          </div>
        </div>
      )}
    </section>
  );
}