@strapi/plugin-users-permissions 5.12.1 → 5.12.3

package/dist/admin/chunks/index-DvubCYNe.js

@@ -1,1537 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
-var admin = require('@strapi/strapi/admin');
-var reactRouterDom = require('react-router-dom');
-var index = require('./index-DD-Z6c1S.js');
-var designSystem = require('@strapi/design-system');
-var icons = require('@strapi/icons');
-var formik = require('formik');
-var reactIntl = require('react-intl');
-var reactQuery = require('react-query');
-var PropTypes = require('prop-types');
-var upperFirst = require('lodash/upperFirst');
-var sortBy = require('lodash/sortBy');
-var get = require('lodash/get');
-var styledComponents = require('styled-components');
-var immer = require('immer');
-var isEmpty = require('lodash/isEmpty');
-var without = require('lodash/without');
-var map = require('lodash/map');
-var tail = require('lodash/tail');
-var set = require('lodash/set');
-var take = require('lodash/take');
-var yup = require('yup');
-
-function _interopNamespaceDefault(e) {
-  var n = Object.create(null);
-  if (e) {
-    Object.keys(e).forEach(function (k) {
-      if (k !== 'default') {
-        var d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: function () { return e[k]; }
-        });
-      }
-    });
-  }
-  n.default = e;
-  return Object.freeze(n);
-}
-
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
-var yup__namespace = /*#__PURE__*/_interopNamespaceDefault(yup);
-
-const UsersPermissions$2 = /*#__PURE__*/ React.createContext({});
-const UsersPermissionsProvider = ({ children, value })=>{
-    return /*#__PURE__*/ jsxRuntime.jsx(UsersPermissions$2.Provider, {
-        value: value,
-        children: children
-    });
-};
-const useUsersPermissions = ()=>React.useContext(UsersPermissions$2);
-UsersPermissionsProvider.propTypes = {
-    children: PropTypes.node.isRequired,
-    value: PropTypes.object.isRequired
-};
-
-function formatPluginName(pluginSlug) {
-    switch(pluginSlug){
-        case 'application':
-            return 'Application';
-        case 'plugin::content-manager':
-            return 'Content manager';
-        case 'plugin::content-type-builder':
-            return 'Content types builder';
-        case 'plugin::documentation':
-            return 'Documentation';
-        case 'plugin::email':
-            return 'Email';
-        case 'plugin::i18n':
-            return 'i18n';
-        case 'plugin::upload':
-            return 'Upload';
-        case 'plugin::users-permissions':
-            return 'Users-permissions';
-        default:
-            return upperFirst(pluginSlug.replace('api::', '').replace('plugin::', ''));
-    }
-}
-
-const init$1 = (initialState, permissions)=>{
-    const collapses = Object.keys(permissions).sort().map((name)=>({
-            name,
-            isOpen: false
-        }));
-    return {
-        ...initialState,
-        collapses
-    };
-};
-
-const activeCheckboxWrapperStyles = styledComponents.css`
-  background: ${(props)=>props.theme.colors.primary100};
-
-  #cog {
-    opacity: 1;
-  }
-`;
-const CheckboxWrapper = styledComponents.styled(designSystem.Box)`
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-
-  #cog {
-    opacity: 0;
-    path {
-      fill: ${(props)=>props.theme.colors.primary600};
-    }
-  }
-
-  /* Show active style both on hover and when the action is selected */
-  ${(props)=>props.isActive && activeCheckboxWrapperStyles}
-  &:hover {
-    ${activeCheckboxWrapperStyles}
-  }
-`;
-
-const Border = styledComponents.styled.div`
-  flex: 1;
-  align-self: center;
-  border-top: 1px solid ${({ theme })=>theme.colors.neutral150};
-`;
-const SubCategory = ({ subCategory })=>{
-    const { formatMessage } = reactIntl.useIntl();
-    const { onChange, onChangeSelectAll, onSelectedAction, selectedAction, modifiedData } = useUsersPermissions();
-    const currentScopedModifiedData = React.useMemo(()=>{
-        return get(modifiedData, subCategory.name, {});
-    }, [
-        modifiedData,
-        subCategory
-    ]);
-    const hasAllActionsSelected = React.useMemo(()=>{
-        return Object.values(currentScopedModifiedData).every((action)=>action.enabled === true);
-    }, [
-        currentScopedModifiedData
-    ]);
-    const hasSomeActionsSelected = React.useMemo(()=>{
-        return Object.values(currentScopedModifiedData).some((action)=>action.enabled === true) && !hasAllActionsSelected;
-    }, [
-        currentScopedModifiedData,
-        hasAllActionsSelected
-    ]);
-    const handleChangeSelectAll = React.useCallback(({ target: { name } })=>{
-        onChangeSelectAll({
-            target: {
-                name,
-                value: !hasAllActionsSelected
-            }
-        });
-    }, [
-        hasAllActionsSelected,
-        onChangeSelectAll
-    ]);
-    const isActionSelected = React.useCallback((actionName)=>{
-        return selectedAction === actionName;
-    }, [
-        selectedAction
-    ]);
-    return /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Box, {
-        children: [
-            /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
-                justifyContent: "space-between",
-                alignItems: "center",
-                children: [
-                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
-                        paddingRight: 4,
-                        children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                            variant: "sigma",
-                            textColor: "neutral600",
-                            children: subCategory.label
-                        })
-                    }),
-                    /*#__PURE__*/ jsxRuntime.jsx(Border, {}),
-                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
-                        paddingLeft: 4,
-                        children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Checkbox, {
-                            name: subCategory.name,
-                            checked: hasSomeActionsSelected ? 'indeterminate' : hasAllActionsSelected,
-                            onCheckedChange: (value)=>handleChangeSelectAll({
-                                    target: {
-                                        name: subCategory.name,
-                                        value
-                                    }
-                                }),
-                            children: formatMessage({
-                                id: 'app.utils.select-all',
-                                defaultMessage: 'Select all'
-                            })
-                        })
-                    })
-                ]
-            }),
-            /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
-                paddingTop: 6,
-                paddingBottom: 6,
-                children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Grid.Root, {
-                    gap: 2,
-                    style: {
-                        flex: 1
-                    },
-                    children: subCategory.actions.map((action)=>{
-                        const name = `${action.name}.enabled`;
-                        return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Grid.Item, {
-                            col: 6,
-                            direction: "column",
-                            alignItems: "stretch",
-                            children: /*#__PURE__*/ jsxRuntime.jsxs(CheckboxWrapper, {
-                                isActive: isActionSelected(action.name),
-                                padding: 2,
-                                hasRadius: true,
-                                children: [
-                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Checkbox, {
-                                        checked: get(modifiedData, name, false),
-                                        name: name,
-                                        onCheckedChange: (value)=>onChange({
-                                                target: {
-                                                    name,
-                                                    value
-                                                }
-                                            }),
-                                        children: action.label
-                                    }),
-                                    /*#__PURE__*/ jsxRuntime.jsxs("button", {
-                                        type: "button",
-                                        onClick: ()=>onSelectedAction(action.name),
-                                        style: {
-                                            display: 'inline-flex',
-                                            alignItems: 'center'
-                                        },
-                                        children: [
-                                            /*#__PURE__*/ jsxRuntime.jsx(designSystem.VisuallyHidden, {
-                                                tag: "span",
-                                                children: formatMessage({
-                                                    id: 'app.utils.show-bound-route',
-                                                    defaultMessage: 'Show bound route for {route}'
-                                                }, {
-                                                    route: action.name
-                                                })
-                                            }),
-                                            /*#__PURE__*/ jsxRuntime.jsx(icons.Cog, {
-                                                id: "cog",
-                                                cursor: "pointer"
-                                            })
-                                        ]
-                                    })
-                                ]
-                            })
-                        }, action.name);
-                    })
-                })
-            })
-        ]
-    });
-};
-SubCategory.propTypes = {
-    subCategory: PropTypes.object.isRequired
-};
-
-const PermissionRow = ({ name, permissions })=>{
-    const subCategories = React.useMemo(()=>{
-        return sortBy(Object.values(permissions.controllers).reduce((acc, curr, index)=>{
-            const currentName = `${name}.controllers.${Object.keys(permissions.controllers)[index]}`;
-            const actions = sortBy(Object.keys(curr).reduce((acc, current)=>{
-                return [
-                    ...acc,
-                    {
-                        ...curr[current],
-                        label: current,
-                        name: `${currentName}.${current}`
-                    }
-                ];
-            }, []), 'label');
-            return [
-                ...acc,
-                {
-                    actions,
-                    label: Object.keys(permissions.controllers)[index],
-                    name: currentName
-                }
-            ];
-        }, []), 'label');
-    }, [
-        name,
-        permissions
-    ]);
-    return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
-        padding: 6,
-        children: subCategories.map((subCategory)=>/*#__PURE__*/ jsxRuntime.jsx(SubCategory, {
-                subCategory: subCategory
-            }, subCategory.name))
-    });
-};
-PermissionRow.propTypes = {
-    name: PropTypes.string.isRequired,
-    permissions: PropTypes.object.isRequired
-};
-
-const initialState$1 = {
-    collapses: []
-};
-const reducer$1 = (state, action)=>// eslint-disable-next-line consistent-return
-    immer.produce(state, (draftState)=>{
-        switch(action.type){
-            case 'TOGGLE_COLLAPSE':
-                {
-                    draftState.collapses = state.collapses.map((collapse, index)=>{
-                        if (index === action.index) {
-                            return {
-                                ...collapse,
-                                isOpen: !collapse.isOpen
-                            };
-                        }
-                        return {
-                            ...collapse,
-                            isOpen: false
-                        };
-                    });
-                    break;
-                }
-            default:
-                return draftState;
-        }
-    });
-
-const Permissions = ()=>{
-    const { modifiedData } = useUsersPermissions();
-    const { formatMessage } = reactIntl.useIntl();
-    const [{ collapses }] = React.useReducer(reducer$1, initialState$1, (state)=>init$1(state, modifiedData));
-    return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Accordion.Root, {
-        size: "M",
-        children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
-            direction: "column",
-            alignItems: "stretch",
-            gap: 1,
-            children: collapses.map((collapse, index)=>/*#__PURE__*/ jsxRuntime.jsxs(designSystem.Accordion.Item, {
-                    value: collapse.name,
-                    children: [
-                        /*#__PURE__*/ jsxRuntime.jsx(designSystem.Accordion.Header, {
-                            variant: index % 2 === 0 ? 'secondary' : undefined,
-                            children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Accordion.Trigger, {
-                                caretPosition: "right",
-                                description: formatMessage({
-                                    id: 'users-permissions.Plugin.permissions.plugins.description',
-                                    defaultMessage: 'Define all allowed actions for the {name} plugin.'
-                                }, {
-                                    name: collapse.name
-                                }),
-                                children: formatPluginName(collapse.name)
-                            })
-                        }),
-                        /*#__PURE__*/ jsxRuntime.jsx(designSystem.Accordion.Content, {
-                            children: /*#__PURE__*/ jsxRuntime.jsx(PermissionRow, {
-                                permissions: modifiedData[collapse.name],
-                                name: collapse.name
-                            })
-                        })
-                    ]
-                }, collapse.name))
-        })
-    });
-};
-
-const getMethodColor = (verb)=>{
-    switch(verb){
-        case 'POST':
-            {
-                return {
-                    text: 'success600',
-                    border: 'success200',
-                    background: 'success100'
-                };
-            }
-        case 'GET':
-            {
-                return {
-                    text: 'secondary600',
-                    border: 'secondary200',
-                    background: 'secondary100'
-                };
-            }
-        case 'PUT':
-            {
-                return {
-                    text: 'warning600',
-                    border: 'warning200',
-                    background: 'warning100'
-                };
-            }
-        case 'DELETE':
-            {
-                return {
-                    text: 'danger600',
-                    border: 'danger200',
-                    background: 'danger100'
-                };
-            }
-        default:
-            {
-                return {
-                    text: 'neutral600',
-                    border: 'neutral200',
-                    background: 'neutral100'
-                };
-            }
-    }
-};
-
-const MethodBox = styledComponents.styled(designSystem.Box)`
-  margin: -1px;
-  border-radius: ${({ theme })=>theme.spaces[1]} 0 0 ${({ theme })=>theme.spaces[1]};
-`;
-function BoundRoute({ route }) {
-    const { formatMessage } = reactIntl.useIntl();
-    const { method, handler: title, path } = route;
-    const formattedRoute = path ? tail(path.split('/')) : [];
-    const [controller = '', action = ''] = title ? title.split('.') : [];
-    const colors = getMethodColor(route.method);
-    return /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
-        direction: "column",
-        alignItems: "stretch",
-        gap: 2,
-        children: [
-            /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Typography, {
-                variant: "delta",
-                tag: "h3",
-                children: [
-                    formatMessage({
-                        id: 'users-permissions.BoundRoute.title',
-                        defaultMessage: 'Bound route to'
-                    }),
-                    " ",
-                    /*#__PURE__*/ jsxRuntime.jsx("span", {
-                        children: controller
-                    }),
-                    /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Typography, {
-                        variant: "delta",
-                        textColor: "primary600",
-                        children: [
-                            ".",
-                            action
-                        ]
-                    })
-                ]
-            }),
-            /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
-                hasRadius: true,
-                background: "neutral0",
-                borderColor: "neutral200",
-                gap: 0,
-                children: [
-                    /*#__PURE__*/ jsxRuntime.jsx(MethodBox, {
-                        background: colors.background,
-                        borderColor: colors.border,
-                        padding: 2,
-                        children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                            fontWeight: "bold",
-                            textColor: colors.text,
-                            children: method
-                        })
-                    }),
-                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
-                        paddingLeft: 2,
-                        paddingRight: 2,
-                        children: map(formattedRoute, (value)=>/*#__PURE__*/ jsxRuntime.jsxs(designSystem.Typography, {
-                                textColor: value.includes(':') ? 'neutral600' : 'neutral900',
-                                children: [
-                                    "/",
-                                    value
-                                ]
-                            }, value))
-                    })
-                ]
-            })
-        ]
-    });
-}
-BoundRoute.defaultProps = {
-    route: {
-        handler: 'Nocontroller.error',
-        method: 'GET',
-        path: '/there-is-no-path'
-    }
-};
-BoundRoute.propTypes = {
-    route: PropTypes.shape({
-        handler: PropTypes.string,
-        method: PropTypes.string,
-        path: PropTypes.string
-    })
-};
-
-const Policies = ()=>{
-    const { formatMessage } = reactIntl.useIntl();
-    const { selectedAction, routes } = useUsersPermissions();
-    const path = without(selectedAction.split('.'), 'controllers');
-    const controllerRoutes = get(routes, path[0]);
-    const pathResolved = path.slice(1).join('.');
-    const displayedRoutes = isEmpty(controllerRoutes) ? [] : controllerRoutes.filter((o)=>o.handler.endsWith(pathResolved));
-    return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Grid.Item, {
-        col: 5,
-        background: "neutral150",
-        paddingTop: 6,
-        paddingBottom: 6,
-        paddingLeft: 7,
-        paddingRight: 7,
-        style: {
-            minHeight: '100%'
-        },
-        direction: "column",
-        alignItems: "stretch",
-        children: selectedAction ? /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
-            direction: "column",
-            alignItems: "stretch",
-            gap: 2,
-            children: displayedRoutes.map((route, key)=>// eslint-disable-next-line react/no-array-index-key
-                /*#__PURE__*/ jsxRuntime.jsx(BoundRoute, {
-                    route: route
-                }, key))
-        }) : /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
-            direction: "column",
-            alignItems: "stretch",
-            gap: 2,
-            children: [
-                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                    variant: "delta",
-                    tag: "h3",
-                    children: formatMessage({
-                        id: 'users-permissions.Policies.header.title',
-                        defaultMessage: 'Advanced settings'
-                    })
-                }),
-                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                    tag: "p",
-                    textColor: "neutral600",
-                    children: formatMessage({
-                        id: 'users-permissions.Policies.header.hint',
-                        defaultMessage: "Select the application's actions or the plugin's actions and click on the cog icon to display the bound route"
-                    })
-                })
-            ]
-        })
-    });
-};
-
-const init = (state, permissions, routes)=>{
-    return {
-        ...state,
-        initialData: permissions,
-        modifiedData: permissions,
-        routes
-    };
-};
-
-const initialState = {
-    initialData: {},
-    modifiedData: {},
-    routes: {},
-    selectedAction: '',
-    policies: []
-};
-const reducer = (state, action)=>immer.produce(state, (draftState)=>{
-        switch(action.type){
-            case 'ON_CHANGE':
-                {
-                    const keysLength = action.keys.length;
-                    const isChangingCheckbox = action.keys[keysLength - 1] === 'enabled';
-                    if (action.value && isChangingCheckbox) {
-                        const selectedAction = take(action.keys, keysLength - 1).join('.');
-                        draftState.selectedAction = selectedAction;
-                    }
-                    set(draftState, [
-                        'modifiedData',
-                        ...action.keys
-                    ], action.value);
-                    break;
-                }
-            case 'ON_CHANGE_SELECT_ALL':
-                {
-                    const pathToValue = [
-                        'modifiedData',
-                        ...action.keys
-                    ];
-                    const oldValues = get(state, pathToValue, {});
-                    const updatedValues = Object.keys(oldValues).reduce((acc, current)=>{
-                        acc[current] = {
-                            ...oldValues[current],
-                            enabled: action.value
-                        };
-                        return acc;
-                    }, {});
-                    set(draftState, pathToValue, updatedValues);
-                    break;
-                }
-            case 'ON_RESET':
-                {
-                    draftState.modifiedData = state.initialData;
-                    break;
-                }
-            case 'ON_SUBMIT_SUCCEEDED':
-                {
-                    draftState.initialData = state.modifiedData;
-                    break;
-                }
-            case 'SELECT_ACTION':
-                {
-                    const { actionToSelect } = action;
-                    draftState.selectedAction = actionToSelect === state.selectedAction ? '' : actionToSelect;
-                    break;
-                }
-            default:
-                return draftState;
-        }
-    });
-
-const UsersPermissions = /*#__PURE__*/ React.forwardRef(({ permissions, routes }, ref)=>{
-    const { formatMessage } = reactIntl.useIntl();
-    const [state, dispatch] = React.useReducer(reducer, initialState, (state)=>init(state, permissions, routes));
-    React.useImperativeHandle(ref, ()=>({
-            getPermissions () {
-                return {
-                    permissions: state.modifiedData
-                };
-            },
-            resetForm () {
-                dispatch({
-                    type: 'ON_RESET'
-                });
-            },
-            setFormAfterSubmit () {
-                dispatch({
-                    type: 'ON_SUBMIT_SUCCEEDED'
-                });
-            }
-        }));
-    const handleChange = ({ target: { name, value } })=>dispatch({
-            type: 'ON_CHANGE',
-            keys: name.split('.'),
-            value: value === 'empty__string_value' ? '' : value
-        });
-    const handleChangeSelectAll = ({ target: { name, value } })=>dispatch({
-            type: 'ON_CHANGE_SELECT_ALL',
-            keys: name.split('.'),
-            value
-        });
-    const handleSelectedAction = (actionToSelect)=>dispatch({
-            type: 'SELECT_ACTION',
-            actionToSelect
-        });
-    const providerValue = {
-        ...state,
-        onChange: handleChange,
-        onChangeSelectAll: handleChangeSelectAll,
-        onSelectedAction: handleSelectedAction
-    };
-    return /*#__PURE__*/ jsxRuntime.jsx(UsersPermissionsProvider, {
-        value: providerValue,
-        children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Grid.Root, {
-            gap: 0,
-            shadow: "filterShadow",
-            hasRadius: true,
-            background: "neutral0",
-            children: [
-                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Grid.Item, {
-                    col: 7,
-                    paddingTop: 6,
-                    paddingBottom: 6,
-                    paddingLeft: 7,
-                    paddingRight: 7,
-                    direction: "column",
-                    alignItems: "stretch",
-                    children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
-                        direction: "column",
-                        alignItems: "stretch",
-                        gap: 6,
-                        children: [
-                            /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
-                                direction: "column",
-                                alignItems: "stretch",
-                                gap: 2,
-                                children: [
-                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                                        variant: "delta",
-                                        tag: "h2",
-                                        children: formatMessage({
-                                            id: index.getTrad('Plugins.header.title'),
-                                            defaultMessage: 'Permissions'
-                                        })
-                                    }),
-                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                                        tag: "p",
-                                        textColor: "neutral600",
-                                        children: formatMessage({
-                                            id: index.getTrad('Plugins.header.description'),
-                                            defaultMessage: 'Only actions bound by a route are listed below.'
-                                        })
-                                    })
-                                ]
-                            }),
-                            /*#__PURE__*/ jsxRuntime.jsx(Permissions, {})
-                        ]
-                    })
-                }),
-                /*#__PURE__*/ jsxRuntime.jsx(Policies, {})
-            ]
-        })
-    });
-});
-UsersPermissions.propTypes = {
-    permissions: PropTypes.object.isRequired,
-    routes: PropTypes.object.isRequired
-};
-var UsersPermissions$1 = /*#__PURE__*/ React.memo(UsersPermissions);
-
-const createRoleSchema = yup__namespace.object().shape({
-    name: yup__namespace.string().required(admin.translatedErrors.required.id),
-    description: yup__namespace.string().required(admin.translatedErrors.required.id)
-});
-
-const cleanPermissions = (permissions)=>Object.keys(permissions).reduce((acc, current)=>{
-        const currentPermission = permissions[current].controllers;
-        const cleanedControllers = Object.keys(currentPermission).reduce((acc2, curr)=>{
-            if (isEmpty(currentPermission[curr])) {
-                return acc2;
-            }
-            acc2[curr] = currentPermission[curr];
-            return acc2;
-        }, {});
-        if (isEmpty(cleanedControllers)) {
-            return acc;
-        }
-        acc[current] = {
-            controllers: cleanedControllers
-        };
-        return acc;
-    }, {});
-
-const usePlugins = ()=>{
-    const { toggleNotification } = admin.useNotification();
-    const { get } = admin.useFetchClient();
-    const { formatAPIError } = admin.useAPIErrorHandler(index.getTrad);
-    const [{ data: permissions, isLoading: isLoadingPermissions, error: permissionsError, refetch: refetchPermissions }, { data: routes, isLoading: isLoadingRoutes, error: routesError, refetch: refetchRoutes }] = reactQuery.useQueries([
-        {
-            queryKey: [
-                'users-permissions',
-                'permissions'
-            ],
-            async queryFn () {
-                const { data: { permissions } } = await get(`/users-permissions/permissions`);
-                return permissions;
-            }
-        },
-        {
-            queryKey: [
-                'users-permissions',
-                'routes'
-            ],
-            async queryFn () {
-                const { data: { routes } } = await get(`/users-permissions/routes`);
-                return routes;
-            }
-        }
-    ]);
-    const refetchQueries = async ()=>{
-        await Promise.all([
-            refetchPermissions(),
-            refetchRoutes()
-        ]);
-    };
-    React.useEffect(()=>{
-        if (permissionsError) {
-            toggleNotification({
-                type: 'danger',
-                message: formatAPIError(permissionsError)
-            });
-        }
-    }, [
-        toggleNotification,
-        permissionsError,
-        formatAPIError
-    ]);
-    React.useEffect(()=>{
-        if (routesError) {
-            toggleNotification({
-                type: 'danger',
-                message: formatAPIError(routesError)
-            });
-        }
-    }, [
-        toggleNotification,
-        routesError,
-        formatAPIError
-    ]);
-    const isLoading = isLoadingPermissions || isLoadingRoutes;
-    return {
-        // TODO: these return values need to be memoized, otherwise
-        // they will create infinite rendering loops when used as
-        // effect dependencies
-        permissions: permissions ? cleanPermissions(permissions) : {},
-        routes: routes ?? {},
-        getData: refetchQueries,
-        isLoading
-    };
-};
-
-const CreatePage = ()=>{
-    const { formatMessage } = reactIntl.useIntl();
-    const { toggleNotification } = admin.useNotification();
-    const navigate = reactRouterDom.useNavigate();
-    const { isLoading: isLoadingPlugins, permissions, routes } = usePlugins();
-    const { trackUsage } = admin.useTracking();
-    const permissionsRef = React__namespace.useRef();
-    const { post } = admin.useFetchClient();
-    const mutation = reactQuery.useMutation((body)=>post(`/users-permissions/roles`, body), {
-        onError () {
-            toggleNotification({
-                type: 'danger',
-                message: formatMessage({
-                    id: 'notification.error',
-                    defaultMessage: 'An error occurred'
-                })
-            });
-        },
-        onSuccess () {
-            trackUsage('didCreateRole');
-            toggleNotification({
-                type: 'success',
-                message: formatMessage({
-                    id: index.getTrad('Settings.roles.created'),
-                    defaultMessage: 'Role created'
-                })
-            });
-            // Forcing redirecting since we don't have the id in the response
-            navigate(-1);
-        }
-    });
-    const handleCreateRoleSubmit = async (data)=>{
-        // TODO: refactor. Child -> parent component communication is evil;
-        // We should either move the provider one level up or move the state
-        // straight into redux.
-        const permissions = permissionsRef.current.getPermissions();
-        await mutation.mutate({
-            ...data,
-            ...permissions,
-            users: []
-        });
-    };
-    return /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Main, {
-        children: [
-            /*#__PURE__*/ jsxRuntime.jsx(admin.Page.Title, {
-                children: formatMessage({
-                    id: 'Settings.PageTitle',
-                    defaultMessage: 'Settings - {name}'
-                }, {
-                    name: 'Roles'
-                })
-            }),
-            /*#__PURE__*/ jsxRuntime.jsx(formik.Formik, {
-                enableReinitialize: true,
-                initialValues: {
-                    name: '',
-                    description: ''
-                },
-                onSubmit: handleCreateRoleSubmit,
-                validationSchema: createRoleSchema,
-                children: ({ handleSubmit, values, handleChange, errors })=>/*#__PURE__*/ jsxRuntime.jsxs(formik.Form, {
-                        noValidate: true,
-                        onSubmit: handleSubmit,
-                        children: [
-                            /*#__PURE__*/ jsxRuntime.jsx(admin.Layouts.Header, {
-                                primaryAction: !isLoadingPlugins && /*#__PURE__*/ jsxRuntime.jsx(designSystem.Button, {
-                                    type: "submit",
-                                    loading: mutation.isLoading,
-                                    startIcon: /*#__PURE__*/ jsxRuntime.jsx(icons.Check, {}),
-                                    children: formatMessage({
-                                        id: 'global.save',
-                                        defaultMessage: 'Save'
-                                    })
-                                }),
-                                title: formatMessage({
-                                    id: 'Settings.roles.create.title',
-                                    defaultMessage: 'Create a role'
-                                }),
-                                subtitle: formatMessage({
-                                    id: 'Settings.roles.create.description',
-                                    defaultMessage: 'Define the rights given to the role'
-                                })
-                            }),
-                            /*#__PURE__*/ jsxRuntime.jsx(admin.Layouts.Content, {
-                                children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
-                                    background: "neutral0",
-                                    direction: "column",
-                                    alignItems: "stretch",
-                                    gap: 7,
-                                    hasRadius: true,
-                                    paddingTop: 6,
-                                    paddingBottom: 6,
-                                    paddingLeft: 7,
-                                    paddingRight: 7,
-                                    shadow: "filterShadow",
-                                    children: [
-                                        /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
-                                            direction: "column",
-                                            alignItems: "stretch",
-                                            children: [
-                                                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                                                    variant: "delta",
-                                                    tag: "h2",
-                                                    children: formatMessage({
-                                                        id: index.getTrad('EditPage.form.roles'),
-                                                        defaultMessage: 'Role details'
-                                                    })
-                                                }),
-                                                /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Grid.Root, {
-                                                    gap: 4,
-                                                    children: [
-                                                        /*#__PURE__*/ jsxRuntime.jsx(designSystem.Grid.Item, {
-                                                            col: 6,
-                                                            direction: "column",
-                                                            alignItems: "stretch",
-                                                            children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Field.Root, {
-                                                                name: "name",
-                                                                error: errors?.name ? formatMessage({
-                                                                    id: errors.name,
-                                                                    defaultMessage: 'Name is required'
-                                                                }) : false,
-                                                                required: true,
-                                                                children: [
-                                                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Label, {
-                                                                        children: formatMessage({
-                                                                            id: 'global.name',
-                                                                            defaultMessage: 'Name'
-                                                                        })
-                                                                    }),
-                                                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.TextInput, {
-                                                                        value: values.name || '',
-                                                                        onChange: handleChange
-                                                                    }),
-                                                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Error, {})
-                                                                ]
-                                                            })
-                                                        }),
-                                                        /*#__PURE__*/ jsxRuntime.jsx(designSystem.Grid.Item, {
-                                                            col: 6,
-                                                            direction: "column",
-                                                            alignItems: "stretch",
-                                                            children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Field.Root, {
-                                                                name: "description",
-                                                                error: errors?.description ? formatMessage({
-                                                                    id: errors.description,
-                                                                    defaultMessage: 'Description is required'
-                                                                }) : false,
-                                                                required: true,
-                                                                children: [
-                                                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Label, {
-                                                                        children: formatMessage({
-                                                                            id: 'global.description',
-                                                                            defaultMessage: 'Description'
-                                                                        })
-                                                                    }),
-                                                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Textarea, {
-                                                                        value: values.description || '',
-                                                                        onChange: handleChange
-                                                                    }),
-                                                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Error, {})
-                                                                ]
-                                                            })
-                                                        })
-                                                    ]
-                                                })
-                                            ]
-                                        }),
-                                        !isLoadingPlugins && /*#__PURE__*/ jsxRuntime.jsx(UsersPermissions$1, {
-                                            ref: permissionsRef,
-                                            permissions: permissions,
-                                            routes: routes
-                                        })
-                                    ]
-                                })
-                            })
-                        ]
-                    })
-            })
-        ]
-    });
-};
-const ProtectedRolesCreatePage = ()=>/*#__PURE__*/ jsxRuntime.jsx(admin.Page.Protect, {
-        permissions: index.PERMISSIONS.createRole,
-        children: /*#__PURE__*/ jsxRuntime.jsx(CreatePage, {})
-    });
-
-const EditPage = ()=>{
-    const { formatMessage } = reactIntl.useIntl();
-    const { toggleNotification } = admin.useNotification();
-    const { params: { id } } = reactRouterDom.useMatch(`/settings/users-permissions/roles/:id`);
-    const { get } = admin.useFetchClient();
-    const { isLoading: isLoadingPlugins, routes } = usePlugins();
-    const { data: role, isLoading: isLoadingRole, refetch: refetchRole } = reactQuery.useQuery([
-        'users-permissions',
-        'role',
-        id
-    ], async ()=>{
-        // TODO: why doesn't this endpoint follow the admin API conventions?
-        const { data: { role } } = await get(`/users-permissions/roles/${id}`);
-        return role;
-    });
-    const permissionsRef = React__namespace.useRef();
-    const { put } = admin.useFetchClient();
-    const { formatAPIError } = admin.useAPIErrorHandler();
-    const mutation = reactQuery.useMutation((body)=>put(`/users-permissions/roles/${id}`, body), {
-        onError (error) {
-            toggleNotification({
-                type: 'danger',
-                message: formatAPIError(error)
-            });
-        },
-        async onSuccess () {
-            toggleNotification({
-                type: 'success',
-                message: formatMessage({
-                    id: index.getTrad('Settings.roles.created'),
-                    defaultMessage: 'Role edited'
-                })
-            });
-            await refetchRole();
-        }
-    });
-    const handleEditRoleSubmit = async (data)=>{
-        const permissions = permissionsRef.current.getPermissions();
-        await mutation.mutate({
-            ...data,
-            ...permissions,
-            users: []
-        });
-    };
-    if (isLoadingRole) {
-        return /*#__PURE__*/ jsxRuntime.jsx(admin.Page.Loading, {});
-    }
-    return /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Main, {
-        children: [
-            /*#__PURE__*/ jsxRuntime.jsx(admin.Page.Title, {
-                children: formatMessage({
-                    id: 'Settings.PageTitle',
-                    defaultMessage: 'Settings - {name}'
-                }, {
-                    name: 'Roles'
-                })
-            }),
-            /*#__PURE__*/ jsxRuntime.jsx(formik.Formik, {
-                enableReinitialize: true,
-                initialValues: {
-                    name: role.name,
-                    description: role.description
-                },
-                onSubmit: handleEditRoleSubmit,
-                validationSchema: createRoleSchema,
-                children: ({ handleSubmit, values, handleChange, errors })=>/*#__PURE__*/ jsxRuntime.jsxs(formik.Form, {
-                        noValidate: true,
-                        onSubmit: handleSubmit,
-                        children: [
-                            /*#__PURE__*/ jsxRuntime.jsx(admin.Layouts.Header, {
-                                primaryAction: !isLoadingPlugins ? /*#__PURE__*/ jsxRuntime.jsx(designSystem.Button, {
-                                    disabled: role.code === 'strapi-super-admin',
-                                    type: "submit",
-                                    loading: mutation.isLoading,
-                                    startIcon: /*#__PURE__*/ jsxRuntime.jsx(icons.Check, {}),
-                                    children: formatMessage({
-                                        id: 'global.save',
-                                        defaultMessage: 'Save'
-                                    })
-                                }) : null,
-                                title: role.name,
-                                subtitle: role.description,
-                                navigationAction: /*#__PURE__*/ jsxRuntime.jsx(admin.BackButton, {
-                                    fallback: ".."
-                                })
-                            }),
-                            /*#__PURE__*/ jsxRuntime.jsx(admin.Layouts.Content, {
-                                children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
-                                    background: "neutral0",
-                                    direction: "column",
-                                    alignItems: "stretch",
-                                    gap: 7,
-                                    hasRadius: true,
-                                    paddingTop: 6,
-                                    paddingBottom: 6,
-                                    paddingLeft: 7,
-                                    paddingRight: 7,
-                                    shadow: "filterShadow",
-                                    children: [
-                                        /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
-                                            direction: "column",
-                                            alignItems: "stretch",
-                                            gap: 4,
-                                            children: [
-                                                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                                                    variant: "delta",
-                                                    tag: "h2",
-                                                    children: formatMessage({
-                                                        id: index.getTrad('EditPage.form.roles'),
-                                                        defaultMessage: 'Role details'
-                                                    })
-                                                }),
-                                                /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Grid.Root, {
-                                                    gap: 4,
-                                                    children: [
-                                                        /*#__PURE__*/ jsxRuntime.jsx(designSystem.Grid.Item, {
-                                                            col: 6,
-                                                            direction: "column",
-                                                            alignItems: "stretch",
-                                                            children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Field.Root, {
-                                                                name: "name",
-                                                                error: errors?.name ? formatMessage({
-                                                                    id: errors.name,
-                                                                    defaultMessage: 'Name is required'
-                                                                }) : false,
-                                                                required: true,
-                                                                children: [
-                                                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Label, {
-                                                                        children: formatMessage({
-                                                                            id: 'global.name',
-                                                                            defaultMessage: 'Name'
-                                                                        })
-                                                                    }),
-                                                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.TextInput, {
-                                                                        value: values.name || '',
-                                                                        onChange: handleChange
-                                                                    }),
-                                                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Error, {})
-                                                                ]
-                                                            })
-                                                        }),
-                                                        /*#__PURE__*/ jsxRuntime.jsx(designSystem.Grid.Item, {
-                                                            col: 6,
-                                                            direction: "column",
-                                                            alignItems: "stretch",
-                                                            children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Field.Root, {
-                                                                name: "description",
-                                                                error: errors?.description ? formatMessage({
-                                                                    id: errors.description,
-                                                                    defaultMessage: 'Description is required'
-                                                                }) : false,
-                                                                required: true,
-                                                                children: [
-                                                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Label, {
-                                                                        children: formatMessage({
-                                                                            id: 'global.description',
-                                                                            defaultMessage: 'Description'
-                                                                        })
-                                                                    }),
-                                                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Textarea, {
-                                                                        value: values.description || '',
-                                                                        onChange: handleChange
-                                                                    }),
-                                                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Error, {})
-                                                                ]
-                                                            })
-                                                        })
-                                                    ]
-                                                })
-                                            ]
-                                        }),
-                                        !isLoadingPlugins && /*#__PURE__*/ jsxRuntime.jsx(UsersPermissions$1, {
-                                            ref: permissionsRef,
-                                            permissions: role.permissions,
-                                            routes: routes
-                                        })
-                                    ]
-                                })
-                            })
-                        ]
-                    })
-            })
-        ]
-    });
-};
-const ProtectedRolesEditPage = ()=>/*#__PURE__*/ jsxRuntime.jsx(admin.Page.Protect, {
-        permissions: index.PERMISSIONS.updateRole,
-        children: /*#__PURE__*/ jsxRuntime.jsx(EditPage, {})
-    });
-
-const EditLink = styledComponents.styled(designSystem.Link)`
-  align-items: center;
-  height: 3.2rem;
-  width: 3.2rem;
-  display: flex;
-  justify-content: center;
-  padding: ${({ theme })=>`${theme.spaces[2]}`};
-
-  svg {
-    height: 1.6rem;
-    width: 1.6rem;
-
-    path {
-      fill: ${({ theme })=>theme.colors.neutral500};
-    }
-  }
-
-  &:hover,
-  &:focus {
-    svg {
-      path {
-        fill: ${({ theme })=>theme.colors.neutral800};
-      }
-    }
-  }
-`;
-const TableBody = ({ sortedRoles, canDelete, canUpdate, setRoleToDelete, onDelete })=>{
-    const { formatMessage } = reactIntl.useIntl();
-    const navigate = reactRouterDom.useNavigate();
-    const [showConfirmDelete, setShowConfirmDelete] = onDelete;
-    const checkCanDeleteRole = (role)=>canDelete && ![
-            'public',
-            'authenticated'
-        ].includes(role.type);
-    const handleClickDelete = (id)=>{
-        setRoleToDelete(id);
-        setShowConfirmDelete(!showConfirmDelete);
-    };
-    return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Tbody, {
-        children: sortedRoles?.map((role)=>/*#__PURE__*/ jsxRuntime.jsxs(designSystem.Tr, {
-                cursor: "pointer",
-                onClick: ()=>navigate(role.id.toString()),
-                children: [
-                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Td, {
-                        width: "20%",
-                        children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                            children: role.name
-                        })
-                    }),
-                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Td, {
-                        width: "50%",
-                        children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                            children: role.description
-                        })
-                    }),
-                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Td, {
-                        width: "30%",
-                        children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                            children: formatMessage({
-                                id: 'Roles.RoleRow.user-count',
-                                defaultMessage: '{number, plural, =0 {# user} one {# user} other {# users}}'
-                            }, {
-                                number: role.nb_users
-                            })
-                        })
-                    }),
-                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Td, {
-                        children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
-                            justifyContent: "end",
-                            onClick: (e)=>e.stopPropagation(),
-                            children: [
-                                canUpdate ? /*#__PURE__*/ jsxRuntime.jsx(EditLink, {
-                                    tag: reactRouterDom.NavLink,
-                                    to: role.id.toString(),
-                                    "aria-label": formatMessage({
-                                        id: 'app.component.table.edit',
-                                        defaultMessage: 'Edit {target}'
-                                    }, {
-                                        target: `${role.name}`
-                                    }),
-                                    children: /*#__PURE__*/ jsxRuntime.jsx(icons.Pencil, {})
-                                }) : null,
-                                checkCanDeleteRole(role) && /*#__PURE__*/ jsxRuntime.jsx(designSystem.IconButton, {
-                                    onClick: ()=>handleClickDelete(role.id.toString()),
-                                    variant: "ghost",
-                                    label: formatMessage({
-                                        id: 'global.delete-target',
-                                        defaultMessage: 'Delete {target}'
-                                    }, {
-                                        target: `${role.name}`
-                                    }),
-                                    children: /*#__PURE__*/ jsxRuntime.jsx(icons.Trash, {})
-                                })
-                            ]
-                        })
-                    })
-                ]
-            }, role.name))
-    });
-};
-TableBody.defaultProps = {
-    canDelete: false,
-    canUpdate: false
-};
-TableBody.propTypes = {
-    onDelete: PropTypes.array.isRequired,
-    setRoleToDelete: PropTypes.func.isRequired,
-    sortedRoles: PropTypes.array.isRequired,
-    canDelete: PropTypes.bool,
-    canUpdate: PropTypes.bool
-};
-
-const RolesListPage = ()=>{
-    const { trackUsage } = admin.useTracking();
-    const { formatMessage, locale } = reactIntl.useIntl();
-    const { toggleNotification } = admin.useNotification();
-    const { notifyStatus } = designSystem.useNotifyAT();
-    const [{ query }] = admin.useQueryParams();
-    const _q = query?._q || '';
-    const [showConfirmDelete, setShowConfirmDelete] = React.useState(false);
-    const [roleToDelete, setRoleToDelete] = React.useState();
-    const { del, get } = admin.useFetchClient();
-    const { isLoading: isLoadingForPermissions, allowedActions: { canRead, canDelete, canCreate, canUpdate } } = admin.useRBAC({
-        create: index.PERMISSIONS.createRole,
-        read: index.PERMISSIONS.readRoles,
-        update: index.PERMISSIONS.updateRole,
-        delete: index.PERMISSIONS.deleteRole
-    });
-    const { isLoading: isLoadingForData, data: { roles }, isFetching, refetch } = reactQuery.useQuery('get-roles', ()=>fetchData(toggleNotification, formatMessage, notifyStatus), {
-        initialData: {},
-        enabled: canRead
-    });
-    const { contains } = designSystem.useFilter(locale, {
-        sensitivity: 'base'
-    });
-    /**
-   * @type {Intl.Collator}
-   */ const formatter = designSystem.useCollator(locale, {
-        sensitivity: 'base'
-    });
-    const isLoading = isLoadingForData || isFetching || isLoadingForPermissions;
-    const handleShowConfirmDelete = ()=>{
-        setShowConfirmDelete(!showConfirmDelete);
-    };
-    const deleteData = async (id, formatMessage, toggleNotification)=>{
-        try {
-            await del(`/users-permissions/roles/${id}`);
-        } catch (error) {
-            toggleNotification({
-                type: 'danger',
-                message: formatMessage({
-                    id: 'notification.error',
-                    defaultMessage: 'An error occured'
-                })
-            });
-        }
-    };
-    const fetchData = async (toggleNotification, formatMessage, notifyStatus)=>{
-        try {
-            const { data } = await get('/users-permissions/roles');
-            notifyStatus('The roles have loaded successfully');
-            return data;
-        } catch (err) {
-            toggleNotification({
-                type: 'danger',
-                message: formatMessage({
-                    id: 'notification.error',
-                    defaultMessage: 'An error occurred'
-                })
-            });
-            throw new Error(err);
-        }
-    };
-    const emptyLayout = {
-        roles: {
-            id: index.getTrad('Roles.empty'),
-            defaultMessage: "You don't have any roles yet."
-        },
-        search: {
-            id: index.getTrad('Roles.empty.search'),
-            defaultMessage: 'No roles match the search.'
-        }
-    };
-    const pageTitle = formatMessage({
-        id: 'global.roles',
-        defaultMessage: 'Roles'
-    });
-    const deleteMutation = reactQuery.useMutation((id)=>deleteData(id, formatMessage, toggleNotification), {
-        async onSuccess () {
-            await refetch();
-        }
-    });
-    const handleConfirmDelete = async ()=>{
-        await deleteMutation.mutateAsync(roleToDelete);
-        setShowConfirmDelete(!showConfirmDelete);
-    };
-    const sortedRoles = (roles || []).filter((role)=>contains(role.name, _q) || contains(role.description, _q)).sort((a, b)=>formatter.compare(a.name, b.name) || formatter.compare(a.description, b.description));
-    const emptyContent = _q && !sortedRoles.length ? 'search' : 'roles';
-    const colCount = 4;
-    const rowCount = (roles?.length || 0) + 1;
-    if (isLoading) {
-        return /*#__PURE__*/ jsxRuntime.jsx(admin.Page.Loading, {});
-    }
-    return /*#__PURE__*/ jsxRuntime.jsxs(admin.Layouts.Root, {
-        children: [
-            /*#__PURE__*/ jsxRuntime.jsx(admin.Page.Title, {
-                children: formatMessage({
-                    id: 'Settings.PageTitle',
-                    defaultMessage: 'Settings - {name}'
-                }, {
-                    name: pageTitle
-                })
-            }),
-            /*#__PURE__*/ jsxRuntime.jsxs(admin.Page.Main, {
-                children: [
-                    /*#__PURE__*/ jsxRuntime.jsx(admin.Layouts.Header, {
-                        title: formatMessage({
-                            id: 'global.roles',
-                            defaultMessage: 'Roles'
-                        }),
-                        subtitle: formatMessage({
-                            id: 'Settings.roles.list.description',
-                            defaultMessage: 'List of roles'
-                        }),
-                        primaryAction: canCreate ? /*#__PURE__*/ jsxRuntime.jsx(designSystem.LinkButton, {
-                            to: "new",
-                            tag: reactRouterDom.NavLink,
-                            onClick: ()=>trackUsage('willCreateRole'),
-                            startIcon: /*#__PURE__*/ jsxRuntime.jsx(icons.Plus, {}),
-                            size: "S",
-                            children: formatMessage({
-                                id: index.getTrad('List.button.roles'),
-                                defaultMessage: 'Add new role'
-                            })
-                        }) : null
-                    }),
-                    /*#__PURE__*/ jsxRuntime.jsx(admin.Layouts.Action, {
-                        startActions: /*#__PURE__*/ jsxRuntime.jsx(admin.SearchInput, {
-                            label: formatMessage({
-                                id: 'app.component.search.label',
-                                defaultMessage: 'Search'
-                            })
-                        })
-                    }),
-                    /*#__PURE__*/ jsxRuntime.jsxs(admin.Layouts.Content, {
-                        children: [
-                            !canRead && /*#__PURE__*/ jsxRuntime.jsx(admin.Page.NoPermissions, {}),
-                            canRead && sortedRoles && sortedRoles?.length ? /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Table, {
-                                colCount: colCount,
-                                rowCount: rowCount,
-                                children: [
-                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Thead, {
-                                        children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Tr, {
-                                            children: [
-                                                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Th, {
-                                                    children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                                                        variant: "sigma",
-                                                        textColor: "neutral600",
-                                                        children: formatMessage({
-                                                            id: 'global.name',
-                                                            defaultMessage: 'Name'
-                                                        })
-                                                    })
-                                                }),
-                                                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Th, {
-                                                    children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                                                        variant: "sigma",
-                                                        textColor: "neutral600",
-                                                        children: formatMessage({
-                                                            id: 'global.description',
-                                                            defaultMessage: 'Description'
-                                                        })
-                                                    })
-                                                }),
-                                                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Th, {
-                                                    children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                                                        variant: "sigma",
-                                                        textColor: "neutral600",
-                                                        children: formatMessage({
-                                                            id: 'global.users',
-                                                            defaultMessage: 'Users'
-                                                        })
-                                                    })
-                                                }),
-                                                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Th, {
-                                                    children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.VisuallyHidden, {
-                                                        children: formatMessage({
-                                                            id: 'global.actions',
-                                                            defaultMessage: 'Actions'
-                                                        })
-                                                    })
-                                                })
-                                            ]
-                                        })
-                                    }),
-                                    /*#__PURE__*/ jsxRuntime.jsx(TableBody, {
-                                        sortedRoles: sortedRoles,
-                                        canDelete: canDelete,
-                                        canUpdate: canUpdate,
-                                        permissions: index.PERMISSIONS,
-                                        setRoleToDelete: setRoleToDelete,
-                                        onDelete: [
-                                            showConfirmDelete,
-                                            setShowConfirmDelete
-                                        ]
-                                    })
-                                ]
-                            }) : /*#__PURE__*/ jsxRuntime.jsx(designSystem.EmptyStateLayout, {
-                                content: formatMessage(emptyLayout[emptyContent])
-                            })
-                        ]
-                    }),
-                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Dialog.Root, {
-                        open: showConfirmDelete,
-                        onOpenChange: handleShowConfirmDelete,
-                        children: /*#__PURE__*/ jsxRuntime.jsx(admin.ConfirmDialog, {
-                            onConfirm: handleConfirmDelete
-                        })
-                    })
-                ]
-            })
-        ]
-    });
-};
-const ProtectedRolesListPage = ()=>{
-    return /*#__PURE__*/ jsxRuntime.jsx(admin.Page.Protect, {
-        permissions: index.PERMISSIONS.accessRoles,
-        children: /*#__PURE__*/ jsxRuntime.jsx(RolesListPage, {})
-    });
-};
-
-const Roles = ()=>{
-    return /*#__PURE__*/ jsxRuntime.jsx(admin.Page.Protect, {
-        permissions: index.PERMISSIONS.accessRoles,
-        children: /*#__PURE__*/ jsxRuntime.jsxs(reactRouterDom.Routes, {
-            children: [
-                /*#__PURE__*/ jsxRuntime.jsx(reactRouterDom.Route, {
-                    index: true,
-                    element: /*#__PURE__*/ jsxRuntime.jsx(ProtectedRolesListPage, {})
-                }),
-                /*#__PURE__*/ jsxRuntime.jsx(reactRouterDom.Route, {
-                    path: "new",
-                    element: /*#__PURE__*/ jsxRuntime.jsx(ProtectedRolesCreatePage, {})
-                }),
-                /*#__PURE__*/ jsxRuntime.jsx(reactRouterDom.Route, {
-                    path: ":id",
-                    element: /*#__PURE__*/ jsxRuntime.jsx(ProtectedRolesEditPage, {})
-                })
-            ]
-        })
-    });
-};
-
-exports.default = Roles;
-//# sourceMappingURL=index-DvubCYNe.js.map