Extend log range

elastic · Jan 16, 2020 · 077aed4 · 077aed4
1 parent f83254b
commit 077aed4
Show file tree

Hide file tree

Showing 3 changed files with 38 additions and 5 deletions.
diff --git a/x-pack/legacy/plugins/infra/public/components/logging/log_text_stream/loading_item_view.tsx b/x-pack/legacy/plugins/infra/public/components/logging/log_text_stream/loading_item_view.tsx
@@ -19,6 +19,7 @@ import * as React from 'react';
 
 import euiStyled from '../../../../../../common/eui_styled_components';
 import { LogTextSeparator } from './log_text_separator';
+import { extendDatemath } from '../../../utils/datemath';
 
 type Position = 'start' | 'end';
 
@@ -32,7 +33,7 @@ interface LogTextStreamLoadingItemViewProps {
  hasMore: boolean;
  isLoading: boolean;
  isStreaming: boolean;
- onExtendRange?: () => void;
+ onExtendRange?: (newDate: string) => void;
  onStreamStart?: () => void;
 }
 
@@ -139,12 +140,30 @@ const ProgressCta: React.FC<Pick<
 
  const iconType = position === 'start' ? 'arrowUp' : 'arrowDown';
 
+ if (!rangeEdge) {
+ return null;
+ }
+
+ const extendedRange = extendDatemath(rangeEdge, position === 'start' ? 'before' : 'after');
+
+ if (!extendedRange || extendedRange.value === 'now') {
+ return null;
+ }
+
  return (
- <EuiButton onClick={onExtendRange} iconType={iconType} size="s">
+ <EuiButton
+ onClick={() => {
+ if (typeof onExtendRange === 'function') {
+ onExtendRange(extendedRange.value);
+ }
+ }}
+ iconType={iconType}
+ size="s"
+ >
  <FormattedMessage
  id="xpack.infra.logs.extendTimeframe"
  defaultMessage="Extend timeframe {amount} {unit}"
- values={{ amount: 1, unit: 'hour' }}
+ values={{ amount: extendedRange.diffAmount, unit: extendedRange.diffUnit }}
  />
  </EuiButton>
  );

diff --git a/...ugins/infra/public/components/logging/log_text_stream/scrollable_log_text_stream_view.tsx b/...ugins/infra/public/components/logging/log_text_stream/scrollable_log_text_stream_view.tsx
@@ -55,6 +55,9 @@ interface ScrollableLogTextStreamViewProps {
  setFlyoutVisibility: (visible: boolean) => void;
  highlightedItem: string | null;
  currentHighlightKey: UniqueTimeKey | null;
+ startDate: string;
+ endDate: string;
+ updateDateRange: (range: { startDate?: string; endDate?: string }) => void;
 }
 
 interface ScrollableLogTextStreamViewState {
@@ -133,6 +136,9 @@ export class ScrollableLogTextStreamView extends React.PureComponent<
  lastLoadedTime,
  scale,
  wrap,
+ startDate,
+ endDate,
+ updateDateRange,
  } = this.props;
  const { targetId, items, isScrollLocked } = this.state;
  const hasItems = items.length > 0;
@@ -195,7 +201,8 @@ export class ScrollableLogTextStreamView extends React.PureComponent<
  items.length > 0 ? items[0].logEntry.cursor.time : undefined
  }
  isStreaming={false}
- // onExtendRange={(...args) => console.log('start.extendRange', args)}
+ rangeEdge={startDate}
+ onExtendRange={newDate => updateDateRange({ startDate: newDate })}
  />
  {items.map((item, idx) => {
  const currentTimestamp = item.logEntry.cursor.time;
@@ -248,7 +255,8 @@ export class ScrollableLogTextStreamView extends React.PureComponent<
  ? items[items.length - 1].logEntry.cursor.time
  : undefined
  }
- // onExtendRange={(...args) => console.log('end.extendRange', args)}
+ rangeEdge={endDate}
+ onExtendRange={newDate => updateDateRange({ endDate: newDate })}
  // onStreamStart={(...args) => console.log('end.streamStart', args)}
  // onLoadMore={this.handleLoadNewerItems}
  />

diff --git a/x-pack/legacy/plugins/infra/public/pages/logs/stream/page_logs_content.tsx b/x-pack/legacy/plugins/infra/public/pages/logs/stream/page_logs_content.tsx
@@ -51,6 +51,9 @@ export const LogsPageLogsContent: React.FunctionComponent = () => {
  reportVisiblePositions,
  jumpToTargetPosition,
  stopLiveStreaming,
+ startDate,
+ endDate,
+ updateDateRange,
  } = useContext(LogPositionState.Context);
  return (
  <>
@@ -102,6 +105,9 @@ export const LogsPageLogsContent: React.FunctionComponent = () => {
  setFlyoutVisibility={setFlyoutVisibility}
  highlightedItem={surroundingLogsId ? surroundingLogsId : null}
  currentHighlightKey={currentHighlightKey}
+ startDate={startDate}
+ endDate={endDate}
+ updateDateRange={updateDateRange}
  />
  )}
  </WithStreamItems>