@namespace Lumeo

<details class="@RootClass" open="@DefaultOpen" @attributes="AdditionalAttributes">
    <summary class="@SummaryClass">
        <span class="inline-flex h-4 w-4 shrink-0 items-center justify-center text-muted-foreground transition-transform duration-150 [details[open]_&]:rotate-90">
            <Icon Name="ChevronRight" Size="Icon.IconSize.Sm" />
        </span>

        <span class="@StatusDotClass" aria-hidden="true"></span>

        <span class="min-w-0 flex-1 truncate font-mono text-xs text-foreground">@ToolName</span>

        <span class="@StatusChipClass">
            @if (Status == ToolCallStatus.Running)
            {
                <Spinner Size="Spinner.SpinnerSize.Sm" Class="h-3 w-3" />
            }
            <span>@StatusLabel</span>
        </span>

        @if (DurationMs is long ms)
        {
            <span class="text-xs font-mono text-muted-foreground">@FormatDuration(ms)</span>
        }
    </summary>

    <div class="space-y-3 border-t border-border/60 px-3 py-3">
        @if (!string.IsNullOrEmpty(Input))
        {
            <div class="space-y-1">
                <div class="font-semibold uppercase tracking-wider text-muted-foreground" style="font-size: 10px">Input</div>
                <pre class="max-h-48 overflow-auto rounded-md bg-muted/40 p-2 text-xs font-mono text-foreground whitespace-pre-wrap break-words"><code>@Input</code></pre>
            </div>
        }

        @if (Status == ToolCallStatus.Error && !string.IsNullOrEmpty(ErrorMessage))
        {
            <div class="space-y-1">
                <div class="font-semibold uppercase tracking-wider text-destructive" style="font-size: 10px">Error</div>
                <pre class="max-h-48 overflow-auto rounded-md border border-destructive/30 bg-destructive/10 p-2 text-xs font-mono text-destructive whitespace-pre-wrap break-words"><code>@ErrorMessage</code></pre>
            </div>
        }
        else if (!string.IsNullOrEmpty(Output))
        {
            <div class="space-y-1">
                <div class="font-semibold uppercase tracking-wider text-muted-foreground" style="font-size: 10px">Output</div>
                <pre class="max-h-48 overflow-auto rounded-md bg-muted/40 p-2 text-xs font-mono text-foreground whitespace-pre-wrap break-words"><code>@Output</code></pre>
            </div>
        }
    </div>
</details>

@code {
    [Parameter] public string ToolName { get; set; } = string.Empty;
    [Parameter] public ToolCallStatus Status { get; set; } = ToolCallStatus.Pending;
    [Parameter] public string? Input { get; set; }
    [Parameter] public string? Output { get; set; }
    [Parameter] public string? ErrorMessage { get; set; }
    [Parameter] public long? DurationMs { get; set; }
    [Parameter] public bool DefaultOpen { get; set; }
    [Parameter] public string? Class { get; set; }
    [Parameter(CaptureUnmatchedValues = true)] public Dictionary<string, object>? AdditionalAttributes { get; set; }

    private string RootClass =>
        $"w-full overflow-hidden rounded-lg border border-border bg-muted/20 {Class}".Trim();

    private string SummaryClass =>
        "flex cursor-pointer list-none items-center gap-2 px-3 py-2 text-sm hover:bg-muted/40 focus-visible:outline-none focus-visible:ring-[1.5px] focus-visible:ring-ring focus-visible:ring-inset transition-colors select-none [&::-webkit-details-marker]:hidden";

    private string StatusDotClass => Status switch
    {
        ToolCallStatus.Pending => "inline-block h-1.5 w-1.5 shrink-0 rounded-full bg-muted-foreground/50",
        ToolCallStatus.Running => "inline-block h-1.5 w-1.5 shrink-0 rounded-full bg-primary animate-pulse",
        ToolCallStatus.Success => "inline-block h-1.5 w-1.5 shrink-0 rounded-full bg-positive",
        ToolCallStatus.Error => "inline-block h-1.5 w-1.5 shrink-0 rounded-full bg-destructive",
        _ => "inline-block h-1.5 w-1.5 shrink-0 rounded-full bg-muted-foreground/50"
    };

    private string StatusChipClass
    {
        get
        {
            var baseChip = "inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-[10px] font-medium";
            var tone = Status switch
            {
                ToolCallStatus.Pending => "bg-muted text-muted-foreground",
                ToolCallStatus.Running => "bg-primary/10 text-primary",
                ToolCallStatus.Success => "bg-positive-light text-positive-text",
                ToolCallStatus.Error => "bg-destructive/10 text-destructive",
                _ => "bg-muted text-muted-foreground"
            };
            return $"{baseChip} {tone}";
        }
    }

    private string StatusLabel => Status switch
    {
        ToolCallStatus.Pending => "pending",
        ToolCallStatus.Running => "running",
        ToolCallStatus.Success => "success",
        ToolCallStatus.Error => "error",
        _ => string.Empty
    };

    private static string FormatDuration(long ms)
    {
        if (ms < 1000) return $"{ms}ms";
        return $"{ms / 1000.0:0.##}s";
    }

    public enum ToolCallStatus
    {
        Pending,
        Running,
        Success,
        Error
    }
}
