fix: address feedback

Author: bra-i-am

src/authz-module/data/api.test.tsx

@@ -277,30 +277,33 @@ describe('API functions', () => {
     it('should fetch scopes successfully', async () => {
       const mockResponse = {
         data: {
-          scopes: [
+          results: [
             { displayName: 'Library 1', scope: 'lib:test1' },
           ],
+          count: 1,
+          next: null,
+          previous: null,
         },
       };
 
       getAuthenticatedHttpClient.mockReturnValue({
         get: jest.fn().mockResolvedValue(mockResponse),
       });
 
-      const result = await getScopes();
+      const result = await getScopes({});
 
-      expect(result.scopes).toHaveLength(1);
+      expect(result.results).toHaveLength(1);
       expect(getAuthenticatedHttpClient).toHaveBeenCalled();
     });
 
     it('should handle search, page, and pageSize parameters', async () => {
-      const mockResponse = { data: { scopes: [] } };
+      const mockResponse = { data: { results: [], count: 0, next: null, previous: null } };
       const mockGet = jest.fn().mockResolvedValue(mockResponse);
       getAuthenticatedHttpClient.mockReturnValue({
         get: mockGet,
       });
 
-      await getScopes('library', 3, 50);
+      await getScopes({ search: 'library', page: 3, pageSize: 50 });
 
       expect(mockGet).toHaveBeenCalled();
       const calledUrl = mockGet.mock.calls[0][0];

src/authz-module/data/hooks.test.tsx

@@ -938,6 +938,9 @@ describe('useUserAssignedRoles', () => {
 
 describe('useScopes', () => {
   const mockScopesData = {
+    count: 2,
+    next: null,
+    previous: null,
     results: [
       {
         displayName: 'Test Library 1',
@@ -966,21 +969,21 @@ describe('useScopes', () => {
     await waitFor(() => expect(result.current.isSuccess).toBe(true));
 
     expect(getAuthenticatedHttpClient).toHaveBeenCalled();
-    expect(result.current.data).toEqual(mockScopesData);
-    expect(result.current.data?.results).toHaveLength(2);
+    expect(result.current.data?.pages[0]).toEqual(mockScopesData);
+    expect(result.current.data?.pages[0].results).toHaveLength(2);
   });
 
   it('handles search parameter', async () => {
     getAuthenticatedHttpClient.mockReturnValue({
-      get: jest.fn().mockResolvedValue({ data: { results: [mockScopesData.results[0]] } }),
+      get: jest.fn().mockResolvedValue({ data: { count: 1, next: null, previous: null, results: [mockScopesData.results[0]] } }),
     });
 
-    const { result } = renderHook(() => useScopes('library'), {
+    const { result } = renderHook(() => useScopes({ search: 'library' }), {
       wrapper: createWrapper(),
     });
 
     await waitFor(() => expect(result.current.isSuccess).toBe(true));
-    expect(result.current.data?.results).toHaveLength(1);
+    expect(result.current.data?.pages[0].results).toHaveLength(1);
   });
 
   it('handles error when API call fails', async () => {

src/authz-module/data/hooks.ts

@@ -87,16 +87,20 @@ export const useLibrary = (libraryId: string) => useSuspenseQuery<LibraryMetadat
  */
 export const useAssignTeamMembersRole = () => {
   const queryClient = useQueryClient();
-  const { querySettings: defaultQuerySettings } = useQuerySettings();
   return useMutation({
     mutationFn: async ({ data }: {
       data: AssignTeamMembersRoleRequest
     }) => assignTeamMembersRole(data),
     onSettled: (_data, error, { data: { scopes } }) => {
       if (!error) {
-        queryClient.invalidateQueries({ queryKey: authzQueryKeys.teamMembers(scopes[0], defaultQuerySettings) });
-        queryClient.invalidateQueries({ queryKey: authzQueryKeys.permissionsByRole(scopes[0]) });
+        scopes.forEach((scope) => {
+          queryClient.invalidateQueries({ queryKey: authzQueryKeys.teamMembersAll(scope) });
+          queryClient.invalidateQueries({ queryKey: authzQueryKeys.permissionsByRole(scope) });
+        });
         queryClient.invalidateQueries({ queryKey: [...authzQueryKeys.all, 'userRoles'] });
+        queryClient.invalidateQueries({
+          predicate: (query) => query.queryKey.includes('allRoleAssignments'),
+        });
       }
     },
   });

src/authz-module/libraries-manager/messages.ts

@@ -71,11 +71,6 @@ const messages = defineMessages({
     defaultMessage: 'See full documentation',
     description: 'Libraries AuthZ link for the course roles alert',
   },
-  'library.authz.manage.add.role.button': {
-    id: 'library.authz.manage.add.role.button',
-    defaultMessage: 'Assign Role',
-    description: 'Button label to add a role to a user in libraries management',
-  },
   'library.authz.team.remove.user.toast.success.description': {
     id: 'library.authz.team.remove.user.toast.success.description',
     defaultMessage: 'The {role} role has been successfully removed.{rolesCount, plural, =0 { The user no longer has access to this library and has been removed from the member list.} other {}}',

src/authz-module/role-assignation-wizard/components/DefineApplicationScopeStep.tsx

@@ -3,7 +3,7 @@ import { useIntl } from '@edx/frontend-platform/i18n';
 import { Alert } from '@openedx/paragon';
 import { courseRolesMetadata } from '@src/authz-module/roles-permissions/course/constants';
 import { libraryRolesMetadata } from '@src/authz-module/roles-permissions/library/constants';
-import useScopeListData from './useScopeListData';
+import useScopeListData from '../hooks/useScopeListData';
 import ScopeFilterBar from './ScopeFilterBar';
 import ScopeList from './ScopeList';
 import messages from '../messages';

src/authz-module/role-assignation-wizard/components/OrgSection.tsx

@@ -4,36 +4,7 @@ import { ExpandLess, ExpandMore } from '@openedx/paragon/icons';
 import { useIntl } from '@edx/frontend-platform/i18n';
 import { Scope } from 'types';
 import messages from '../messages';
-
-interface ScopeCheckboxItemProps {
-  scope: Scope;
-  checked: boolean;
-  onToggle: (scopeId: string) => void;
-}
-
-export const ScopeCheckboxItem = ({ scope, checked, onToggle }: ScopeCheckboxItemProps) => (
-  <div className="mb-2">
-    <div className="pgn__form-checkbox">
-      <input
-        type="checkbox"
-        id={`scope-${scope.externalKey}`}
-        className="pgn__form-checkbox-input"
-        checked={checked}
-        onChange={() => onToggle(scope.externalKey)}
-      />
-      <label
-        className="pgn__form-label"
-        htmlFor={`scope-${scope.externalKey}`}
-        data-testid="toggle-scope"
-      >
-        {scope.displayName}
-      </label>
-    </div>
-    {scope.description && (
-      <small className="d-block text-muted pl-4">{scope.description}</small>
-    )}
-  </div>
-);
+import ScopeCheckboxItem from './ScopeCheckboxItem';
 
 export interface OrgSectionProps {
   orgName: string;

src/authz-module/role-assignation-wizard/components/ScopeCheckboxItem.tsx

@@ -0,0 +1,25 @@
+import { Form } from '@openedx/paragon';
+import { Scope } from 'types';
+
+interface ScopeCheckboxItemProps {
+  scope: Scope;
+  checked: boolean;
+  onToggle: (scopeId: string) => void;
+}
+
+const ScopeCheckboxItem = ({ scope, checked, onToggle }: ScopeCheckboxItemProps) => (
+  <div className="mb-2">
+    <Form.Checkbox
+      checked={checked}
+      onChange={() => onToggle(scope.externalKey)}
+      data-testid="toggle-scope"
+    >
+      {scope.displayName}
+    </Form.Checkbox>
+    {scope.description && (
+      <small className="d-block text-muted pl-4">{scope.description}</small>
+    )}
+  </div>
+);
+
+export default ScopeCheckboxItem;

src/authz-module/role-assignation-wizard/components/ScopeList.tsx

@@ -2,7 +2,8 @@ import { useEffect, useRef } from 'react';
 import { Spinner } from '@openedx/paragon';
 import { useIntl } from '@edx/frontend-platform/i18n';
 import { Org, Scope } from 'types';
-import OrgSection, { ScopeCheckboxItem } from './OrgSection';
+import OrgSection from './OrgSection';
+import ScopeCheckboxItem from './ScopeCheckboxItem';
 import messages from '../messages';
 
 interface ScopeListQueryState {
@@ -93,7 +94,7 @@ const ScopeList = ({
                 externalKey: contextType === 'course' ? `course-v1:${org}+*` : `lib:${org}:*`,
                 displayName: aggregateLabel,
                 description: aggregateDescription,
-                org: { id: 0, name: org, shortName: org },
+                org: { id: '', name: org, shortName: org },
               }
               : undefined;