diff --git a/assets/js/pages/ActivityLogPage/ActivityLogPage.jsx b/assets/js/pages/ActivityLogPage/ActivityLogPage.jsx index f0c3c6e346..dbf16c3723 100644 --- a/assets/js/pages/ActivityLogPage/ActivityLogPage.jsx +++ b/assets/js/pages/ActivityLogPage/ActivityLogPage.jsx @@ -1,19 +1,14 @@ -import React, { useState, useEffect } from 'react'; -import { useSearchParams } from 'react-router-dom'; -import { useSelector } from 'react-redux'; - -import { map, pipe } from 'lodash/fp'; - +import ActivityLogOverview from '@common/ActivityLogOverview'; +import ComposedFilter from '@common/ComposedFilter'; +import PageHeader from '@common/PageHeader'; import { getActivityLog } from '@lib/api/activityLogs'; import { allowedActivities } from '@lib/model/activityLog'; - +import { getActivityLogUsers } from '@state/selectors/activityLog'; import { getUserProfile } from '@state/selectors/user'; - -import PageHeader from '@common/PageHeader'; +import { map, pipe } from 'lodash/fp'; +import React, { useEffect, useState } from 'react'; import { useSelector } from 'react-redux'; -import ActivityLogOverview from '@common/ActivityLogOverview'; -import ComposedFilter from '@common/ComposedFilter'; -import { getActivityLogUsers } from '@state/selectors/activityLog'; +import { useSearchParams } from 'react-router-dom'; import { filterValueToSearchParams, @@ -23,36 +18,6 @@ import { function ActivityLogPage() { const users = useSelector(getActivityLogUsers); - const filters = [ - { - key: 'type', - type: 'select', - title: 'Resource type', - options: Object.entries(ACTIVITY_TYPES_CONFIG).map(([key, value]) => [ - key, - value.label, - ]), - }, - { - key: 'actor', - type: 'select', - title: 'User', - options: users, - }, - { - key: 'to_date', - title: 'newer than', - type: 'date', - prefilled: true, - }, - { - key: 'from_date', - title: 'older than', - type: 'date', - prefilled: true, - }, - ]; - const [searchParams, setSearchParams] = useSearchParams(); const [activityLog, setActivityLog] = useState([]); const [isLoading, setLoading] = useState(true); @@ -70,6 +35,12 @@ function ActivityLogPage() { map(([key, value]) => [key, value.label]) )(abilities), }, + { + key: 'actor', + type: 'select', + title: 'User', + options: users, + }, { key: 'to_date', title: 'newer than', diff --git a/assets/js/pages/ActivityLogPage/ActivityLogPage.test.jsx b/assets/js/pages/ActivityLogPage/ActivityLogPage.test.jsx index 22aa56ab8f..094734a7a5 100644 --- a/assets/js/pages/ActivityLogPage/ActivityLogPage.test.jsx +++ b/assets/js/pages/ActivityLogPage/ActivityLogPage.test.jsx @@ -1,15 +1,11 @@ import '@testing-library/jest-dom'; -<<<<<<< HEAD -======= -import MockAdapter from 'axios-mock-adapter'; -import { withDefaultState, renderWithRouter } from '@lib/test-utils'; - ->>>>>>> d9845ca54 (Refactors ActivityLogPage test) import { networkClient } from '@lib/network'; -import { renderWithRouter, withDefaultState } from '@lib/test-utils'; +import { renderWithRouter, withDefaultState, withState } from '@lib/test-utils'; import { activityLogEntryFactory } from '@lib/test-utils/factories/activityLog'; +import { userFactory } from '@lib/test-utils/factories/users'; import { screen } from '@testing-library/react'; +import userEvent from '@testing-library/user-event'; import MockAdapter from 'axios-mock-adapter'; import React, { act } from 'react'; @@ -63,4 +59,18 @@ describe('ActivityLogPage', () => { ); expect(container.querySelectorAll('tbody > tr')).toHaveLength(5); }); + + it('should render tracked activity log and the users filter with non-default/non-empty state', async () => { + const users = userFactory.buildList(5).map((user) => user.username); + axiosMock.onGet('/api/v1/activity_log'); + const [StatefulActivityLogPage, _] = withState(, { + activityLog: { users }, + }); + const { container } = await act(() => + renderWithRouter(StatefulActivityLogPage) + ); + + await userEvent.click(screen.getByTestId('filter-User')); + expect(container.querySelectorAll('ul > li')).toHaveLength(users.length); + }); });