[7.x] [Logs UI] Reload log entries on container mount (elastic#34099) (…

…elastic#34384)

Backports the following commits to 7.x:
 - [Logs UI] Reload log entries on container mount  (elastic#34099)

x-pack/plugins/infra/public/containers/logs/with_stream_items.ts

@@ -24,10 +24,17 @@ export const withStreamItems = connect(
  }),
  bindPlainActionCreators({
  loadNewerEntries: logEntriesActions.loadNewerEntries,
+ reloadEntries: logEntriesActions.reloadEntries,
  })
 );
 
-export const WithStreamItems = asChildFunctionRenderer(withStreamItems);
+export const WithStreamItems = asChildFunctionRenderer(withStreamItems, {
+ onInitialize: props => {
+ if (!props.isReloading && !props.isLoadingMore) {
+ props.reloadEntries();
+ }
+ },
+});
 
 const selectItems = createSelector(
  logEntriesSelectors.selectEntries,

x-pack/plugins/infra/public/pages/logs/page_content.tsx

@@ -36,7 +36,7 @@ export const LogsPageContent: React.FunctionComponent<Props> = ({ showFlyout, se
  reportVisiblePositions,
  targetPosition,
  }) => (
- <WithStreamItems>
+ <WithStreamItems initializeOnMount={!isAutoReloading}>
  {({
  hasMoreAfterEnd,
  hasMoreBeforeStart,

x-pack/plugins/infra/public/store/remote/log_entries/actions.ts

@@ -15,3 +15,5 @@ export const loadEntries = loadEntriesActionCreators.resolve;
 export const loadMoreEntries = loadMoreEntriesActionCreators.resolve;
 
 export const loadNewerEntries = actionCreator('LOAD_NEWER_LOG_ENTRIES');
+
+export const reloadEntries = actionCreator('RELOAD_LOG_ENTRIES');

x-pack/plugins/infra/public/store/remote/log_entries/epic.ts

@@ -11,7 +11,7 @@ import { exhaustMap, filter, map, withLatestFrom } from 'rxjs/operators';
 
 import { logFilterActions, logPositionActions } from '../..';
 import { pickTimeKey, TimeKey, timeKeyIsBetween } from '../../../../common/time';
-import { loadEntries, loadMoreEntries, loadNewerEntries } from './actions';
+import { loadEntries, loadMoreEntries, loadNewerEntries, reloadEntries } from './actions';
 import { loadEntriesEpic } from './operations/load';
 import { loadMoreEntriesEpic } from './operations/load_more';
 
@@ -81,6 +81,8 @@ export const createEntriesEffectsEpic = <State>(): Epic<
  withLatestFrom(filterQuery$, (filterQuery, filterQueryString) => filterQueryString)
  );
 
+ const shouldReload$ = action$.pipe(filter(reloadEntries.match));
+
  const shouldLoadMoreBefore$ = action$.pipe(
  filter(logPositionActions.reportVisiblePositions.match),
  filter(({ payload: { pagesBeforeStart } }) => pagesBeforeStart < DESIRED_BUFFER_PAGES),
@@ -143,6 +145,18 @@ export const createEntriesEffectsEpic = <State>(): Epic<
  }),
  ])
  ),
+ shouldReload$.pipe(
+ withLatestFrom(visibleMidpointOrTarget$, filterQuery$),
+ exhaustMap(([_, timeKey, filterQuery]) => [
+ loadEntries({
+ sourceId: 'default',
+ timeKey,
+ countBefore: LOAD_CHUNK_SIZE,
+ countAfter: LOAD_CHUNK_SIZE,
+ filterQuery,
+ }),
+ ])
+ ),
  shouldLoadMoreAfter$.pipe(
  withLatestFrom(filterQuery$),
  exhaustMap(([timeKey, filterQuery]) => [

x-pack/plugins/infra/public/store/remote/log_entries/operations/load.ts

@@ -24,7 +24,12 @@ export const loadEntriesReducer = createGraphqlOperationReducer(
  operationKey,
  initialLogEntriesState,
  loadEntriesActionCreators,
- (state, action) => action.payload.result.data.source.logEntriesAround
+ (state, action) => action.payload.result.data.source.logEntriesAround,
+ () => ({
+ entries: [],
+ hasMoreAfter: false,
+ hasMoreBefore: false,
+ })
 );
 
 export const loadEntriesEpic = createGraphqlQueryEpic(logEntriesQuery, loadEntriesActionCreators);

x-pack/plugins/infra/public/utils/remote_state/remote_graphql_state.ts

@@ -81,6 +81,10 @@ export const createGraphqlOperationReducer = <State, Data, Variables, Error = Ap
  reduceSuccess: (
  state: State | undefined,
  action: Action<ResolveDonePayload<Variables, Data>>
+ ) => State | undefined = state => state,
+ reduceFailure: (
+ state: State | undefined,
+ action: Action<ResolveFailedPayload<Variables, Error>>
  ) => State | undefined = state => state
 ) =>
  reducerWithInitialState(initialState)
@@ -125,6 +129,7 @@ export const createGraphqlOperationReducer = <State, Data, Variables, Error = Ap
  variables: action.payload.params,
  },
  },
+ data: reduceFailure(state.data, action),
  }))
  .build();