[TSVB] Fix cannot override the timerange mode on the override index pattern series settings (#116955) (#117272)

Closes: #116745

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>

Co-authored-by: Alexey Antonov <alexwizp@gmail.com>

src/plugins/vis_types/timeseries/common/types/panel_model.ts

@@ -115,7 +115,6 @@ export interface Series {
   terms_size?: string;
   time_range_mode?: string;
   trend_arrows?: number;
-  type?: string;
   value_template?: string;
   var_name?: string;
 }

src/plugins/vis_types/timeseries/public/application/components/aggs/agg.tsx

@@ -33,13 +33,13 @@ interface AggProps extends HTMLAttributes<HTMLElement> {
   siblings: Metric[];
   uiRestrictions: TimeseriesUIRestrictions;
   dragHandleProps: DragHandleProps;
-  onChange: (part: Partial<Series>) => void;
+  onModelChange: (part: Partial<Series>) => void;
   onAdd: () => void;
   onDelete: () => void;
 }
 
 export function Agg(props: AggProps) {
-  const { model, uiRestrictions, series, name, onChange, fields, siblings } = props;
+  const { model, uiRestrictions, series, name, onModelChange, fields, siblings } = props;
 
   let Component = aggToComponent[model.type];
 
@@ -72,8 +72,8 @@ export function Agg(props: AggProps) {
   const isKibanaIndexPattern = props.panel.use_kibana_indexes || indexPattern === '';
 
   const onAggChange = useMemo(
-    () => seriesChangeHandler({ name, model: series, onChange }, siblings),
-    [name, onChange, siblings, series]
+    () => seriesChangeHandler({ name, model: series, onChange: onModelChange }, siblings),
+    [name, onModelChange, siblings, series]
   );
 
   useEffect(() => {
@@ -86,17 +86,25 @@ export function Agg(props: AggProps) {
       );
 
       if (isNumberFormatter && !isNumericMetric) {
-        onChange({ formatter: DATA_FORMATTERS.DEFAULT });
+        onModelChange({ formatter: DATA_FORMATTERS.DEFAULT });
       }
       // in case of string index pattern mode, change default formatter depending on metric type
       // "number" formatter for numeric metric and "" as custom formatter for any other type
       if (formatterType === DATA_FORMATTERS.DEFAULT && !isKibanaIndexPattern) {
-        onChange({
+        onModelChange({
           formatter: isNumericMetric ? DATA_FORMATTERS.NUMBER : '',
         });
       }
     }
-  }, [indexPattern, model, onChange, fields, series.formatter, isKibanaIndexPattern, siblings]);
+  }, [
+    indexPattern,
+    model,
+    onModelChange,
+    fields,
+    series.formatter,
+    isKibanaIndexPattern,
+    siblings,
+  ]);
 
   return (
     <div className={props.className} style={style}>

src/plugins/vis_types/timeseries/public/application/components/aggs/aggs.tsx

@@ -51,7 +51,7 @@ export class Aggs extends PureComponent<AggsProps> {
                 name={name}
                 model={row}
                 onAdd={() => handleAdd(this.props, newMetricAggFn)}
-                onChange={onChange}
+                onModelChange={onChange}
                 onDelete={() => handleDelete(this.props, row)}
                 panel={panel}
                 series={model}

src/plugins/vis_types/timeseries/public/application/components/aggs/histogram_support.test.js

@@ -34,7 +34,7 @@ const runTest = (aggType, name, test, additionalProps = {}) => {
         <div>
           <Agg
             onAdd={jest.fn()}
-            onChange={jest.fn()}
+            onModelChange={jest.fn()}
             onDelete={jest.fn()}
             panel={panel}
             fields={FIELDS}

src/plugins/vis_types/timeseries/public/application/components/index_pattern.js

@@ -27,7 +27,6 @@ import { IndexPatternSelect } from './lib/index_pattern_select';
 import { YesNo } from './yes_no';
 import { LastValueModePopover } from './last_value_mode_popover';
 import { KBN_FIELD_TYPES } from '../../../../../data/public';
-import { FormValidationContext } from '../contexts/form_validation_context';
 import { isGteInterval, validateReInterval, isAutoInterval } from './lib/get_interval';
 import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n/react';
@@ -35,6 +34,8 @@ import { PANEL_TYPES, TIME_RANGE_DATA_MODES, TIME_RANGE_MODE_KEY } from '../../.
 import { AUTO_INTERVAL } from '../../../common/constants';
 import { isTimerangeModeEnabled } from '../lib/check_ui_restrictions';
 import { VisDataContext } from '../contexts/vis_data_context';
+import { PanelModelContext } from '../contexts/panel_model_context';
+import { FormValidationContext } from '../contexts/form_validation_context';
 import { getDataStart, getUISettings } from '../../services';
 import { UI_SETTINGS } from '../../../../../data/common';
 import { fetchIndexPattern } from '../../../common/index_patterns_utils';
@@ -76,12 +77,15 @@ export const IndexPattern = ({
   const maxBarsName = `${prefix}max_bars`;
   const dropBucketName = `${prefix}drop_last_bucket`;
   const updateControlValidity = useContext(FormValidationContext);
-
+  const panelModel = useContext(PanelModelContext);
   const uiRestrictions = get(useContext(VisDataContext), 'uiRestrictions');
+
   const maxBarsUiSettings = config.get(UI_SETTINGS.HISTOGRAM_MAX_BARS);
 
   const [fetchedIndex, setFetchedIndex] = useState(null);
 
+  const isTimeSeries = panelModel.type === PANEL_TYPES.TIMESERIES;
+
   const handleMaxBarsChange = useCallback(
     ({ target }) => {
       onChange({
@@ -126,7 +130,7 @@ export const IndexPattern = ({
   const selectedTimeRangeOption = timeRangeOptions.find(
     ({ value }) => model[TIME_RANGE_MODE_KEY] === value
   );
-  const isTimeSeries = model.type === PANEL_TYPES.TIMESERIES;
+
   const isDataTimerangeModeInvalid =
     !disabled &&
     selectedTimeRangeOption &&

src/plugins/vis_types/timeseries/public/application/components/lib/convert_series_to_datatable.test.ts

@@ -154,7 +154,6 @@ describe('convert series to datatables', () => {
           ],
           split_mode: 'terms',
           terms_field: 'Cancelled',
-          type: 'timeseries',
         },
       ],
     } as TimeseriesVisParams;

src/plugins/vis_types/timeseries/public/application/components/vis_types/timeseries/series.js

@@ -24,7 +24,6 @@ import {
 import { Split } from '../../split';
 import { createTextHandler } from '../../lib/create_text_handler';
 import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
-import { PANEL_TYPES } from '../../../../../common/enums';
 
 const TimeseriesSeriesUI = injectI18n(function (props) {
   const {
@@ -45,7 +44,6 @@ const TimeseriesSeriesUI = injectI18n(function (props) {
 
   const defaults = {
     label: '',
-    type: PANEL_TYPES.TIMESERIES,
   };
   const model = { ...defaults, ...props.model };