undo

ui/src/logs/actions/index.ts

@@ -46,7 +46,7 @@ const defaultTableData: TableData = {
     'timestamp',
     'facility',
     'procid',
-    'application',
+    'appname',
     'host',
     'message',
   ],
@@ -412,17 +412,7 @@ export const executeTableBackwardQueryAsync = () => async (
   try {
     dispatch(incrementQueryCount())
 
-    const queryTimeRange = {
-      upper: timeRange.upper,
-      lower: timeRange.lower,
-      seconds: timeRange.seconds,
-    }
-    const query = buildLogQuery(
-      queryTimeRange,
-      queryConfig,
-      filters,
-      searchTerm
-    )
+    const query = buildBackwardLogQuery(time, queryConfig, filters, searchTerm)
     const response = await executeQueryAsync(
       proxyLink,
       namespace,

ui/src/logs/containers/LogsPage.tsx

@@ -39,7 +39,7 @@ import OverlayTechnology from 'src/reusable_ui/components/overlays/OverlayTechno
 import {SeverityFormatOptions, SECONDS_TO_MS} from 'src/logs/constants'
 import {Source, Namespace} from 'src/types'
 
-import {HistogramData, HistogramColor} from 'src/types/histogram'
+import {HistogramData, HistogramColor, BarGroup} from 'src/types/histogram'
 import {
   Filter,
   SeverityLevelColor,
@@ -326,6 +326,7 @@ class LogsPage extends Component<Props, State> {
             height={height}
             colorScale={colorForSeverity}
             colors={histogramColors}
+            onBarClick={this.handleBarClick}
           />
         )}
       </AutoSizer>
@@ -396,6 +397,19 @@ class LogsPage extends Component<Props, State> {
     this.props.executeQueriesAsync()
   }
 
+  private handleBarClick = (group: BarGroup): void => {
+    const {data} = group
+
+    if (!data.length) {
+      return
+    }
+
+    const unixTimestamp = data[0].time
+    const timeOption = moment(unixTimestamp).toISOString()
+
+    this.handleSetTimeMarker({timeOption})
+  }
+
   private handleSetTimeBounds = async () => {
     const {seconds, windowOption, timeOption} = this.props.timeRange
     let lower = `now() - ${windowOption}`

ui/test/logs/reducers/logs.test.ts

@@ -1,17 +1,57 @@
 import reducer, {defaultState} from 'src/logs/reducers'
-import {setTimeWindow} from 'src/logs/actions'
+import {setTimeWindow, setTimeMarker, setTimeBounds} from 'src/logs/actions'
 
 describe('Logs.Reducers', () => {
   it('can set a time window', () => {
-    const expected = {
-      timeOption: 'now',
-      windowOption: '1h',
-      upper: null,
-      lower: 'now() - 1h',
-      seconds: 3600,
+    const actionPayload = {
+      windowOption: '10m',
+      seconds: 600,
     }
 
-    const actual = reducer(defaultState, setTimeWindow(expected))
-    expect(actual.timeWindow).toBe(expected)
+    const expected = {
+      timeOption: 'now',
+      windowOption: '10m',
+      upper: null,
+      lower: 'now() - 1m',
+      seconds: 600,
+    }
+
+    const actual = reducer(defaultState, setTimeWindow(actionPayload))
+    expect(actual.timeRange).toEqual(expected)
+  })
+
+  it('can set a time marker', () => {
+    const actionPayload = {
+      timeOption: '2018-07-10T22:22:21.769Z',
+    }
+
+    const expected = {
+      timeOption: '2018-07-10T22:22:21.769Z',
+      windowOption: '1m',
+      upper: null,
+      lower: 'now() - 1m',
+      seconds: 60,
+    }
+
+    const actual = reducer(defaultState, setTimeMarker(actionPayload))
+    expect(actual.timeRange).toEqual(expected)
+  })
+
+  it('can set the time bounds', () => {
+    const payload = {
+      upper: '2018-07-10T22:20:21.769Z',
+      lower: '2018-07-10T22:22:21.769Z',
+    }
+
+    const expected = {
+      timeOption: 'now',
+      windowOption: '1m',
+      upper: '2018-07-10T22:20:21.769Z',
+      lower: '2018-07-10T22:22:21.769Z',
+      seconds: 60,
+    }
+
+    const actual = reducer(defaultState, setTimeBounds(payload))
+    expect(actual.timeRange).toEqual(expected)
   })
 })