diff --git a/x-pack/plugins/infra/public/components/log_stream/log_stream.tsx b/x-pack/plugins/infra/public/components/log_stream/log_stream.tsx index 0087d559a42e6..ff9b749911c84 100644 --- a/x-pack/plugins/infra/public/components/log_stream/log_stream.tsx +++ b/x-pack/plugins/infra/public/components/log_stream/log_stream.tsx @@ -112,7 +112,7 @@ Read more at https://github.com/elastic/kibana/blob/master/src/plugins/kibana_re const { derivedIndexPattern, - isLoadingSourceConfiguration, + isLoading: isLoadingSource, loadSource, sourceConfiguration, } = useLogSource({ @@ -138,7 +138,7 @@ Read more at https://github.com/elastic/kibana/blob/master/src/plugins/kibana_re hasMoreAfter, hasMoreBefore, isLoadingMore, - isReloading, + isReloading: isLoadingEntries, } = useLogStream({ sourceId, startTimestamp, @@ -198,7 +198,7 @@ Read more at https://github.com/elastic/kibana/blob/master/src/plugins/kibana_re items={streamItems} scale="medium" wrap={true} - isReloading={isLoadingSourceConfiguration || isReloading} + isReloading={isLoadingSource || isLoadingEntries} isLoadingMore={isLoadingMore} hasMoreBeforeStart={hasMoreBefore} hasMoreAfterEnd={hasMoreAfter} diff --git a/x-pack/plugins/infra/public/containers/logs/log_stream/index.ts b/x-pack/plugins/infra/public/containers/logs/log_stream/index.ts index 021aa8f79fe59..4cdeb678c432b 100644 --- a/x-pack/plugins/infra/public/containers/logs/log_stream/index.ts +++ b/x-pack/plugins/infra/public/containers/logs/log_stream/index.ts @@ -5,8 +5,9 @@ * 2.0. */ +import { isEqual } from 'lodash'; import createContainer from 'constate'; -import { useCallback, useEffect, useMemo, useState } from 'react'; +import { useCallback, useEffect, useMemo, useState, useRef } from 'react'; import usePrevious from 'react-use/lib/usePrevious'; import useSetState from 'react-use/lib/useSetState'; import { esQuery } from '../../../../../../../src/plugins/data/public'; @@ -65,6 +66,12 @@ export function useLogStream({ const prevStartTimestamp = usePrevious(startTimestamp); const prevEndTimestamp = usePrevious(endTimestamp); + const cachedQuery = useRef(query); + + if (!isEqual(query, cachedQuery)) { + cachedQuery.current = query; + } + useEffect(() => { if (prevStartTimestamp && prevStartTimestamp > startTimestamp) { setState({ hasMoreBefore: true }); @@ -82,10 +89,10 @@ export function useLogStream({ sourceId, startTimestamp, endTimestamp, - query, + query: cachedQuery.current, columnOverrides: columns, }), - [columns, endTimestamp, query, sourceId, startTimestamp] + [columns, endTimestamp, cachedQuery, sourceId, startTimestamp] ); const {