update query

shahzad31 · shahzad31 · commit cacbb28b9f87 · 2019-12-11T18:24:23.000+01:00
diff --git a/package.json b/package.json
@@ -235,7 +235,7 @@
     "react-use": "^13.10.2",
     "reactcss": "1.2.3",
     "redux": "4.0.0",
-    "redux-actions": "2.2.1",
+    "redux-actions": "2.6.5",
     "redux-thunk": "2.3.0",
     "regenerator-runtime": "^0.13.3",
     "regression": "2.0.1",
@@ -347,7 +347,7 @@
     "@types/react-router-dom": "^4.3.1",
     "@types/react-virtualized": "^9.18.7",
     "@types/redux": "^3.6.31",
-    "@types/redux-actions": "^2.2.1",
+    "@types/redux-actions": "^2.6.1",
     "@types/request": "^2.48.2",
     "@types/selenium-webdriver": "^4.0.3",
     "@types/semver": "^5.5.0",
diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/filter_group/filter_group.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/filter_group/filter_group.tsx
@@ -21,6 +21,7 @@ interface FilterBarQueryResult {
 interface FilterBarDropdownsProps {
   currentFilter: string;
   onFilterUpdate: (kuery: string) => void;
+  setFilters: Function;
 }
 
 type Props = UptimeGraphQLQueryProps<FilterBarQueryResult> & FilterBarDropdownsProps;
@@ -30,6 +31,7 @@ export const FilterGroupComponent = ({
   currentFilter,
   data,
   onFilterUpdate,
+  setFilters,
 }: Props) => {
   const locations = get<string[]>(data, 'filterBar.locations', []);
   const ports = get<string[]>(data, 'filterBar.ports', []);
@@ -61,10 +63,13 @@ export const FilterGroupComponent = ({
     // store the new set of filters
     const persistedFilters = Array.from(updatedFilterMap);
     onFilterUpdate(persistedFilters.length === 0 ? '' : JSON.stringify(persistedFilters));
+    setFilters(new Map([[fieldName, values]]));
   };
 
   const getSelectedItems = (fieldName: string) => filterKueries.get(fieldName) || [];
 
+  setFilters(filterKueries);
+
   const filterPopoverProps: FilterPopoverProps[] = [
     {
       fieldName: 'observer.geo.name',
diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/filter_group/index.ts b/x-pack/legacy/plugins/uptime/public/components/functional/filter_group/index.ts
@@ -4,4 +4,12 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-export { FilterGroup } from './filter_group';
+import { connect } from 'react-redux';
+import { setFilters } from '../../../state/actions';
+import { FilterGroup as FilterGroupComponent } from './filter_group';
+
+const mapDispatchToProps = (dispatch: any) => ({
+  setFilters: (filters: Map<string, string[]>) => dispatch(setFilters(filters)),
+});
+
+export const FilterGroup = connect(null, mapDispatchToProps)(FilterGroupComponent);
diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx
@@ -13,7 +13,7 @@ import { MonitorSummary } from '../../../../../common/graphql/types';
 import { AppState } from '../../../../state';
 import { fetchMonitorDetails } from '../../../../state/actions/monitor';
 import { MostRecentError } from './most_recent_error';
-import { getMonitorDetails } from '../../../../state/selectors';
+import { getMonitorDetails, getFilters } from '../../../../state/selectors';
 import { MonitorStatusList } from './monitor_status_list';
 import { MonitorDetails } from '../../../../../common/runtime_types';
 import { useUrlParams } from '../../../../hooks';
@@ -39,6 +39,11 @@ interface MonitorListDrawerProps {
    * Redux action to trigger , loading monitor details
    */
   loadMonitorDetails: typeof fetchMonitorDetails;
+
+  /**
+   * Filters from filter bar
+   */
+  filters: Map<string, string[]>;
 }
 
 /**
@@ -49,20 +54,22 @@ export function MonitorListDrawerComponent({
   summary,
   loadMonitorDetails,
   monitorDetails,
+  filters,
 }: MonitorListDrawerProps) {
   if (!summary || !summary.state.checks) {
     return null;
   }
   const { monitor_id: monitorId } = summary;
   const [getUrlParams] = useUrlParams();
-  const { dateRangeStart: dateStart, dateRangeEnd: dateEnd, filters } = getUrlParams();
+  const { dateRangeStart: dateStart, dateRangeEnd: dateEnd } = getUrlParams();
 
   useEffect(() => {
+    const location = filters?.get('observer.geo.name') ?? [];
     loadMonitorDetails({
       dateStart,
       dateEnd,
-      filters,
       monitorId,
+      location: location.join(),
     });
   }, [dateStart, dateEnd, filters]);
 
@@ -93,6 +100,7 @@ export function MonitorListDrawerComponent({
 
 const mapStateToProps = (state: AppState, { summary }: any) => ({
   monitorDetails: getMonitorDetails(state, summary),
+  filters: getFilters(state),
 });
 
 const mapDispatchToProps = (dispatch: any) => ({
diff --git a/x-pack/legacy/plugins/uptime/public/state/actions/types.ts b/x-pack/legacy/plugins/uptime/public/state/actions/types.ts
@@ -8,5 +8,5 @@ export interface MonitorDetailsActionPayload {
   monitorId: string;
   dateStart: string;
   dateEnd: string;
-  filters?: string;
+  location?: string;
 }
diff --git a/x-pack/legacy/plugins/uptime/public/state/actions/ui.ts b/x-pack/legacy/plugins/uptime/public/state/actions/ui.ts
@@ -3,53 +3,17 @@
  * or more contributor license agreements. Licensed under the Elastic License;
  * you may not use this file except in compliance with the Elastic License.
  */
-
-export const SET_INTEGRATION_POPOVER_STATE = 'SET_INTEGRATION_POPOVER_STATE';
-export const SET_BASE_PATH = 'SET_BASE_PATH';
-export const REFRESH_APP = 'REFRESH_APP';
+import { createAction } from 'redux-actions';
 
 export interface PopoverState {
   id: string;
   open: boolean;
 }
 
-interface SetBasePathAction {
-  type: typeof SET_BASE_PATH;
-  payload: string;
-}
-
-interface SetIntegrationPopoverAction {
-  type: typeof SET_INTEGRATION_POPOVER_STATE;
-  payload: PopoverState;
-}
-
-interface TriggerAppRefreshAction {
-  type: typeof REFRESH_APP;
-  payload: number;
-}
-
-export type UiActionTypes =
-  | SetIntegrationPopoverAction
-  | SetBasePathAction
-  | TriggerAppRefreshAction;
-
-export function toggleIntegrationsPopover(popoverState: PopoverState): SetIntegrationPopoverAction {
-  return {
-    type: SET_INTEGRATION_POPOVER_STATE,
-    payload: popoverState,
-  };
-}
-
-export function setBasePath(basePath: string): SetBasePathAction {
-  return {
-    type: SET_BASE_PATH,
-    payload: basePath,
-  };
-}
+export const setBasePath = createAction<string>('SET BASE PATH');
+export const triggerAppRefresh = createAction<number>('REFRESH APP');
 
-export function triggerAppRefresh(refreshTime: number): TriggerAppRefreshAction {
-  return {
-    type: REFRESH_APP,
-    payload: refreshTime,
-  };
-}
+export const setFilters = createAction<Map<string, string[]>>('SET FILTERS');
+export const toggleIntegrationsPopover = createAction<PopoverState>(
+  'TOGGLE INTEGRATION POPOVER STATE'
+);
diff --git a/x-pack/legacy/plugins/uptime/public/state/api/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/api/monitor.ts
@@ -21,14 +21,14 @@ export const fetchMonitorDetails = async ({
   basePath,
   dateStart,
   dateEnd,
-  filters,
+  location,
 }: MonitorQueryParams): Promise<MonitorDetails> => {
   const url = getApiPath(`/api/uptime/monitor/details`, basePath);
   const params = {
     monitorId,
     dateStart,
     dateEnd,
-    ...(filters && { filters }),
+    ...(location && { location }),
   };
   const urlParams = new URLSearchParams(params).toString();
   const response = await fetch(`${url}?${urlParams}`);
diff --git a/x-pack/legacy/plugins/uptime/public/state/api/types.ts b/x-pack/legacy/plugins/uptime/public/state/api/types.ts
@@ -10,4 +10,5 @@ export interface BaseParams {
   dateEnd: string;
   filters?: string;
   statusFilter?: string;
+  location?: string;
 }
diff --git a/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts
@@ -16,15 +16,15 @@ import { getBasePath } from '../selectors';
 import { MonitorDetailsActionPayload } from '../actions/types';
 
 function* monitorDetailsEffect(action: Action<any>) {
-  const { monitorId, dateStart, dateEnd, filters }: MonitorDetailsActionPayload = action.payload;
+  const { monitorId, dateStart, dateEnd, location }: MonitorDetailsActionPayload = action.payload;
   try {
     const basePath = yield select(getBasePath);
     const response = yield call(fetchMonitorDetails, {
       monitorId,
       basePath,
       dateStart,
       dateEnd,
-      filters,
+      location,
     });
     yield put({ type: FETCH_MONITOR_DETAILS_SUCCESS, payload: response });
   } catch (error) {
diff --git a/x-pack/legacy/plugins/uptime/public/state/reducers/ui.ts b/x-pack/legacy/plugins/uptime/public/state/reducers/ui.ts
@@ -4,49 +4,52 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import { handleActions, Action } from 'redux-actions';
 import {
-  UiActionTypes,
   PopoverState,
-  SET_INTEGRATION_POPOVER_STATE,
-  SET_BASE_PATH,
-  REFRESH_APP,
+  toggleIntegrationsPopover,
+  setBasePath,
+  triggerAppRefresh,
+  setFilters,
 } from '../actions/ui';
 
 export interface UiState {
   integrationsPopoverOpen: PopoverState | null;
   basePath: string;
   lastRefresh: number;
+  filters: Map<string, string[]>;
 }
 
 const initialState: UiState = {
   integrationsPopoverOpen: null,
   basePath: '',
   lastRefresh: Date.now(),
+  filters: new Map(),
 };
 
-export function uiReducer(state = initialState, action: UiActionTypes): UiState {
-  switch (action.type) {
-    case REFRESH_APP:
-      return {
-        ...state,
-        lastRefresh: action.payload,
-      };
-    case SET_INTEGRATION_POPOVER_STATE:
-      const popoverState = action.payload;
-      return {
-        ...state,
-        integrationsPopoverOpen: {
-          id: popoverState.id,
-          open: popoverState.open,
-        },
-      };
-    case SET_BASE_PATH:
-      const basePath = action.payload;
-      return {
-        ...state,
-        basePath,
-      };
-    default:
-      return state;
-  }
-}
+type UiPayload = PopoverState & string & boolean & number & Map<string, string[]>;
+
+export const uiReducer = handleActions<UiState, UiPayload>(
+  {
+    [String(toggleIntegrationsPopover)]: (state, action: Action<PopoverState>) => ({
+      ...state,
+      integrationsPopoverOpen: action.payload as PopoverState,
+    }),
+
+    [String(setBasePath)]: (state, action: Action<string>) => ({
+      ...state,
+      basePath: action.payload as string,
+    }),
+
+    [String(triggerAppRefresh)]: (state, action: Action<number>) => ({
+      ...state,
+      lastRefresh: action.payload as number,
+    }),
+
+    [String(setFilters)]: (state, action: Action<Map<string, string[]>>) => ({
+      ...state,
+      filters: new Map([...state.filters, ...(action.payload as Map<string, string[]>)]),
+    }),
+  },
+  initialState
+);
diff --git a/x-pack/legacy/plugins/uptime/public/state/selectors/index.ts b/x-pack/legacy/plugins/uptime/public/state/selectors/index.ts
@@ -6,11 +6,14 @@
 
 import { AppState } from '../../state';
 
+// UI Selectors
 export const getBasePath = ({ ui: { basePath } }: AppState) => basePath;
 
 export const isIntegrationsPopupOpen = ({ ui: { integrationsPopoverOpen } }: AppState) =>
   integrationsPopoverOpen;
 
-export const getMonitorDetails = (state: AppState, summary: any) => {
-  return state.monitor.monitorDetailsList[summary.monitor_id];
-};
+export const getFilters = ({ ui: { filters } }: AppState) => filters;
+
+// Monitor Selectors
+export const getMonitorDetails = (state: AppState, summary: any) =>
+  state.monitor.monitorDetailsList[summary.monitor_id];
diff --git a/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/adapter_types.ts b/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/adapter_types.ts
@@ -21,6 +21,6 @@ export interface UMMonitorsAdapter {
     monitorId: string,
     dateStart: string,
     dateEnd: string,
-    filters?: string
+    location?: string
   ): Promise<any>;
 }
diff --git a/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts b/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts
@@ -278,17 +278,22 @@ export class ElasticsearchMonitorsAdapter implements UMMonitorsAdapter {
     monitorId: string,
     dateStart: string,
     dateEnd: string,
-    filters?: string
+    location?: string
   ): Promise<MonitorDetails> {
     // Doing filtering by location, because only that matters here
     // All of the other filters are already automatically applied by MonitorId
 
-    const queryFilters = [
+    const queryFilters: any = [
       { range: { '@timestamp': { gte: dateStart, lte: dateEnd } } },
       { term: { 'monitor.id': monitorId } },
-      ...(filters ? JSON.parse(filters) : []),
     ];
 
+    if (location) {
+      queryFilters.push({
+        terms: { 'observer.geo.name': location.split(',') },
+      });
+    }
+
     const params = {
       index: INDEX_NAMES.HEARTBEAT,
       body: {
diff --git a/x-pack/legacy/plugins/uptime/server/rest_api/monitors/monitors_details.ts b/x-pack/legacy/plugins/uptime/server/rest_api/monitors/monitors_details.ts
@@ -16,18 +16,24 @@ export const createGetMonitorDetailsRoute: UMRestApiRouteCreator = (libs: UMServ
       monitorId: schema.string(),
       dateStart: schema.maybe(schema.string()),
       dateEnd: schema.maybe(schema.string()),
-      filters: schema.maybe(schema.string()),
+      location: schema.maybe(schema.string()),
     }),
   },
   options: {
     tags: ['access:uptime'],
   },
   handler: async (_context, request, response): Promise<any> => {
-    const { monitorId, dateStart, dateEnd, filters } = request.query;
+    const { monitorId, dateStart, dateEnd, location } = request.query;
 
     return response.ok({
       body: {
-        ...(await libs.monitors.getMonitorDetails(request, monitorId, dateStart, dateEnd, filters)),
+        ...(await libs.monitors.getMonitorDetails(
+          request,
+          monitorId,
+          dateStart,
+          dateEnd,
+          location
+        )),
       },
     });
   },
diff --git a/x-pack/package.json b/x-pack/package.json
diff --git a/yarn.lock b/yarn.lock

Original file line number	Diff line number	Diff line change
`@@ -8,5 +8,5 @@ export interface MonitorDetailsActionPayload {`
`8`	`8`	`monitorId: string;`
`9`	`9`	`dateStart: string;`
`10`	`10`	`dateEnd: string;`
`11`		`- filters?: string;`
	`11`	`+ location?: string;`
`12`	`12`	`}`
Original file line number	Diff line number	Diff line change
`@@ -10,4 +10,5 @@ export interface BaseParams {`
`10`	`10`	`dateEnd: string;`
`11`	`11`	`filters?: string;`
`12`	`12`	`statusFilter?: string;`
	`13`	`+ location?: string;`
`13`	`14`	`}`