Timelion: Move datemath parsing to the client (#47813) (#48889)

packages/kbn-ui-framework/src/components/local_nav/_local_title.scss

@@ -1,7 +1,6 @@
 .kuiLocalTitle {
   display: flex;
   align-items: center;
-  height: 100%;
   padding: ($localNavSideSpacing * 1.5) $localNavSideSpacing;
   font-size: $kuiFontSize;
   font-weight: bold;

src/legacy/core_plugins/timelion/public/app.js

@@ -407,9 +407,15 @@ app.controller('timelion', function (
     $scope.state.save();
     $scope.running = true;
 
+    // parse the time range client side to make sure it behaves like other charts
+    const timeRangeBounds = timefilter.getBounds();
+
     const httpResult = $http.post('../api/timelion/run', {
       sheet: $scope.state.sheet,
-      time: _.extend(timefilter.getTime(), {
+      time: _.extend({
+        from: timeRangeBounds.min,
+        to: timeRangeBounds.max,
+      }, {
         interval: $scope.state.interval,
         timezone: timezone
       }),

src/legacy/core_plugins/timelion/public/legacy.ts

@@ -21,11 +21,13 @@ import { PluginInitializerContext } from 'kibana/public';
 import { npSetup, npStart } from 'ui/new_platform';
 import { plugin } from '.';
 import { setup as visualizations } from '../../visualizations/public/np_ready/public/legacy';
+import { setup as data } from '../../data/public/legacy';
 import { TimelionPluginSetupDependencies } from './plugin';
 import { LegacyDependenciesPlugin } from './shim';
 
 const setupPlugins: Readonly<TimelionPluginSetupDependencies> = {
   visualizations,
+  data,
   expressions: npSetup.plugins.expressions,
 
   // Temporary solution

src/legacy/core_plugins/timelion/public/plugin.ts

@@ -29,6 +29,8 @@ import { VisualizationsSetup } from '../../visualizations/public/np_ready/public
 import { getTimelionVisualizationConfig } from './timelion_vis_fn';
 import { getTimelionVisualization } from './vis';
 import { getTimeChart } from './panels/timechart/timechart';
+import { DataSetup } from '../../data/public';
+import { TimefilterSetup } from '../../data/public/timefilter';
 import { Panel } from './panels/panel';
 import { LegacyDependenciesPlugin, LegacyDependenciesPluginSetup } from './shim';
 
@@ -37,12 +39,14 @@ export interface TimelionVisualizationDependencies extends LegacyDependenciesPlu
   uiSettings: UiSettingsClientContract;
   http: HttpSetup;
   timelionPanels: Map<string, Panel>;
+  timefilter: TimefilterSetup;
 }
 
 /** @internal */
 export interface TimelionPluginSetupDependencies {
   expressions: ReturnType<ExpressionsPlugin['setup']>;
   visualizations: VisualizationsSetup;
+  data: DataSetup;
 
   // Temporary solution
   __LEGACY: LegacyDependenciesPlugin;
@@ -58,13 +62,14 @@ export class TimelionPlugin implements Plugin<Promise<void>, void> {
 
   public async setup(
     core: CoreSetup,
-    { __LEGACY, expressions, visualizations }: TimelionPluginSetupDependencies
+    { __LEGACY, expressions, visualizations, data }: TimelionPluginSetupDependencies
   ) {
     const timelionPanels: Map<string, Panel> = new Map();
 
     const dependencies: TimelionVisualizationDependencies = {
       uiSettings: core.uiSettings,
       http: core.http,
+      timefilter: data.timefilter,
       timelionPanels,
       ...(await __LEGACY.setup(core, timelionPanels)),
     };

src/legacy/core_plugins/timelion/public/vis/timelion_request_handler.ts

@@ -50,7 +50,7 @@ export interface TimelionSuccessResponse {
 }
 
 export function getTimelionRequestHandler(dependencies: TimelionVisualizationDependencies) {
-  const { uiSettings, http } = dependencies;
+  const { uiSettings, http, timefilter } = dependencies;
   const timezone = timezoneProvider(uiSettings)();
 
   return async function({
@@ -77,6 +77,9 @@ export function getTimelionRequestHandler(dependencies: TimelionVisualizationDep
 
     const esQueryConfigs = getEsQueryConfig(uiSettings);
 
+    // parse the time range client side to make sure it behaves like other charts
+    const timeRangeBounds = timefilter.timefilter.calculateBounds(timeRange);
+
     try {
       return await http.post('../api/timelion/run', {
         body: JSON.stringify({
@@ -86,7 +89,12 @@ export function getTimelionRequestHandler(dependencies: TimelionVisualizationDep
               filter: buildEsQuery(undefined, query, filters, esQueryConfigs),
             },
           },
-          time: { ...timeRange, interval: visParams.interval, timezone },
+          time: {
+            from: timeRangeBounds.min,
+            to: timeRangeBounds.max,
+            interval: visParams.interval,
+            timezone,
+          },
         }),
       });
     } catch (e) {

src/legacy/core_plugins/timelion/server/handlers/chain_runner.js

@@ -21,9 +21,9 @@
 import _ from 'lodash';
 import Bluebird from 'bluebird';
 import { i18n } from '@kbn/i18n';
+import moment from 'moment';
 
 import parseSheet from './lib/parse_sheet.js';
-import parseDateMath from '../lib/date_math.js';
 import repositionArguments from './lib/reposition_arguments.js';
 import indexArguments from './lib/index_arguments.js';
 import validateTime from './lib/validate_time.js';
@@ -191,8 +191,8 @@ export default function chainRunner(tlConfig) {
     validateTime(request.time, tlConfig);
 
     tlConfig.time = request.time;
-    tlConfig.time.to = parseDateMath(request.time.to, true).valueOf();
-    tlConfig.time.from = parseDateMath(request.time.from).valueOf();
+    tlConfig.time.to = moment(request.time.to).valueOf();
+    tlConfig.time.from = moment(request.time.from).valueOf();
     tlConfig.time.interval = calculateInterval(
       tlConfig.time.from,
       tlConfig.time.to,

src/legacy/core_plugins/timelion/server/handlers/lib/validate_time.js

@@ -18,12 +18,12 @@
  */
 
 import { i18n } from '@kbn/i18n';
+import moment from 'moment';
 
-import parseDateMath from '../../lib/date_math.js';
 import toMS from '../../lib/to_milliseconds.js';
 
 export default function validateTime(time, tlConfig) {
-  const span = parseDateMath(time.to, true) - parseDateMath(time.from);
+  const span = moment.duration(moment(time.to).diff(moment(time.from))).asMilliseconds();
   const interval = toMS(time.interval);
   const bucketCount = span / interval;
   const maxBuckets = tlConfig.settings['timelion:max_buckets'];

src/legacy/core_plugins/timelion/server/series_functions/quandl.js

@@ -23,8 +23,6 @@ import fetch from 'node-fetch';
 import moment from 'moment';
 fetch.Promise = require('bluebird');
 
-//var parseDateMath = require('../utils/date_math.js');
-
 import Datasource from '../lib/classes/datasource';
 
 export default new Datasource ('quandl', {