Disable select when permissions is not managed or if user does not have (#44144)

* Disable select when permissions is not managed
This commit is contained in:
Karl Persson
2022-01-18 12:45:14 +01:00
committed by GitHub
parent 118cc0d735
commit acb791bdd6
3 changed files with 10 additions and 9 deletions

View File

@ -6,12 +6,12 @@ interface Props {
title: string; title: string;
items: ResourcePermission[]; items: ResourcePermission[];
permissionLevels: string[]; permissionLevels: string[];
canRemove: boolean; canSet: boolean;
onRemove: (item: ResourcePermission) => void; onRemove: (item: ResourcePermission) => void;
onChange: (resourcePermission: ResourcePermission, permission: string) => void; onChange: (resourcePermission: ResourcePermission, permission: string) => void;
} }
export const PermissionList = ({ title, items, permissionLevels, canRemove, onRemove, onChange }: Props) => { export const PermissionList = ({ title, items, permissionLevels, canSet, onRemove, onChange }: Props) => {
if (items.length === 0) { if (items.length === 0) {
return null; return null;
} }
@ -26,7 +26,7 @@ export const PermissionList = ({ title, items, permissionLevels, canRemove, onRe
item={item} item={item}
onRemove={onRemove} onRemove={onRemove}
onChange={onChange} onChange={onChange}
canRemove={canRemove} canSet={canSet}
key={`${index}-${item.userId}`} key={`${index}-${item.userId}`}
permissionLevels={permissionLevels} permissionLevels={permissionLevels}
/> />

View File

@ -5,12 +5,12 @@ import { Button, Icon, Select, Tooltip } from '@grafana/ui';
interface Props { interface Props {
item: ResourcePermission; item: ResourcePermission;
permissionLevels: string[]; permissionLevels: string[];
canRemove: boolean; canSet: boolean;
onRemove: (item: ResourcePermission) => void; onRemove: (item: ResourcePermission) => void;
onChange: (item: ResourcePermission, permission: string) => void; onChange: (item: ResourcePermission, permission: string) => void;
} }
export const PermissionListItem = ({ item, permissionLevels, canRemove, onRemove, onChange }: Props) => ( export const PermissionListItem = ({ item, permissionLevels, canSet, onRemove, onChange }: Props) => (
<tr> <tr>
<td style={{ width: '1%' }}>{getAvatar(item)}</td> <td style={{ width: '1%' }}>{getAvatar(item)}</td>
<td style={{ width: '90%' }}>{getDescription(item)}</td> <td style={{ width: '90%' }}>{getDescription(item)}</td>
@ -21,6 +21,7 @@ export const PermissionListItem = ({ item, permissionLevels, canRemove, onRemove
<Select <Select
className="width-20" className="width-20"
menuShouldPortal menuShouldPortal
disabled={!canSet || !item.isManaged}
onChange={(p) => onChange(item, p.value!)} onChange={(p) => onChange(item, p.value!)}
value={permissionLevels.find((p) => p === item.permission)} value={permissionLevels.find((p) => p === item.permission)}
options={permissionLevels.map((p) => ({ value: p, label: p }))} options={permissionLevels.map((p) => ({ value: p, label: p }))}
@ -38,7 +39,7 @@ export const PermissionListItem = ({ item, permissionLevels, canRemove, onRemove
size="sm" size="sm"
icon="times" icon="times"
variant="destructive" variant="destructive"
disabled={!canRemove} disabled={!canSet}
onClick={() => onRemove(item)} onClick={() => onRemove(item)}
aria-label={`Remove permission for ${getName(item)}`} aria-label={`Remove permission for ${getName(item)}`}
/> />

View File

@ -139,7 +139,7 @@ export const Permissions = ({ resource, resourceId, canListUsers, canSetPermissi
permissionLevels={desc.permissions} permissionLevels={desc.permissions}
onChange={onChange} onChange={onChange}
onRemove={onRemove} onRemove={onRemove}
canRemove={canSetPermissions} canSet={canSetPermissions}
/> />
<PermissionList <PermissionList
title="Users" title="Users"
@ -147,7 +147,7 @@ export const Permissions = ({ resource, resourceId, canListUsers, canSetPermissi
permissionLevels={desc.permissions} permissionLevels={desc.permissions}
onChange={onChange} onChange={onChange}
onRemove={onRemove} onRemove={onRemove}
canRemove={canSetPermissions} canSet={canSetPermissions}
/> />
<PermissionList <PermissionList
title="Teams" title="Teams"
@ -155,7 +155,7 @@ export const Permissions = ({ resource, resourceId, canListUsers, canSetPermissi
permissionLevels={desc.permissions} permissionLevels={desc.permissions}
onChange={onChange} onChange={onChange}
onRemove={onRemove} onRemove={onRemove}
canRemove={canSetPermissions} canSet={canSetPermissions}
/> />
</div> </div>
</div> </div>