Service Accounts: Fix issue in UserTable and ServiceAccountsTable (#43865)

* fix issue where ServiceAccountsTable rendere delete modal
for every item in list

Co-authored-by: Dominik Prokop <dominik.prokop@grafana.com>
This commit is contained in:
Karl Persson 2022-01-11 18:51:24 +01:00 committed by GitHub
parent 1966eba796
commit e2de1c1ec4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 92 additions and 90 deletions

View File

@ -45,7 +45,7 @@ export class ServiceAccountsListPage extends PureComponent<Props, State> {
<ServiceAccountsTable
serviceAccounts={paginatedServiceAccounts}
onRoleChange={(role, serviceAccount) => this.onRoleChange(role, serviceAccount)}
onRemoveServiceaccount={(serviceAccount) => this.props.removeServiceAccount(serviceAccount.serviceAccountId)}
onRemoveServiceAccount={(serviceAccount) => this.props.removeServiceAccount(serviceAccount.serviceAccountId)}
/>
<HorizontalGroup justify="flex-end">
<Pagination

View File

@ -9,19 +9,20 @@ import { fetchBuiltinRoles, fetchRoleOptions, UserRolePicker } from 'app/core/co
export interface Props {
serviceAccounts: OrgServiceAccount[];
orgId?: number;
onRoleChange: (role: OrgRole, serviceaccount: OrgServiceAccount) => void;
onRemoveServiceaccount: (serviceaccount: OrgServiceAccount) => void;
onRoleChange: (role: OrgRole, serviceAccount: OrgServiceAccount) => void;
onRemoveServiceAccount: (serviceAccount: OrgServiceAccount) => void;
}
const ServiceaccountsTable: FC<Props> = (props) => {
const { serviceAccounts, orgId, onRoleChange, onRemoveServiceaccount: onRemoveserviceaccount } = props;
const ServiceAccountsTable: FC<Props> = (props) => {
const { serviceAccounts, orgId, onRoleChange, onRemoveServiceAccount } = props;
const canUpdateRole = contextSrv.hasPermission(AccessControlAction.OrgUsersRoleUpdate);
const canRemoveFromOrg = contextSrv.hasPermission(AccessControlAction.OrgUsersRemove);
const rolePickerDisabled = !canUpdateRole;
const [showRemoveModal, setShowRemoveModal] = useState(false);
const [roleOptions, setRoleOptions] = useState<Role[]>([]);
const [toRemove, setToRemove] = useState<OrgServiceAccount | null>(null);
const [builtinRoles, setBuiltinRoles] = useState<Record<string, Role[]>>({});
const [showRemoveModal, setShowRemoveModal] = useState<boolean | string>(false);
useEffect(() => {
async function fetchOptions() {
@ -43,6 +44,7 @@ const ServiceaccountsTable: FC<Props> = (props) => {
const getBuiltinRoles = async () => builtinRoles;
return (
<>
<table className="filter-table form-inline">
<thead>
<tr>
@ -100,26 +102,15 @@ const ServiceaccountsTable: FC<Props> = (props) => {
/>
)}
</td>
{canRemoveFromOrg && (
<td>
<Button
size="sm"
variant="destructive"
onClick={() => setShowRemoveModal(Boolean(serviceAccount.login))}
onClick={() => setShowRemoveModal(serviceAccount.login)}
icon="times"
aria-label="Delete serviceaccount"
/>
<ConfirmModal
body={`Are you sure you want to delete serviceaccount ${serviceAccount.login}?`}
confirmText="Delete"
title="Delete"
onDismiss={() => setShowRemoveModal(false)}
isOpen={Boolean(serviceAccount.login) === showRemoveModal}
onConfirm={() => {
onRemoveserviceaccount(serviceAccount);
}}
/>
</td>
)}
</tr>
@ -127,7 +118,18 @@ const ServiceaccountsTable: FC<Props> = (props) => {
})}
</tbody>
</table>
{toRemove !== null && (
<ConfirmModal
body={`Are you sure you want to delete ${toRemove.login} service account?`}
confirmText="Delete"
title="Delete"
onDismiss={() => setToRemove(null)}
isOpen={toRemove.login === showRemoveModal}
onConfirm={() => onRemoveServiceAccount(toRemove)}
/>
)}
</>
);
};
export default ServiceaccountsTable;
export default ServiceAccountsTable;