52 lines
1.4 KiB
TypeScript
52 lines
1.4 KiB
TypeScript
'use client';
|
|
|
|
type Option = { label: string; value: string };
|
|
|
|
type SiteSelectorProps = {
|
|
options: Option[]; // e.g. [{label: 'Timo… (Installation)', value: 'PROJ-0008'}, …]
|
|
selectedValue: string | null; // the selected project "name" (siteId) or null
|
|
onChange: (value: string) => void; // called with the selected value
|
|
label?: string;
|
|
disabled?: boolean;
|
|
};
|
|
|
|
const SiteSelector = ({
|
|
options,
|
|
selectedValue,
|
|
onChange,
|
|
label = 'Select Site:',
|
|
disabled = false,
|
|
}: SiteSelectorProps) => {
|
|
const isEmpty = !options || options.length === 0;
|
|
|
|
return (
|
|
<div className="flex flex-col">
|
|
<label htmlFor="site" className="font-semibold text-lg dark:text-white">
|
|
{label}
|
|
</label>
|
|
|
|
<select
|
|
id="site"
|
|
className="border p-2 rounded dark:text-white dark:bg-rtgray-800 dark:border-rtgray-700"
|
|
value={selectedValue ?? ''} // keep controlled even when null
|
|
onChange={(e) => onChange(e.target.value)}
|
|
disabled={disabled || isEmpty}
|
|
>
|
|
{/* Placeholder when nothing selected */}
|
|
<option value="" disabled>
|
|
{isEmpty ? 'No sites available' : 'Choose a site…'}
|
|
</option>
|
|
|
|
{options.map((opt) => (
|
|
<option key={opt.value} value={opt.value}>
|
|
{opt.label}
|
|
</option>
|
|
))}
|
|
</select>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default SiteSelector;
|
|
|