optimization

src/components/calendar/YearSelector.tsx

@@ -0,0 +1,37 @@
+import { Calendar as CalendarIcon } from 'lucide-react'
+import { cn } from '@/lib/utils'
+
+type YearSelectorProps = {
+    years: number[]
+    selectedYear: number
+    onYearChange: (year: number) => void
+    className?: string
+}
+
+export function YearSelector({
+    years,
+    selectedYear,
+    onYearChange,
+    className
+}: YearSelectorProps) {
+    return (
+        <div className={cn('flex flex-wrap items-center justify-center gap-4', className)}>
+            <label className="text-sm font-medium text-gray-700 flex items-center gap-2">
+                <CalendarIcon className="w-4 h-4 text-gray-500" />
+                انتخاب سال:
+            </label>
+            <select
+                className="px-4 py-2 border-2 border-gray-200 rounded-xl focus:border-green-500 focus:outline-none focus:ring-2 focus:ring-green-500/20 transition-all bg-white font-medium"
+                value={selectedYear}
+                onChange={(e) => onYearChange(Number(e.target.value))}
+            >
+                {years.map((year) => (
+                    <option key={year} value={year}>
+                        {year}
+                    </option>
+                ))}
+            </select>
+        </div>
+    )
+}
+