@backstage-community/plugin-rbac 1.32.4 → 1.33.0

package/dist/components/RoleOverview/RoleOverviewPage.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"RoleOverviewPage.esm.js","sources":["../../../src/components/RoleOverview/RoleOverviewPage.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React from 'react';\nimport { useParams } from 'react-router-dom';\n\nimport { Header, Page, TabbedLayout } from '@backstage/core-components';\n\nimport { Grid } from '@material-ui/core';\n\nimport { useLocationToast } from '../../hooks/useLocationToast';\nimport { useMembers } from '../../hooks/useMembers';\nimport { SnackbarAlert } from '../SnackbarAlert';\nimport { useToast } from '../ToastContext';\nimport { AboutCard } from './AboutCard';\nimport { MembersCard } from './MembersCard';\nimport { PermissionsCard } from './PermissionsCard';\n\nexport const RoleOverviewPage = () => {\n  const { roleName, roleNamespace, roleKind } = useParams();\n  const { toastMessage, setToastMessage } = useToast();\n  const membersInfo = useMembers(`${roleKind}:${roleNamespace}/${roleName}`);\n\n  useLocationToast(setToastMessage);\n\n  const onAlertClose = () => {\n    setToastMessage('');\n  };\n\n  return (\n    <>\n      <SnackbarAlert toastMessage={toastMessage} onAlertClose={onAlertClose} />\n      <Page themeId=\"tool\">\n        <Header\n          title={`${roleKind}:${roleNamespace}/${roleName}`}\n          type=\"RBAC\"\n          typeLink=\"..\"\n        />\n        <TabbedLayout>\n          <TabbedLayout.Route path=\"\" title=\"Overview\">\n            <Grid container direction=\"row\">\n              <Grid item lg={12} xs={12}>\n                <AboutCard\n                  roleName={`${roleKind}:${roleNamespace}/${roleName}`}\n                />\n              </Grid>\n              <Grid item lg={6} xs={12}>\n                <MembersCard\n                  roleName={`${roleKind}:${roleNamespace}/${roleName}`}\n                  membersInfo={membersInfo}\n                />\n              </Grid>\n              <Grid item lg={6} xs={12}>\n                <PermissionsCard\n                  entityReference={`${roleKind}:${roleNamespace}/${roleName}`}\n                  canReadUsersAndGroups={membersInfo.canReadUsersAndGroups}\n                />\n              </Grid>\n            </Grid>\n          </TabbedLayout.Route>\n        </TabbedLayout>\n      </Page>\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;AA8BO,MAAM,mBAAmB,MAAM;AACpC,EAAA,MAAM,EAAE,QAAA,EAAU,aAAe,EAAA,QAAA,KAAa,SAAU,EAAA;AACxD,EAAA,MAAM,EAAE,YAAA,EAAc,eAAgB,EAAA,GAAI,QAAS,EAAA;AACnD,EAAM,MAAA,WAAA,GAAc,WAAW,CAAG,EAAA,QAAQ,IAAI,aAAa,CAAA,CAAA,EAAI,QAAQ,CAAE,CAAA,CAAA;AAEzE,EAAA,gBAAA,CAAiB,eAAe,CAAA;AAEhC,EAAA,MAAM,eAAe,MAAM;AACzB,IAAA,eAAA,CAAgB,EAAE,CAAA;AAAA,GACpB;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,sCACG,aAAc,EAAA,EAAA,YAAA,EAA4B,cAA4B,CACvE,kBAAA,KAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,OAAA,EAAQ,MACZ,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,OAAO,CAAG,EAAA,QAAQ,CAAI,CAAA,EAAA,aAAa,IAAI,QAAQ,CAAA,CAAA;AAAA,MAC/C,IAAK,EAAA,MAAA;AAAA,MACL,QAAS,EAAA;AAAA;AAAA,GACX,kBACC,KAAA,CAAA,aAAA,CAAA,YAAA,EAAA,IAAA,kBACE,KAAA,CAAA,aAAA,CAAA,YAAA,CAAa,OAAb,EAAmB,IAAA,EAAK,EAAG,EAAA,KAAA,EAAM,UAChC,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,QAAK,SAAS,EAAA,IAAA,EAAC,SAAU,EAAA,KAAA,EAAA,kBACvB,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,MAAI,IAAC,EAAA,EAAA,EAAI,EAAI,EAAA,EAAA,EAAI,EACrB,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,UAAU,CAAG,EAAA,QAAQ,CAAI,CAAA,EAAA,aAAa,IAAI,QAAQ,CAAA;AAAA;AAAA,GAEtD,mBACC,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,MAAI,IAAC,EAAA,EAAA,EAAI,CAAG,EAAA,EAAA,EAAI,EACpB,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACC,UAAU,CAAG,EAAA,QAAQ,CAAI,CAAA,EAAA,aAAa,IAAI,QAAQ,CAAA,CAAA;AAAA,MAClD;AAAA;AAAA,GAEJ,mBACC,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,MAAI,IAAC,EAAA,EAAA,EAAI,CAAG,EAAA,EAAA,EAAI,EACpB,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,eAAA;AAAA,IAAA;AAAA,MACC,iBAAiB,CAAG,EAAA,QAAQ,CAAI,CAAA,EAAA,aAAa,IAAI,QAAQ,CAAA,CAAA;AAAA,MACzD,uBAAuB,WAAY,CAAA;AAAA;AAAA,GAEvC,CACF,CACF,CACF,CACF,CACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"RoleOverviewPage.esm.js","sources":["../../../src/components/RoleOverview/RoleOverviewPage.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React from 'react';\nimport { useParams } from 'react-router-dom';\n\nimport { Header, Page, TabbedLayout } from '@backstage/core-components';\n\nimport Grid from '@mui/material/Grid';\n\nimport { useLocationToast } from '../../hooks/useLocationToast';\nimport { useMembers } from '../../hooks/useMembers';\nimport { SnackbarAlert } from '../SnackbarAlert';\nimport { useToast } from '../ToastContext';\nimport { AboutCard } from './AboutCard';\nimport { MembersCard } from './MembersCard';\nimport { PermissionsCard } from './PermissionsCard';\n\nexport const RoleOverviewPage = () => {\n  const { roleName, roleNamespace, roleKind } = useParams();\n  const { toastMessage, setToastMessage } = useToast();\n  const membersInfo = useMembers(`${roleKind}:${roleNamespace}/${roleName}`);\n\n  useLocationToast(setToastMessage);\n\n  const onAlertClose = () => {\n    setToastMessage('');\n  };\n\n  return (\n    <>\n      <SnackbarAlert toastMessage={toastMessage} onAlertClose={onAlertClose} />\n      <Page themeId=\"tool\">\n        <Header\n          title={`${roleKind}:${roleNamespace}/${roleName}`}\n          type=\"RBAC\"\n          typeLink=\"..\"\n        />\n        <TabbedLayout>\n          <TabbedLayout.Route path=\"\" title=\"Overview\">\n            <Grid container direction=\"row\">\n              <Grid item lg={12} xs={12}>\n                <AboutCard\n                  roleName={`${roleKind}:${roleNamespace}/${roleName}`}\n                />\n              </Grid>\n              <Grid item lg={6} xs={12}>\n                <MembersCard\n                  roleName={`${roleKind}:${roleNamespace}/${roleName}`}\n                  membersInfo={membersInfo}\n                />\n              </Grid>\n              <Grid item lg={6} xs={12}>\n                <PermissionsCard\n                  entityReference={`${roleKind}:${roleNamespace}/${roleName}`}\n                  canReadUsersAndGroups={membersInfo.canReadUsersAndGroups}\n                />\n              </Grid>\n            </Grid>\n          </TabbedLayout.Route>\n        </TabbedLayout>\n      </Page>\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;AA8BO,MAAM,mBAAmB,MAAM;AACpC,EAAA,MAAM,EAAE,QAAA,EAAU,aAAe,EAAA,QAAA,KAAa,SAAU,EAAA;AACxD,EAAA,MAAM,EAAE,YAAA,EAAc,eAAgB,EAAA,GAAI,QAAS,EAAA;AACnD,EAAM,MAAA,WAAA,GAAc,WAAW,CAAG,EAAA,QAAQ,IAAI,aAAa,CAAA,CAAA,EAAI,QAAQ,CAAE,CAAA,CAAA;AAEzE,EAAA,gBAAA,CAAiB,eAAe,CAAA;AAEhC,EAAA,MAAM,eAAe,MAAM;AACzB,IAAA,eAAA,CAAgB,EAAE,CAAA;AAAA,GACpB;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,sCACG,aAAc,EAAA,EAAA,YAAA,EAA4B,cAA4B,CACvE,kBAAA,KAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,OAAA,EAAQ,MACZ,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,OAAO,CAAG,EAAA,QAAQ,CAAI,CAAA,EAAA,aAAa,IAAI,QAAQ,CAAA,CAAA;AAAA,MAC/C,IAAK,EAAA,MAAA;AAAA,MACL,QAAS,EAAA;AAAA;AAAA,GACX,kBACC,KAAA,CAAA,aAAA,CAAA,YAAA,EAAA,IAAA,kBACE,KAAA,CAAA,aAAA,CAAA,YAAA,CAAa,OAAb,EAAmB,IAAA,EAAK,EAAG,EAAA,KAAA,EAAM,UAChC,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,QAAK,SAAS,EAAA,IAAA,EAAC,SAAU,EAAA,KAAA,EAAA,kBACvB,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,MAAI,IAAC,EAAA,EAAA,EAAI,EAAI,EAAA,EAAA,EAAI,EACrB,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,UAAU,CAAG,EAAA,QAAQ,CAAI,CAAA,EAAA,aAAa,IAAI,QAAQ,CAAA;AAAA;AAAA,GAEtD,mBACC,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,MAAI,IAAC,EAAA,EAAA,EAAI,CAAG,EAAA,EAAA,EAAI,EACpB,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACC,UAAU,CAAG,EAAA,QAAQ,CAAI,CAAA,EAAA,aAAa,IAAI,QAAQ,CAAA,CAAA;AAAA,MAClD;AAAA;AAAA,GAEJ,mBACC,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,MAAI,IAAC,EAAA,EAAA,EAAI,CAAG,EAAA,EAAA,EAAI,EACpB,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,eAAA;AAAA,IAAA;AAAA,MACC,iBAAiB,CAAG,EAAA,QAAQ,CAAI,CAAA,EAAA,aAAa,IAAI,QAAQ,CAAA,CAAA;AAAA,MACzD,uBAAuB,WAAY,CAAA;AAAA;AAAA,GAEvC,CACF,CACF,CACF,CACF,CACF,CAAA;AAEJ;;;;"}

package/dist/components/RolesList/DeleteRole.esm.js

@@ -1,7 +1,8 @@
 import React from 'react';
 import { useDeleteDialog } from '@janus-idp/shared-react';
-import { Tooltip, IconButton } from '@material-ui/core';
 import Delete from '@mui/icons-material/Delete';
+import IconButton from '@mui/material/IconButton';
+import Tooltip from '@mui/material/Tooltip';
 import Typography from '@mui/material/Typography';
 
 const DeleteRole = ({

package/dist/components/RolesList/DeleteRole.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"DeleteRole.esm.js","sources":["../../../src/components/RolesList/DeleteRole.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React from 'react';\n\nimport { useDeleteDialog } from '@janus-idp/shared-react';\nimport { IconButton, Tooltip } from '@material-ui/core';\nimport Delete from '@mui/icons-material/Delete';\nimport Typography from '@mui/material/Typography';\n\ntype DeleteRoleProps = {\n  roleName: string;\n  disable: boolean;\n  tooltip?: string;\n  dataTestId: string;\n};\n\nconst DeleteRole = ({\n  roleName,\n  tooltip,\n  disable,\n  dataTestId,\n}: DeleteRoleProps) => {\n  const { setDeleteComponent, setOpenDialog } = useDeleteDialog();\n\n  const openDialog = (name: string) => {\n    setDeleteComponent({ roleName: name });\n    setOpenDialog(true);\n  };\n\n  return (\n    <Tooltip title={tooltip || ''}>\n      <Typography component=\"span\" data-testid={dataTestId}>\n        <IconButton\n          color=\"inherit\"\n          onClick={() => openDialog(roleName)}\n          aria-label=\"Delete\"\n          disabled={disable}\n          title={tooltip || 'Delete Role'}\n        >\n          <Delete />\n        </IconButton>\n      </Typography>\n    </Tooltip>\n  );\n};\nexport default DeleteRole;\n"],"names":[],"mappings":";;;;;;AA6BA,MAAM,aAAa,CAAC;AAAA,EAClB,QAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA;AACF,CAAuB,KAAA;AACrB,EAAA,MAAM,EAAE,kBAAA,EAAoB,aAAc,EAAA,GAAI,eAAgB,EAAA;AAE9D,EAAM,MAAA,UAAA,GAAa,CAAC,IAAiB,KAAA;AACnC,IAAmB,kBAAA,CAAA,EAAE,QAAU,EAAA,IAAA,EAAM,CAAA;AACrC,IAAA,aAAA,CAAc,IAAI,CAAA;AAAA,GACpB;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,OAAQ,EAAA,EAAA,KAAA,EAAO,OAAW,IAAA,EAAA,EAAA,sCACxB,UAAW,EAAA,EAAA,SAAA,EAAU,MAAO,EAAA,aAAA,EAAa,UACxC,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,KAAM,EAAA,SAAA;AAAA,MACN,OAAA,EAAS,MAAM,UAAA,CAAW,QAAQ,CAAA;AAAA,MAClC,YAAW,EAAA,QAAA;AAAA,MACX,QAAU,EAAA,OAAA;AAAA,MACV,OAAO,OAAW,IAAA;AAAA,KAAA;AAAA,wCAEjB,MAAO,EAAA,IAAA;AAAA,GAEZ,CACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"DeleteRole.esm.js","sources":["../../../src/components/RolesList/DeleteRole.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React from 'react';\n\nimport { useDeleteDialog } from '@janus-idp/shared-react';\nimport Delete from '@mui/icons-material/Delete';\nimport IconButton from '@mui/material/IconButton';\nimport Tooltip from '@mui/material/Tooltip';\nimport Typography from '@mui/material/Typography';\n\ntype DeleteRoleProps = {\n  roleName: string;\n  disable: boolean;\n  tooltip?: string;\n  dataTestId: string;\n};\n\nconst DeleteRole = ({\n  roleName,\n  tooltip,\n  disable,\n  dataTestId,\n}: DeleteRoleProps) => {\n  const { setDeleteComponent, setOpenDialog } = useDeleteDialog();\n\n  const openDialog = (name: string) => {\n    setDeleteComponent({ roleName: name });\n    setOpenDialog(true);\n  };\n\n  return (\n    <Tooltip title={tooltip || ''}>\n      <Typography component=\"span\" data-testid={dataTestId}>\n        <IconButton\n          color=\"inherit\"\n          onClick={() => openDialog(roleName)}\n          aria-label=\"Delete\"\n          disabled={disable}\n          title={tooltip || 'Delete Role'}\n        >\n          <Delete />\n        </IconButton>\n      </Typography>\n    </Tooltip>\n  );\n};\nexport default DeleteRole;\n"],"names":[],"mappings":";;;;;;;AA8BA,MAAM,aAAa,CAAC;AAAA,EAClB,QAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA;AACF,CAAuB,KAAA;AACrB,EAAA,MAAM,EAAE,kBAAA,EAAoB,aAAc,EAAA,GAAI,eAAgB,EAAA;AAE9D,EAAM,MAAA,UAAA,GAAa,CAAC,IAAiB,KAAA;AACnC,IAAmB,kBAAA,CAAA,EAAE,QAAU,EAAA,IAAA,EAAM,CAAA;AACrC,IAAA,aAAA,CAAc,IAAI,CAAA;AAAA,GACpB;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,OAAQ,EAAA,EAAA,KAAA,EAAO,OAAW,IAAA,EAAA,EAAA,sCACxB,UAAW,EAAA,EAAA,SAAA,EAAU,MAAO,EAAA,aAAA,EAAa,UACxC,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,KAAM,EAAA,SAAA;AAAA,MACN,OAAA,EAAS,MAAM,UAAA,CAAW,QAAQ,CAAA;AAAA,MAClC,YAAW,EAAA,QAAA;AAAA,MACX,QAAU,EAAA,OAAA;AAAA,MACV,OAAO,OAAW,IAAA;AAAA,KAAA;AAAA,wCAEjB,MAAO,EAAA,IAAA;AAAA,GAEZ,CACF,CAAA;AAEJ;;;;"}

package/dist/components/RolesList/DeleteRoleDialog.esm.js

@@ -1,37 +1,28 @@
 import React from 'react';
 import { useApi } from '@backstage/core-plugin-api';
-import { makeStyles, createStyles, Dialog, DialogTitle, Box, IconButton, DialogContent, TextField, DialogActions, Button } from '@material-ui/core';
-import CloseIcon from '@material-ui/icons/Close';
-import ErrorIcon from '@material-ui/icons/Error';
-import { Alert } from '@material-ui/lab';
+import CloseIcon from '@mui/icons-material/Close';
+import ErrorIcon from '@mui/icons-material/Error';
+import Alert from '@mui/material/Alert';
+import Box from '@mui/material/Box';
+import Button from '@mui/material/Button';
+import Dialog from '@mui/material/Dialog';
+import DialogActions from '@mui/material/DialogActions';
+import DialogContent from '@mui/material/DialogContent';
+import DialogTitle from '@mui/material/DialogTitle';
+import IconButton from '@mui/material/IconButton';
+import TextField from '@mui/material/TextField';
 import Typography from '@mui/material/Typography';
 import { rbacApiRef } from '../../api/RBACBackendClient.esm.js';
 import { getMembers } from '../../utils/rbac-utils.esm.js';
 import { removePermissions, removeConditions } from '../../utils/role-form-utils.esm.js';
 import { useToast } from '../ToastContext.esm.js';
 
-const useStyles = makeStyles(
-  (theme) => createStyles({
-    titleContainer: {
-      display: "flex",
-      alignItems: "center",
-      gap: theme.spacing(1)
-    },
-    closeButton: {
-      position: "absolute",
-      right: theme.spacing(1),
-      top: theme.spacing(1),
-      color: theme.palette.grey[500]
-    }
-  })
-);
 const DeleteRoleDialog = ({
   open,
   closeDialog,
   roleName,
   propOptions
 }) => {
-  const classes = useStyles();
   const { setToastMessage } = useToast();
   const [deleteRoleValue, setDeleteRoleValue] = React.useState();
   const [disableDelete, setDisableDelete] = React.useState(false);
@@ -72,26 +63,42 @@ const DeleteRoleDialog = ({
       setDisableDelete(true);
     }
   };
-  return /* @__PURE__ */ React.createElement(Dialog, { maxWidth: "md", open, onClose: closeDialog }, /* @__PURE__ */ React.createElement(DialogTitle, { id: "delete-role", title: "Delete Role" }, /* @__PURE__ */ React.createElement(Box, { className: classes.titleContainer }, /* @__PURE__ */ React.createElement(Typography, { component: "span", sx: { fontWeight: "bold" } }, /* @__PURE__ */ React.createElement(
-    ErrorIcon,
-    {
-      style: {
-        color: "red",
-        alignContent: "center",
-        marginTop: "7px",
-        marginBottom: "-3px"
-      },
-      fontSize: "small"
-    }
-  ), " ", "Delete this role?"), /* @__PURE__ */ React.createElement(
-    IconButton,
+  return /* @__PURE__ */ React.createElement(Dialog, { maxWidth: "md", open, onClose: closeDialog }, /* @__PURE__ */ React.createElement(DialogTitle, { id: "delete-role", title: "Delete Role" }, /* @__PURE__ */ React.createElement(
+    Box,
     {
-      "aria-label": "close",
-      className: classes.closeButton,
-      onClick: closeDialog
+      sx: {
+        display: "flex",
+        alignItems: "center",
+        gap: (theme) => theme.spacing(1)
+      }
     },
-    /* @__PURE__ */ React.createElement(CloseIcon, null)
-  ))), /* @__PURE__ */ React.createElement(DialogContent, null, "Are you sure you want to delete the role", " ", /* @__PURE__ */ React.createElement(Typography, { component: "span", sx: { fontWeight: "bold" } }, roleName), " ", "?", /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement("br", null), "Deleting this role is irreversible and will remove its functionality from the system. Proceed with caution.", /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement("br", null), "The", " ", /* @__PURE__ */ React.createElement(Typography, { component: "span", sx: { fontWeight: "bold" } }, `${getMembers(
+    /* @__PURE__ */ React.createElement(Typography, { component: "span", sx: { fontWeight: "bold" } }, /* @__PURE__ */ React.createElement(
+      ErrorIcon,
+      {
+        style: {
+          color: "red",
+          alignContent: "center",
+          marginTop: "7px",
+          marginBottom: "-3px"
+        },
+        fontSize: "small"
+      }
+    ), " ", "Delete this role?"),
+    /* @__PURE__ */ React.createElement(
+      IconButton,
+      {
+        "aria-label": "close",
+        sx: {
+          position: "absolute",
+          right: (theme) => theme.spacing(1),
+          top: (theme) => theme.spacing(1),
+          color: (theme) => theme.palette.grey[500]
+        },
+        onClick: closeDialog
+      },
+      /* @__PURE__ */ React.createElement(CloseIcon, null)
+    )
+  )), /* @__PURE__ */ React.createElement(DialogContent, null, "Are you sure you want to delete the role", " ", /* @__PURE__ */ React.createElement(Typography, { component: "span", sx: { fontWeight: "bold" } }, roleName), " ", "?", /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement("br", null), "Deleting this role is irreversible and will remove its functionality from the system. Proceed with caution.", /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement("br", null), "The", " ", /* @__PURE__ */ React.createElement(Typography, { component: "span", sx: { fontWeight: "bold" } }, `${getMembers(
     propOptions.memberRefs
   ).toLocaleLowerCase("en-US")}`), " ", "associated with this role will lose access to all the", " ", /* @__PURE__ */ React.createElement(
     Typography,

package/dist/components/RolesList/DeleteRoleDialog.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"DeleteRoleDialog.esm.js","sources":["../../../src/components/RolesList/DeleteRoleDialog.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React from 'react';\n\nimport { useApi } from '@backstage/core-plugin-api';\n\nimport {\n  Box,\n  Button,\n  createStyles,\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogTitle,\n  IconButton,\n  makeStyles,\n  TextField,\n  Theme,\n} from '@material-ui/core';\nimport CloseIcon from '@material-ui/icons/Close';\nimport ErrorIcon from '@material-ui/icons/Error';\nimport { Alert } from '@material-ui/lab';\nimport Typography from '@mui/material/Typography';\n\nimport { RoleBasedPolicy } from '@backstage-community/plugin-rbac-common';\n\nimport { rbacApiRef } from '../../api/RBACBackendClient';\nimport { getMembers } from '../../utils/rbac-utils';\nimport {\n  removeConditions,\n  removePermissions,\n} from '../../utils/role-form-utils';\nimport { useToast } from '../ToastContext';\n\nconst useStyles = makeStyles((theme: Theme) =>\n  createStyles({\n    titleContainer: {\n      display: 'flex',\n      alignItems: 'center',\n      gap: theme.spacing(1),\n    },\n    closeButton: {\n      position: 'absolute',\n      right: theme.spacing(1),\n      top: theme.spacing(1),\n      color: theme.palette.grey[500],\n    },\n  }),\n);\n\ntype DeleteRoleDialogProps = {\n  open: boolean;\n  closeDialog: () => void;\n  roleName: string;\n  propOptions: {\n    memberRefs: string[];\n    permissions: number;\n  };\n};\n\nconst DeleteRoleDialog = ({\n  open,\n  closeDialog,\n  roleName,\n  propOptions,\n}: DeleteRoleDialogProps) => {\n  const classes = useStyles();\n  const { setToastMessage } = useToast();\n  const [deleteRoleValue, setDeleteRoleValue] = React.useState<string>();\n  const [disableDelete, setDisableDelete] = React.useState(false);\n  const [error, setError] = React.useState<string>('');\n\n  const rbacApi = useApi(rbacApiRef);\n\n  const deleteRole = async () => {\n    try {\n      const policies = await rbacApi.getAssociatedPolicies(roleName);\n      const conditionalPolicies = await rbacApi.getRoleConditions(roleName);\n\n      if (Array.isArray(policies)) {\n        const allowedPolicies = policies.filter(\n          (policy: RoleBasedPolicy) => policy.effect !== 'deny',\n        );\n        await removePermissions(roleName, allowedPolicies, rbacApi);\n      }\n\n      if (Array.isArray(conditionalPolicies)) {\n        const conditionalPoliciesIds = conditionalPolicies.map(cp => cp.id);\n        await removeConditions(conditionalPoliciesIds, rbacApi);\n      }\n\n      const response = await rbacApi.deleteRole(roleName);\n      if (response.status === 200 || response.status === 204) {\n        setToastMessage(`Role ${roleName} deleted successfully`);\n        closeDialog();\n      } else {\n        setError(`Unable to delete the role. ${response.statusText}`);\n      }\n    } catch (err) {\n      setError(err instanceof Error ? err.message : `${err}`);\n    }\n  };\n\n  const onTextInput = (value: string) => {\n    setDeleteRoleValue(value);\n    if (value === '') {\n      setDisableDelete(true);\n    } else if (value === roleName) {\n      setDisableDelete(false);\n    } else {\n      setDisableDelete(true);\n    }\n  };\n\n  return (\n    <Dialog maxWidth=\"md\" open={open} onClose={closeDialog}>\n      <DialogTitle id=\"delete-role\" title=\"Delete Role\">\n        <Box className={classes.titleContainer}>\n          <Typography component=\"span\" sx={{ fontWeight: 'bold' }}>\n            <ErrorIcon\n              style={{\n                color: 'red',\n                alignContent: 'center',\n                marginTop: '7px',\n                marginBottom: '-3px',\n              }}\n              fontSize=\"small\"\n            />{' '}\n            Delete this role?\n          </Typography>\n\n          <IconButton\n            aria-label=\"close\"\n            className={classes.closeButton}\n            onClick={closeDialog}\n          >\n            <CloseIcon />\n          </IconButton>\n        </Box>\n      </DialogTitle>\n      <DialogContent>\n        Are you sure you want to delete the role{' '}\n        <Typography component=\"span\" sx={{ fontWeight: 'bold' }}>\n          {roleName}\n        </Typography>{' '}\n        ?\n        <br />\n        <br />\n        Deleting this role is irreversible and will remove its functionality\n        from the system. Proceed with caution.\n        <br />\n        <br />\n        The{' '}\n        <Typography component=\"span\" sx={{ fontWeight: 'bold' }}>{`${getMembers(\n          propOptions.memberRefs,\n        ).toLocaleLowerCase('en-US')}`}</Typography>{' '}\n        associated with this role will lose access to all the{' '}\n        <Typography\n          component=\"span\"\n          sx={{ fontWeight: 'bold' }}\n        >{`${propOptions.permissions} permission policies`}</Typography>{' '}\n        specified in this role.\n        <br />\n        <TextField\n          name=\"delete-role\"\n          data-testid=\"delete-role\"\n          style={{ marginTop: '24px' }}\n          required\n          variant=\"outlined\"\n          label=\"Role name\"\n          defaultValue={deleteRoleValue}\n          helperText=\"Type the name of the role to confirm\"\n          onChange={({ target: { value } }) => onTextInput(value)}\n          onBlur={({ target: { value } }) => onTextInput(value)}\n        />\n      </DialogContent>\n      {error && (\n        <Box maxWidth=\"650px\" marginLeft=\"20px\">\n          <Alert severity=\"error\">{error}</Alert>\n        </Box>\n      )}\n      <DialogActions\n        style={{\n          paddingLeft: '25px',\n          paddingBottom: '30px',\n          justifyContent: 'left',\n          paddingTop: '16px',\n        }}\n      >\n        <Button\n          variant=\"contained\"\n          style={\n            disableDelete || !deleteRoleValue\n              ? {}\n              : { background: 'red', color: 'white' }\n          }\n          onClick={deleteRole}\n          disabled={disableDelete || !deleteRoleValue}\n        >\n          Delete\n        </Button>\n        <Button variant=\"outlined\" onClick={closeDialog}>\n          Cancel\n        </Button>\n      </DialogActions>\n    </Dialog>\n  );\n};\n\nexport default DeleteRoleDialog;\n"],"names":[],"mappings":";;;;;;;;;;;;AA+CA,MAAM,SAAY,GAAA,UAAA;AAAA,EAAW,CAAC,UAC5B,YAAa,CAAA;AAAA,IACX,cAAgB,EAAA;AAAA,MACd,OAAS,EAAA,MAAA;AAAA,MACT,UAAY,EAAA,QAAA;AAAA,MACZ,GAAA,EAAK,KAAM,CAAA,OAAA,CAAQ,CAAC;AAAA,KACtB;AAAA,IACA,WAAa,EAAA;AAAA,MACX,QAAU,EAAA,UAAA;AAAA,MACV,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,MACtB,GAAA,EAAK,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,MACpB,KAAO,EAAA,KAAA,CAAM,OAAQ,CAAA,IAAA,CAAK,GAAG;AAAA;AAC/B,GACD;AACH,CAAA;AAYA,MAAM,mBAAmB,CAAC;AAAA,EACxB,IAAA;AAAA,EACA,WAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF,CAA6B,KAAA;AAC3B,EAAA,MAAM,UAAU,SAAU,EAAA;AAC1B,EAAM,MAAA,EAAE,eAAgB,EAAA,GAAI,QAAS,EAAA;AACrC,EAAA,MAAM,CAAC,eAAA,EAAiB,kBAAkB,CAAA,GAAI,MAAM,QAAiB,EAAA;AACrE,EAAA,MAAM,CAAC,aAAe,EAAA,gBAAgB,CAAI,GAAA,KAAA,CAAM,SAAS,KAAK,CAAA;AAC9D,EAAA,MAAM,CAAC,KAAO,EAAA,QAAQ,CAAI,GAAA,KAAA,CAAM,SAAiB,EAAE,CAAA;AAEnD,EAAM,MAAA,OAAA,GAAU,OAAO,UAAU,CAAA;AAEjC,EAAA,MAAM,aAAa,YAAY;AAC7B,IAAI,IAAA;AACF,MAAA,MAAM,QAAW,GAAA,MAAM,OAAQ,CAAA,qBAAA,CAAsB,QAAQ,CAAA;AAC7D,MAAA,MAAM,mBAAsB,GAAA,MAAM,OAAQ,CAAA,iBAAA,CAAkB,QAAQ,CAAA;AAEpE,MAAI,IAAA,KAAA,CAAM,OAAQ,CAAA,QAAQ,CAAG,EAAA;AAC3B,QAAA,MAAM,kBAAkB,QAAS,CAAA,MAAA;AAAA,UAC/B,CAAC,MAA4B,KAAA,MAAA,CAAO,MAAW,KAAA;AAAA,SACjD;AACA,QAAM,MAAA,iBAAA,CAAkB,QAAU,EAAA,eAAA,EAAiB,OAAO,CAAA;AAAA;AAG5D,MAAI,IAAA,KAAA,CAAM,OAAQ,CAAA,mBAAmB,CAAG,EAAA;AACtC,QAAA,MAAM,sBAAyB,GAAA,mBAAA,CAAoB,GAAI,CAAA,CAAA,EAAA,KAAM,GAAG,EAAE,CAAA;AAClE,QAAM,MAAA,gBAAA,CAAiB,wBAAwB,OAAO,CAAA;AAAA;AAGxD,MAAA,MAAM,QAAW,GAAA,MAAM,OAAQ,CAAA,UAAA,CAAW,QAAQ,CAAA;AAClD,MAAA,IAAI,QAAS,CAAA,MAAA,KAAW,GAAO,IAAA,QAAA,CAAS,WAAW,GAAK,EAAA;AACtD,QAAgB,eAAA,CAAA,CAAA,KAAA,EAAQ,QAAQ,CAAuB,qBAAA,CAAA,CAAA;AACvD,QAAY,WAAA,EAAA;AAAA,OACP,MAAA;AACL,QAAS,QAAA,CAAA,CAAA,2BAAA,EAA8B,QAAS,CAAA,UAAU,CAAE,CAAA,CAAA;AAAA;AAC9D,aACO,GAAK,EAAA;AACZ,MAAA,QAAA,CAAS,eAAe,KAAQ,GAAA,GAAA,CAAI,OAAU,GAAA,CAAA,EAAG,GAAG,CAAE,CAAA,CAAA;AAAA;AACxD,GACF;AAEA,EAAM,MAAA,WAAA,GAAc,CAAC,KAAkB,KAAA;AACrC,IAAA,kBAAA,CAAmB,KAAK,CAAA;AACxB,IAAA,IAAI,UAAU,EAAI,EAAA;AAChB,MAAA,gBAAA,CAAiB,IAAI,CAAA;AAAA,KACvB,MAAA,IAAW,UAAU,QAAU,EAAA;AAC7B,MAAA,gBAAA,CAAiB,KAAK,CAAA;AAAA,KACjB,MAAA;AACL,MAAA,gBAAA,CAAiB,IAAI,CAAA;AAAA;AACvB,GACF;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,MAAO,EAAA,EAAA,QAAA,EAAS,IAAK,EAAA,IAAA,EAAY,OAAS,EAAA,WAAA,EAAA,kBACxC,KAAA,CAAA,aAAA,CAAA,WAAA,EAAA,EAAY,EAAG,EAAA,aAAA,EAAc,KAAM,EAAA,aAAA,EAAA,sCACjC,GAAI,EAAA,EAAA,SAAA,EAAW,OAAQ,CAAA,cAAA,EAAA,kBACrB,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,SAAU,EAAA,MAAA,EAAO,EAAI,EAAA,EAAE,UAAY,EAAA,MAAA,EAC7C,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,KAAO,EAAA;AAAA,QACL,KAAO,EAAA,KAAA;AAAA,QACP,YAAc,EAAA,QAAA;AAAA,QACd,SAAW,EAAA,KAAA;AAAA,QACX,YAAc,EAAA;AAAA,OAChB;AAAA,MACA,QAAS,EAAA;AAAA;AAAA,GACX,EAAG,GAAI,EAAA,mBAET,CAEA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,YAAW,EAAA,OAAA;AAAA,MACX,WAAW,OAAQ,CAAA,WAAA;AAAA,MACnB,OAAS,EAAA;AAAA,KAAA;AAAA,wCAER,SAAU,EAAA,IAAA;AAAA,GAEf,CACF,CACA,kBAAA,KAAA,CAAA,aAAA,CAAC,qBAAc,0CAC4B,EAAA,GAAA,sCACxC,UAAW,EAAA,EAAA,SAAA,EAAU,QAAO,EAAI,EAAA,EAAE,YAAY,MAAO,EAAA,EAAA,EACnD,QACH,CAAc,EAAA,GAAA,EAAI,qBAEjB,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,IAAG,mBACH,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,IAAG,GAAE,6GAGN,kBAAA,KAAA,CAAA,aAAA,CAAC,UAAG,CACJ,kBAAA,KAAA,CAAA,aAAA,CAAC,UAAG,CAAE,EAAA,KAAA,EACF,qBACH,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,WAAU,MAAO,EAAA,EAAA,EAAI,EAAE,UAAY,EAAA,MAAA,MAAW,CAAG,EAAA,UAAA;AAAA,IAC3D,WAAY,CAAA;AAAA,GACd,CAAE,kBAAkB,OAAO,CAAC,EAAG,CAAc,EAAA,GAAA,EAAI,yDACK,GACtD,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,SAAU,EAAA,MAAA;AAAA,MACV,EAAA,EAAI,EAAE,UAAA,EAAY,MAAO;AAAA,KAAA;AAAA,IACzB,CAAA,EAAG,YAAY,WAAW,CAAA,oBAAA;AAAA,GAAqC,EAAA,GAAA,EAAI,yBAErE,kBAAA,KAAA,CAAA,aAAA,CAAC,UAAG,CACJ,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,IAAK,EAAA,aAAA;AAAA,MACL,aAAY,EAAA,aAAA;AAAA,MACZ,KAAA,EAAO,EAAE,SAAA,EAAW,MAAO,EAAA;AAAA,MAC3B,QAAQ,EAAA,IAAA;AAAA,MACR,OAAQ,EAAA,UAAA;AAAA,MACR,KAAM,EAAA,WAAA;AAAA,MACN,YAAc,EAAA,eAAA;AAAA,MACd,UAAW,EAAA,sCAAA;AAAA,MACX,QAAA,EAAU,CAAC,EAAE,MAAA,EAAQ,EAAE,KAAM,EAAA,EAAQ,KAAA,WAAA,CAAY,KAAK,CAAA;AAAA,MACtD,MAAA,EAAQ,CAAC,EAAE,MAAA,EAAQ,EAAE,KAAM,EAAA,EAAQ,KAAA,WAAA,CAAY,KAAK;AAAA;AAAA,GAExD,CAAA,EACC,KACC,oBAAA,KAAA,CAAA,aAAA,CAAC,OAAI,QAAS,EAAA,OAAA,EAAQ,UAAW,EAAA,MAAA,EAAA,sCAC9B,KAAM,EAAA,EAAA,QAAA,EAAS,OAAS,EAAA,EAAA,KAAM,CACjC,CAEF,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,aAAA;AAAA,IAAA;AAAA,MACC,KAAO,EAAA;AAAA,QACL,WAAa,EAAA,MAAA;AAAA,QACb,aAAe,EAAA,MAAA;AAAA,QACf,cAAgB,EAAA,MAAA;AAAA,QAChB,UAAY,EAAA;AAAA;AACd,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,OAAQ,EAAA,WAAA;AAAA,QACR,KAAA,EACE,aAAiB,IAAA,CAAC,eACd,GAAA,KACA,EAAE,UAAA,EAAY,KAAO,EAAA,KAAA,EAAO,OAAQ,EAAA;AAAA,QAE1C,OAAS,EAAA,UAAA;AAAA,QACT,QAAA,EAAU,iBAAiB,CAAC;AAAA,OAAA;AAAA,MAC7B;AAAA,KAED;AAAA,wCACC,MAAO,EAAA,EAAA,OAAA,EAAQ,UAAW,EAAA,OAAA,EAAS,eAAa,QAEjD;AAAA,GAEJ,CAAA;AAEJ;;;;"}
+{"version":3,"file":"DeleteRoleDialog.esm.js","sources":["../../../src/components/RolesList/DeleteRoleDialog.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React from 'react';\n\nimport { useApi } from '@backstage/core-plugin-api';\n\nimport CloseIcon from '@mui/icons-material/Close';\nimport ErrorIcon from '@mui/icons-material/Error';\nimport Alert from '@mui/material/Alert';\nimport Box from '@mui/material/Box';\nimport Button from '@mui/material/Button';\nimport Dialog from '@mui/material/Dialog';\nimport DialogActions from '@mui/material/DialogActions';\nimport DialogContent from '@mui/material/DialogContent';\nimport DialogTitle from '@mui/material/DialogTitle';\nimport IconButton from '@mui/material/IconButton';\nimport TextField from '@mui/material/TextField';\nimport Typography from '@mui/material/Typography';\n\nimport { RoleBasedPolicy } from '@backstage-community/plugin-rbac-common';\n\nimport { rbacApiRef } from '../../api/RBACBackendClient';\nimport { getMembers } from '../../utils/rbac-utils';\nimport {\n  removeConditions,\n  removePermissions,\n} from '../../utils/role-form-utils';\nimport { useToast } from '../ToastContext';\n\ntype DeleteRoleDialogProps = {\n  open: boolean;\n  closeDialog: () => void;\n  roleName: string;\n  propOptions: {\n    memberRefs: string[];\n    permissions: number;\n  };\n};\n\nconst DeleteRoleDialog = ({\n  open,\n  closeDialog,\n  roleName,\n  propOptions,\n}: DeleteRoleDialogProps) => {\n  const { setToastMessage } = useToast();\n  const [deleteRoleValue, setDeleteRoleValue] = React.useState<string>();\n  const [disableDelete, setDisableDelete] = React.useState(false);\n  const [error, setError] = React.useState<string>('');\n\n  const rbacApi = useApi(rbacApiRef);\n\n  const deleteRole = async () => {\n    try {\n      const policies = await rbacApi.getAssociatedPolicies(roleName);\n      const conditionalPolicies = await rbacApi.getRoleConditions(roleName);\n\n      if (Array.isArray(policies)) {\n        const allowedPolicies = policies.filter(\n          (policy: RoleBasedPolicy) => policy.effect !== 'deny',\n        );\n        await removePermissions(roleName, allowedPolicies, rbacApi);\n      }\n\n      if (Array.isArray(conditionalPolicies)) {\n        const conditionalPoliciesIds = conditionalPolicies.map(cp => cp.id);\n        await removeConditions(conditionalPoliciesIds, rbacApi);\n      }\n\n      const response = await rbacApi.deleteRole(roleName);\n      if (response.status === 200 || response.status === 204) {\n        setToastMessage(`Role ${roleName} deleted successfully`);\n        closeDialog();\n      } else {\n        setError(`Unable to delete the role. ${response.statusText}`);\n      }\n    } catch (err) {\n      setError(err instanceof Error ? err.message : `${err}`);\n    }\n  };\n\n  const onTextInput = (value: string) => {\n    setDeleteRoleValue(value);\n    if (value === '') {\n      setDisableDelete(true);\n    } else if (value === roleName) {\n      setDisableDelete(false);\n    } else {\n      setDisableDelete(true);\n    }\n  };\n\n  return (\n    <Dialog maxWidth=\"md\" open={open} onClose={closeDialog}>\n      <DialogTitle id=\"delete-role\" title=\"Delete Role\">\n        <Box\n          sx={{\n            display: 'flex',\n            alignItems: 'center',\n            gap: theme => theme.spacing(1),\n          }}\n        >\n          <Typography component=\"span\" sx={{ fontWeight: 'bold' }}>\n            <ErrorIcon\n              style={{\n                color: 'red',\n                alignContent: 'center',\n                marginTop: '7px',\n                marginBottom: '-3px',\n              }}\n              fontSize=\"small\"\n            />{' '}\n            Delete this role?\n          </Typography>\n\n          <IconButton\n            aria-label=\"close\"\n            sx={{\n              position: 'absolute',\n              right: theme => theme.spacing(1),\n              top: theme => theme.spacing(1),\n              color: theme => theme.palette.grey[500],\n            }}\n            onClick={closeDialog}\n          >\n            <CloseIcon />\n          </IconButton>\n        </Box>\n      </DialogTitle>\n      <DialogContent>\n        Are you sure you want to delete the role{' '}\n        <Typography component=\"span\" sx={{ fontWeight: 'bold' }}>\n          {roleName}\n        </Typography>{' '}\n        ?\n        <br />\n        <br />\n        Deleting this role is irreversible and will remove its functionality\n        from the system. Proceed with caution.\n        <br />\n        <br />\n        The{' '}\n        <Typography component=\"span\" sx={{ fontWeight: 'bold' }}>{`${getMembers(\n          propOptions.memberRefs,\n        ).toLocaleLowerCase('en-US')}`}</Typography>{' '}\n        associated with this role will lose access to all the{' '}\n        <Typography\n          component=\"span\"\n          sx={{ fontWeight: 'bold' }}\n        >{`${propOptions.permissions} permission policies`}</Typography>{' '}\n        specified in this role.\n        <br />\n        <TextField\n          name=\"delete-role\"\n          data-testid=\"delete-role\"\n          style={{ marginTop: '24px' }}\n          required\n          variant=\"outlined\"\n          label=\"Role name\"\n          defaultValue={deleteRoleValue}\n          helperText=\"Type the name of the role to confirm\"\n          onChange={({ target: { value } }) => onTextInput(value)}\n          onBlur={({ target: { value } }) => onTextInput(value)}\n        />\n      </DialogContent>\n      {error && (\n        <Box maxWidth=\"650px\" marginLeft=\"20px\">\n          <Alert severity=\"error\">{error}</Alert>\n        </Box>\n      )}\n      <DialogActions\n        style={{\n          paddingLeft: '25px',\n          paddingBottom: '30px',\n          justifyContent: 'left',\n          paddingTop: '16px',\n        }}\n      >\n        <Button\n          variant=\"contained\"\n          style={\n            disableDelete || !deleteRoleValue\n              ? {}\n              : { background: 'red', color: 'white' }\n          }\n          onClick={deleteRole}\n          disabled={disableDelete || !deleteRoleValue}\n        >\n          Delete\n        </Button>\n        <Button variant=\"outlined\" onClick={closeDialog}>\n          Cancel\n        </Button>\n      </DialogActions>\n    </Dialog>\n  );\n};\n\nexport default DeleteRoleDialog;\n"],"names":[],"mappings":"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"}

package/dist/components/RolesList/RolesList.esm.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Progress, WarningPanel, Table } from '@backstage/core-components';
 import { useDeleteDialog } from '@janus-idp/shared-react';
-import { makeStyles } from '@material-ui/core';
+import Box from '@mui/material/Box';
 import { useCheckIfLicensePluginEnabled } from '../../hooks/useCheckIfLicensePluginEnabled.esm.js';
 import { useLocationToast } from '../../hooks/useLocationToast.esm.js';
 import { useRoles } from '../../hooks/useRoles.esm.js';
@@ -12,19 +12,11 @@ import DeleteRoleDialog from './DeleteRoleDialog.esm.js';
 import { columns } from './RolesListColumns.esm.js';
 import { RolesListToolbar } from './RolesListToolbar.esm.js';
 
-const useStyles = makeStyles((theme) => ({
-  empty: {
-    padding: theme.spacing(2),
-    display: "flex",
-    justifyContent: "center"
-  }
-}));
 const RolesList = () => {
   const { toastMessage, setToastMessage } = useToast();
   const { openDialog, setOpenDialog, deleteComponent } = useDeleteDialog();
   useLocationToast(setToastMessage);
   const [roles, setRoles] = React.useState();
-  const classes = useStyles();
   const { loading, data, retry, createRoleAllowed, createRoleLoading, error } = useRoles();
   const closeDialog = () => {
     setOpenDialog(false);
@@ -82,7 +74,14 @@ const RolesList = () => {
       isLoading: loading,
       columns,
       renderSummaryRow: (summary) => onSearchResultsChange(summary.data),
-      emptyContent: /* @__PURE__ */ React.createElement("div", { "data-testid": "roles-table-empty", className: classes.empty }, "No records found")
+      emptyContent: /* @__PURE__ */ React.createElement(
+        Box,
+        {
+          "data-testid": "roles-table-empty",
+          sx: { display: "flex", justifyContent: "center", p: 2 }
+        },
+        "No records found"
+      )
     }
   ), isLicensePluginEnabled.isEnabled && /* @__PURE__ */ React.createElement(DownloadCSVLink, null), openDialog && /* @__PURE__ */ React.createElement(
     DeleteRoleDialog,

package/dist/components/RolesList/RolesList.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"RolesList.esm.js","sources":["../../../src/components/RolesList/RolesList.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React from 'react';\n\nimport { Progress, Table, WarningPanel } from '@backstage/core-components';\n\nimport { useDeleteDialog } from '@janus-idp/shared-react';\nimport { makeStyles } from '@material-ui/core';\n\nimport { useCheckIfLicensePluginEnabled } from '../../hooks/useCheckIfLicensePluginEnabled';\nimport { useLocationToast } from '../../hooks/useLocationToast';\nimport { useRoles } from '../../hooks/useRoles';\nimport { RolesData } from '../../types';\nimport DownloadCSVLink from '../DownloadUserStatistics';\nimport { SnackbarAlert } from '../SnackbarAlert';\nimport { useToast } from '../ToastContext';\nimport DeleteRoleDialog from './DeleteRoleDialog';\nimport { columns } from './RolesListColumns';\nimport { RolesListToolbar } from './RolesListToolbar';\n\nconst useStyles = makeStyles(theme => ({\n  empty: {\n    padding: theme.spacing(2),\n    display: 'flex',\n    justifyContent: 'center',\n  },\n}));\n\nexport const RolesList = () => {\n  const { toastMessage, setToastMessage } = useToast();\n  const { openDialog, setOpenDialog, deleteComponent } = useDeleteDialog();\n  useLocationToast(setToastMessage);\n  const [roles, setRoles] = React.useState<number | undefined>();\n  const classes = useStyles();\n  const { loading, data, retry, createRoleAllowed, createRoleLoading, error } =\n    useRoles();\n\n  const closeDialog = () => {\n    setOpenDialog(false);\n    retry.roleRetry();\n    retry.policiesRetry();\n  };\n\n  const onAlertClose = () => {\n    setToastMessage('');\n  };\n  const onSearchResultsChange = (searchResults: RolesData[]) => {\n    setRoles(searchResults.length);\n  };\n\n  const getErrorWarning = () => {\n    const errorTitleBase = 'Something went wrong while fetching the';\n    const errorWarningArr = [\n      { message: error?.rolesError, title: `${errorTitleBase} roles` },\n      {\n        message: error?.policiesError,\n        title: `${errorTitleBase} permission policies`,\n      },\n      {\n        message: error?.roleConditionError,\n        title: `${errorTitleBase} role conditions`,\n      },\n    ];\n\n    return (\n      errorWarningArr.find(({ message }) => message) || {\n        message: '',\n        title: '',\n      }\n    );\n  };\n\n  const errorWarning = getErrorWarning();\n\n  const isLicensePluginEnabled = useCheckIfLicensePluginEnabled();\n  if (isLicensePluginEnabled.loading) {\n    return <Progress />;\n  }\n\n  return (\n    <>\n      <SnackbarAlert toastMessage={toastMessage} onAlertClose={onAlertClose} />\n      <RolesListToolbar\n        createRoleAllowed={createRoleAllowed}\n        createRoleLoading={createRoleLoading}\n      />\n      {errorWarning.message && (\n        <div style={{ paddingBottom: '16px' }}>\n          <WarningPanel\n            message={errorWarning.message}\n            title={errorWarning.title}\n            severity=\"error\"\n          />\n        </div>\n      )}\n      <Table\n        title={\n          !loading && data?.length\n            ? `All roles (${roles ?? data.length})`\n            : `All roles`\n        }\n        options={{ padding: 'default', search: true, paging: true }}\n        data={data}\n        isLoading={loading}\n        columns={columns}\n        renderSummaryRow={summary => onSearchResultsChange(summary.data)}\n        emptyContent={\n          <div data-testid=\"roles-table-empty\" className={classes.empty}>\n            No records found\n          </div>\n        }\n      />\n      {isLicensePluginEnabled.isEnabled && <DownloadCSVLink />}\n      {openDialog && (\n        <DeleteRoleDialog\n          open={openDialog}\n          closeDialog={closeDialog}\n          roleName={deleteComponent.roleName}\n          propOptions={{\n            memberRefs:\n              data.find(d => d.name === deleteComponent.roleName)?.members ||\n              [],\n            permissions:\n              data.find(d => d.name === deleteComponent.roleName)\n                ?.permissions || 0,\n          }}\n        />\n      )}\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"RolesList.esm.js","sources":["../../../src/components/RolesList/RolesList.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React from 'react';\n\nimport { Progress, Table, WarningPanel } from '@backstage/core-components';\n\nimport { useDeleteDialog } from '@janus-idp/shared-react';\nimport Box from '@mui/material/Box';\n\nimport { useCheckIfLicensePluginEnabled } from '../../hooks/useCheckIfLicensePluginEnabled';\nimport { useLocationToast } from '../../hooks/useLocationToast';\nimport { useRoles } from '../../hooks/useRoles';\nimport { RolesData } from '../../types';\nimport DownloadCSVLink from '../DownloadUserStatistics';\nimport { SnackbarAlert } from '../SnackbarAlert';\nimport { useToast } from '../ToastContext';\nimport DeleteRoleDialog from './DeleteRoleDialog';\nimport { columns } from './RolesListColumns';\nimport { RolesListToolbar } from './RolesListToolbar';\n\nexport const RolesList = () => {\n  const { toastMessage, setToastMessage } = useToast();\n  const { openDialog, setOpenDialog, deleteComponent } = useDeleteDialog();\n  useLocationToast(setToastMessage);\n  const [roles, setRoles] = React.useState<number | undefined>();\n  const { loading, data, retry, createRoleAllowed, createRoleLoading, error } =\n    useRoles();\n\n  const closeDialog = () => {\n    setOpenDialog(false);\n    retry.roleRetry();\n    retry.policiesRetry();\n  };\n\n  const onAlertClose = () => {\n    setToastMessage('');\n  };\n  const onSearchResultsChange = (searchResults: RolesData[]) => {\n    setRoles(searchResults.length);\n  };\n\n  const getErrorWarning = () => {\n    const errorTitleBase = 'Something went wrong while fetching the';\n    const errorWarningArr = [\n      { message: error?.rolesError, title: `${errorTitleBase} roles` },\n      {\n        message: error?.policiesError,\n        title: `${errorTitleBase} permission policies`,\n      },\n      {\n        message: error?.roleConditionError,\n        title: `${errorTitleBase} role conditions`,\n      },\n    ];\n\n    return (\n      errorWarningArr.find(({ message }) => message) || {\n        message: '',\n        title: '',\n      }\n    );\n  };\n\n  const errorWarning = getErrorWarning();\n\n  const isLicensePluginEnabled = useCheckIfLicensePluginEnabled();\n  if (isLicensePluginEnabled.loading) {\n    return <Progress />;\n  }\n\n  return (\n    <>\n      <SnackbarAlert toastMessage={toastMessage} onAlertClose={onAlertClose} />\n      <RolesListToolbar\n        createRoleAllowed={createRoleAllowed}\n        createRoleLoading={createRoleLoading}\n      />\n      {errorWarning.message && (\n        <div style={{ paddingBottom: '16px' }}>\n          <WarningPanel\n            message={errorWarning.message}\n            title={errorWarning.title}\n            severity=\"error\"\n          />\n        </div>\n      )}\n      <Table\n        title={\n          !loading && data?.length\n            ? `All roles (${roles ?? data.length})`\n            : `All roles`\n        }\n        options={{ padding: 'default', search: true, paging: true }}\n        data={data}\n        isLoading={loading}\n        columns={columns}\n        renderSummaryRow={summary => onSearchResultsChange(summary.data)}\n        emptyContent={\n          <Box\n            data-testid=\"roles-table-empty\"\n            sx={{ display: 'flex', justifyContent: 'center', p: 2 }}\n          >\n            No records found\n          </Box>\n        }\n      />\n      {isLicensePluginEnabled.isEnabled && <DownloadCSVLink />}\n      {openDialog && (\n        <DeleteRoleDialog\n          open={openDialog}\n          closeDialog={closeDialog}\n          roleName={deleteComponent.roleName}\n          propOptions={{\n            memberRefs:\n              data.find(d => d.name === deleteComponent.roleName)?.members ||\n              [],\n            permissions:\n              data.find(d => d.name === deleteComponent.roleName)\n                ?.permissions || 0,\n          }}\n        />\n      )}\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/RolesList/RolesListColumns.esm.js

@@ -1,7 +1,8 @@
 import React from 'react';
 import { parseEntityRef } from '@backstage/catalog-model';
 import { Link } from '@backstage/core-components';
-import { Tooltip, Typography } from '@material-ui/core';
+import Tooltip from '@mui/material/Tooltip';
+import Typography from '@mui/material/Typography';
 import { getMembers } from '../../utils/rbac-utils.esm.js';
 import EditRole from '../EditRole.esm.js';
 import DeleteRole from './DeleteRole.esm.js';

package/dist/components/RolesList/RolesListColumns.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"RolesListColumns.esm.js","sources":["../../../src/components/RolesList/RolesListColumns.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React from 'react';\n\nimport { parseEntityRef } from '@backstage/catalog-model';\nimport { Link, TableColumn } from '@backstage/core-components';\n\nimport { Tooltip, Typography } from '@material-ui/core';\n\nimport { RolesData } from '../../types';\nimport { getMembers } from '../../utils/rbac-utils';\nimport EditRole from '../EditRole';\nimport DeleteRole from './DeleteRole';\n\nexport const columns: TableColumn<RolesData>[] = [\n  {\n    title: 'Name',\n    field: 'name',\n    type: 'string',\n    render: (props: RolesData) => {\n      const { kind, namespace, name } = parseEntityRef(props.name);\n      return (\n        <Link to={`roles/${kind}/${namespace}/${name}`}>{props.name}</Link>\n      );\n    },\n  },\n  {\n    title: 'Users and groups',\n    field: 'members',\n    type: 'string',\n    align: 'left',\n    render: props => getMembers(props.members),\n    customSort: (a, b) => {\n      if (a.members.length === 0) {\n        return -1;\n      }\n      if (b.members.length === 0) {\n        return 1;\n      }\n      if (a.members.length === b.members.length) {\n        return 0;\n      }\n      return a.members.length < b.members.length ? -1 : 1;\n    },\n  },\n  {\n    title: 'Accessible plugins',\n    field: 'accessiblePlugins',\n    type: 'string',\n    align: 'left',\n    render: (props: RolesData) => {\n      const pls = props.accessiblePlugins.map(\n        p => p[0].toLocaleUpperCase('en-US') + p.slice(1),\n      );\n      const plsTooltip = pls.join(', ');\n      const plsOverflowCount = pls.length > 2 ? `+ ${pls.length - 2}` : '';\n\n      return pls.length > 0 ? (\n        <Tooltip title={plsTooltip || ''} placement=\"top-start\">\n          <Typography>\n            {pls.length === 1\n              ? `${pls[0]}`\n              : `${pls[0]}, ${pls[1]} ${plsOverflowCount}`}\n          </Typography>\n        </Tooltip>\n      ) : (\n        '-'\n      );\n    },\n  },\n  {\n    title: 'Actions',\n    sorting: false,\n    render: (props: RolesData) => (\n      <>\n        <EditRole\n          dataTestId={\n            !props.actionsPermissionResults.edit.allowed\n              ? `disable-update-role-${props.name}`\n              : `update-role-${props.name}`\n          }\n          roleName={props.name}\n          disable={!props.actionsPermissionResults.edit.allowed}\n          tooltip={\n            !props.actionsPermissionResults.edit.allowed\n              ? 'Unauthorized to edit'\n              : ''\n          }\n        />\n        <DeleteRole\n          dataTestId={\n            !props.actionsPermissionResults.delete.allowed\n              ? `disable-delete-role-${props.name}`\n              : `delete-role-${props.name}`\n          }\n          roleName={props.name}\n          disable={!props.actionsPermissionResults.delete.allowed}\n          tooltip={\n            !props.actionsPermissionResults.delete.allowed\n              ? 'Role cannot be deleted'\n              : ''\n          }\n        />\n      </>\n    ),\n  },\n];\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"RolesListColumns.esm.js","sources":["../../../src/components/RolesList/RolesListColumns.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React from 'react';\n\nimport { parseEntityRef } from '@backstage/catalog-model';\nimport { Link, TableColumn } from '@backstage/core-components';\n\nimport Tooltip from '@mui/material/Tooltip';\nimport Typography from '@mui/material/Typography';\n\nimport { RolesData } from '../../types';\nimport { getMembers } from '../../utils/rbac-utils';\nimport EditRole from '../EditRole';\nimport DeleteRole from './DeleteRole';\n\nexport const columns: TableColumn<RolesData>[] = [\n  {\n    title: 'Name',\n    field: 'name',\n    type: 'string',\n    render: (props: RolesData) => {\n      const { kind, namespace, name } = parseEntityRef(props.name);\n      return (\n        <Link to={`roles/${kind}/${namespace}/${name}`}>{props.name}</Link>\n      );\n    },\n  },\n  {\n    title: 'Users and groups',\n    field: 'members',\n    type: 'string',\n    align: 'left',\n    render: props => getMembers(props.members),\n    customSort: (a, b) => {\n      if (a.members.length === 0) {\n        return -1;\n      }\n      if (b.members.length === 0) {\n        return 1;\n      }\n      if (a.members.length === b.members.length) {\n        return 0;\n      }\n      return a.members.length < b.members.length ? -1 : 1;\n    },\n  },\n  {\n    title: 'Accessible plugins',\n    field: 'accessiblePlugins',\n    type: 'string',\n    align: 'left',\n    render: (props: RolesData) => {\n      const pls = props.accessiblePlugins.map(\n        p => p[0].toLocaleUpperCase('en-US') + p.slice(1),\n      );\n      const plsTooltip = pls.join(', ');\n      const plsOverflowCount = pls.length > 2 ? `+ ${pls.length - 2}` : '';\n\n      return pls.length > 0 ? (\n        <Tooltip title={plsTooltip || ''} placement=\"top-start\">\n          <Typography>\n            {pls.length === 1\n              ? `${pls[0]}`\n              : `${pls[0]}, ${pls[1]} ${plsOverflowCount}`}\n          </Typography>\n        </Tooltip>\n      ) : (\n        '-'\n      );\n    },\n  },\n  {\n    title: 'Actions',\n    sorting: false,\n    render: (props: RolesData) => (\n      <>\n        <EditRole\n          dataTestId={\n            !props.actionsPermissionResults.edit.allowed\n              ? `disable-update-role-${props.name}`\n              : `update-role-${props.name}`\n          }\n          roleName={props.name}\n          disable={!props.actionsPermissionResults.edit.allowed}\n          tooltip={\n            !props.actionsPermissionResults.edit.allowed\n              ? 'Unauthorized to edit'\n              : ''\n          }\n        />\n        <DeleteRole\n          dataTestId={\n            !props.actionsPermissionResults.delete.allowed\n              ? `disable-delete-role-${props.name}`\n              : `delete-role-${props.name}`\n          }\n          roleName={props.name}\n          disable={!props.actionsPermissionResults.delete.allowed}\n          tooltip={\n            !props.actionsPermissionResults.delete.allowed\n              ? 'Role cannot be deleted'\n              : ''\n          }\n        />\n      </>\n    ),\n  },\n];\n"],"names":[],"mappings":"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"}

package/dist/components/RolesList/RolesListToolbar.esm.js

@@ -1,47 +1,50 @@
 import React from 'react';
-import { LinkButton } from '@backstage/core-components';
-import { makeStyles } from '@material-ui/core';
-import Alert from '@material-ui/lab/Alert';
-import AlertTitle from '@material-ui/lab/AlertTitle';
+import { Link, LinkButton } from '@backstage/core-components';
+import Alert from '@mui/material/Alert';
+import AlertTitle from '@mui/material/AlertTitle';
 import Typography from '@mui/material/Typography';
 
-const useStyles = makeStyles((theme) => ({
-  toolbar: {
-    display: "flex",
-    justifyContent: "end",
-    marginBottom: "24px"
-  },
-  rbacPreReqLink: {
-    color: theme.palette.link
-  },
-  alertTitle: {
-    fontWeight: "bold"
-  }
-}));
 const RolesListToolbar = ({
   createRoleAllowed,
   createRoleLoading
 }) => {
-  const classes = useStyles();
-  return /* @__PURE__ */ React.createElement("div", null, !createRoleLoading && !createRoleAllowed && /* @__PURE__ */ React.createElement(Alert, { severity: "warning", "data-testid": "create-role-warning" }, /* @__PURE__ */ React.createElement(AlertTitle, { className: classes.alertTitle }, "Unable to create role."), "To enable create/edit role button, make sure required users/groups are available in catalog as a role cannot be created without users/groups and also the role associated with your user should have the permission policies mentioned", " ", /* @__PURE__ */ React.createElement(
-    "a",
+  return /* @__PURE__ */ React.createElement("div", null, !createRoleLoading && !createRoleAllowed && /* @__PURE__ */ React.createElement(Alert, { severity: "warning", "data-testid": "create-role-warning" }, /* @__PURE__ */ React.createElement(
+    AlertTitle,
     {
-      href: "https://github.com/backstage/community-plugins/tree/main/workspaces/rbac/plugins/rbac#prerequisites",
-      target: "blank",
-      className: classes.rbacPreReqLink
+      sx: {
+        fontWeight: "bold"
+      }
+    },
+    "Unable to create role."
+  ), "To enable create/edit role button, make sure required users/groups are available in catalog as a role cannot be created without users/groups and also the role associated with your user should have the permission policies mentioned", " ", /* @__PURE__ */ React.createElement(
+    Link,
+    {
+      to: "https://github.com/backstage/community-plugins/tree/main/workspaces/rbac/plugins/rbac#prerequisites",
+      target: "_blank"
     },
     "here"
-  ), ".", /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement(Typography, null, /* @__PURE__ */ React.createElement(Typography, { component: "span", sx: { fontWeight: "bold" } }, "Note"), ": Even after ingesting users/groups in catalog and applying above permissions if the create/edit button is still disabled then please contact your administrator as you might be conditionally restricted from accessing the create/edit button.")), /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement(Typography, { component: "span", className: classes.toolbar }, /* @__PURE__ */ React.createElement(
-    LinkButton,
+  ), /* @__PURE__ */ React.createElement(Typography, { sx: { mt: 1 }, fontSize: "small" }, /* @__PURE__ */ React.createElement(Typography, { component: "span", fontWeight: "bold", fontSize: "small" }, "Note"), ": Even after ingesting users/groups in catalog and applying above permissions if the create/edit button is still disabled then please contact your administrator as you might be conditionally restricted from accessing the create/edit button.")), /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement(
+    Typography,
     {
-      to: "role/new",
-      color: "primary",
-      variant: "contained",
-      disabled: !createRoleAllowed,
-      "data-testid": "create-role"
+      component: "span",
+      sx: {
+        display: "flex",
+        justifyContent: "end",
+        marginBottom: "24px"
+      }
     },
-    "Create"
-  )));
+    /* @__PURE__ */ React.createElement(
+      LinkButton,
+      {
+        to: "role/new",
+        color: "primary",
+        variant: "contained",
+        disabled: !createRoleAllowed,
+        "data-testid": "create-role"
+      },
+      "Create"
+    )
+  ));
 };
 
 export { RolesListToolbar };

package/dist/components/RolesList/RolesListToolbar.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"RolesListToolbar.esm.js","sources":["../../../src/components/RolesList/RolesListToolbar.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React from 'react';\n\nimport { LinkButton } from '@backstage/core-components';\n\nimport { makeStyles } from '@material-ui/core';\nimport Alert from '@material-ui/lab/Alert';\nimport AlertTitle from '@material-ui/lab/AlertTitle';\nimport Typography from '@mui/material/Typography';\n\nconst useStyles = makeStyles(theme => ({\n  toolbar: {\n    display: 'flex',\n    justifyContent: 'end',\n    marginBottom: '24px',\n  },\n  rbacPreReqLink: {\n    color: theme.palette.link,\n  },\n  alertTitle: {\n    fontWeight: 'bold',\n  },\n}));\n\nexport const RolesListToolbar = ({\n  createRoleAllowed,\n  createRoleLoading,\n}: {\n  createRoleAllowed: boolean;\n  createRoleLoading: boolean;\n}) => {\n  const classes = useStyles();\n  return (\n    <div>\n      {!createRoleLoading && !createRoleAllowed && (\n        <Alert severity=\"warning\" data-testid=\"create-role-warning\">\n          <AlertTitle className={classes.alertTitle}>\n            Unable to create role.\n          </AlertTitle>\n          To enable create/edit role button, make sure required users/groups are\n          available in catalog as a role cannot be created without users/groups\n          and also the role associated with your user should have the permission\n          policies mentioned{' '}\n          <a\n            href=\"https://github.com/backstage/community-plugins/tree/main/workspaces/rbac/plugins/rbac#prerequisites\"\n            target=\"blank\"\n            className={classes.rbacPreReqLink}\n          >\n            here\n          </a>\n          .\n          <br />\n          <Typography>\n            <Typography component=\"span\" sx={{ fontWeight: 'bold' }}>\n              Note\n            </Typography>\n            : Even after ingesting users/groups in catalog and applying above\n            permissions if the create/edit button is still disabled then please\n            contact your administrator as you might be conditionally restricted\n            from accessing the create/edit button.\n          </Typography>\n        </Alert>\n      )}\n      <br />\n      <Typography component=\"span\" className={classes.toolbar}>\n        <LinkButton\n          to=\"role/new\"\n          color=\"primary\"\n          variant=\"contained\"\n          disabled={!createRoleAllowed}\n          data-testid=\"create-role\"\n        >\n          Create\n        </LinkButton>\n      </Typography>\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;AAwBA,MAAM,SAAA,GAAY,WAAW,CAAU,KAAA,MAAA;AAAA,EACrC,OAAS,EAAA;AAAA,IACP,OAAS,EAAA,MAAA;AAAA,IACT,cAAgB,EAAA,KAAA;AAAA,IAChB,YAAc,EAAA;AAAA,GAChB;AAAA,EACA,cAAgB,EAAA;AAAA,IACd,KAAA,EAAO,MAAM,OAAQ,CAAA;AAAA,GACvB;AAAA,EACA,UAAY,EAAA;AAAA,IACV,UAAY,EAAA;AAAA;AAEhB,CAAE,CAAA,CAAA;AAEK,MAAM,mBAAmB,CAAC;AAAA,EAC/B,iBAAA;AAAA,EACA;AACF,CAGM,KAAA;AACJ,EAAA,MAAM,UAAU,SAAU,EAAA;AAC1B,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,aACE,CAAC,iBAAA,IAAqB,CAAC,iBACtB,oBAAA,KAAA,CAAA,aAAA,CAAC,SAAM,QAAS,EAAA,SAAA,EAAU,eAAY,qBACpC,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,cAAW,SAAW,EAAA,OAAA,CAAQ,cAAY,wBAE3C,CAAA,EAAa,0OAIM,GACnB,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,IAAK,EAAA,qGAAA;AAAA,MACL,MAAO,EAAA,OAAA;AAAA,MACP,WAAW,OAAQ,CAAA;AAAA,KAAA;AAAA,IACpB;AAAA,GAEG,EAAA,GAAA,kBAEH,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,IAAG,CACJ,kBAAA,KAAA,CAAA,aAAA,CAAC,UACC,EAAA,IAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,UAAW,EAAA,EAAA,SAAA,EAAU,MAAO,EAAA,EAAA,EAAI,EAAE,UAAY,EAAA,MAAA,EAAU,EAAA,EAAA,MAEzD,CAAa,EAAA,kPAKf,CACF,CAAA,kBAED,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,IAAG,CACJ,kBAAA,KAAA,CAAA,aAAA,CAAC,UAAW,EAAA,EAAA,SAAA,EAAU,MAAO,EAAA,SAAA,EAAW,QAAQ,OAC9C,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,EAAG,EAAA,UAAA;AAAA,MACH,KAAM,EAAA,SAAA;AAAA,MACN,OAAQ,EAAA,WAAA;AAAA,MACR,UAAU,CAAC,iBAAA;AAAA,MACX,aAAY,EAAA;AAAA,KAAA;AAAA,IACb;AAAA,GAGH,CACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"RolesListToolbar.esm.js","sources":["../../../src/components/RolesList/RolesListToolbar.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React from 'react';\n\nimport { Link, LinkButton } from '@backstage/core-components';\n\nimport Alert from '@mui/material/Alert';\nimport AlertTitle from '@mui/material/AlertTitle';\nimport Typography from '@mui/material/Typography';\n\nexport const RolesListToolbar = ({\n  createRoleAllowed,\n  createRoleLoading,\n}: {\n  createRoleAllowed: boolean;\n  createRoleLoading: boolean;\n}) => {\n  return (\n    <div>\n      {!createRoleLoading && !createRoleAllowed && (\n        <Alert severity=\"warning\" data-testid=\"create-role-warning\">\n          <AlertTitle\n            sx={{\n              fontWeight: 'bold',\n            }}\n          >\n            Unable to create role.\n          </AlertTitle>\n          To enable create/edit role button, make sure required users/groups are\n          available in catalog as a role cannot be created without users/groups\n          and also the role associated with your user should have the permission\n          policies mentioned{' '}\n          <Link\n            to=\"https://github.com/backstage/community-plugins/tree/main/workspaces/rbac/plugins/rbac#prerequisites\"\n            target=\"_blank\"\n          >\n            here\n          </Link>\n          <Typography sx={{ mt: 1 }} fontSize=\"small\">\n            <Typography component=\"span\" fontWeight=\"bold\" fontSize=\"small\">\n              Note\n            </Typography>\n            : Even after ingesting users/groups in catalog and applying above\n            permissions if the create/edit button is still disabled then please\n            contact your administrator as you might be conditionally restricted\n            from accessing the create/edit button.\n          </Typography>\n        </Alert>\n      )}\n      <br />\n      <Typography\n        component=\"span\"\n        sx={{\n          display: 'flex',\n          justifyContent: 'end',\n          marginBottom: '24px',\n        }}\n      >\n        <LinkButton\n          to=\"role/new\"\n          color=\"primary\"\n          variant=\"contained\"\n          disabled={!createRoleAllowed}\n          data-testid=\"create-role\"\n        >\n          Create\n        </LinkButton>\n      </Typography>\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAuBO,MAAM,mBAAmB,CAAC;AAAA,EAC/B,iBAAA;AAAA,EACA;AACF,CAGM,KAAA;AACJ,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,KACE,EAAA,IAAA,EAAA,CAAC,iBAAqB,IAAA,CAAC,iBACtB,oBAAA,KAAA,CAAA,aAAA,CAAC,KAAM,EAAA,EAAA,QAAA,EAAS,SAAU,EAAA,aAAA,EAAY,qBACpC,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,EAAI,EAAA;AAAA,QACF,UAAY,EAAA;AAAA;AACd,KAAA;AAAA,IACD;AAAA,GAED,EAAa,0OAIM,GACnB,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,EAAG,EAAA,qGAAA;AAAA,MACH,MAAO,EAAA;AAAA,KAAA;AAAA,IACR;AAAA,GAED,kBACC,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,EAAI,EAAA,EAAE,IAAI,CAAE,EAAA,EAAG,QAAS,EAAA,OAAA,EAAA,kBACjC,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,WAAU,MAAO,EAAA,UAAA,EAAW,MAAO,EAAA,QAAA,EAAS,OAAQ,EAAA,EAAA,MAEhE,CAAa,EAAA,kPAKf,CACF,CAAA,kBAED,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,IAAG,CACJ,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,SAAU,EAAA,MAAA;AAAA,MACV,EAAI,EAAA;AAAA,QACF,OAAS,EAAA,MAAA;AAAA,QACT,cAAgB,EAAA,KAAA;AAAA,QAChB,YAAc,EAAA;AAAA;AAChB,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,EAAG,EAAA,UAAA;AAAA,QACH,KAAM,EAAA,SAAA;AAAA,QACN,OAAQ,EAAA,WAAA;AAAA,QACR,UAAU,CAAC,iBAAA;AAAA,QACX,aAAY,EAAA;AAAA,OAAA;AAAA,MACb;AAAA;AAED,GAEJ,CAAA;AAEJ;;;;"}

package/dist/components/SnackbarAlert.esm.js

@@ -1,6 +1,6 @@
 import React from 'react';
-import Snackbar from '@material-ui/core/Snackbar';
-import Alert from '@material-ui/lab/Alert';
+import Alert from '@mui/material/Alert';
+import Snackbar from '@mui/material/Snackbar';
 
 const SnackbarAlert = ({
   toastMessage,

package/dist/components/SnackbarAlert.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"SnackbarAlert.esm.js","sources":["../../src/components/SnackbarAlert.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React from 'react';\n\nimport Snackbar from '@material-ui/core/Snackbar';\nimport Alert from '@material-ui/lab/Alert';\n\nexport const SnackbarAlert = ({\n  toastMessage,\n  onAlertClose,\n}: {\n  toastMessage: string;\n  onAlertClose: () => void;\n}) => {\n  return (\n    <Snackbar\n      open={toastMessage !== ''}\n      autoHideDuration={10000}\n      anchorOrigin={{ vertical: 'top', horizontal: 'right' }}\n      style={{ top: '100px', left: '0px', justifyContent: 'center' }}\n      onClose={onAlertClose}\n    >\n      <Alert onClose={onAlertClose} severity=\"success\">\n        {toastMessage}\n      </Alert>\n    </Snackbar>\n  );\n};\n"],"names":[],"mappings":";;;;AAoBO,MAAM,gBAAgB,CAAC;AAAA,EAC5B,YAAA;AAAA,EACA;AACF,CAGM,KAAA;AACJ,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,MAAM,YAAiB,KAAA,EAAA;AAAA,MACvB,gBAAkB,EAAA,GAAA;AAAA,MAClB,YAAc,EAAA,EAAE,QAAU,EAAA,KAAA,EAAO,YAAY,OAAQ,EAAA;AAAA,MACrD,OAAO,EAAE,GAAA,EAAK,SAAS,IAAM,EAAA,KAAA,EAAO,gBAAgB,QAAS,EAAA;AAAA,MAC7D,OAAS,EAAA;AAAA,KAAA;AAAA,wCAER,KAAM,EAAA,EAAA,OAAA,EAAS,YAAc,EAAA,QAAA,EAAS,aACpC,YACH;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"SnackbarAlert.esm.js","sources":["../../src/components/SnackbarAlert.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React from 'react';\n\nimport Alert from '@mui/material/Alert';\nimport Snackbar from '@mui/material/Snackbar';\n\nexport const SnackbarAlert = ({\n  toastMessage,\n  onAlertClose,\n}: {\n  toastMessage: string;\n  onAlertClose: () => void;\n}) => {\n  return (\n    <Snackbar\n      open={toastMessage !== ''}\n      autoHideDuration={10000}\n      anchorOrigin={{ vertical: 'top', horizontal: 'right' }}\n      style={{ top: '100px', left: '0px', justifyContent: 'center' }}\n      onClose={onAlertClose}\n    >\n      <Alert onClose={onAlertClose} severity=\"success\">\n        {toastMessage}\n      </Alert>\n    </Snackbar>\n  );\n};\n"],"names":[],"mappings":";;;;AAoBO,MAAM,gBAAgB,CAAC;AAAA,EAC5B,YAAA;AAAA,EACA;AACF,CAGM,KAAA;AACJ,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,MAAM,YAAiB,KAAA,EAAA;AAAA,MACvB,gBAAkB,EAAA,GAAA;AAAA,MAClB,YAAc,EAAA,EAAE,QAAU,EAAA,KAAA,EAAO,YAAY,OAAQ,EAAA;AAAA,MACrD,OAAO,EAAE,GAAA,EAAK,SAAS,IAAM,EAAA,KAAA,EAAO,gBAAgB,QAAS,EAAA;AAAA,MAC7D,OAAS,EAAA;AAAA,KAAA;AAAA,wCAER,KAAM,EAAA,EAAA,OAAA,EAAS,YAAc,EAAA,QAAA,EAAS,aACpC,YACH;AAAA,GACF;AAEJ;;;;"}