From 1cefc8eed0be74711f2b5a23a79a159f27855782 Mon Sep 17 00:00:00 2001 From: Nathan Reese Date: Thu, 8 Oct 2020 07:48:21 -0600 Subject: [PATCH] [Maps] clean up uses of any in redux actions and kibana services (#79737) * [Maps] clean up uses of any in redux actions and kibana services * API doc changes and updated IndexPatternSelect type * tslint errors in OSS code * API updates * remove IndexPatternSelectPublicProps and create IndexPatternSelectInternalProps instead * include changes to index_pattern_select * API updates * remove savedObjectClient from IndexPatternSelectProps * update types for lazy load component * remove unused import * export type * another API clean-up * revert changes to import in data/public/types Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com> --- ...ins-data-public.indexpatternselectprops.md | 4 +- .../search_examples/public/components/app.tsx | 1 - src/plugins/data/public/public.api.md | 4 +- .../create_index_pattern_select.tsx | 2 +- .../public/ui/index_pattern_select/index.tsx | 4 +- .../index_pattern_select.tsx | 17 +- .../editor/index_pattern_select_form_row.tsx | 2 - .../public/actions/data_request_actions.ts | 80 +++++---- .../maps/public/actions/layer_actions.ts | 153 ++++++++++++------ .../maps/public/actions/map_actions.test.js | 2 +- .../maps/public/actions/map_actions.ts | 34 ++-- .../plugins/maps/public/actions/ui_actions.ts | 10 +- .../layer_template.tsx | 10 +- .../components/geo_index_pattern_select.tsx | 4 +- .../add_layer_panel/index.ts | 13 +- .../layer_panel/join_editor/index.tsx | 7 +- .../map_container/index.ts | 9 +- .../toolbar_overlay/fit_to_data/index.ts | 7 +- .../toolbar_overlay/tools_control/index.ts | 9 +- .../toc_entry_actions_popover/index.ts | 13 +- x-pack/plugins/maps/public/kibana_services.ts | 2 +- 21 files changed, 241 insertions(+), 146 deletions(-) diff --git a/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.indexpatternselectprops.md b/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.indexpatternselectprops.md index 1fe551def29ba..5cfd5e1bc9929 100644 --- a/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.indexpatternselectprops.md +++ b/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.indexpatternselectprops.md @@ -7,10 +7,10 @@ Signature: ```typescript -export declare type IndexPatternSelectProps = Required, 'isLoading' | 'onSearchChange' | 'options' | 'selectedOptions'>, 'onChange' | 'placeholder'> & { +export declare type IndexPatternSelectProps = Required, 'isLoading' | 'onSearchChange' | 'options' | 'selectedOptions' | 'onChange'>, 'placeholder'> & { + onChange: (indexPatternId?: string) => void; indexPatternId: string; fieldTypes?: string[]; onNoIndexPatterns?: () => void; - savedObjectsClient: SavedObjectsClientContract; }; ``` diff --git a/examples/search_examples/public/components/app.tsx b/examples/search_examples/public/components/app.tsx index 61e50d3379d03..2425f3bbad8a9 100644 --- a/examples/search_examples/public/components/app.tsx +++ b/examples/search_examples/public/components/app.tsx @@ -232,7 +232,6 @@ export const SearchExamplesApp = ({ Index Pattern ; // Warning: (ae-missing-release-tag) "IndexPatternSelectProps" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // // @public (undocumented) -export type IndexPatternSelectProps = Required, 'isLoading' | 'onSearchChange' | 'options' | 'selectedOptions'>, 'onChange' | 'placeholder'> & { +export type IndexPatternSelectProps = Required, 'isLoading' | 'onSearchChange' | 'options' | 'selectedOptions' | 'onChange'>, 'placeholder'> & { + onChange: (indexPatternId?: string) => void; indexPatternId: string; fieldTypes?: string[]; onNoIndexPatterns?: () => void; - savedObjectsClient: SavedObjectsClientContract; }; // Warning: (ae-missing-release-tag) "IndexPatternSpec" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) diff --git a/src/plugins/data/public/ui/index_pattern_select/create_index_pattern_select.tsx b/src/plugins/data/public/ui/index_pattern_select/create_index_pattern_select.tsx index b49cc24ba90b1..a48c2dabf1506 100644 --- a/src/plugins/data/public/ui/index_pattern_select/create_index_pattern_select.tsx +++ b/src/plugins/data/public/ui/index_pattern_select/create_index_pattern_select.tsx @@ -25,7 +25,7 @@ import { IndexPatternSelect, IndexPatternSelectProps } from './'; // Takes in stateful runtime dependencies and pre-wires them to the component export function createIndexPatternSelect(savedObjectsClient: SavedObjectsClientContract) { - return (props: Omit) => ( + return (props: IndexPatternSelectProps) => ( ); } diff --git a/src/plugins/data/public/ui/index_pattern_select/index.tsx b/src/plugins/data/public/ui/index_pattern_select/index.tsx index 2912ec401b8b6..f0db37eb963fd 100644 --- a/src/plugins/data/public/ui/index_pattern_select/index.tsx +++ b/src/plugins/data/public/ui/index_pattern_select/index.tsx @@ -19,7 +19,7 @@ import React from 'react'; import { EuiLoadingContent, EuiDelayRender } from '@elastic/eui'; -import type { IndexPatternSelectProps } from './index_pattern_select'; +import type { IndexPatternSelectInternalProps } from './index_pattern_select'; const Fallback = () => ( @@ -28,7 +28,7 @@ const Fallback = () => ( ); const LazyIndexPatternSelect = React.lazy(() => import('./index_pattern_select')); -export const IndexPatternSelect = (props: IndexPatternSelectProps) => ( +export const IndexPatternSelect = (props: IndexPatternSelectInternalProps) => ( }> diff --git a/src/plugins/data/public/ui/index_pattern_select/index_pattern_select.tsx b/src/plugins/data/public/ui/index_pattern_select/index_pattern_select.tsx index 8de1e2c16f159..1e0e8934778ad 100644 --- a/src/plugins/data/public/ui/index_pattern_select/index_pattern_select.tsx +++ b/src/plugins/data/public/ui/index_pattern_select/index_pattern_select.tsx @@ -27,12 +27,19 @@ import { SavedObjectsClientContract, SimpleSavedObject } from 'src/core/public'; import { getTitle } from '../../../common/index_patterns/lib'; export type IndexPatternSelectProps = Required< - Omit, 'isLoading' | 'onSearchChange' | 'options' | 'selectedOptions'>, - 'onChange' | 'placeholder' + Omit< + EuiComboBoxProps, + 'isLoading' | 'onSearchChange' | 'options' | 'selectedOptions' | 'onChange' + >, + 'placeholder' > & { + onChange: (indexPatternId?: string) => void; indexPatternId: string; fieldTypes?: string[]; onNoIndexPatterns?: () => void; +}; + +export type IndexPatternSelectInternalProps = IndexPatternSelectProps & { savedObjectsClient: SavedObjectsClientContract; }; @@ -60,11 +67,11 @@ const getIndexPatterns = async ( // Needed for React.lazy // eslint-disable-next-line import/no-default-export -export default class IndexPatternSelect extends Component { +export default class IndexPatternSelect extends Component { private isMounted: boolean = false; state: IndexPatternSelectState; - constructor(props: IndexPatternSelectProps) { + constructor(props: IndexPatternSelectInternalProps) { super(props); this.state = { @@ -86,7 +93,7 @@ export default class IndexPatternSelect extends Component ); diff --git a/x-pack/plugins/maps/public/actions/data_request_actions.ts b/x-pack/plugins/maps/public/actions/data_request_actions.ts index d7d9259e1539e..2c59424ec174b 100644 --- a/x-pack/plugins/maps/public/actions/data_request_actions.ts +++ b/x-pack/plugins/maps/public/actions/data_request_actions.ts @@ -5,7 +5,8 @@ */ /* eslint-disable @typescript-eslint/consistent-type-definitions */ -import { Dispatch } from 'redux'; +import { AnyAction, Dispatch } from 'redux'; +import { ThunkDispatch } from 'redux-thunk'; import bbox from '@turf/bbox'; import uuid from 'uuid/v4'; import { multiPoint } from '@turf/helpers'; @@ -70,9 +71,12 @@ export function clearDataRequests(layer: ILayer) { } export function cancelAllInFlightRequests() { - return (dispatch: Dispatch, getState: () => MapStoreState) => { + return ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { getLayerList(getState()).forEach((layer) => { - dispatch(clearDataRequests(layer)); + dispatch(clearDataRequests(layer)); }); }; } @@ -100,20 +104,20 @@ export function updateStyleMeta(layerId: string | null) { } function getDataRequestContext( - dispatch: Dispatch, + dispatch: ThunkDispatch, getState: () => MapStoreState, layerId: string ): DataRequestContext { return { dataFilters: getDataFilters(getState()), startLoading: (dataId: string, requestToken: symbol, meta: DataMeta) => - dispatch(startDataLoad(layerId, dataId, requestToken, meta)), + dispatch(startDataLoad(layerId, dataId, requestToken, meta)), stopLoading: (dataId: string, requestToken: symbol, data: object, meta: DataMeta) => - dispatch(endDataLoad(layerId, dataId, requestToken, data, meta)), + dispatch(endDataLoad(layerId, dataId, requestToken, data, meta)), onLoadError: (dataId: string, requestToken: symbol, errorMessage: string) => - dispatch(onDataLoadError(layerId, dataId, requestToken, errorMessage)), + dispatch(onDataLoadError(layerId, dataId, requestToken, errorMessage)), updateSourceData: (newData: unknown) => { - dispatch(updateSourceDataRequest(layerId, newData)); + dispatch(updateSourceDataRequest(layerId, newData)); }, isRequestStillActive: (dataId: string, requestToken: symbol) => { const dataRequest = getDataRequestDescriptor(getState(), layerId, dataId); @@ -128,22 +132,28 @@ function getDataRequestContext( } export function syncDataForAllLayers() { - return async (dispatch: Dispatch, getState: () => MapStoreState) => { + return async ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const syncPromises = getLayerList(getState()).map((layer) => { - return dispatch(syncDataForLayer(layer)); + return dispatch(syncDataForLayer(layer)); }); await Promise.all(syncPromises); }; } function syncDataForAllJoinLayers() { - return async (dispatch: Dispatch, getState: () => MapStoreState) => { + return async ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const syncPromises = getLayerList(getState()) .filter((layer) => { return 'hasJoins' in layer ? (layer as IVectorLayer).hasJoins() : false; }) .map((layer) => { - return dispatch(syncDataForLayer(layer)); + return dispatch(syncDataForLayer(layer)); }); await Promise.all(syncPromises); }; @@ -160,10 +170,13 @@ export function syncDataForLayer(layer: ILayer) { } export function syncDataForLayerId(layerId: string | null) { - return async (dispatch: Dispatch, getState: () => MapStoreState) => { + return async ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const layer = getLayerById(layerId, getState()); if (layer) { - dispatch(syncDataForLayer(layer)); + dispatch(syncDataForLayer(layer)); } }; } @@ -180,10 +193,13 @@ function setLayerDataLoadErrorStatus(layerId: string, errorMessage: string | nul } function startDataLoad(layerId: string, dataId: string, requestToken: symbol, meta: DataMeta) { - return (dispatch: Dispatch, getState: () => MapStoreState) => { + return ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const layer = getLayerById(layerId, getState()); if (layer) { - dispatch(cancelRequest(layer.getPrevRequestToken(dataId))); + dispatch(cancelRequest(layer.getPrevRequestToken(dataId))); } const eventHandlers = getEventHandlers(getState()); @@ -211,7 +227,10 @@ function endDataLoad( data: object, meta: DataMeta ) { - return async (dispatch: Dispatch, getState: () => MapStoreState) => { + return async ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { dispatch(unregisterCancelCallback(requestToken)); const features = data && 'features' in data ? (data as FeatureCollection).features : []; @@ -231,7 +250,7 @@ function endDataLoad( }); } - dispatch(cleanTooltipStateForLayer(layerId, features)); + dispatch(cleanTooltipStateForLayer(layerId, features)); dispatch({ type: LAYER_DATA_LOAD_ENDED, layerId, @@ -244,9 +263,9 @@ function endDataLoad( // Clear any data-load errors when there is a succesful data return. // Co this on end-data-load iso at start-data-load to avoid blipping the error status between true/false. // This avoids jitter in the warning icon of the TOC when the requests continues to return errors. - dispatch(setLayerDataLoadErrorStatus(layerId, null)); + dispatch(setLayerDataLoadErrorStatus(layerId, null)); - dispatch(updateStyleMeta(layerId)); + dispatch(updateStyleMeta(layerId)); }; } @@ -256,7 +275,10 @@ function onDataLoadError( requestToken: symbol, errorMessage: string ) { - return async (dispatch: Dispatch, getState: () => MapStoreState) => { + return async ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { dispatch(unregisterCancelCallback(requestToken)); const eventHandlers = getEventHandlers(getState()); @@ -268,7 +290,7 @@ function onDataLoadError( }); } - dispatch(cleanTooltipStateForLayer(layerId)); + dispatch(cleanTooltipStateForLayer(layerId)); dispatch({ type: LAYER_DATA_LOAD_ERROR, data: null, @@ -277,12 +299,12 @@ function onDataLoadError( requestToken, }); - dispatch(setLayerDataLoadErrorStatus(layerId, errorMessage)); + dispatch(setLayerDataLoadErrorStatus(layerId, errorMessage)); }; } export function updateSourceDataRequest(layerId: string, newData: unknown) { - return (dispatch: Dispatch) => { + return (dispatch: ThunkDispatch) => { dispatch({ type: UPDATE_SOURCE_DATA_REQUEST, dataId: SOURCE_DATA_REQUEST_ID, @@ -290,7 +312,7 @@ export function updateSourceDataRequest(layerId: string, newData: unknown) { newData, }); - dispatch(updateStyleMeta(layerId)); + dispatch(updateStyleMeta(layerId)); }; } @@ -385,7 +407,7 @@ export function fitToDataBounds(onNoBounds?: () => void) { let lastSetQueryCallId: string = ''; export function autoFitToBounds() { - return async (dispatch: Dispatch) => { + return async (dispatch: ThunkDispatch) => { // Method can be triggered before async actions complete // Use localSetQueryCallId to only continue execution path if method has not been re-triggered. const localSetQueryCallId = uuid(); @@ -394,17 +416,17 @@ export function autoFitToBounds() { // Joins are performed on the client. // As a result, bounds for join layers must also be performed on the client. // Therefore join layers need to fetch data prior to auto fitting bounds. - await dispatch(syncDataForAllJoinLayers()); + await dispatch(syncDataForAllJoinLayers()); if (localSetQueryCallId === lastSetQueryCallId) { // In cases where there are no bounds, such as no matching documents, fitToDataBounds does not trigger setGotoWithBounds. // Ensure layer syncing occurs when setGotoWithBounds is not triggered. function onNoBounds() { if (localSetQueryCallId === lastSetQueryCallId) { - dispatch(syncDataForAllLayers()); + dispatch(syncDataForAllLayers()); } } - dispatch(fitToDataBounds(onNoBounds)); + dispatch(fitToDataBounds(onNoBounds)); } }; } diff --git a/x-pack/plugins/maps/public/actions/layer_actions.ts b/x-pack/plugins/maps/public/actions/layer_actions.ts index 19c9adfadd45a..b7a07e98437a1 100644 --- a/x-pack/plugins/maps/public/actions/layer_actions.ts +++ b/x-pack/plugins/maps/public/actions/layer_actions.ts @@ -4,7 +4,8 @@ * you may not use this file except in compliance with the Elastic License. */ -import { Dispatch } from 'redux'; +import { AnyAction, Dispatch } from 'redux'; +import { ThunkDispatch } from 'redux-thunk'; import { Query } from 'src/plugins/data/public'; import { MapStoreState } from '../reducers/store'; import { @@ -53,7 +54,10 @@ export function trackCurrentLayerState(layerId: string) { } export function rollbackToTrackedLayerStateForSelectedLayer() { - return async (dispatch: Dispatch, getState: () => MapStoreState) => { + return async ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const layerId = getSelectedLayerId(getState()); await dispatch({ type: ROLLBACK_TO_TRACKED_LAYER_STATE, @@ -62,9 +66,9 @@ export function rollbackToTrackedLayerStateForSelectedLayer() { // Ensure updateStyleMeta is triggered // syncDataForLayer may not trigger endDataLoad if no re-fetch is required - dispatch(updateStyleMeta(layerId)); + dispatch(updateStyleMeta(layerId)); - dispatch(syncDataForLayerId(layerId)); + dispatch(syncDataForLayerId(layerId)); }; } @@ -79,7 +83,10 @@ export function removeTrackedLayerStateForSelectedLayer() { } export function replaceLayerList(newLayerList: LayerDescriptor[]) { - return (dispatch: Dispatch, getState: () => MapStoreState) => { + return ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const isMapReady = getMapReady(getState()); if (!isMapReady) { dispatch({ @@ -87,30 +94,36 @@ export function replaceLayerList(newLayerList: LayerDescriptor[]) { }); } else { getLayerListRaw(getState()).forEach(({ id }) => { - dispatch(removeLayerFromLayerList(id)); + dispatch(removeLayerFromLayerList(id)); }); } newLayerList.forEach((layerDescriptor) => { - dispatch(addLayer(layerDescriptor)); + dispatch(addLayer(layerDescriptor)); }); }; } export function cloneLayer(layerId: string) { - return async (dispatch: Dispatch, getState: () => MapStoreState) => { + return async ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const layer = getLayerById(layerId, getState()); if (!layer) { return; } const clonedDescriptor = await layer.cloneDescriptor(); - dispatch(addLayer(clonedDescriptor)); + dispatch(addLayer(clonedDescriptor)); }; } export function addLayer(layerDescriptor: LayerDescriptor) { - return async (dispatch: Dispatch, getState: () => MapStoreState) => { + return async ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const isMapReady = getMapReady(getState()); if (!isMapReady) { dispatch({ @@ -124,7 +137,7 @@ export function addLayer(layerDescriptor: LayerDescriptor) { type: ADD_LAYER, layer: layerDescriptor, }); - dispatch(syncDataForLayerId(layerDescriptor.id)); + dispatch(syncDataForLayerId(layerDescriptor.id)); const layer = createLayerInstance(layerDescriptor); const features = await layer.getLicensedFeatures(); @@ -140,20 +153,23 @@ export function addLayerWithoutDataSync(layerDescriptor: LayerDescriptor) { } export function addPreviewLayers(layerDescriptors: LayerDescriptor[]) { - return (dispatch: Dispatch) => { - dispatch(removePreviewLayers()); + return (dispatch: ThunkDispatch) => { + dispatch(removePreviewLayers()); layerDescriptors.forEach((layerDescriptor) => { - dispatch(addLayer({ ...layerDescriptor, __isPreviewLayer: true })); + dispatch(addLayer({ ...layerDescriptor, __isPreviewLayer: true })); }); }; } export function removePreviewLayers() { - return (dispatch: Dispatch, getState: () => MapStoreState) => { + return ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { getLayerList(getState()).forEach((layer) => { if (layer.isPreviewLayer()) { - dispatch(removeLayer(layer.getId())); + dispatch(removeLayer(layer.getId())); } }); }; @@ -175,7 +191,10 @@ export function promotePreviewLayers() { } export function setLayerVisibility(layerId: string, makeVisible: boolean) { - return (dispatch: Dispatch, getState: () => MapStoreState) => { + return ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { // if the current-state is invisible, we also want to sync data // e.g. if a layer was invisible at start-up, it won't have any data loaded const layer = getLayerById(layerId, getState()); @@ -186,7 +205,7 @@ export function setLayerVisibility(layerId: string, makeVisible: boolean) { } if (!makeVisible) { - dispatch(cleanTooltipStateForLayer(layerId)); + dispatch(cleanTooltipStateForLayer(layerId)); } dispatch({ @@ -195,28 +214,34 @@ export function setLayerVisibility(layerId: string, makeVisible: boolean) { visibility: makeVisible, }); if (makeVisible) { - dispatch(syncDataForLayerId(layerId)); + dispatch(syncDataForLayerId(layerId)); } }; } export function toggleLayerVisible(layerId: string) { - return (dispatch: Dispatch, getState: () => MapStoreState) => { + return ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const layer = getLayerById(layerId, getState()); if (!layer) { return; } const makeVisible = !layer.isVisible(); - dispatch(setLayerVisibility(layerId, makeVisible)); + dispatch(setLayerVisibility(layerId, makeVisible)); }; } export function setSelectedLayer(layerId: string | null) { - return async (dispatch: Dispatch, getState: () => MapStoreState) => { + return async ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const oldSelectedLayer = getSelectedLayerId(getState()); if (oldSelectedLayer) { - await dispatch(rollbackToTrackedLayerStateForSelectedLayer()); + await dispatch(rollbackToTrackedLayerStateForSelectedLayer()); } if (layerId) { dispatch(trackCurrentLayerState(layerId)); @@ -229,12 +254,15 @@ export function setSelectedLayer(layerId: string | null) { } export function setFirstPreviewLayerToSelectedLayer() { - return async (dispatch: Dispatch, getState: () => MapStoreState) => { + return async ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const firstPreviewLayer = getLayerList(getState()).find((layer) => { return layer.isPreviewLayer(); }); if (firstPreviewLayer) { - dispatch(setSelectedLayer(firstPreviewLayer.getId())); + dispatch(setSelectedLayer(firstPreviewLayer.getId())); } }; } @@ -252,7 +280,7 @@ export function updateSourceProp( value: unknown, newLayerType?: LAYER_TYPE ) { - return async (dispatch: Dispatch) => { + return async (dispatch: ThunkDispatch) => { dispatch({ type: UPDATE_SOURCE_PROP, layerId, @@ -260,20 +288,23 @@ export function updateSourceProp( value, }); if (newLayerType) { - dispatch(updateLayerType(layerId, newLayerType)); + dispatch(updateLayerType(layerId, newLayerType)); } - await dispatch(clearMissingStyleProperties(layerId)); - dispatch(syncDataForLayerId(layerId)); + await dispatch(clearMissingStyleProperties(layerId)); + dispatch(syncDataForLayerId(layerId)); }; } function updateLayerType(layerId: string, newLayerType: string) { - return (dispatch: Dispatch, getState: () => MapStoreState) => { + return ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const layer = getLayerById(layerId, getState()); if (!layer || layer.getType() === newLayerType) { return; } - dispatch(clearDataRequests(layer)); + dispatch(clearDataRequests(layer)); dispatch({ type: UPDATE_LAYER_PROP, id: layerId, @@ -329,7 +360,7 @@ export function updateLabelsOnTop(id: string, areLabelsOnTop: boolean) { } export function setLayerQuery(id: string, query: Query) { - return (dispatch: Dispatch) => { + return (dispatch: ThunkDispatch) => { dispatch({ type: UPDATE_LAYER_PROP, id, @@ -337,32 +368,41 @@ export function setLayerQuery(id: string, query: Query) { newValue: query, }); - dispatch(syncDataForLayerId(id)); + dispatch(syncDataForLayerId(id)); }; } export function removeSelectedLayer() { - return (dispatch: Dispatch, getState: () => MapStoreState) => { + return ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const state = getState(); const layerId = getSelectedLayerId(state); - dispatch(removeLayer(layerId)); + dispatch(removeLayer(layerId)); }; } export function removeLayer(layerId: string | null) { - return async (dispatch: Dispatch, getState: () => MapStoreState) => { + return async ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const state = getState(); const selectedLayerId = getSelectedLayerId(state); if (layerId === selectedLayerId) { dispatch(updateFlyout(FLYOUT_STATE.NONE)); - await dispatch(setSelectedLayer(null)); + await dispatch(setSelectedLayer(null)); } - dispatch(removeLayerFromLayerList(layerId)); + dispatch(removeLayerFromLayerList(layerId)); }; } function removeLayerFromLayerList(layerId: string | null) { - return (dispatch: Dispatch, getState: () => MapStoreState) => { + return ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const layerGettingRemoved = getLayerById(layerId, getState()); if (!layerGettingRemoved) { return; @@ -371,7 +411,7 @@ function removeLayerFromLayerList(layerId: string | null) { layerGettingRemoved.getInFlightRequestTokens().forEach((requestToken) => { dispatch(cancelRequest(requestToken)); }); - dispatch(cleanTooltipStateForLayer(layerId!)); + dispatch(cleanTooltipStateForLayer(layerId!)); layerGettingRemoved.destroy(); dispatch({ type: REMOVE_LAYER, @@ -381,7 +421,10 @@ function removeLayerFromLayerList(layerId: string | null) { } export function clearMissingStyleProperties(layerId: string) { - return async (dispatch: Dispatch, getState: () => MapStoreState) => { + return async ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const targetLayer = getLayerById(layerId, getState()); if (!targetLayer || !('getFields' in targetLayer)) { return; @@ -401,13 +444,13 @@ export function clearMissingStyleProperties(layerId: string) { getMapColors(getState()) ); if (hasChanges && nextStyleDescriptor) { - dispatch(updateLayerStyle(layerId, nextStyleDescriptor)); + dispatch(updateLayerStyle(layerId, nextStyleDescriptor)); } }; } export function updateLayerStyle(layerId: string, styleDescriptor: StyleDescriptor) { - return (dispatch: Dispatch) => { + return (dispatch: ThunkDispatch) => { dispatch({ type: UPDATE_LAYER_STYLE, layerId, @@ -418,45 +461,51 @@ export function updateLayerStyle(layerId: string, styleDescriptor: StyleDescript // Ensure updateStyleMeta is triggered // syncDataForLayer may not trigger endDataLoad if no re-fetch is required - dispatch(updateStyleMeta(layerId)); + dispatch(updateStyleMeta(layerId)); // Style update may require re-fetch, for example ES search may need to retrieve field used for dynamic styling - dispatch(syncDataForLayerId(layerId)); + dispatch(syncDataForLayerId(layerId)); }; } export function updateLayerStyleForSelectedLayer(styleDescriptor: StyleDescriptor) { - return (dispatch: Dispatch, getState: () => MapStoreState) => { + return ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const selectedLayerId = getSelectedLayerId(getState()); if (!selectedLayerId) { return; } - dispatch(updateLayerStyle(selectedLayerId, styleDescriptor)); + dispatch(updateLayerStyle(selectedLayerId, styleDescriptor)); }; } export function setJoinsForLayer(layer: ILayer, joins: JoinDescriptor[]) { - return async (dispatch: Dispatch) => { + return async (dispatch: ThunkDispatch) => { await dispatch({ type: SET_JOINS, layer, joins, }); - await dispatch(clearMissingStyleProperties(layer.getId())); - dispatch(syncDataForLayerId(layer.getId())); + await dispatch(clearMissingStyleProperties(layer.getId())); + dispatch(syncDataForLayerId(layer.getId())); }; } export function setHiddenLayers(hiddenLayerIds: string[]) { - return (dispatch: Dispatch, getState: () => MapStoreState) => { + return ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const isMapReady = getMapReady(getState()); if (!isMapReady) { dispatch({ type: SET_WAITING_FOR_READY_HIDDEN_LAYERS, hiddenLayerIds }); } else { getLayerListRaw(getState()).forEach((layer) => - dispatch(setLayerVisibility(layer.id, !hiddenLayerIds.includes(layer.id))) + dispatch(setLayerVisibility(layer.id, !hiddenLayerIds.includes(layer.id))) ); } }; diff --git a/x-pack/plugins/maps/public/actions/map_actions.test.js b/x-pack/plugins/maps/public/actions/map_actions.test.js index 50e583f00ae81..58621b0a70e04 100644 --- a/x-pack/plugins/maps/public/actions/map_actions.test.js +++ b/x-pack/plugins/maps/public/actions/map_actions.test.js @@ -289,7 +289,7 @@ describe('map_actions', () => { type: 'SET_QUERY', }, ], - [undefined], // dispatch(syncDataForAllLayers()); + [undefined], // dispatch(syncDataForAllLayers()); ]); }); diff --git a/x-pack/plugins/maps/public/actions/map_actions.ts b/x-pack/plugins/maps/public/actions/map_actions.ts index 09491e5c3a7b3..4efdd3dda344e 100644 --- a/x-pack/plugins/maps/public/actions/map_actions.ts +++ b/x-pack/plugins/maps/public/actions/map_actions.ts @@ -4,7 +4,8 @@ * you may not use this file except in compliance with the Elastic License. */ import _ from 'lodash'; -import { Dispatch } from 'redux'; +import { AnyAction, Dispatch } from 'redux'; +import { ThunkDispatch } from 'redux-thunk'; import turfBboxPolygon from '@turf/bbox-polygon'; import turfBooleanContains from '@turf/boolean-contains'; @@ -90,7 +91,10 @@ export function updateMapSetting( } export function mapReady() { - return (dispatch: Dispatch, getState: () => MapStoreState) => { + return ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { dispatch({ type: MAP_READY, }); @@ -102,12 +106,12 @@ export function mapReady() { if (getMapSettings(getState()).initialLocation === INITIAL_LOCATION.AUTO_FIT_TO_BOUNDS) { waitingForMapReadyLayerList.forEach((layerDescriptor) => { - dispatch(addLayerWithoutDataSync(layerDescriptor)); + dispatch(addLayerWithoutDataSync(layerDescriptor)); }); - dispatch(autoFitToBounds()); + dispatch(autoFitToBounds()); } else { waitingForMapReadyLayerList.forEach((layerDescriptor) => { - dispatch(addLayer(layerDescriptor)); + dispatch(addLayer(layerDescriptor)); }); } }; @@ -120,7 +124,10 @@ export function mapDestroyed() { } export function mapExtentChanged(newMapConstants: { zoom: number; extent: MapExtent }) { - return async (dispatch: Dispatch, getState: () => MapStoreState) => { + return async ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const state = getState(); const dataFilters = getDataFilters(state); const { extent, zoom: newZoom } = newMapConstants; @@ -157,7 +164,7 @@ export function mapExtentChanged(newMapConstants: { zoom: number; extent: MapExt ...newMapConstants, }, }); - await dispatch(syncDataForAllLayers()); + await dispatch(syncDataForAllLayers()); }; } @@ -212,7 +219,10 @@ export function setQuery({ timeFilters?: TimeRange; forceRefresh?: boolean; }) { - return async (dispatch: Dispatch, getState: () => MapStoreState) => { + return async ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const prevQuery = getQuery(getState()); const prevTriggeredAt = prevQuery && prevQuery.queryLastTriggeredAt @@ -246,9 +256,9 @@ export function setQuery({ }); if (getMapSettings(getState()).autoFitToDataBounds) { - dispatch(autoFitToBounds()); + dispatch(autoFitToBounds()); } else { - await dispatch(syncDataForAllLayers()); + await dispatch(syncDataForAllLayers()); } }; } @@ -262,12 +272,12 @@ export function setRefreshConfig({ isPaused, interval }: MapRefreshConfig) { } export function triggerRefreshTimer() { - return async (dispatch: Dispatch) => { + return async (dispatch: ThunkDispatch) => { dispatch({ type: TRIGGER_REFRESH_TIMER, }); - await dispatch(syncDataForAllLayers()); + await dispatch(syncDataForAllLayers()); }; } diff --git a/x-pack/plugins/maps/public/actions/ui_actions.ts b/x-pack/plugins/maps/public/actions/ui_actions.ts index 8f2650beb012d..b120b69f9215d 100644 --- a/x-pack/plugins/maps/public/actions/ui_actions.ts +++ b/x-pack/plugins/maps/public/actions/ui_actions.ts @@ -4,7 +4,8 @@ * you may not use this file except in compliance with the Elastic License. */ -import { Dispatch } from 'redux'; +import { AnyAction } from 'redux'; +import { ThunkDispatch } from 'redux-thunk'; import { MapStoreState } from '../reducers/store'; import { getFlyoutDisplay } from '../selectors/ui_selectors'; import { FLYOUT_STATE } from '../reducers/ui'; @@ -35,12 +36,15 @@ export function updateFlyout(display: FLYOUT_STATE) { }; } export function openMapSettings() { - return (dispatch: Dispatch, getState: () => MapStoreState) => { + return ( + dispatch: ThunkDispatch, + getState: () => MapStoreState + ) => { const flyoutDisplay = getFlyoutDisplay(getState()); if (flyoutDisplay === FLYOUT_STATE.MAP_SETTINGS_PANEL) { return; } - dispatch(setSelectedLayer(null)); + dispatch(setSelectedLayer(null)); dispatch(trackMapSettings()); dispatch(updateFlyout(FLYOUT_STATE.MAP_SETTINGS_PANEL)); }; diff --git a/x-pack/plugins/maps/public/classes/layers/choropleth_layer_wizard/layer_template.tsx b/x-pack/plugins/maps/public/classes/layers/choropleth_layer_wizard/layer_template.tsx index 72618781902d2..9f936bdfde266 100644 --- a/x-pack/plugins/maps/public/classes/layers/choropleth_layer_wizard/layer_template.tsx +++ b/x-pack/plugins/maps/public/classes/layers/choropleth_layer_wizard/layer_template.tsx @@ -60,7 +60,7 @@ interface State { leftGeoField: string | null; leftEmsJoinField: string | null; leftElasticsearchJoinField: string | null; - rightIndexPatternId: string | null; + rightIndexPatternId: string; rightIndexPatternTitle: string | null; rightTermsFields: IFieldType[]; rightJoinField: string | null; @@ -79,7 +79,7 @@ export class LayerTemplate extends Component { leftGeoField: null, leftEmsJoinField: null, leftElasticsearchJoinField: null, - rightIndexPatternId: null, + rightIndexPatternId: '', rightIndexPatternTitle: null, rightTermsFields: [], rightJoinField: null, @@ -201,7 +201,7 @@ export class LayerTemplate extends Component { this.setState({ leftEmsJoinField: selectedOptions[0].value! }, this._previewLayer); }; - _onRightIndexPatternChange = (indexPatternId: string) => { + _onRightIndexPatternChange = (indexPatternId?: string) => { if (!indexPatternId) { return; } @@ -254,14 +254,14 @@ export class LayerTemplate extends Component { leftIndexPatternId: this.state.leftIndexPattern!.id, leftGeoField: this.state.leftGeoField!, leftJoinField: this.state.leftElasticsearchJoinField!, - rightIndexPatternId: this.state.rightIndexPatternId!, + rightIndexPatternId: this.state.rightIndexPatternId, rightIndexPatternTitle: this.state.rightIndexPatternTitle!, rightTermField: this.state.rightJoinField!, }) : createEmsChoroplethLayerDescriptor({ leftEmsFileId: this.state.leftEmsFileId!, leftEmsField: this.state.leftEmsJoinField!, - rightIndexPatternId: this.state.rightIndexPatternId!, + rightIndexPatternId: this.state.rightIndexPatternId, rightIndexPatternTitle: this.state.rightIndexPatternTitle!, rightTermField: this.state.rightJoinField!, }); diff --git a/x-pack/plugins/maps/public/components/geo_index_pattern_select.tsx b/x-pack/plugins/maps/public/components/geo_index_pattern_select.tsx index ae23d9d97de86..2e750e0648e53 100644 --- a/x-pack/plugins/maps/public/components/geo_index_pattern_select.tsx +++ b/x-pack/plugins/maps/public/components/geo_index_pattern_select.tsx @@ -40,7 +40,7 @@ export class GeoIndexPatternSelect extends Component { this._isMounted = true; } - _onIndexPatternSelect = async (indexPatternId: string) => { + _onIndexPatternSelect = async (indexPatternId?: string) => { if (!indexPatternId || indexPatternId.length === 0) { return; } @@ -123,7 +123,7 @@ export class GeoIndexPatternSelect extends Component { > ) { +function mapDispatchToProps(dispatch: ThunkDispatch) { return { addPreviewLayers: (layerDescriptors: LayerDescriptor[]) => { - dispatch(addPreviewLayers(layerDescriptors)); + dispatch(addPreviewLayers(layerDescriptors)); }, promotePreviewLayers: () => { - dispatch(setFirstPreviewLayerToSelectedLayer()); + dispatch(setFirstPreviewLayerToSelectedLayer()); dispatch(updateFlyout(FLYOUT_STATE.LAYER_PANEL)); - dispatch(promotePreviewLayers()); + dispatch(promotePreviewLayers()); }, closeFlyout: () => { dispatch(updateFlyout(FLYOUT_STATE.NONE)); - dispatch(removePreviewLayers()); + dispatch(removePreviewLayers()); }, }; } diff --git a/x-pack/plugins/maps/public/connected_components/layer_panel/join_editor/index.tsx b/x-pack/plugins/maps/public/connected_components/layer_panel/join_editor/index.tsx index 0348b38351971..b813dc55cdec9 100644 --- a/x-pack/plugins/maps/public/connected_components/layer_panel/join_editor/index.tsx +++ b/x-pack/plugins/maps/public/connected_components/layer_panel/join_editor/index.tsx @@ -4,7 +4,8 @@ * you may not use this file except in compliance with the Elastic License. */ -import { AnyAction, Dispatch } from 'redux'; +import { AnyAction } from 'redux'; +import { ThunkDispatch } from 'redux-thunk'; import { connect } from 'react-redux'; import { JoinEditor } from './join_editor'; import { getSelectedLayerJoinDescriptors } from '../../../selectors/map_selectors'; @@ -19,10 +20,10 @@ function mapStateToProps(state: MapStoreState) { }; } -function mapDispatchToProps(dispatch: Dispatch) { +function mapDispatchToProps(dispatch: ThunkDispatch) { return { onChange: (layer: ILayer, joins: JoinDescriptor[]) => { - dispatch(setJoinsForLayer(layer, joins)); + dispatch(setJoinsForLayer(layer, joins)); }, }; } diff --git a/x-pack/plugins/maps/public/connected_components/map_container/index.ts b/x-pack/plugins/maps/public/connected_components/map_container/index.ts index c3b49f1e807eb..c4b5cc51fb210 100644 --- a/x-pack/plugins/maps/public/connected_components/map_container/index.ts +++ b/x-pack/plugins/maps/public/connected_components/map_container/index.ts @@ -4,7 +4,8 @@ * you may not use this file except in compliance with the Elastic License. */ -import { AnyAction, Dispatch } from 'redux'; +import { AnyAction } from 'redux'; +import { ThunkDispatch } from 'redux-thunk'; import { connect } from 'react-redux'; import { MapContainer } from './map_container'; import { getFlyoutDisplay, getIsFullScreen } from '../../selectors/ui_selectors'; @@ -31,14 +32,14 @@ function mapStateToProps(state: MapStoreState) { }; } -function mapDispatchToProps(dispatch: Dispatch) { +function mapDispatchToProps(dispatch: ThunkDispatch) { return { - triggerRefreshTimer: () => dispatch(triggerRefreshTimer()), + triggerRefreshTimer: () => dispatch(triggerRefreshTimer()), exitFullScreen: () => { dispatch(exitFullScreen()); getCoreChrome().setIsVisible(true); }, - cancelAllInFlightRequests: () => dispatch(cancelAllInFlightRequests()), + cancelAllInFlightRequests: () => dispatch(cancelAllInFlightRequests()), }; } diff --git a/x-pack/plugins/maps/public/connected_components/toolbar_overlay/fit_to_data/index.ts b/x-pack/plugins/maps/public/connected_components/toolbar_overlay/fit_to_data/index.ts index 8790f6f35c574..1f28673b5e24f 100644 --- a/x-pack/plugins/maps/public/connected_components/toolbar_overlay/fit_to_data/index.ts +++ b/x-pack/plugins/maps/public/connected_components/toolbar_overlay/fit_to_data/index.ts @@ -4,7 +4,8 @@ * you may not use this file except in compliance with the Elastic License. */ -import { AnyAction, Dispatch } from 'redux'; +import { AnyAction } from 'redux'; +import { ThunkDispatch } from 'redux-thunk'; import { connect } from 'react-redux'; import { MapStoreState } from '../../../reducers/store'; import { fitToDataBounds } from '../../../actions'; @@ -17,10 +18,10 @@ function mapStateToProps(state: MapStoreState) { }; } -function mapDispatchToProps(dispatch: Dispatch) { +function mapDispatchToProps(dispatch: ThunkDispatch) { return { fitToBounds: () => { - dispatch(fitToDataBounds()); + dispatch(fitToDataBounds()); }, }; } diff --git a/x-pack/plugins/maps/public/connected_components/toolbar_overlay/tools_control/index.ts b/x-pack/plugins/maps/public/connected_components/toolbar_overlay/tools_control/index.ts index 70101f1ce6eba..a04314206aeb3 100644 --- a/x-pack/plugins/maps/public/connected_components/toolbar_overlay/tools_control/index.ts +++ b/x-pack/plugins/maps/public/connected_components/toolbar_overlay/tools_control/index.ts @@ -4,7 +4,8 @@ * you may not use this file except in compliance with the Elastic License. */ -import { AnyAction, Dispatch } from 'redux'; +import { AnyAction } from 'redux'; +import { ThunkDispatch } from 'redux-thunk'; import { connect } from 'react-redux'; import { ToolsControl } from './tools_control'; import { isDrawingFilter } from '../../../selectors/map_selectors'; @@ -18,13 +19,13 @@ function mapStateToProps(state: MapStoreState) { }; } -function mapDispatchToProps(dispatch: Dispatch) { +function mapDispatchToProps(dispatch: ThunkDispatch) { return { initiateDraw: (drawState: DrawState) => { - dispatch(updateDrawState(drawState)); + dispatch(updateDrawState(drawState)); }, cancelDraw: () => { - dispatch(updateDrawState(null)); + dispatch(updateDrawState(null)); }, }; } diff --git a/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/index.ts b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/index.ts index 17a6dbf02b878..d8d43e1e1b27a 100644 --- a/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/index.ts +++ b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/index.ts @@ -4,7 +4,8 @@ * you may not use this file except in compliance with the Elastic License. */ -import { AnyAction, Dispatch } from 'redux'; +import { AnyAction } from 'redux'; +import { ThunkDispatch } from 'redux-thunk'; import { connect } from 'react-redux'; import { MapStoreState } from '../../../../../../reducers/store'; import { @@ -25,19 +26,19 @@ function mapStateToProps(state: MapStoreState) { }; } -function mapDispatchToProps(dispatch: Dispatch) { +function mapDispatchToProps(dispatch: ThunkDispatch) { return { cloneLayer: (layerId: string) => { - dispatch(cloneLayer(layerId)); + dispatch(cloneLayer(layerId)); }, fitToBounds: (layerId: string) => { - dispatch(fitToLayerExtent(layerId)); + dispatch(fitToLayerExtent(layerId)); }, removeLayer: (layerId: string) => { - dispatch(removeLayer(layerId)); + dispatch(removeLayer(layerId)); }, toggleVisible: (layerId: string) => { - dispatch(toggleLayerVisible(layerId)); + dispatch(toggleLayerVisible(layerId)); }, }; } diff --git a/x-pack/plugins/maps/public/kibana_services.ts b/x-pack/plugins/maps/public/kibana_services.ts index b520e0cb2df01..5de018a4b59be 100644 --- a/x-pack/plugins/maps/public/kibana_services.ts +++ b/x-pack/plugins/maps/public/kibana_services.ts @@ -28,7 +28,7 @@ export const getFileUploadComponent = async () => { }; export const getUiSettings = () => coreStart.uiSettings; export const getIsDarkMode = () => getUiSettings().get('theme:darkMode', false); -export const getIndexPatternSelectComponent = (): any => pluginsStart.data.ui.IndexPatternSelect; +export const getIndexPatternSelectComponent = () => pluginsStart.data.ui.IndexPatternSelect; export const getHttp = () => coreStart.http; export const getTimeFilter = () => pluginsStart.data.query.timefilter.timefilter; export const getToasts = () => coreStart.notifications.toasts;