"use client";

import type { PostSource } from "./PostPill";

const SOURCE_LABELS: Record<string, string> = {
  HUMAN: "Human",
  HUBSPOT: "HubSpot",
};

interface SourceFilterProps {
  value: PostSource | "ALL";
  onChange: (value: PostSource | "ALL") => void;
  sources?: string[];
}

export function SourceFilter({ value, onChange, sources = [] }: SourceFilterProps) {
  return (
    <select
      value={value}
      onChange={(e) => onChange(e.target.value as PostSource | "ALL")}
      className="rounded-lg border border-gray-200 bg-white px-3 py-1.5 text-sm text-gray-700 focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500"
      aria-label="Filter by source"
    >
      <option value="ALL">All Sources</option>
      {sources.map((s) => (
        <option key={s} value={s}>{SOURCE_LABELS[s] ?? s}</option>
      ))}
    </select>
  );
}