const filters = [
  { key: 'all', label: 'همه', empty: 'پروژه‌ای برای نمایش وجود ندارد.' },
  { key: 'active', label: 'فعال', empty: 'پروژه فعالی پیدا نشد.' },
  { key: 'waiting', label: 'در انتظار', empty: 'پروژه در انتظاری پیدا نشد.' },
  { key: 'completed', label: 'تکمیل‌شده', empty: 'پروژه تکمیل‌شده‌ای پیدا نشد.' },
  { key: 'delayed', label: 'دارای تأخیر', empty: 'پروژه دارای تأخیر پیدا نشد.' },
  { key: 'mine', label: 'پروژه‌های من', empty: 'شما هنوز عضو پروژه‌ای نیستید.' },
];

export function getProjectFilter(key) {
  return filters.find((item) => item.key === key) || filters[0];
}

export default function PwaProjectFilters({ value, onChange }) {
  return (
    <div className="pwa-filter-row">
      {filters.map((item) => (
        <button key={item.key} type="button" className={value === item.key ? 'active' : ''} onClick={() => onChange(item.key)}>
          {item.label}
        </button>
      ))}
    </div>
  );
}
