github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2025-04-19 18:25:22 +00:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #24057 from overleaf/ii-group-management-improvements

Browse source 
[web] Group management improvements

GitOrigin-RevId: 01826bf37fa8d5e06595f660ccb42a8df00b63ae
This commit is contained in:
ilkin-overleaf 2025-03-10 12:34:01 +02:00 • committed by Copybot
parent c3c14ccfbc
commit 1c4a761478
13 changed files with 95 additions and 90 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
services/web/frontend/js/features/group-management/components/managers-table.tsx
View file

@ -174,8 +174,10 @@ export function ManagersTable({
<div className="row-spaced-small">
<ErrorAlert error={removeMemberError} />
<OLTable
className="managed-users-table managed-users-list structured-list"
data-testid="managed-users-table"
className="managed-entities-table managed-entities-list structured-list"
container={false}
hover
data-testid="managed-entities-table"
>
<thead>
<tr>

2
services/web/frontend/js/features/group-management/components/members-table/member-row.tsx
View file

@ -35,7 +35,7 @@ export default function MemberRow({
const groupSSOActive = getMeta('ol-groupSSOActive')
return (
<tr className="managed-user-row">
<tr className="managed-entity-row">
<SelectUserCheckbox user={user} />
<td
className={classnames('cell-email', {

6
services/web/frontend/js/features/group-management/components/members-table/members-list.tsx
View file

@ -40,9 +40,9 @@ export default function MembersList({ groupId }: ManagedUsersListProps) {
)}
<OLTable
className={classNames(
'managed-users-table',
'managed-entities-table',
'structured-list',
'managed-users-list',
'managed-entities-list',
{
'managed-users-active': managedUsersActive,
'group-sso-active': groupSSOActive,
@ -50,7 +50,7 @@ export default function MembersList({ groupId }: ManagedUsersListProps) {
)}
container={false}
hover
data-testid="managed-users-table"
data-testid="managed-entities-table"
>
<thead>
<tr>

2
services/web/frontend/js/features/group-management/components/user-row.tsx
View file

@ -34,7 +34,7 @@ export default function UserRow({
)
return (
<tr key={`user-${user.email}`} className="managed-user-row">
<tr key={`user-${user.email}`} className="managed-entity-row">
<td className="cell-checkbox">
<BootstrapVersionSwitcher
bs3={

8
services/web/frontend/stylesheets/bootstrap-5/components/group-members.scss
View file

@ -1,13 +1,13 @@
/* Styles for group-subscription members view */
.structured-list.managed-users-list {
.structured-list.managed-entities-list {
/* Override scrolling behaviour on structured-list */
overflow: initial;
overflow-y: initial;
overflow-x: initial;
}
.managed-users-list {
.managed-entities-list {
vertical-align: middle;
.security-state-invite-pending {
@ -22,7 +22,7 @@
color: var(--content-danger);
}
.managed-user-row {
.managed-entity-row {
overflow-wrap: break-word;
}
@ -32,7 +32,7 @@
}
}
.managed-users-table {
.managed-entities-table {
width: 100%;
table-layout: fixed;

8
services/web/frontend/stylesheets/components/group-members.less
View file

@ -1,13 +1,13 @@
/* Styles for group-subscription members view */
.structured-list.managed-users-list {
.structured-list.managed-entities-list {
/* Override scrolling behaviour on structured-list */
overflow: initial;
overflow-y: initial;
overflow-x: initial;
}
.managed-users-list {
.managed-entities-list {
.security-state-invite-pending {
color: @text-muted;
}
@ -17,7 +17,7 @@
.security-state-not-managed {
color: @red;
}
.managed-user-row {
.managed-entity-row {
overflow-wrap: break-word;
}
@ -61,7 +61,7 @@
}
}
.managed-users-table {
.managed-entities-table {
width: 100%;
table-layout: fixed;

16
services/web/test/frontend/features/group-management/components/group-managers.spec.tsx
View file

@ -37,7 +37,7 @@ describe('group managers', function () {
it('renders the group management page', function () {
cy.findByRole('heading', { name: /my awesome team/i, level: 1 })
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -72,7 +72,7 @@ describe('group managers', function () {
cy.findByRole('button').click()
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(3)').within(() => {
@ -101,7 +101,7 @@ describe('group managers', function () {
})
it('checks the select all checkbox', function () {
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -112,13 +112,13 @@ describe('group managers', function () {
})
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('thead')
.within(() => {
cy.findByLabelText(/select all/i).check()
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -135,7 +135,7 @@ describe('group managers', function () {
statusCode: 200,
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -145,7 +145,7 @@ describe('group managers', function () {
cy.findByRole('button', { name: /remove manager/i }).click()
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -162,7 +162,7 @@ describe('group managers', function () {
statusCode: 500,
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {

32
services/web/test/frontend/features/group-management/components/group-members.spec.tsx
View file

@ -64,7 +64,7 @@ describe('GroupMembers', function () {
'You have added 2 of 10 available members'
)
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -100,7 +100,7 @@ describe('GroupMembers', function () {
cy.get('.form-control').type('someone.else@test.com')
cy.get('.add-more-members-form button').click()
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(3)').within(() => {
@ -130,7 +130,7 @@ describe('GroupMembers', function () {
})
it('checks the select all checkbox', function () {
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -143,7 +143,7 @@ describe('GroupMembers', function () {
cy.get('.select-all').click()
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -160,7 +160,7 @@ describe('GroupMembers', function () {
statusCode: 200,
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -171,7 +171,7 @@ describe('GroupMembers', function () {
cy.get('button').contains('Remove from group').click()
cy.get('small').contains('You have added 1 of 10 available members')
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -188,7 +188,7 @@ describe('GroupMembers', function () {
statusCode: 500,
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -257,7 +257,7 @@ describe('GroupMembers', function () {
cy.get('h1').contains('My Awesome Team')
cy.get('small').contains('You have added 3 of 10 available members')
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -304,7 +304,7 @@ describe('GroupMembers', function () {
cy.get('.form-control').type('someone.else@test.com')
cy.get('.add-more-members-form button').click()
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(4)').within(() => {
@ -336,7 +336,7 @@ describe('GroupMembers', function () {
})
it('checks the select all checkbox', function () {
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -349,7 +349,7 @@ describe('GroupMembers', function () {
cy.get('.select-all').click()
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -368,7 +368,7 @@ describe('GroupMembers', function () {
statusCode: 200,
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -379,7 +379,7 @@ describe('GroupMembers', function () {
cy.get('button').contains('Remove from group').click()
cy.get('small').contains('You have added 2 of 10 available members')
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -395,7 +395,7 @@ describe('GroupMembers', function () {
statusCode: 200,
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
// no checkbox should be shown for 'Claire Jennings', a managed user
@ -410,7 +410,7 @@ describe('GroupMembers', function () {
statusCode: 500,
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -480,7 +480,7 @@ describe('GroupMembers', function () {
})
it('should display the Security column', function () {
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(2)').within(() => {

16
services/web/test/frontend/features/group-management/components/institution-managers.spec.tsx
View file

@ -37,7 +37,7 @@ describe('institution managers', function () {
it('renders the institution management page', function () {
cy.findByRole('heading', { name: /my awesome institution/i, level: 1 })
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -72,7 +72,7 @@ describe('institution managers', function () {
cy.findByRole('button').click()
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(3)').within(() => {
@ -101,7 +101,7 @@ describe('institution managers', function () {
})
it('checks the select all checkbox', function () {
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -112,13 +112,13 @@ describe('institution managers', function () {
})
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('thead')
.within(() => {
cy.findByLabelText(/select all/i).check()
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -135,7 +135,7 @@ describe('institution managers', function () {
statusCode: 200,
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -145,7 +145,7 @@ describe('institution managers', function () {
cy.findByRole('button', { name: /remove manager/i }).click()
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -162,7 +162,7 @@ describe('institution managers', function () {
statusCode: 500,
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {

20
services/web/test/frontend/features/group-management/components/managed-group-members.spec.tsx
View file

@ -86,7 +86,7 @@ describe('group members, with managed users', function () {
cy.get('h1').contains('My Awesome Team')
cy.get('small').contains('You have added 3 of 10 available members')
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -134,7 +134,7 @@ describe('group members, with managed users', function () {
cy.get('.form-control').type('someone.else@test.com')
cy.get('.add-more-members-form button').click()
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(4)').within(() => {
@ -166,7 +166,7 @@ describe('group members, with managed users', function () {
})
it('checks the select all checkbox', function () {
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -179,7 +179,7 @@ describe('group members, with managed users', function () {
cy.get('.select-all').click()
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -198,7 +198,7 @@ describe('group members, with managed users', function () {
statusCode: 200,
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -209,7 +209,7 @@ describe('group members, with managed users', function () {
cy.get('button').contains('Remove from group').click()
cy.get('small').contains('You have added 2 of 10 available members')
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -225,7 +225,7 @@ describe('group members, with managed users', function () {
statusCode: 200,
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
// no checkbox should be shown for 'Claire Jennings', a managed user
@ -240,7 +240,7 @@ describe('group members, with managed users', function () {
statusCode: 500,
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -275,7 +275,7 @@ describe('Group members when group SSO is enabled', function () {
win.metaAttributesCache.set('ol-groupSSOActive', false)
})
mountGroupMembersProvider()
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(2)').within(() => {
@ -295,7 +295,7 @@ describe('Group members when group SSO is enabled', function () {
win.metaAttributesCache.set('ol-groupSSOActive', true)
})
mountGroupMembersProvider()
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(2)').within(() => {

2
services/web/test/frontend/features/group-management/components/members-table/dropdown-button.spec.tsx
View file

@ -7,7 +7,7 @@ import { User } from '../../../../../../types/group-management/user'
function Wrapper({ children }: PropsWithChildren<Record<string, unknown>>) {
return (
<ul className="managed-users-list">
<ul className="managed-entities-list">
<span
className="managed-users-actions"
style={{ display: 'flex', width: '100%', justifyContent: 'flex-end' }}

53
services/web/test/frontend/features/group-management/components/members-table/members-list.spec.tsx
View file

@ -52,16 +52,16 @@ describe('MembersList', function () {
mountManagedUsersList()
// Select-all checkbox
cy.findByTestId('managed-users-table').within(() => {
cy.findByTestId('managed-entities-table').within(() => {
cy.findByTestId('select-all-checkbox')
})
cy.findByTestId('managed-users-table').should('contain.text', 'Email')
cy.findByTestId('managed-users-table').should('contain.text', 'Name')
cy.findByTestId('managed-users-table').should(
cy.findByTestId('managed-entities-table').should('contain.text', 'Email')
cy.findByTestId('managed-entities-table').should('contain.text', 'Name')
cy.findByTestId('managed-entities-table').should(
'contain.text',
'Last Active'
)
cy.findByTestId('managed-users-table').should(
cy.findByTestId('managed-entities-table').should(
'not.contain.text',
'Security'
)
@ -73,48 +73,51 @@ describe('MembersList', function () {
mountManagedUsersList()
// Select-all checkbox
cy.findByTestId('managed-users-table').within(() => {
cy.findByTestId('managed-entities-table').within(() => {
cy.findByTestId('select-all-checkbox')
})
cy.findByTestId('managed-users-table').should('contain.text', 'Email')
cy.findByTestId('managed-users-table').should('contain.text', 'Name')
cy.findByTestId('managed-users-table').should(
cy.findByTestId('managed-entities-table').should('contain.text', 'Email')
cy.findByTestId('managed-entities-table').should('contain.text', 'Name')
cy.findByTestId('managed-entities-table').should(
'contain.text',
'Last Active'
)
cy.findByTestId('managed-users-table').should('contain.text', 'Security')
cy.findByTestId('managed-entities-table').should(
'contain.text',
'Security'
)
})
it('should render the list of users', function () {
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.findAllByRole('row').should('have.length', 2)
})
// First user
cy.findByTestId('managed-users-table').should(
cy.findByTestId('managed-entities-table').should(
'contain.text',
users[0].email
)
cy.findByTestId('managed-users-table').should(
cy.findByTestId('managed-entities-table').should(
'contain.text',
users[0].first_name
)
cy.findByTestId('managed-users-table').should(
cy.findByTestId('managed-entities-table').should(
'contain.text',
users[0].last_name
)
// Second user
cy.findByTestId('managed-users-table').should(
cy.findByTestId('managed-entities-table').should(
'contain.text',
users[1].email
)
cy.findByTestId('managed-users-table').should(
cy.findByTestId('managed-entities-table').should(
'contain.text',
users[1].first_name
)
cy.findByTestId('managed-users-table').should(
cy.findByTestId('managed-entities-table').should(
'contain.text',
users[1].last_name
)
@ -134,11 +137,11 @@ describe('MembersList', function () {
})
it('should render the list, with a "no members" message', function () {
cy.findByTestId('managed-users-table').should(
cy.findByTestId('managed-entities-table').should(
'contain.text',
'No members'
)
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.findAllByRole('row')
@ -223,7 +226,7 @@ describe('MembersList', function () {
describe('unlinking user', function () {
beforeEach(function () {
mountManagedUsersList()
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(3)').within(() => {
@ -242,7 +245,7 @@ describe('MembersList', function () {
'contain.text',
`SSO reauthentication request has been sent to ${USER_LINKED.email}`
)
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(3)').within(() => {
@ -262,7 +265,7 @@ describe('MembersList', function () {
describe('when user is not managed', function () {
beforeEach(function () {
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(3)').within(() => {
@ -282,7 +285,7 @@ describe('MembersList', function () {
'contain.text',
`SSO reauthentication request has been sent to ${USER_LINKED.email}`
)
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(3)').within(() => {
@ -295,7 +298,7 @@ describe('MembersList', function () {
describe('when user is managed', function () {
beforeEach(function () {
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(4)').within(() => {
@ -315,7 +318,7 @@ describe('MembersList', function () {
'contain.text',
`SSO reauthentication request has been sent to ${USER_LINKED_AND_MANAGED.email}`
)
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(4)').within(() => {

14
services/web/test/frontend/features/group-management/components/publisher-managers.spec.tsx
View file

@ -37,7 +37,7 @@ describe('publisher managers', function () {
it('renders the publisher management page', function () {
cy.findByRole('heading', { name: /my awesome publisher/i, level: 1 })
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -72,7 +72,7 @@ describe('publisher managers', function () {
cy.findByRole('button').click()
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(3)').within(() => {
@ -101,7 +101,7 @@ describe('publisher managers', function () {
})
it('checks the select all checkbox', function () {
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -114,7 +114,7 @@ describe('publisher managers', function () {
cy.get('.select-all').click()
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -131,7 +131,7 @@ describe('publisher managers', function () {
statusCode: 200,
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -141,7 +141,7 @@ describe('publisher managers', function () {
cy.findByRole('button', { name: 'Remove manager' }).click()
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {
@ -158,7 +158,7 @@ describe('publisher managers', function () {
statusCode: 500,
})
cy.findByTestId('managed-users-table')
cy.findByTestId('managed-entities-table')
.find('tbody')
.within(() => {
cy.get('tr:nth-child(1)').within(() => {