[Logs UI] Fix log stream data fetching (#93201)
* Use ReplaySubject and amend date comparisons * Assess date range expressions separately * Only add dataset filter to view in stream links if one exists
This commit is contained in:
parent
6ab3fc0107
commit
e45718d0ff
|
@ -21,6 +21,7 @@ interface DateRange {
|
|||
startTimestamp: number;
|
||||
endTimestamp: number;
|
||||
timestampsLastUpdate: number;
|
||||
lastCompleteDateRangeExpressionUpdate: number;
|
||||
}
|
||||
|
||||
interface VisiblePositions {
|
||||
|
@ -46,6 +47,7 @@ export interface LogPositionStateParams {
|
|||
startTimestamp: number | null;
|
||||
endTimestamp: number | null;
|
||||
timestampsLastUpdate: number;
|
||||
lastCompleteDateRangeExpressionUpdate: number;
|
||||
}
|
||||
|
||||
export interface LogPositionCallbacks {
|
||||
|
@ -121,6 +123,7 @@ export const useLogPositionState: () => LogPositionStateParams & LogPositionCall
|
|||
startTimestamp: datemathToEpochMillis(DEFAULT_DATE_RANGE.startDateExpression)!,
|
||||
endTimestamp: datemathToEpochMillis(DEFAULT_DATE_RANGE.endDateExpression, 'up')!,
|
||||
timestampsLastUpdate: Date.now(),
|
||||
lastCompleteDateRangeExpressionUpdate: Date.now(),
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
|
@ -171,12 +174,18 @@ export const useLogPositionState: () => LogPositionStateParams & LogPositionCall
|
|||
jumpToTargetPosition(null);
|
||||
}
|
||||
|
||||
setDateRange({
|
||||
setDateRange((prevState) => ({
|
||||
...newDateRange,
|
||||
startTimestamp: nextStartTimestamp,
|
||||
endTimestamp: nextEndTimestamp,
|
||||
timestampsLastUpdate: Date.now(),
|
||||
});
|
||||
// NOTE: Complete refers to the last time an update was requested with both expressions. These require a full refresh (unless streaming). Timerange expansion
|
||||
// and pagination however do not.
|
||||
lastCompleteDateRangeExpressionUpdate:
|
||||
'startDateExpression' in newDateRange && 'endDateExpression' in newDateRange
|
||||
? Date.now()
|
||||
: prevState.lastCompleteDateRangeExpressionUpdate,
|
||||
}));
|
||||
},
|
||||
[setDateRange, dateRange, targetPosition]
|
||||
);
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
*/
|
||||
|
||||
import { useCallback } from 'react';
|
||||
import { combineLatest, Observable, Subject } from 'rxjs';
|
||||
import { combineLatest, Observable, ReplaySubject } from 'rxjs';
|
||||
import { last, map, startWith, switchMap } from 'rxjs/operators';
|
||||
import { LogSourceColumnConfiguration } from '../../../../common/http_api/log_sources';
|
||||
import { LogEntryCursor } from '../../../../common/log_entry';
|
||||
|
@ -53,7 +53,7 @@ export const useFetchLogEntriesAround = ({
|
|||
type LogEntriesAfterRequest = NonNullable<ReturnType<typeof fetchLogEntriesAfter>>;
|
||||
|
||||
const logEntriesAroundSearchRequests$ = useObservable(
|
||||
() => new Subject<[LogEntriesBeforeRequest, Observable<LogEntriesAfterRequest>]>(),
|
||||
() => new ReplaySubject<[LogEntriesBeforeRequest, Observable<LogEntriesAfterRequest>]>(),
|
||||
[]
|
||||
);
|
||||
|
||||
|
|
|
@ -111,10 +111,14 @@ export const LogEntryExampleMessage: React.FunctionComponent<Props> = ({
|
|||
flyoutOptions: encode({
|
||||
surroundingLogsId: id,
|
||||
}),
|
||||
logFilter: encode({
|
||||
expression: `${partitionField}: ${dataset}`,
|
||||
kind: 'kuery',
|
||||
}),
|
||||
...(dataset
|
||||
? {
|
||||
logFilter: encode({
|
||||
expression: `${partitionField}: ${dataset}`,
|
||||
kind: 'kuery',
|
||||
}),
|
||||
}
|
||||
: {}),
|
||||
},
|
||||
});
|
||||
|
||||
|
|
|
@ -60,6 +60,7 @@ export const LogsPageLogsContent: React.FunctionComponent = () => {
|
|||
startDateExpression,
|
||||
endDateExpression,
|
||||
updateDateRange,
|
||||
lastCompleteDateRangeExpressionUpdate,
|
||||
} = useContext(LogPositionState.Context);
|
||||
const { filterQuery, applyLogFilterQuery } = useContext(LogFilterState.Context);
|
||||
|
||||
|
@ -81,16 +82,16 @@ export const LogsPageLogsContent: React.FunctionComponent = () => {
|
|||
const prevStartTimestamp = usePrevious(startTimestamp);
|
||||
const prevEndTimestamp = usePrevious(endTimestamp);
|
||||
const prevFilterQuery = usePrevious(filterQuery);
|
||||
const prevLastCompleteDateRangeExpressionUpdate = usePrevious(
|
||||
lastCompleteDateRangeExpressionUpdate
|
||||
);
|
||||
|
||||
// Refetch entries if...
|
||||
useEffect(() => {
|
||||
const isFirstLoad = !prevStartTimestamp || !prevEndTimestamp;
|
||||
|
||||
const newDateRangeDoesNotOverlap =
|
||||
(prevStartTimestamp != null &&
|
||||
startTimestamp != null &&
|
||||
prevStartTimestamp < startTimestamp) ||
|
||||
(prevEndTimestamp != null && endTimestamp != null && prevEndTimestamp > endTimestamp);
|
||||
const completeDateRangeExpressionHasChanged =
|
||||
lastCompleteDateRangeExpressionUpdate !== prevLastCompleteDateRangeExpressionUpdate;
|
||||
|
||||
const isCenterPointOutsideLoadedRange =
|
||||
targetPosition != null &&
|
||||
|
@ -101,7 +102,7 @@ export const LogsPageLogsContent: React.FunctionComponent = () => {
|
|||
|
||||
if (
|
||||
isFirstLoad ||
|
||||
newDateRangeDoesNotOverlap ||
|
||||
completeDateRangeExpressionHasChanged ||
|
||||
isCenterPointOutsideLoadedRange ||
|
||||
hasQueryChanged
|
||||
) {
|
||||
|
@ -124,6 +125,8 @@ export const LogsPageLogsContent: React.FunctionComponent = () => {
|
|||
bottomCursor,
|
||||
filterQuery,
|
||||
prevFilterQuery,
|
||||
lastCompleteDateRangeExpressionUpdate,
|
||||
prevLastCompleteDateRangeExpressionUpdate,
|
||||
]);
|
||||
|
||||
const { logSummaryHighlights, currentHighlightKey, logEntryHighlightsById } = useContext(
|
||||
|
|
Loading…
Reference in a new issue