// [nexus] Assistant input bar composite (Phase 9).
//
// Stacks the voice waveform above the text input, separated by a hairline
// divider, inside a single near-black surface with a sharp 8px radius.
// Wraps the existing ChatInput as-is; waveform state is passed in by the
// caller so we can keep this component stateless and reusable.
import { ChatInput } from "../ChatInput";
import { VoiceWaveform } from "../VoiceWaveform";
import type { Agent } from "@paperclipai/shared";
import type { PendingFile } from "../../hooks/useChatFileUpload";
import { cn } from "@/lib/utils";

export interface AssistantInputBarProps {
  /**
   * Called when the user submits a message (Enter or Send button).
   */
  onSend: (content: string) => void;
  /**
   * Optional microphone stream for the waveform. If null the waveform shows
   * a flat baseline.
   */
  micStream?: MediaStream | null;
  /**
   * Whether the microphone is actively capturing. Drives the waveform
   * animation loop.
   */
  micActive?: boolean;
  /**
   * Forwarded to ChatInput: disables submit while a stream is in flight.
   */
  isSubmitting?: boolean;
  /**
   * Forwarded to ChatInput.
   */
  disabled?: boolean;
  /**
   * Placeholder text. Defaults to the spec copy.
   */
  placeholder?: string;
  /**
   * Agents for the @mention popover inside ChatInput.
   */
  agents?: Agent[];
  agentsLoading?: boolean;
  /**
   * File attach integration.
   */
  onFilesPicked?: (files: File[]) => void;
  pendingFiles?: PendingFile[];
  onRemoveFile?: (id: string) => void;
  /**
   * Whether voice input (mic) button inside ChatInput should be shown.
   * Defaults to true for the Assistant page.
   */
  enableVoiceInput?: boolean;
  className?: string;
}

export function AssistantInputBar({
  onSend,
  micStream = null,
  micActive = false,
  isSubmitting,
  disabled,
  placeholder = "Type a message or hold space to talk…",
  agents,
  agentsLoading,
  onFilesPicked,
  pendingFiles,
  onRemoveFile,
  enableVoiceInput = true,
  className,
}: AssistantInputBarProps) {
  return (
    <div
      data-testid="assistant-input-bar"
      aria-label="Assistant input"
      className={cn(
        "flex flex-col rounded-[8px] border border-border bg-card",
        "focus-within:ring-2 focus-within:ring-primary focus-within:ring-offset-2 focus-within:ring-offset-background",
        className,
      )}
    >
      {/* Waveform row */}
      <div
        data-testid="assistant-input-bar-waveform"
        className="flex items-center justify-center px-4 pt-3 pb-2"
      >
        <div className="relative flex h-8 w-full items-center justify-center overflow-hidden">
          {/* Flat-baseline underlay: silver 1px line visible whenever the
              canvas isn't drawing (idle state). */}
          <div
            aria-hidden="true"
            className="absolute left-1/2 top-1/2 h-px w-20 -translate-x-1/2 -translate-y-1/2 bg-muted-foreground/40"
          />
          <VoiceWaveform stream={micStream} active={micActive} />
        </div>
      </div>

      {/* Hairline divider */}
      <div
        aria-hidden="true"
        data-testid="assistant-input-bar-divider"
        className="h-px w-full bg-border"
      />

      {/* Text input row with generous 24px vertical padding (px-4 py-6) */}
      <div className="px-4 py-6">
        <ChatInput
          onSend={onSend}
          isSubmitting={isSubmitting}
          disabled={disabled}
          placeholder={placeholder}
          agents={agents}
          agentsLoading={agentsLoading}
          onFilesPicked={onFilesPicked}
          pendingFiles={pendingFiles}
          onRemoveFile={onRemoveFile}
          enableVoiceInput={enableVoiceInput}
        />
      </div>
    </div>
  );
}
