diff --git a/app/react/portainer/access-control/AccessControlPanel/AccessControlPaneDetails.test.tsx b/app/react/portainer/access-control/AccessControlPanel/AccessControlPaneDetails.test.tsx
index 9970da4d9..4a10aee31 100644
--- a/app/react/portainer/access-control/AccessControlPanel/AccessControlPaneDetails.test.tsx
+++ b/app/react/portainer/access-control/AccessControlPanel/AccessControlPaneDetails.test.tsx
@@ -83,7 +83,7 @@ for (let i = 0; i < inheritanceTests.length; i += 1) {
});
}
-test('when resource is limited to specific users, show comma separated list of their names', async () => {
+test('when resource is limited to specific users, show number of users', async () => {
const users = createMockUsers(10, Role.Standard);
server.use(rest.get('/api/users', (req, res, ctx) => res(ctx.json(users))));
@@ -107,7 +107,7 @@ test('when resource is limited to specific users, show comma separated list of t
expect(queryByText(/Authorized users/)).toBeVisible();
await expect(findByLabelText('authorized-users')).resolves.toHaveTextContent(
- restrictedToUsers.map((user) => user.Username).join(', ')
+ `${restrictedToUsers.length} users`
);
});
@@ -145,6 +145,7 @@ async function renderComponent(
resourceControl?: ResourceControlViewModel
) {
const WithUser = withUserProvider(AccessControlPanelDetails);
+
const queries = renderWithQueryClient(
);
diff --git a/app/react/portainer/access-control/AccessControlPanel/AccessControlPanel.tsx b/app/react/portainer/access-control/AccessControlPanel/AccessControlPanel.tsx
index 82ab49161..4109c6a5d 100644
--- a/app/react/portainer/access-control/AccessControlPanel/AccessControlPanel.tsx
+++ b/app/react/portainer/access-control/AccessControlPanel/AccessControlPanel.tsx
@@ -52,6 +52,7 @@ export function AccessControlPanel({
{!isEditDisabled && !isEditMode && (
diff --git a/app/react/portainer/access-control/AccessControlPanel/AccessControlPanelDetails.tsx b/app/react/portainer/access-control/AccessControlPanel/AccessControlPanelDetails.tsx
index 3201959cc..503493356 100644
--- a/app/react/portainer/access-control/AccessControlPanel/AccessControlPanelDetails.tsx
+++ b/app/react/portainer/access-control/AccessControlPanel/AccessControlPanelDetails.tsx
@@ -24,11 +24,13 @@ import { ResourceControlViewModel } from '../models/ResourceControlViewModel';
interface Props {
resourceControl?: ResourceControlViewModel;
resourceType: ResourceControlType;
+ isAuthorisedToFetchUsers?: boolean;
}
export function AccessControlPanelDetails({
resourceControl,
resourceType,
+ isAuthorisedToFetchUsers = false,
}: Props) {
const inheritanceMessage = getInheritanceMessage(
resourceType,
@@ -41,7 +43,10 @@ export function AccessControlPanelDetails({
TeamAccesses: restrictedToTeams = [],
} = resourceControl || {};
- const users = useAuthorizedUsers(restrictedToUsers.map((ra) => ra.UserId));
+ const users = useAuthorizedUsers(
+ restrictedToUsers.map((ra) => ra.UserId),
+ isAuthorisedToFetchUsers
+ );
const teams = useAuthorizedTeams(restrictedToTeams.map((ra) => ra.TeamId));
const teamsLength = teams.data ? teams.data.length : 0;