From d8002529de6027ad14bbb237a3930e16a3550d0b Mon Sep 17 00:00:00 2001 From: Kibana Machine <42973632+kibanamachine@users.noreply.github.com> Date: Wed, 5 May 2021 11:26:24 -0400 Subject: [PATCH] [TSVB] Adds `ignore DST` switch for timeseries (#98484) (#99343) * [TSVB] add ignore DST switch * [TSVB] move YesNo component to timeseries panel, get rid of getTimezone call * [TSVB] reduce formatter creation number * [TSVB] add usage EuFormRow, remove redundant translations * [TSVB] use boolean instead of number * [TSVB] use number for YesNo * [TSVB] resolve YesNo value type * [TSVB] replace number with boolean Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com> Co-authored-by: Dmitry Tomashevich <39378793+Dmitriynj@users.noreply.github.com> --- .../vis_type_timeseries/common/vis_schema.ts | 1 + .../components/last_value_mode_indicator.tsx | 9 ++++++++- .../lib/create_interval_based_formatter.ts | 14 +++++++++++--- .../components/panel_config/timeseries.tsx | 17 +++++++++++++++++ ...onfig_query_bar_with_ignore_global_filter.js | 2 +- .../components/timeseries_visualization.tsx | 1 + .../components/vis_types/timeseries/vis.js | 7 ++++--- .../public/application/components/yes_no.tsx | 2 +- 8 files changed, 44 insertions(+), 9 deletions(-) diff --git a/src/plugins/vis_type_timeseries/common/vis_schema.ts b/src/plugins/vis_type_timeseries/common/vis_schema.ts index d31fed4639ffe..bfa1f79a6487a 100644 --- a/src/plugins/vis_type_timeseries/common/vis_schema.ts +++ b/src/plugins/vis_type_timeseries/common/vis_schema.ts @@ -215,6 +215,7 @@ export const panel = schema.object({ background_color_rules: schema.maybe(schema.arrayOf(backgroundColorRulesItems)), drilldown_url: stringOptional, drop_last_bucket: numberIntegerOptional, + ignore_daylight_time: schema.boolean(), filter: schema.maybe(queryObject), gauge_color_rules: schema.maybe(schema.arrayOf(gaugeColorRulesItems)), gauge_width: schema.nullable(schema.oneOf([stringOptionalNullable, numberOptional])), diff --git a/src/plugins/vis_type_timeseries/public/application/components/last_value_mode_indicator.tsx b/src/plugins/vis_type_timeseries/public/application/components/last_value_mode_indicator.tsx index 4ac52a0a80c97..12ffe72135288 100644 --- a/src/plugins/vis_type_timeseries/public/application/components/last_value_mode_indicator.tsx +++ b/src/plugins/vis_type_timeseries/public/application/components/last_value_mode_indicator.tsx @@ -19,6 +19,7 @@ interface LastValueModeIndicatorProps { seriesData?: PanelData['data']; panelInterval: number; modelInterval: string; + ignoreDaylightTime: boolean; } const lastValueLabel = i18n.translate('visTypeTimeseries.lastValueModeIndicator.lastValue', { @@ -29,6 +30,7 @@ export const LastValueModeIndicator = ({ seriesData, panelInterval, modelInterval, + ignoreDaylightTime, }: LastValueModeIndicatorProps) => { if (!seriesData?.length) return {lastValueLabel}; @@ -40,7 +42,12 @@ export const LastValueModeIndicator = ({ return interval && `${interval.unitValue}${interval.unitString}`; }; - const formatter = createIntervalBasedFormatter(panelInterval, scaledDataFormat, dateFormat); + const formatter = createIntervalBasedFormatter( + panelInterval, + scaledDataFormat, + dateFormat, + ignoreDaylightTime + ); const lastBucketDate = formatter(seriesData[seriesData.length - 1][0]); const formattedPanelInterval = (isAutoInterval(modelInterval) || isGteInterval(modelInterval)) && getFormattedPanelInterval(); diff --git a/src/plugins/vis_type_timeseries/public/application/components/lib/create_interval_based_formatter.ts b/src/plugins/vis_type_timeseries/public/application/components/lib/create_interval_based_formatter.ts index 562aec31a0803..371a07af7b2e5 100644 --- a/src/plugins/vis_type_timeseries/public/application/components/lib/create_interval_based_formatter.ts +++ b/src/plugins/vis_type_timeseries/public/application/components/lib/create_interval_based_formatter.ts @@ -8,6 +8,8 @@ import moment from 'moment'; +const JANUARY_MOMENT_CONFIG = { M: 0, d: 1 }; + function getFormat(interval: number, rules: string[][] = []) { for (let i = rules.length - 1; i >= 0; i--) { const rule = rules[i]; @@ -20,9 +22,15 @@ function getFormat(interval: number, rules: string[][] = []) { export function createIntervalBasedFormatter( interval: number, rules: string[][], - dateFormat: string + dateFormat: string, + ignoreDaylightTime: boolean ) { - return (val: moment.MomentInput): string => { - return moment(val).format(getFormat(interval, rules) ?? dateFormat); + const fixedOffset = moment(JANUARY_MOMENT_CONFIG).utcOffset(); + return (val: moment.MomentInput) => { + const momentVal = moment(val); + if (ignoreDaylightTime) { + momentVal.utcOffset(fixedOffset); + } + return momentVal.format(getFormat(interval, rules) ?? dateFormat); }; } diff --git a/src/plugins/vis_type_timeseries/public/application/components/panel_config/timeseries.tsx b/src/plugins/vis_type_timeseries/public/application/components/panel_config/timeseries.tsx index 86d3d50eb1f6a..a2e5ed448c93d 100644 --- a/src/plugins/vis_type_timeseries/public/application/components/panel_config/timeseries.tsx +++ b/src/plugins/vis_type_timeseries/public/application/components/panel_config/timeseries.tsx @@ -127,6 +127,7 @@ export class TimeseriesPanelConfig extends Component< legend_position: 'right', show_grid: 1, tooltip_mode: 'show_all', + ignore_daylight_time: false, }; const model = { ...defaults, ...this.props.model }; const { selectedTab } = this.state; @@ -227,6 +228,22 @@ export class TimeseriesPanelConfig extends Component< /> + + + + + diff --git a/src/plugins/vis_type_timeseries/public/application/components/series_config_query_bar_with_ignore_global_filter.js b/src/plugins/vis_type_timeseries/public/application/components/series_config_query_bar_with_ignore_global_filter.js index 950101103b3a5..d153f31801575 100644 --- a/src/plugins/vis_type_timeseries/public/application/components/series_config_query_bar_with_ignore_global_filter.js +++ b/src/plugins/vis_type_timeseries/public/application/components/series_config_query_bar_with_ignore_global_filter.js @@ -23,7 +23,7 @@ export function SeriesConfigQueryBarWithIgnoreGlobalFilter({ const htmlId = htmlIdGenerator(); const yesNoOption = ( diff --git a/src/plugins/vis_type_timeseries/public/application/components/vis_types/timeseries/vis.js b/src/plugins/vis_type_timeseries/public/application/components/vis_types/timeseries/vis.js index c15d3e0e4f6f8..29560c4bd9368 100644 --- a/src/plugins/vis_type_timeseries/public/application/components/vis_types/timeseries/vis.js +++ b/src/plugins/vis_type_timeseries/public/application/components/vis_types/timeseries/vis.js @@ -33,13 +33,14 @@ class TimeseriesVisualization extends Component { scaledDataFormat = this.props.getConfig('dateFormat:scaled'); dateFormat = this.props.getConfig('dateFormat'); - xAxisFormatter = (interval) => (val) => { + xAxisFormatter = (interval) => { const formatter = createIntervalBasedFormatter( interval, this.scaledDataFormat, - this.dateFormat + this.dateFormat, + this.props.model.ignore_daylight_time ); - return formatter(val); + return (val) => formatter(val); }; yAxisStackedByPercentFormatter = (val) => { diff --git a/src/plugins/vis_type_timeseries/public/application/components/yes_no.tsx b/src/plugins/vis_type_timeseries/public/application/components/yes_no.tsx index 708892bbc681d..3c02deb177f9e 100644 --- a/src/plugins/vis_type_timeseries/public/application/components/yes_no.tsx +++ b/src/plugins/vis_type_timeseries/public/application/components/yes_no.tsx @@ -13,7 +13,7 @@ import { TimeseriesVisParams } from '../../types'; interface YesNoProps { name: ParamName; - value: TimeseriesVisParams[ParamName]; + value: boolean | number | undefined; disabled?: boolean; 'data-test-subj'?: string; onChange: (partialModel: Partial) => void;