mirror of https://github.com/portainer/portainer
59 lines
1.5 KiB
TypeScript
59 lines
1.5 KiB
TypeScript
interface Props {
|
|
versions?: number[];
|
|
onChange(value: number): void;
|
|
}
|
|
|
|
export function StackVersionSelector({ versions, onChange }: Props) {
|
|
if (!versions || versions.length === 0) {
|
|
return null;
|
|
}
|
|
|
|
const showSelector = versions.length > 1;
|
|
|
|
const versionOptions = versions.map((version) => ({
|
|
value: version,
|
|
label: version.toString(),
|
|
}));
|
|
|
|
return (
|
|
<div className="flex">
|
|
{!showSelector && (
|
|
<>
|
|
<label className="text-muted mr-2" htmlFor="version_id">
|
|
<span>Version:</span>
|
|
</label>
|
|
<span className="text-muted" id="version_id">
|
|
{versions[0]}
|
|
</span>
|
|
</>
|
|
)}
|
|
|
|
{showSelector && (
|
|
<div className="text-muted">
|
|
<label className="mr-2" htmlFor="version_id">
|
|
<span>Version:</span>
|
|
</label>
|
|
<select
|
|
className="form-select"
|
|
data-cy="version-selector"
|
|
style={{
|
|
width: '60px',
|
|
height: '24px',
|
|
borderRadius: '4px',
|
|
borderColor: 'hsl(0, 0%, 80%)',
|
|
padding: '2px 8px',
|
|
}}
|
|
onChange={(e) => onChange(parseInt(e.target.value, 10))}
|
|
>
|
|
{versionOptions.map((option) => (
|
|
<option key={option.value} value={option.value}>
|
|
{option.value}
|
|
</option>
|
|
))}
|
|
</select>
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|