// frontend/components/inbox/CaptureComposer.tsx
"use client";
import { useState } from "react";
import { Icon } from "@/components/Icon";

// MVP 스텁: 음성/이미지는 더미 transcript/caption 주입
const VOICE_STUB = "음성 메모 0:09 — 엄마 생신 선물 미리 알아보기";
const IMAGE_STUB = "이미지 캡처 — 영수증/스크린샷 (자동 인식 결과)";

export default function CaptureComposer({
  onSubmit,
}: {
  onSubmit: (raw: string, kind: "text" | "voice" | "image") => void;
}) {
  const [input, setInput] = useState("");

  const submitText = () => {
    const t = input.trim();
    if (!t) return;
    onSubmit(t, "text");
    setInput("");
  };

  return (
    <div className="sb-cmd">
      <Icon name="spark" />
      <input
        value={input}
        onChange={(e) => setInput(e.target.value)}
        onKeyDown={(e) => e.key === "Enter" && submitText()}
        placeholder="갑자기 생각난 것 아무거나… 예) 다음 주 한국 가는 비행기 티켓 사기"
        aria-label="인박스에 빠르게 캡처"
      />
      <button
        className="sb-mode"
        aria-label="음성으로 캡처(MVP 스텁)"
        title="음성 입력은 MVP에서 더미 메모로 동작합니다"
        onClick={() => onSubmit(VOICE_STUB, "voice")}
      >
        <Icon name="mic" />
      </button>
      <button
        className="sb-mode"
        aria-label="이미지로 캡처(MVP 스텁)"
        title="이미지 입력은 MVP에서 더미 캡션으로 동작합니다"
        onClick={() => onSubmit(IMAGE_STUB, "image")}
      >
        <Icon name="image" />
      </button>
      <button className="sb-send" onClick={submitText} aria-label="보내기">
        <Icon name="arrow" />
      </button>
    </div>
  );
}