Unify all dropdowns on the custom Select component.

Replace every native <select> across the dashboard, admin pages, and
shared components with the custom Select used by the optional-service
version pickers, for consistent styling and mobile-safe anchoring. Add
a disabled prop to Select to cover the former read-only native cases.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
keyhan
2026-06-12 17:37:04 +03:30
parent aa7ff3d26d
commit 97cd5e989a
16 changed files with 664 additions and 494 deletions
@@ -8,6 +8,7 @@ import { useT, useLocale } from '@/i18n/I18nProvider';
import type { Cluster, ClusterPool } from '@/types';
import { Scale, BarChart3, RotateCw, CheckCircle, XCircle, Pencil, Clock, X } from 'lucide-react';
import { useConfirm } from '@/components/confirm-modal';
import { Select } from '@/components/ui/select';
export default function AdminPoolsPage() {
const t = useT();
@@ -150,18 +151,20 @@ export default function AdminPoolsPage() {
</div>
<div>
<label className="block text-sm font-medium text-gray-700 mb-1">{p.strategy}</label>
<select
className="input-field"
<Select
size="md"
ariaLabel={p.strategy}
value={form.strategy}
onChange={(e) => setForm({ ...form, strategy: e.target.value as any })}
>
<option value="weighted-resource">{strategyOption('weighted-resource')}</option>
<option value="least-loaded">{strategyOption('least-loaded')}</option>
<option value="weighted-round-robin">{strategyOption('weighted-round-robin')}</option>
<option value="region-based">{strategyOption('region-based')}</option>
<option value="least-apps">{strategyOption('least-apps')}</option>
<option value="round-robin">{strategyOption('round-robin')}</option>
</select>
onChange={(v) => setForm({ ...form, strategy: v as any })}
options={[
{ value: 'weighted-resource', label: strategyOption('weighted-resource') },
{ value: 'least-loaded', label: strategyOption('least-loaded') },
{ value: 'weighted-round-robin', label: strategyOption('weighted-round-robin') },
{ value: 'region-based', label: strategyOption('region-based') },
{ value: 'least-apps', label: strategyOption('least-apps') },
{ value: 'round-robin', label: strategyOption('round-robin') },
]}
/>
</div>
<div>
<label className="block text-sm font-medium text-gray-700 mb-1">{p.priority}</label>