diff --git a/x-pack/legacy/plugins/siem/public/components/timeline/properties/helpers.tsx b/x-pack/legacy/plugins/siem/public/components/timeline/properties/helpers.tsx index 16fdf118c9d95d..6f7e1f782d3f67 100644 --- a/x-pack/legacy/plugins/siem/public/components/timeline/properties/helpers.tsx +++ b/x-pack/legacy/plugins/siem/public/components/timeline/properties/helpers.tsx @@ -21,7 +21,7 @@ import React, { useCallback } from 'react'; import uuid from 'uuid'; import styled from 'styled-components'; import { useHistory } from 'react-router-dom'; -import { useDispatch, useSelector } from 'react-redux'; +import { useSelector } from 'react-redux'; import { Note } from '../../../lib/note'; import { Notes } from '../../notes'; @@ -30,7 +30,7 @@ import { NOTES_PANEL_WIDTH } from './notes_size'; import { ButtonContainer, DescriptionContainer, LabelText, NameField, StyledStar } from './styles'; import * as i18n from './translations'; import { SiemPageName } from '../../../pages/home/types'; -import { timelineActions, timelineSelectors } from '../../../store/timeline'; +import { timelineSelectors } from '../../../store/timeline'; import { State } from '../../../store'; export const historyToolTip = 'The chronological history of actions related to this timeline'; diff --git a/x-pack/legacy/plugins/siem/public/pages/case/components/all_cases/index.tsx b/x-pack/legacy/plugins/siem/public/pages/case/components/all_cases/index.tsx index 0de8f9444c6084..a6eca717a82a3e 100644 --- a/x-pack/legacy/plugins/siem/public/pages/case/components/all_cases/index.tsx +++ b/x-pack/legacy/plugins/siem/public/pages/case/components/all_cases/index.tsx @@ -4,7 +4,7 @@ * you may not use this file except in compliance with the Elastic License. */ -import React, { useCallback, useEffect, useMemo, useState } from 'react'; +import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'; import { EuiBasicTable, EuiButton, @@ -129,20 +129,25 @@ export const AllCases = React.memo(({ userCanCrud }) => { id: '', }); const [deleteBulk, setDeleteBulk] = useState([]); - const [isRefetchFilters, setIsRefetchFilters] = useState(false); + const filterRefetch = useRef<() => void>(); + const setFilterRefetch = useCallback( + (refetchFilter: () => void) => { + filterRefetch.current = refetchFilter; + }, + [filterRefetch.current] + ); const refreshCases = useCallback( (dataRefresh = true) => { if (dataRefresh) refetchCases(); fetchCasesStatus(); setSelectedCases([]); setDeleteBulk([]); - setIsRefetchFilters(true); + if (filterRefetch.current != null) { + filterRefetch.current(); + } }, - [filterOptions, queryParams] + [filterOptions, queryParams, filterRefetch.current] ); - useEffect(() => { - refreshCases(false); - }, [filterOptions, queryParams]); useEffect(() => { if (isDeleted) { @@ -254,6 +259,7 @@ export const AllCases = React.memo(({ userCanCrud }) => { }; } setQueryParams(newQueryParams); + refreshCases(false); }, [queryParams] ); @@ -266,6 +272,7 @@ export const AllCases = React.memo(({ userCanCrud }) => { setQueryParams({ sortField: SortFieldCase.createdAt }); } setFilters(newFilterOptions); + refreshCases(false); }, [filterOptions, queryParams] ); @@ -354,8 +361,7 @@ export const AllCases = React.memo(({ userCanCrud }) => { tags: filterOptions.tags, status: filterOptions.status, }} - isRefetchFilters={isRefetchFilters} - setIsRefetchFilters={setIsRefetchFilters} + setFilterRefetch={setFilterRefetch} /> {isCasesLoading && isDataEmpty ? (
diff --git a/x-pack/legacy/plugins/siem/public/pages/case/components/all_cases/table_filters.test.tsx b/x-pack/legacy/plugins/siem/public/pages/case/components/all_cases/table_filters.test.tsx index ed3925a682d820..21dcc9732440d3 100644 --- a/x-pack/legacy/plugins/siem/public/pages/case/components/all_cases/table_filters.test.tsx +++ b/x-pack/legacy/plugins/siem/public/pages/case/components/all_cases/table_filters.test.tsx @@ -20,15 +20,14 @@ jest.mock('../../../../containers/case/use_get_tags'); const onFilterChanged = jest.fn(); const fetchReporters = jest.fn(); const fetchTags = jest.fn(); -const setIsRefetchFilters = jest.fn(); +const setFilterRefetch = jest.fn(); const props = { countClosedCases: 1234, countOpenCases: 99, onFilterChanged, initial: DEFAULT_FILTER_OPTIONS, - isRefetchFilters: false, - setIsRefetchFilters, + setFilterRefetch, }; describe('CasesTableFilters ', () => { beforeEach(() => { @@ -122,15 +121,13 @@ describe('CasesTableFilters ', () => { expect(onFilterChanged).toBeCalledWith({ status: 'closed' }); }); - it('should refetch tags and reporters when isRefetchFilters is true', () => { + it('should call on load setFilterRefetch', () => { mount( - + ); - expect(fetchReporters).toHaveBeenCalledTimes(1); - expect(fetchTags).toHaveBeenCalledTimes(1); - expect(setIsRefetchFilters).toHaveBeenCalledWith(false); + expect(setFilterRefetch).toHaveBeenCalled(); }); it('should remove tag from selected tags when tag no longer exists', () => { const ourProps = { diff --git a/x-pack/legacy/plugins/siem/public/pages/case/components/all_cases/table_filters.tsx b/x-pack/legacy/plugins/siem/public/pages/case/components/all_cases/table_filters.tsx index 7ab58bfbd5f020..901fb133753e82 100644 --- a/x-pack/legacy/plugins/siem/public/pages/case/components/all_cases/table_filters.tsx +++ b/x-pack/legacy/plugins/siem/public/pages/case/components/all_cases/table_filters.tsx @@ -25,8 +25,7 @@ interface CasesTableFiltersProps { countOpenCases: number | null; onFilterChanged: (filterOptions: Partial) => void; initial: FilterOptions; - isRefetchFilters: boolean; - setIsRefetchFilters: (val: boolean) => void; + setFilterRefetch: (val: () => void) => void; } /** @@ -43,8 +42,7 @@ const CasesTableFiltersComponent = ({ countOpenCases, onFilterChanged, initial = defaultInitial, - isRefetchFilters, - setIsRefetchFilters, + setFilterRefetch, }: CasesTableFiltersProps) => { const [selectedReporters, setSelectedReporters] = useState( initial.reporters.map(r => r.full_name ?? r.username ?? '') @@ -54,14 +52,15 @@ const CasesTableFiltersComponent = ({ const [showOpenCases, setShowOpenCases] = useState(initial.status === 'open'); const { tags, fetchTags } = useGetTags(); const { reporters, respReporters, fetchReporters } = useGetReporters(); - + const refetch = useCallback(() => { + fetchTags(); + fetchReporters(); + }, [fetchReporters, fetchTags]); useEffect(() => { - if (isRefetchFilters) { - fetchTags(); - fetchReporters(); - setIsRefetchFilters(false); + if (setFilterRefetch != null) { + setFilterRefetch(refetch); } - }, [isRefetchFilters]); + }, [refetch, setFilterRefetch]); useEffect(() => { if (selectedReporters.length) { const newReporters = selectedReporters.filter(r => reporters.includes(r));