[Synthetics] Set fix list of sort fields (#158369)

x-pack/plugins/synthetics/common/runtime_types/monitor_management/sort_field.ts

@@ -0,0 +1,24 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+import { schema, TypeOf } from '@kbn/config-schema';
+import { ConfigKey } from '../../constants/monitor_management';
+
+export const MonitorSortFieldSchema = schema.maybe(
+  schema.oneOf([
+    schema.literal('enabled'),
+    schema.literal('status'),
+    schema.literal('updated_at'),
+    schema.literal(`${ConfigKey.NAME}.keyword`),
+    schema.literal(`${ConfigKey.TAGS}.keyword`),
+    schema.literal(`${ConfigKey.PROJECT_ID}.keyword`),
+    schema.literal(`${ConfigKey.MONITOR_TYPE}.keyword`),
+    schema.literal(`${ConfigKey.SCHEDULE}.keyword`),
+    schema.literal(ConfigKey.JOURNEY_ID),
+  ])
+);
+
+export type MonitorListSortField = TypeOf<typeof MonitorSortFieldSchema>;

x-pack/plugins/synthetics/public/apps/synthetics/components/monitors_page/management/monitor_list_table/monitor_list.tsx

@@ -16,6 +16,7 @@ import {
   useIsWithinMinBreakpoint,
 } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
+import { MonitorListSortField } from '../../../../../../../common/runtime_types/monitor_management/sort_field';
 import { DeleteMonitor } from './delete_monitor';
 import { IHttpSerializedFetchError } from '../../../../state/utils/http_error';
 import { MonitorListPageState } from '../../../../state';
@@ -66,7 +67,7 @@ export const MonitorList = ({
       loadPage({
         pageIndex: index,
         pageSize: size,
-        sortField: field === 'enabled' ? field : `${field}.keyword`,
+        sortField: (field === 'enabled' ? field : `${field}.keyword`) as MonitorListSortField,
         sortOrder: direction,
       });
     },
@@ -82,7 +83,7 @@ export const MonitorList = ({
 
   const sorting: EuiTableSortingType<EncryptedSyntheticsSavedMonitor> = {
     sort: {
-      field: sortField.replace('.keyword', '') as keyof EncryptedSyntheticsSavedMonitor,
+      field: sortField?.replace('.keyword', '') as keyof EncryptedSyntheticsSavedMonitor,
       direction: sortOrder,
     },
   };

x-pack/plugins/synthetics/public/apps/synthetics/components/monitors_page/overview/overview/sort_fields.tsx

@@ -9,6 +9,7 @@ import type { PayloadAction } from '@reduxjs/toolkit';
 import { useDispatch, useSelector } from 'react-redux';
 import { i18n } from '@kbn/i18n';
 import { EuiFlexGroup, EuiFlexItem, EuiTitle } from '@elastic/eui';
+import { MonitorListSortField } from '../../../../../../../common/runtime_types/monitor_management/sort_field';
 import { ConfigKey } from '../../../../../../../common/runtime_types';
 
 import { selectOverviewState, setOverviewPageStateAction } from '../../../../state/overview';
@@ -116,7 +117,7 @@ export const SortFields = ({ onSortChange }: { onSortChange?: () => void }) => {
   );
 };
 
-const getOrderContent = (sortField: string) => {
+const getOrderContent = (sortField: MonitorListSortField) => {
   switch (sortField) {
     case `${ConfigKey.NAME}.keyword`:
       return {

x-pack/plugins/synthetics/public/apps/synthetics/components/monitors_page/overview/overview/use_infinite_scroll.ts

@@ -9,6 +9,7 @@ import useThrottle from 'react-use/lib/useThrottle';
 import { useEffect, useState, MutableRefObject } from 'react';
 import useIntersection from 'react-use/lib/useIntersection';
 import { useSelector } from 'react-redux';
+import { MonitorListSortField } from '../../../../../../../common/runtime_types/monitor_management/sort_field';
 import { useGetUrlParams } from '../../../../hooks';
 import { selectOverviewState } from '../../../../state';
 import { MonitorOverviewItem } from '../../../../../../../common/runtime_types';
@@ -75,7 +76,7 @@ const getCurrentMonitors = ({
   monitorsSortedByStatus,
   statusFilter,
 }: {
-  sortField: string;
+  sortField: MonitorListSortField;
   perPage: number;
   page: number;
   monitors: MonitorOverviewItem[];

x-pack/plugins/synthetics/public/apps/synthetics/state/monitor_list/index.ts

@@ -71,6 +71,7 @@ export const monitorListReducer = createReducer(initialState, (builder) => {
     .addCase(fetchMonitorListAction.success, (state, action) => {
       state.loading = false;
       state.loaded = true;
+      state.error = null;
       state.data = action.payload;
     })
     .addCase(fetchMonitorListAction.fail, (state, action) => {

x-pack/plugins/synthetics/public/apps/synthetics/state/monitor_list/models.ts

@@ -7,17 +7,15 @@
 
 import { ErrorToastOptions } from '@kbn/core-notifications-browser';
 
+import { MonitorListSortField } from '../../../../../common/runtime_types/monitor_management/sort_field';
 import {
   EncryptedSyntheticsMonitor,
-  EncryptedSyntheticsSavedMonitor,
   FetchMonitorManagementListQueryArgs,
   SyntheticsMonitor,
 } from '../../../../../common/runtime_types';
 
 import { IHttpSerializedFetchError } from '../utils/http_error';
 
-export type MonitorListSortField = `${keyof EncryptedSyntheticsSavedMonitor}.keyword` | 'enabled';
-
 export interface MonitorFilterState {
   query?: string;
   tags?: string[];

x-pack/plugins/synthetics/public/apps/synthetics/state/overview/models.ts

@@ -4,6 +4,7 @@
  * 2.0; you may not use this file except in compliance with the Elastic License
  * 2.0.
  */
+import { MonitorListSortField } from '../../../../../common/runtime_types/monitor_management/sort_field';
 import { ConfigKey, MonitorOverviewResult } from '../../../../../common/runtime_types';
 
 import { IHttpSerializedFetchError } from '../utils/http_error';
@@ -12,7 +13,7 @@ import { MonitorFilterState } from '../monitor_list';
 export interface MonitorOverviewPageState extends MonitorFilterState {
   perPage: number;
   sortOrder: 'asc' | 'desc';
-  sortField: string;
+  sortField: MonitorListSortField;
 }
 
 export type MonitorOverviewFlyoutConfig = {

x-pack/plugins/synthetics/server/routes/common.ts

@@ -7,6 +7,7 @@
 
 import { schema, TypeOf } from '@kbn/config-schema';
 import { SavedObjectsFindResponse } from '@kbn/core/server';
+import { MonitorSortFieldSchema } from '../../common/runtime_types/monitor_management/sort_field';
 import { getAllLocations } from '../synthetics_service/get_all_locations';
 import { EncryptedSyntheticsMonitor, ServiceLocations } from '../../common/runtime_types';
 import { monitorAttributes, syntheticsMonitorType } from '../../common/types/saved_objects';
@@ -19,7 +20,7 @@ const StringOrArraySchema = schema.maybe(
 export const QuerySchema = schema.object({
   page: schema.maybe(schema.number()),
   perPage: schema.maybe(schema.number()),
-  sortField: schema.maybe(schema.string()),
+  sortField: MonitorSortFieldSchema,
   sortOrder: schema.maybe(schema.oneOf([schema.literal('desc'), schema.literal('asc')])),
   query: schema.maybe(schema.string()),
   filter: schema.maybe(schema.string()),