export interface ChatAttachment {
  name: string;
  contentBase64: string;
}

export function ChatAttachmentList({ attachments, onRemove }: { attachments: ChatAttachment[]; onRemove: (name: string) => void }) {
  if (attachments.length === 0) return null;
  return (
    <div className="flex max-h-12 min-w-0 flex-1 flex-wrap gap-1 overflow-y-auto">
      {attachments.map(attachment => (
        <span key={attachment.name} className="inline-flex items-center gap-1 rounded border border-hairline bg-surface-2 px-1.5 py-0.5 font-mono text-[10px] text-slate-700">
          {attachment.name}
          <button type="button" onClick={() => onRemove(attachment.name)} aria-label={`${attachment.name}を削除`} className="ml-0.5 text-slate-400 hover:text-slate-700">&times;</button>
        </span>
      ))}
    </div>
  );
}