[Controls as Code] Use discriminated union

src/platform/packages/shared/controls/controls-constants/src/control_constants.ts

@@ -8,10 +8,10 @@
  */
 
 // Do not change constant values - part of public REST APIs
-export const TIME_SLIDER_CONTROL = 'time_slider_control';
-export const RANGE_SLIDER_CONTROL = 'range_slider_control';
-export const OPTIONS_LIST_CONTROL = 'options_list_control';
 export const ESQL_CONTROL = 'esql_control';
+export const OPTIONS_LIST_CONTROL = 'options_list_control';
+export const RANGE_SLIDER_CONTROL = 'range_slider_control';
+export const TIME_SLIDER_CONTROL = 'time_slider_control';
 
 export const DEFAULT_DATA_CONTROL_STATE = {
   use_global_filters: true,

src/platform/packages/shared/controls/controls-schemas/index.ts

@@ -7,7 +7,7 @@
  * License v3.0 only", or the "Server Side Public License, v 1".
  */
 
-export { controlsGroupSchema } from './src/controls_group_schema';
+export { getControlsGroupSchema } from './src/controls_group_schema';
 
 export type {
   ControlsGroupState,

src/platform/packages/shared/controls/controls-schemas/src/control_schema.ts

@@ -10,16 +10,14 @@
 import { schema } from '@kbn/config-schema';
 import { DEFAULT_DATA_CONTROL_STATE } from '@kbn/controls-constants';
 
-export const controlSchema = schema.object(
-  {
-    title: schema.maybe(
-      schema.string({ meta: { description: 'A human-readable title for the control' } })
-    ),
-  },
-  { unknowns: 'allow' }
-);
+export const controlTitleSchema = schema.object({
+  title: schema.maybe(
+    schema.string({ meta: { description: 'A human-readable title for the control' } })
+  ),
+});
 
-export const dataControlSchema = controlSchema.extends({
+export const dataControlSchema = schema.object({
+  ...controlTitleSchema.getPropSchemas(),
   data_view_id: schema.string({
     meta: { description: 'The ID of the data view that the control is tied to' }, // this will generate a reference
   }),

src/platform/packages/shared/controls/controls-schemas/src/controls_group_schema.ts

@@ -43,67 +43,67 @@ export const pinnedControlSchema = schema.object({
   }),
 });
 
-export const controlsGroupSchema = schema.arrayOf(
-  // order will be determined by the array
-  schema.oneOf([
-    schema
-      .allOf(
-        [
-          schema.object({ type: schema.literal(OPTIONS_LIST_CONTROL) }),
-          schema.object({ config: optionsListDSLControlSchema }),
-          pinnedControlSchema,
-        ],
+export const getControlsGroupSchema = () => {
+  const pinnedControl = pinnedControlSchema.getPropSchemas();
+  return schema.arrayOf(
+    /**
+     * - keep types in alphabetical order for the sake of documentation
+     * - control order will be determined by the array
+     */
+    schema.discriminatedUnion('type', [
+      schema.object(
+        {
+          type: schema.literal(ESQL_CONTROL),
+          config: optionsListESQLControlSchema,
+          ...pinnedControl,
+        },
+        {
+          meta: {
+            title: ESQL_CONTROL,
+          },
+        }
+      ),
+      schema.object(
+        {
+          type: schema.literal(OPTIONS_LIST_CONTROL),
+          config: optionsListDSLControlSchema,
+          ...pinnedControl,
+        },
         {
           meta: {
             title: OPTIONS_LIST_CONTROL,
           },
         }
-      )
-      .extendsDeep({ unknowns: 'allow' }), // allows for legacy unknowns such as `parentField` and `enhancements`
-    schema
-      .allOf(
-        [
-          schema.object({ type: schema.literal(RANGE_SLIDER_CONTROL) }),
-          schema.object({ config: rangeSliderControlSchema }),
-          pinnedControlSchema,
-        ],
+      ),
+      schema.object(
+        {
+          type: schema.literal(RANGE_SLIDER_CONTROL),
+          config: rangeSliderControlSchema,
+          ...pinnedControl,
+        },
         {
           meta: {
             title: RANGE_SLIDER_CONTROL,
           },
         }
-      )
-      .extendsDeep({ unknowns: 'allow' }),
-    schema
-      .allOf(
-        [
-          schema.object({ type: schema.literal(TIME_SLIDER_CONTROL) }),
-          schema.object({ config: timeSliderControlSchema }),
-          pinnedControlSchema,
-        ],
+      ),
+      schema.object(
+        {
+          type: schema.literal(TIME_SLIDER_CONTROL),
+          config: timeSliderControlSchema,
+          ...pinnedControl,
+        },
         {
           meta: {
             title: TIME_SLIDER_CONTROL,
           },
         }
-      )
-      .extendsDeep({ unknowns: 'allow' }), // allows for legacy unknowns such as `useGlobalFilters`
-    schema.allOf(
-      [
-        schema.object({ type: schema.literal(ESQL_CONTROL) }),
-        schema.object({ config: optionsListESQLControlSchema }),
-        pinnedControlSchema,
-      ],
-      {
-        meta: {
-          title: ESQL_CONTROL,
-        },
-      }
-    ), // variable controls do not need `unknowns: 'allow'` because they have no legacy values
-  ]),
-  {
-    defaultValue: [],
-    maxSize: 100,
-    meta: { description: 'An array of control panels and their state in the control group.' },
-  }
-);
+      ),
+    ]),
+    {
+      defaultValue: [],
+      maxSize: 100,
+      meta: { description: 'An array of control panels and their state in the control group.' },
+    }
+  );
+};

src/platform/packages/shared/controls/controls-schemas/src/options_list_schema.ts

@@ -13,7 +13,7 @@ import {
   DEFAULT_ESQL_OPTIONS_LIST_STATE,
   MAX_OPTIONS_LIST_REQUEST_SIZE,
 } from '@kbn/controls-constants';
-import { controlSchema, dataControlSchema } from './control_schema';
+import { controlTitleSchema, dataControlSchema } from './control_schema';
 
 const SELECTIONS_MAX = 10000;
 
@@ -40,48 +40,53 @@ export const optionsListSortSchema = schema.object(
 
 export const optionsListSelectionSchema = schema.oneOf([schema.string(), schema.number()]);
 
-const optionsListControlBaseParameters = {
+const optionsListControlBaseParameters = schema.object({
   display_settings: schema.maybe(optionsListDisplaySettingsSchema),
-};
+});
 
-export const optionsListDSLControlSchema = dataControlSchema
-  .extends(optionsListControlBaseParameters)
-  .extends({
-    exclude: schema.boolean({ defaultValue: DEFAULT_DSL_OPTIONS_LIST_STATE.exclude }),
-    exists_selected: schema.boolean({
-      defaultValue: DEFAULT_DSL_OPTIONS_LIST_STATE.exists_selected,
-    }),
-    run_past_timeout: schema.boolean({
-      defaultValue: DEFAULT_DSL_OPTIONS_LIST_STATE.run_past_timeout,
-    }),
-    search_technique: optionsListSearchTechniqueSchema,
-    selected_options: schema.arrayOf(optionsListSelectionSchema, {
-      defaultValue: DEFAULT_DSL_OPTIONS_LIST_STATE.selected_options,
-      maxSize: SELECTIONS_MAX,
-    }),
-    single_select: schema.boolean({ defaultValue: DEFAULT_DSL_OPTIONS_LIST_STATE.single_select }),
-    sort: optionsListSortSchema,
-  });
+export const optionsListDSLControlSchema = schema.object({
+  ...optionsListControlBaseParameters.getPropSchemas(),
+  ...dataControlSchema.getPropSchemas(),
+  exclude: schema.boolean({ defaultValue: DEFAULT_DSL_OPTIONS_LIST_STATE.exclude }),
+  exists_selected: schema.boolean({
+    defaultValue: DEFAULT_DSL_OPTIONS_LIST_STATE.exists_selected,
+  }),
+  run_past_timeout: schema.boolean({
+    defaultValue: DEFAULT_DSL_OPTIONS_LIST_STATE.run_past_timeout,
+  }),
+  search_technique: optionsListSearchTechniqueSchema,
+  selected_options: schema.arrayOf(optionsListSelectionSchema, {
+    defaultValue: DEFAULT_DSL_OPTIONS_LIST_STATE.selected_options,
+    maxSize: SELECTIONS_MAX,
+  }),
+  single_select: schema.boolean({ defaultValue: DEFAULT_DSL_OPTIONS_LIST_STATE.single_select }),
+  sort: optionsListSortSchema,
+});
+
+const baseEsqlControl = {
+  ...controlTitleSchema.getPropSchemas(),
+  ...optionsListControlBaseParameters.getPropSchemas(),
+  selected_options: schema.arrayOf(schema.string(), { maxSize: SELECTIONS_MAX }),
+  single_select: schema.boolean({ defaultValue: DEFAULT_ESQL_OPTIONS_LIST_STATE.single_select }),
+  variable_name: schema.string(),
+  variable_type: schema.oneOf([
+    schema.literal('fields'),
+    schema.literal('values'),
+    schema.literal('functions'),
+    schema.literal('time_literal'),
+    schema.literal('multi_values'),
+  ]),
+};
 
-export const optionsListESQLControlSchema = controlSchema
-  .extends(optionsListControlBaseParameters)
-  .extends({
-    selected_options: schema.arrayOf(schema.string(), { maxSize: SELECTIONS_MAX }),
-    single_select: schema.boolean({ defaultValue: DEFAULT_ESQL_OPTIONS_LIST_STATE.single_select }),
-    variable_name: schema.string(),
-    variable_type: schema.oneOf([
-      schema.literal('fields'),
-      schema.literal('values'),
-      schema.literal('functions'),
-      schema.literal('time_literal'),
-      schema.literal('multi_values'),
-    ]),
+export const optionsListESQLControlSchema = schema.discriminatedUnion('control_type', [
+  schema.object({
+    ...baseEsqlControl,
+    control_type: schema.literal('STATIC_VALUES'),
+    available_options: schema.arrayOf(schema.string(), { maxSize: MAX_OPTIONS_LIST_REQUEST_SIZE }),
+  }),
+  schema.object({
+    ...baseEsqlControl,
+    control_type: schema.literal('VALUES_FROM_QUERY'),
     esql_query: schema.string(),
-    control_type: schema.oneOf([
-      schema.literal('STATIC_VALUES'),
-      schema.literal('VALUES_FROM_QUERY'),
-    ]),
-    available_options: schema.maybe(
-      schema.arrayOf(schema.string(), { maxSize: MAX_OPTIONS_LIST_REQUEST_SIZE })
-    ),
-  });
+  }),
+]);

src/platform/packages/shared/controls/controls-schemas/src/range_slider_schema.ts

@@ -13,7 +13,8 @@ import { dataControlSchema } from './control_schema';
 
 export const rangeValueSchema = schema.arrayOf(schema.string(), { minSize: 2, maxSize: 2 });
 
-export const rangeSliderControlSchema = dataControlSchema.extends({
+export const rangeSliderControlSchema = schema.object({
+  ...dataControlSchema.getPropSchemas(),
   value: schema.maybe(rangeValueSchema),
   step: schema.number({ defaultValue: DEFAULT_RANGE_SLIDER_STATE.step, min: 0 }),
 });

src/platform/packages/shared/controls/controls-schemas/src/types.ts

@@ -10,9 +10,9 @@
 import type React from 'react';
 
 import type { TypeOf } from '@kbn/config-schema';
-import type { controlSchema, dataControlSchema } from './control_schema';
+import type { controlTitleSchema, dataControlSchema } from './control_schema';
 import type {
-  controlsGroupSchema,
+  getControlsGroupSchema,
   controlWidthSchema,
   pinnedControlSchema,
 } from './controls_group_schema';
@@ -27,14 +27,15 @@ import type {
 import type { rangeSliderControlSchema, rangeValueSchema } from './range_slider_schema';
 import type { timeSliderControlSchema } from './time_slider_schema';
 
-export type ControlsGroupState = TypeOf<typeof controlsGroupSchema>;
+export type ControlsGroupState = TypeOf<ReturnType<typeof getControlsGroupSchema>>;
 export type PinnedControlState = ControlsGroupState[number];
 export type PinnedControlLayoutState = TypeOf<typeof pinnedControlSchema> & {
   order: number;
   type: string;
 };
+
 export type ControlWidth = TypeOf<typeof controlWidthSchema>;
-export type ControlState = TypeOf<typeof controlSchema>;
+export type ControlState = TypeOf<typeof controlTitleSchema>;
 
 export type DataControlState = TypeOf<typeof dataControlSchema>;
 

src/platform/packages/shared/kbn-esql-types/index.ts

@@ -14,9 +14,13 @@ export {
   type ESQLControlVariable,
   type PublishesESQLVariable,
   type PublishesESQLVariables,
+  type StaticESQLControl,
+  type QueryESQLControl,
   apiPublishesESQLVariable,
   apiPublishesESQLVariables,
   controlHasVariableName,
+  isStaticESQLControl,
+  isQueryESQLControl,
 } from './src/variables_types';
 
 export {

src/platform/packages/shared/kbn-esql-types/moon.yml

@@ -20,6 +20,7 @@ dependsOn:
   - '@kbn/licensing-types'
   - '@kbn/core-pricing-common'
   - '@kbn/projects-solutions-groups'
+  - '@kbn/controls-schemas'
 tags:
   - shared-common
   - package

src/platform/packages/shared/kbn-esql-types/src/variables_types.ts

@@ -8,6 +8,7 @@
  */
 
 import type { BehaviorSubject } from 'rxjs';
+import type { OptionsListESQLControlState } from '@kbn/controls-schemas';
 
 type PublishingSubject<T extends unknown = unknown> = Omit<BehaviorSubject<T>, 'next'>;
 
@@ -34,6 +35,28 @@ export enum EsqlControlType {
   VALUES_FROM_QUERY = 'VALUES_FROM_QUERY',
 }
 
+export type StaticESQLControl = Extract<
+  OptionsListESQLControlState,
+  { control_type: 'STATIC_VALUES' }
+>;
+export const isStaticESQLControl = (control?: object): control is StaticESQLControl => {
+  return Boolean(
+    control && 'control_type' in control && control.control_type === EsqlControlType.STATIC_VALUES
+  );
+};
+
+export type QueryESQLControl = Extract<
+  OptionsListESQLControlState,
+  { control_type: 'VALUES_FROM_QUERY' }
+>;
+export const isQueryESQLControl = (control?: object): control is QueryESQLControl => {
+  return Boolean(
+    control &&
+      'control_type' in control &&
+      control.control_type === EsqlControlType.VALUES_FROM_QUERY
+  );
+};
+
 export interface ESQLControlVariable {
   key: string;
   value: string | number | (string | number)[];

src/platform/packages/shared/kbn-esql-types/tsconfig.json

@@ -8,6 +8,7 @@
     "@kbn/licensing-types",
     "@kbn/core-pricing-common",
     "@kbn/projects-solutions-groups",
+    "@kbn/controls-schemas",
   ],
   "exclude": ["target/**/*"]
 }

src/platform/packages/shared/kbn-esql-utils/src/utils/get_esql_controls.test.ts

@@ -28,7 +28,6 @@ const createControlState = (variableName: string): OptionsListESQLControlState =
   selected_options: ['option-1'],
   variable_name: variableName,
   variable_type: ESQLVariableType.VALUES,
-  esql_query: 'FROM index',
   control_type: EsqlControlType.STATIC_VALUES,
   single_select: true,
   available_options: ['option-1', 'option-2'],

src/platform/plugins/shared/controls/common/options_list/index.ts

@@ -15,4 +15,3 @@ export type {
   OptionsListSuccessResponse,
   OptionsListSuggestions,
 } from './types';
-export { isOptionsListESQLControlState } from './types';