2022-09-02 15:30:34 +00:00
|
|
|
import { Team, TeamId } from '@/react/portainer/users/teams/types';
|
2022-01-05 16:28:56 +00:00
|
|
|
|
2022-09-21 07:10:58 +00:00
|
|
|
import { PortainerSelect } from '@@/form-components/PortainerSelect';
|
2022-06-17 16:18:42 +00:00
|
|
|
|
2022-01-05 16:28:56 +00:00
|
|
|
interface Props {
|
2022-02-01 17:38:45 +00:00
|
|
|
name?: string;
|
2022-09-21 07:10:58 +00:00
|
|
|
value: TeamId[] | readonly TeamId[];
|
|
|
|
onChange(value: readonly TeamId[]): void;
|
2022-01-05 16:28:56 +00:00
|
|
|
teams: Team[];
|
|
|
|
dataCy?: string;
|
|
|
|
inputId?: string;
|
|
|
|
placeholder?: string;
|
|
|
|
}
|
|
|
|
|
|
|
|
export function TeamsSelector({
|
2022-02-01 17:38:45 +00:00
|
|
|
name,
|
2022-01-05 16:28:56 +00:00
|
|
|
value,
|
|
|
|
onChange,
|
|
|
|
teams,
|
|
|
|
dataCy,
|
|
|
|
inputId,
|
|
|
|
placeholder,
|
|
|
|
}: Props) {
|
2022-09-21 07:10:58 +00:00
|
|
|
const options = teams.map((team) => ({ label: team.Name, value: team.Id }));
|
|
|
|
|
2022-01-05 16:28:56 +00:00
|
|
|
return (
|
2022-09-21 07:10:58 +00:00
|
|
|
<PortainerSelect<number>
|
2022-02-01 17:38:45 +00:00
|
|
|
name={name}
|
2022-01-05 16:28:56 +00:00
|
|
|
isMulti
|
2022-09-21 07:10:58 +00:00
|
|
|
options={options}
|
|
|
|
value={value}
|
|
|
|
onChange={(value) => onChange(value)}
|
2022-01-05 16:28:56 +00:00
|
|
|
data-cy={dataCy}
|
|
|
|
inputId={inputId}
|
|
|
|
placeholder={placeholder}
|
|
|
|
/>
|
|
|
|
);
|
|
|
|
}
|