diff --git a/frontend/src/components/ResizeTable/ResizeTable.tsx b/frontend/src/components/ResizeTable/ResizeTable.tsx index d2bd98f568..5f8ac7a4a5 100644 --- a/frontend/src/components/ResizeTable/ResizeTable.tsx +++ b/frontend/src/components/ResizeTable/ResizeTable.tsx @@ -3,6 +3,7 @@ import { Table } from 'antd'; import { ColumnsType } from 'antd/lib/table'; import { dragColumnParams } from 'hooks/useDragColumns/configs'; +import { set } from 'lodash-es'; import { SyntheticEvent, useCallback, @@ -59,15 +60,21 @@ function ResizeTable({ [columnsData, onDragColumn, handleResize], ); - const tableParams = useMemo( - () => ({ + const tableParams = useMemo(() => { + const props = { ...restProps, components: { header: { cell: ResizableHeader } }, columns: mergedColumns, - pagination: { ...pagination, hideOnSinglePage: true }, - }), - [mergedColumns, pagination, restProps], - ); + }; + + set( + props, + 'pagination', + pagination ? { ...pagination, hideOnSinglePage: true } : false, + ); + + return props; + }, [mergedColumns, pagination, restProps]); useEffect(() => { if (columns) { diff --git a/frontend/src/container/OrganizationSettings/tests/OrganizationSettings.test.tsx b/frontend/src/container/OrganizationSettings/tests/OrganizationSettings.test.tsx new file mode 100644 index 0000000000..35517806cd --- /dev/null +++ b/frontend/src/container/OrganizationSettings/tests/OrganizationSettings.test.tsx @@ -0,0 +1,37 @@ +import { act, render, screen, waitFor } from 'tests/test-utils'; + +import Members from '../Members'; + +describe('Organization Settings Page', () => { + afterEach(() => { + jest.clearAllMocks(); + }); + + it('render list of members', async () => { + act(() => { + render(); + }); + + const title = await screen.findByText(/Members/i); + expect(title).toBeInTheDocument(); + + await waitFor(() => { + expect(screen.getByText('firstUser@test.io')).toBeInTheDocument(); // first item + expect(screen.getByText('lastUser@test.io')).toBeInTheDocument(); // last item + }); + }); + + // this is required as our edit/delete logic is dependent on the index and it will break with pagination enabled + it('render list of members without pagination', async () => { + render(); + + await waitFor(() => { + expect(screen.getByText('firstUser@test.io')).toBeInTheDocument(); // first item + expect(screen.getByText('lastUser@test.io')).toBeInTheDocument(); // last item + + expect( + document.querySelector('.ant-table-pagination'), + ).not.toBeInTheDocument(); + }); + }); +}); diff --git a/frontend/src/mocks-server/__mockdata__/members.ts b/frontend/src/mocks-server/__mockdata__/members.ts new file mode 100644 index 0000000000..355224735a --- /dev/null +++ b/frontend/src/mocks-server/__mockdata__/members.ts @@ -0,0 +1,220 @@ +/* eslint-disable sonarjs/no-duplicate-string */ + +export const membersResponse = [ + { + id: '3223a874-5678458745786', + name: 'John Doe', + email: 'firstUser@test.io', + createdAt: 1666357530, + profilePictureURL: '', + orgId: '1287612376312867312867', + groupId: '5678458745786', + role: 'ADMIN', + organization: 'Test Inc', + flags: null, + }, + { + id: '5e9681b1-5678458745786', + name: 'Jane Doe', + email: 'johndoe2@test.io', + createdAt: 1666365394, + profilePictureURL: '', + orgId: '1287612376312867312867', + groupId: '5678458745786', + role: 'ADMIN', + organization: 'Test Inc', + flags: null, + }, + { + id: '11e8c55d-5678458745786', + name: 'Alex', + email: 'blah@test.io', + createdAt: 1666366317, + profilePictureURL: '', + orgId: '1287612376312867312867', + groupId: 'd878012367813286731aab62', + role: 'VIEWER', + organization: 'Test Inc', + flags: null, + }, + { + id: '2ad2e404-5678458745786', + name: 'Tom', + email: 'johndoe4@test.io', + createdAt: 1673441483, + profilePictureURL: '', + orgId: '1287612376312867312867', + groupId: '5678458745786', + role: 'ADMIN', + organization: 'Test Inc', + flags: null, + }, + { + id: '6f532456-5678458745786', + name: 'Harry', + email: 'harry@test.io', + createdAt: 1691551672, + profilePictureURL: '', + orgId: '1287612376312867312867', + groupId: '5678458745786', + role: 'ADMIN', + organization: 'Test Inc', + flags: null, + }, + { + id: 'ae22fa73-5678458745786', + name: 'Ron', + email: 'ron@test.io', + createdAt: 1691668239, + profilePictureURL: '', + orgId: '1287612376312867312867', + groupId: '5678458745786', + role: 'ADMIN', + organization: 'Test Inc', + flags: null, + }, + { + id: '3223a874-5678458745786', + name: 'John Doe', + email: 'johndoe@test.io', + createdAt: 1666357530, + profilePictureURL: '', + orgId: '1287612376312867312867', + groupId: '5678458745786', + role: 'ADMIN', + organization: 'Test Inc', + flags: null, + }, + { + id: '5e9681b1-5678458745786', + name: 'Jane Doe', + email: 'johndoe2@test.io', + createdAt: 1666365394, + profilePictureURL: '', + orgId: '1287612376312867312867', + groupId: '5678458745786', + role: 'ADMIN', + organization: 'Test Inc', + flags: null, + }, + { + id: '11e8c55d-5678458745786', + name: 'Alex', + email: 'blah@test.io', + createdAt: 1666366317, + profilePictureURL: '', + orgId: '1287612376312867312867', + groupId: 'd878012367813286731aab62', + role: 'VIEWER', + organization: 'Test Inc', + flags: null, + }, + { + id: '2ad2e404-5678458745786', + name: 'Tom', + email: 'johndoe4@test.io', + createdAt: 1673441483, + profilePictureURL: '', + orgId: '1287612376312867312867', + groupId: '5678458745786', + role: 'ADMIN', + organization: 'Test Inc', + flags: null, + }, + { + id: '6f532456-5678458745786', + name: 'Harry', + email: 'harry@test.io', + createdAt: 1691551672, + profilePictureURL: '', + orgId: '1287612376312867312867', + groupId: '5678458745786', + role: 'ADMIN', + organization: 'Test Inc', + flags: null, + }, + { + id: 'ae22fa73-5678458745786', + name: 'Ron', + email: 'ron@test.io', + createdAt: 1691668239, + profilePictureURL: '', + orgId: '1287612376312867312867', + groupId: '5678458745786', + role: 'ADMIN', + organization: 'Test Inc', + flags: null, + }, + { + id: '3223a874-5678458745786', + name: 'John Doe', + email: 'johndoe@test.io', + createdAt: 1666357530, + profilePictureURL: '', + orgId: '1287612376312867312867', + groupId: '5678458745786', + role: 'ADMIN', + organization: 'Test Inc', + flags: null, + }, + { + id: '5e9681b1-5678458745786', + name: 'Jane Doe', + email: 'johndoe2@test.io', + createdAt: 1666365394, + profilePictureURL: '', + orgId: '1287612376312867312867', + groupId: '5678458745786', + role: 'ADMIN', + organization: 'Test Inc', + flags: null, + }, + { + id: '11e8c55d-5678458745786', + name: 'Alex', + email: 'blah@test.io', + createdAt: 1666366317, + profilePictureURL: '', + orgId: '1287612376312867312867', + groupId: 'd878012367813286731aab62', + role: 'VIEWER', + organization: 'Test Inc', + flags: null, + }, + { + id: '2ad2e404-5678458745786', + name: 'Tom', + email: 'johndoe4@test.io', + createdAt: 1673441483, + profilePictureURL: '', + orgId: '1287612376312867312867', + groupId: '5678458745786', + role: 'ADMIN', + organization: 'Test Inc', + flags: null, + }, + { + id: '6f532456-5678458745786', + name: 'Harry', + email: 'harry@test.io', + createdAt: 1691551672, + profilePictureURL: '', + orgId: '1287612376312867312867', + groupId: '5678458745786', + role: 'ADMIN', + organization: 'Test Inc', + flags: null, + }, + { + id: 'ae22fa73-5678458745786', + name: 'Ron', + email: 'lastUser@test.io', + createdAt: 1691668239, + profilePictureURL: '', + orgId: '1287612376312867312867', + groupId: '5678458745786', + role: 'ADMIN', + organization: 'Test Inc', + flags: null, + }, +]; diff --git a/frontend/src/mocks-server/handlers.ts b/frontend/src/mocks-server/handlers.ts index 445c4d8354..4e48a4a908 100644 --- a/frontend/src/mocks-server/handlers.ts +++ b/frontend/src/mocks-server/handlers.ts @@ -2,6 +2,7 @@ import { rest } from 'msw'; import { billingSuccessResponse } from './__mockdata__/billing'; import { licensesSuccessResponse } from './__mockdata__/licenses'; +import { membersResponse } from './__mockdata__/members'; import { queryRangeSuccessResponse } from './__mockdata__/query_range'; import { serviceSuccessResponse } from './__mockdata__/services'; import { topLevelOperationSuccessResponse } from './__mockdata__/top_level_operations'; @@ -25,6 +26,9 @@ export const handlers = [ res(ctx.status(200), ctx.json(topLevelOperationSuccessResponse)), ), + rest.get('http://localhost/api/v1/orgUsers/*', (req, res, ctx) => + res(ctx.status(200), ctx.json(membersResponse)), + ), rest.get( 'http://localhost/api/v3/autocomplete/attribute_keys', (req, res, ctx) => { diff --git a/frontend/src/tests/test-utils.tsx b/frontend/src/tests/test-utils.tsx index 45793dfa76..ff2d3c7e51 100644 --- a/frontend/src/tests/test-utils.tsx +++ b/frontend/src/tests/test-utils.tsx @@ -42,6 +42,15 @@ const mockStored = (role?: string): any => accessJwt: '', refreshJwt: '', }, + org: [ + { + createdAt: 0, + hasOptedUpdates: false, + id: 'xyz', + isAnonymous: false, + name: 'Test Inc. - India', + }, + ], }, });