Team LBAC: Add epilogue to permissions (#82523)

* add epilogue to permissions

* gs
linting fix

* update docs

* Revert "update docs"

This reverts commit 0902ce2d8a.

public/app/core/actions/index.ts

@@ -1,3 +1,4 @@
 import { hideAppNotification, notifyApp } from '../reducers/appNotification';
 import { updateNavIndex, updateConfigurationSubtitle } from '../reducers/navModel';
+
 export { updateNavIndex, updateConfigurationSubtitle, notifyApp, hideAppNotification };

public/app/core/components/AccessControl/Permissions.tsx

@@ -37,6 +37,7 @@ export type Props = {
   resourceId: ResourceId;
   canSetPermissions: boolean;
   getWarnings?: (items: ResourcePermission[]) => ResourcePermission[];
+  epilogue?: (items: ResourcePermission[]) => React.ReactNode;
 };
 
 export const Permissions = ({
@@ -48,6 +49,7 @@ export const Permissions = ({
   canSetPermissions,
   addPermissionTitle,
   getWarnings,
+  epilogue,
 }: Props) => {
   const styles = useStyles2(getStyles);
   const [isAdding, setIsAdding] = useState(false);
@@ -157,87 +159,90 @@ export const Permissions = ({
   const titleTeam = t('access-control.permissions.team', 'Team');
 
   return (
-    <div>
-      {canSetPermissions && resource === 'folders' && (
-        <>
-          <Trans i18nKey="access-control.permissions.permissions-change-warning">
-            This will change permissions for this folder and all its descendants. In total, this will affect:
-          </Trans>
-          <DescendantCount
-            selectedItems={{
-              folder: { [resourceId]: true },
-              dashboard: {},
-              panel: {},
-              $all: false,
-            }}
-          />
-          <Space v={2} />
-        </>
-      )}
-      {items.length === 0 && (
-        <Box>
-          <Text>{emptyLabel}</Text>
-        </Box>
-      )}
-      <PermissionList
-        title={titleRole}
-        items={builtInRoles}
-        compareKey={'builtInRole'}
-        permissionLevels={desc.permissions}
-        onChange={onChange}
-        onRemove={onRemove}
-        canSet={canSetPermissions}
-      />
-      <PermissionList
-        title={titleUser}
-        items={users}
-        compareKey={'userLogin'}
-        permissionLevels={desc.permissions}
-        onChange={onChange}
-        onRemove={onRemove}
-        canSet={canSetPermissions}
-      />
-      <PermissionList
-        title={titleServiceAccount}
-        items={serviceAccounts}
-        compareKey={'userLogin'}
-        permissionLevels={desc.permissions}
-        onChange={onChange}
-        onRemove={onRemove}
-        canSet={canSetPermissions}
-      />
-      <PermissionList
-        title={titleTeam}
-        items={teams}
-        compareKey={'team'}
-        permissionLevels={desc.permissions}
-        onChange={onChange}
-        onRemove={onRemove}
-        canSet={canSetPermissions}
-      />
-      {canSetPermissions && (
-        <>
-          <Button
-            className={styles.addPermissionButton}
-            variant={'primary'}
-            key="add-permission"
-            onClick={() => setIsAdding(true)}
-            icon="plus"
-          >
-            {buttonLabel}
-          </Button>
-          <SlideDown in={isAdding}>
-            <AddPermission
-              title={addPermissionTitle}
-              onAdd={onAdd}
-              permissions={desc.permissions}
-              assignments={desc.assignments}
-              onCancel={() => setIsAdding(false)}
+    <>
+      <div>
+        {canSetPermissions && resource === 'folders' && (
+          <>
+            <Trans i18nKey="access-control.permissions.permissions-change-warning">
+              This will change permissions for this folder and all its descendants. In total, this will affect:
+            </Trans>
+            <DescendantCount
+              selectedItems={{
+                folder: { [resourceId]: true },
+                dashboard: {},
+                panel: {},
+                $all: false,
+              }}
             />
-          </SlideDown>
-        </>
-      )}
-    </div>
+            <Space v={2} />
+          </>
+        )}
+        {items.length === 0 && (
+          <Box>
+            <Text>{emptyLabel}</Text>
+          </Box>
+        )}
+        <PermissionList
+          title={titleRole}
+          items={builtInRoles}
+          compareKey={'builtInRole'}
+          permissionLevels={desc.permissions}
+          onChange={onChange}
+          onRemove={onRemove}
+          canSet={canSetPermissions}
+        />
+        <PermissionList
+          title={titleUser}
+          items={users}
+          compareKey={'userLogin'}
+          permissionLevels={desc.permissions}
+          onChange={onChange}
+          onRemove={onRemove}
+          canSet={canSetPermissions}
+        />
+        <PermissionList
+          title={titleServiceAccount}
+          items={serviceAccounts}
+          compareKey={'userLogin'}
+          permissionLevels={desc.permissions}
+          onChange={onChange}
+          onRemove={onRemove}
+          canSet={canSetPermissions}
+        />
+        <PermissionList
+          title={titleTeam}
+          items={teams}
+          compareKey={'team'}
+          permissionLevels={desc.permissions}
+          onChange={onChange}
+          onRemove={onRemove}
+          canSet={canSetPermissions}
+        />
+        {canSetPermissions && (
+          <>
+            <Button
+              className={styles.addPermissionButton}
+              variant={'primary'}
+              key="add-permission"
+              onClick={() => setIsAdding(true)}
+              icon="plus"
+            >
+              {buttonLabel}
+            </Button>
+            <SlideDown in={isAdding}>
+              <AddPermission
+                title={addPermissionTitle}
+                onAdd={onAdd}
+                permissions={desc.permissions}
+                assignments={desc.assignments}
+                onCancel={() => setIsAdding(false)}
+              />
+            </SlideDown>
+          </>
+        )}
+      </div>
+      {epilogue && epilogue(items)}
+    </>
   );
 };