'use client';

import { Checkbox } from '@/components/ui/checkbox';
import { Heart } from 'lucide-react';

interface FavoritesFilterProps {
  value: boolean;
  onChange: (value: boolean) => void;
  disabled?: boolean;
}

export function FavoritesFilter({ value, onChange, disabled }: FavoritesFilterProps) {
  return (
    <div className="space-y-2">
      <label className="text-sm font-medium text-secondary">Favorites</label>
      <div className="flex items-center space-x-2">
        <Checkbox
          id="favorites-only"
          checked={value}
          onCheckedChange={(checked) => onChange(checked === true)}
          disabled={disabled}
        />
        <label
          htmlFor="favorites-only"
          className="text-sm font-normal cursor-pointer flex items-center gap-2"
        >
          <Heart className="h-4 w-4" />
          Show favorites only
        </label>
      </div>
    </div>
  );
}

