feat(PermissionCatalogField): adapt loader for new form

packages/web/src/components/PermissionCatalogField/PermissionCatalogFieldLoader/index.jsx

@@ -1,7 +1,5 @@
 import {
-  IconButton,
   Skeleton,
-  Stack,
   Table,
   TableBody,
   TableCell,
@@ -10,7 +8,6 @@ import {
   TableRow,
   Typography,
 } from '@mui/material';
-import SettingsIcon from '@mui/icons-material/Settings';
 
 import ControlledCheckbox from 'components/ControlledCheckbox';
 
@@ -21,7 +18,7 @@ const PermissionCatalogFieldLoader = () => {
         <TableHead>
           <TableRow>
             <TableCell component="th" />
-            {[...Array(5)].map((row, index) => (
+            {[...Array(4)].map((row, index) => (
               <TableCell key={index} component="th">
                 <Skeleton />
               </TableCell>
@@ -30,27 +27,26 @@ const PermissionCatalogFieldLoader = () => {
           </TableRow>
         </TableHead>
         <TableBody>
-          {[...Array(3)].map((row, index) => (
-            <TableRow key={index} sx={{ '&:last-child td': { border: 0 } }}>
+          {[...Array(3)].map((row, subjectIndex) => (
+            <TableRow
+              key={subjectIndex}
+              sx={{ '&:last-child td': { border: 0 } }}
+            >
               <TableCell scope="row">
                 <Skeleton width={40} />
               </TableCell>
 
-              {[...Array(5)].map((action, index) => (
-                <TableCell key={index} align="center">
-                  <Typography variant="subtitle2">
-                    <ControlledCheckbox name="value" disabled />
-                  </Typography>
-                </TableCell>
-              ))}
-
-              <TableCell>
-                <Stack direction="row" gap={1} justifyContent="right">
-                  <IconButton color="info" size="small" disabled>
-                    <SettingsIcon />
-                  </IconButton>
-                </Stack>
-              </TableCell>
+              {[...Array(4)].map(
+                (action, actionIndex) =>
+                  (subjectIndex !== 2 ||
+                    (actionIndex !== 3 && actionIndex !== 2)) && (
+                    <TableCell key={actionIndex} align="center">
+                      <Typography variant="subtitle2">
+                        <ControlledCheckbox name="value" disabled />
+                      </Typography>
+                    </TableCell>
+                  ),
+              )}
             </TableRow>
           ))}
         </TableBody>

packages/web/src/components/PermissionCatalogField/index.ee.jsx

@@ -1,7 +1,4 @@
-import SettingsIcon from '@mui/icons-material/Settings';
-import IconButton from '@mui/material/IconButton';
 import Paper from '@mui/material/Paper';
-import Stack from '@mui/material/Stack';
 import Table from '@mui/material/Table';
 import TableBody from '@mui/material/TableBody';
 import TableCell from '@mui/material/TableCell';
@@ -12,13 +9,11 @@ import Typography from '@mui/material/Typography';
 import PropTypes from 'prop-types';
 import * as React from 'react';
 
-import ControlledCheckbox from 'components/ControlledCheckbox';
 import usePermissionCatalog from 'hooks/usePermissionCatalog.ee';
 import useFormatMessage from 'hooks/useFormatMessage';
 import AllEntitiesPermissions from './AllEntitiesPermissions';
 import ConditionField from './OwnEntitiesPermission';
 import PermissionCatalogFieldLoader from './PermissionCatalogFieldLoader';
-import PermissionSettings from './PermissionSettings.ee';
 
 const PermissionCatalogField = ({
   name = 'permissions',
@@ -30,7 +25,6 @@ const PermissionCatalogField = ({
   const { data, isLoading: isPermissionCatalogLoading } =
     usePermissionCatalog();
   const permissionCatalog = data?.data;
-  const [dialogName, setDialogName] = React.useState();
 
   if (isPermissionCatalogLoading || loading)
     return <PermissionCatalogFieldLoader />;