"use client";

import { useTheme } from "@/components/theme/ThemeProvider";
import type { ScheduleFilter } from "@/lib/types";

export interface ScheduleFilterSelectProps {
  value: ScheduleFilter | null;
  onChange: (next: ScheduleFilter | null) => void;
  className: string;
}

/** 紐づく予定の3択絞り込み（指示書BH §4 / §12-2） */
export function ScheduleFilterSelect({
  value,
  onChange,
  className,
}: ScheduleFilterSelectProps) {
  const { t } = useTheme();

  return (
    <select
      className={className}
      aria-label={t("紐づく予定")}
      title={t("紐づく予定")}
      value={value ?? ""}
      onChange={(e) => {
        const v = e.target.value;
        onChange(v === "" ? null : (v as ScheduleFilter));
      }}
    >
      <option value="">{t("予定：すべて")}</option>
      <option value="scheduled">{t("予定あり")}</option>
      {/* ★画面の文言は「予定なし」★（ユーザー指示 2026-11-04「予定なし、予定ありに統一して」）。値 `unscheduled` は API 契約のまま */}
      <option value="unscheduled">{t("予定なし")}</option>
    </select>
  );
}