import styles from './EnvironmentSelector.module.css';

interface EnvironmentSelectorProps {
  environments: string[];
  value: string | undefined;
  onChange: (env: string | undefined) => void;
}

export function EnvironmentSelector({ environments, value, onChange }: EnvironmentSelectorProps) {
  if (environments.length === 0) return null;

  return (
    <select
      className={styles.select}
      value={value ?? ''}
      onChange={(e) => onChange(e.target.value || undefined)}
      aria-label="Environment filter"
    >
      <option value="">All Envs</option>
      {environments.map((env) => (
        <option key={env} value={env}>{env}</option>
      ))}
    </select>
  );
}