From 701581f8182b2870cdd3d393bca03c420b07830b Mon Sep 17 00:00:00 2001 From: Nathan Reese Date: Tue, 8 Sep 2020 18:36:07 -0600 Subject: [PATCH] Convert map client routing files to TS (#76387) (#76991) * Converted maps_router and store operations files * Converted files in map routes to typescript * Removed an unwanted ts-expect-error * Fixed the lint errors from jenkins * Naming changes, type for mapStateJSON etc. * More type fixes in map routes * More type fixes in map routes * Added back some removed props * Added types to app state manager * Autogenerated api documentation * Type fixes Co-authored-by: Elastic Machine Co-authored-by: Shamin Meerankutty <8272719+shamin@users.noreply.github.com> Co-authored-by: Elastic Machine --- .../kibana-plugin-plugins-data-public.md | 1 + ...data-public.querystatechange.appfilters.md | 11 ++ ...a-public.querystatechange.globalfilters.md | 11 ++ ...in-plugins-data-public.querystatechange.md | 19 +++ ...na-plugin-plugins-data-public.searchbar.md | 4 +- src/plugins/data/public/index.ts | 1 + src/plugins/data/public/public.api.md | 15 +- .../public/top_nav_menu/top_nav_menu.tsx | 65 ++++---- .../maps/public/lazy_load_bundle/index.ts | 6 +- .../public/lazy_load_bundle/lazy/index.ts | 2 - x-pack/plugins/maps/public/plugin.ts | 1 - .../routing/bootstrap/get_initial_layers.d.ts | 12 -- ...nitial_layers.js => get_initial_layers.ts} | 11 +- ..._initial_query.js => get_initial_query.ts} | 9 +- ...onfig.js => get_initial_refresh_config.ts} | 9 +- ...filters.js => get_initial_time_filters.ts} | 9 +- ...ader.js => gis_map_saved_object_loader.ts} | 0 .../bootstrap/services/saved_gis_map.ts | 1 - .../{maps_router.js => maps_router.tsx} | 29 +++- ...and_render.js => load_list_and_render.tsx} | 5 +- .../{maps_list_view.js => maps_list_view.tsx} | 80 ++++++---- .../routes/maps_app/get_breadcrumbs.tsx | 3 +- .../routes/maps_app/{index.js => index.ts} | 39 +++-- ..._and_render.js => load_map_and_render.tsx} | 28 +++- .../{maps_app_view.js => maps_app_view.tsx} | 146 ++++++++++++++---- .../routes/maps_app/top_nav_config.tsx | 1 - ..._state_manager.js => app_state_manager.ts} | 23 ++- .../{app_sync.js => app_sync.ts} | 10 +- .../routing/state_syncing/global_sync.ts | 17 +- ...tore_operations.js => store_operations.ts} | 0 30 files changed, 407 insertions(+), 161 deletions(-) create mode 100644 docs/development/plugins/data/public/kibana-plugin-plugins-data-public.querystatechange.appfilters.md create mode 100644 docs/development/plugins/data/public/kibana-plugin-plugins-data-public.querystatechange.globalfilters.md create mode 100644 docs/development/plugins/data/public/kibana-plugin-plugins-data-public.querystatechange.md delete mode 100644 x-pack/plugins/maps/public/routing/bootstrap/get_initial_layers.d.ts rename x-pack/plugins/maps/public/routing/bootstrap/{get_initial_layers.js => get_initial_layers.ts} (87%) rename x-pack/plugins/maps/public/routing/bootstrap/{get_initial_query.js => get_initial_query.ts} (73%) rename x-pack/plugins/maps/public/routing/bootstrap/{get_initial_refresh_config.js => get_initial_refresh_config.ts} (81%) rename x-pack/plugins/maps/public/routing/bootstrap/{get_initial_time_filters.js => get_initial_time_filters.ts} (75%) rename x-pack/plugins/maps/public/routing/bootstrap/services/{gis_map_saved_object_loader.js => gis_map_saved_object_loader.ts} (100%) rename x-pack/plugins/maps/public/routing/{maps_router.js => maps_router.tsx} (80%) rename x-pack/plugins/maps/public/routing/routes/list/{load_list_and_render.js => load_list_and_render.tsx} (98%) rename x-pack/plugins/maps/public/routing/routes/list/{maps_list_view.js => maps_list_view.tsx} (88%) rename x-pack/plugins/maps/public/routing/routes/maps_app/{index.js => index.ts} (62%) rename x-pack/plugins/maps/public/routing/routes/maps_app/{load_map_and_render.js => load_map_and_render.tsx} (75%) rename x-pack/plugins/maps/public/routing/routes/maps_app/{maps_app_view.js => maps_app_view.tsx} (73%) rename x-pack/plugins/maps/public/routing/state_syncing/{app_state_manager.js => app_state_manager.ts} (58%) rename x-pack/plugins/maps/public/routing/state_syncing/{app_sync.js => app_sync.ts} (88%) rename x-pack/plugins/maps/public/routing/{store_operations.js => store_operations.ts} (100%) diff --git a/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.md b/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.md index b651480a85899..0c493ca492953 100644 --- a/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.md +++ b/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.md @@ -69,6 +69,7 @@ | [OptionedValueProp](./kibana-plugin-plugins-data-public.optionedvalueprop.md) | | | [Query](./kibana-plugin-plugins-data-public.query.md) | | | [QueryState](./kibana-plugin-plugins-data-public.querystate.md) | All query state service state | +| [QueryStateChange](./kibana-plugin-plugins-data-public.querystatechange.md) | | | [QuerySuggestionBasic](./kibana-plugin-plugins-data-public.querysuggestionbasic.md) | \* | | [QuerySuggestionField](./kibana-plugin-plugins-data-public.querysuggestionfield.md) | \* | | [QuerySuggestionGetFnArgs](./kibana-plugin-plugins-data-public.querysuggestiongetfnargs.md) | \* | diff --git a/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.querystatechange.appfilters.md b/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.querystatechange.appfilters.md new file mode 100644 index 0000000000000..b358e9477e515 --- /dev/null +++ b/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.querystatechange.appfilters.md @@ -0,0 +1,11 @@ + + +[Home](./index.md) > [kibana-plugin-plugins-data-public](./kibana-plugin-plugins-data-public.md) > [QueryStateChange](./kibana-plugin-plugins-data-public.querystatechange.md) > [appFilters](./kibana-plugin-plugins-data-public.querystatechange.appfilters.md) + +## QueryStateChange.appFilters property + +Signature: + +```typescript +appFilters?: boolean; +``` diff --git a/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.querystatechange.globalfilters.md b/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.querystatechange.globalfilters.md new file mode 100644 index 0000000000000..c395f169c35a5 --- /dev/null +++ b/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.querystatechange.globalfilters.md @@ -0,0 +1,11 @@ + + +[Home](./index.md) > [kibana-plugin-plugins-data-public](./kibana-plugin-plugins-data-public.md) > [QueryStateChange](./kibana-plugin-plugins-data-public.querystatechange.md) > [globalFilters](./kibana-plugin-plugins-data-public.querystatechange.globalfilters.md) + +## QueryStateChange.globalFilters property + +Signature: + +```typescript +globalFilters?: boolean; +``` diff --git a/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.querystatechange.md b/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.querystatechange.md new file mode 100644 index 0000000000000..71fb211da11d2 --- /dev/null +++ b/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.querystatechange.md @@ -0,0 +1,19 @@ + + +[Home](./index.md) > [kibana-plugin-plugins-data-public](./kibana-plugin-plugins-data-public.md) > [QueryStateChange](./kibana-plugin-plugins-data-public.querystatechange.md) + +## QueryStateChange interface + +Signature: + +```typescript +export interface QueryStateChange extends QueryStateChangePartial +``` + +## Properties + +| Property | Type | Description | +| --- | --- | --- | +| [appFilters](./kibana-plugin-plugins-data-public.querystatechange.appfilters.md) | boolean | | +| [globalFilters](./kibana-plugin-plugins-data-public.querystatechange.globalfilters.md) | boolean | | + diff --git a/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.searchbar.md b/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.searchbar.md index 498691c06285d..d1d20291a6799 100644 --- a/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.searchbar.md +++ b/docs/development/plugins/data/public/kibana-plugin-plugins-data-public.searchbar.md @@ -7,7 +7,7 @@ Signature: ```typescript -SearchBar: React.ComponentClass, "query" | "isLoading" | "filters" | "onRefresh" | "onRefreshChange" | "refreshInterval" | "indexPatterns" | "dataTestSubj" | "customSubmitButton" | "screenTitle" | "showQueryBar" | "showQueryInput" | "showFilterBar" | "showDatePicker" | "showAutoRefreshOnly" | "isRefreshPaused" | "dateRangeFrom" | "dateRangeTo" | "showSaveQuery" | "savedQuery" | "onQueryChange" | "onQuerySubmit" | "onSaved" | "onSavedQueryUpdated" | "onClearSavedQuery" | "indicateNoData" | "timeHistory" | "onFiltersUpdated">, any> & { - WrappedComponent: React.ComponentType & ReactIntl.InjectedIntlProps>; +SearchBar: React.ComponentClass, "query" | "isLoading" | "filters" | "onRefresh" | "onRefreshChange" | "refreshInterval" | "indexPatterns" | "dataTestSubj" | "timeHistory" | "customSubmitButton" | "screenTitle" | "showQueryBar" | "showQueryInput" | "showFilterBar" | "showDatePicker" | "showAutoRefreshOnly" | "isRefreshPaused" | "dateRangeFrom" | "dateRangeTo" | "showSaveQuery" | "savedQuery" | "onQueryChange" | "onQuerySubmit" | "onSaved" | "onSavedQueryUpdated" | "onClearSavedQuery" | "indicateNoData" | "onFiltersUpdated">, any> & { + WrappedComponent: React.ComponentType & ReactIntl.InjectedIntlProps>; } ``` diff --git a/src/plugins/data/public/index.ts b/src/plugins/data/public/index.ts index f7b4111df5172..553ee6bde5f2d 100644 --- a/src/plugins/data/public/index.ts +++ b/src/plugins/data/public/index.ts @@ -429,6 +429,7 @@ export { TimeHistory, TimefilterContract, TimeHistoryContract, + QueryStateChange, } from './query'; export { diff --git a/src/plugins/data/public/public.api.md b/src/plugins/data/public/public.api.md index 0af6c95679de3..88f401ea97bb2 100644 --- a/src/plugins/data/public/public.api.md +++ b/src/plugins/data/public/public.api.md @@ -1473,6 +1473,17 @@ export interface QueryState { time?: TimeRange; } +// Warning: (ae-forgotten-export) The symbol "QueryStateChangePartial" needs to be exported by the entry point index.d.ts +// Warning: (ae-missing-release-tag) "QueryStateChange" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) +// +// @public (undocumented) +export interface QueryStateChange extends QueryStateChangePartial { + // (undocumented) + appFilters?: boolean; + // (undocumented) + globalFilters?: boolean; +} + // Warning: (ae-forgotten-export) The symbol "Props" needs to be exported by the entry point index.d.ts // Warning: (ae-missing-release-tag) "QueryStringInput" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // @@ -1690,8 +1701,8 @@ export const search: { // Warning: (ae-missing-release-tag) "SearchBar" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // // @public (undocumented) -export const SearchBar: React.ComponentClass, "query" | "isLoading" | "filters" | "onRefresh" | "onRefreshChange" | "refreshInterval" | "indexPatterns" | "dataTestSubj" | "customSubmitButton" | "screenTitle" | "showQueryBar" | "showQueryInput" | "showFilterBar" | "showDatePicker" | "showAutoRefreshOnly" | "isRefreshPaused" | "dateRangeFrom" | "dateRangeTo" | "showSaveQuery" | "savedQuery" | "onQueryChange" | "onQuerySubmit" | "onSaved" | "onSavedQueryUpdated" | "onClearSavedQuery" | "indicateNoData" | "timeHistory" | "onFiltersUpdated">, any> & { - WrappedComponent: React.ComponentType & ReactIntl.InjectedIntlProps>; +export const SearchBar: React.ComponentClass, "query" | "isLoading" | "filters" | "onRefresh" | "onRefreshChange" | "refreshInterval" | "indexPatterns" | "dataTestSubj" | "timeHistory" | "customSubmitButton" | "screenTitle" | "showQueryBar" | "showQueryInput" | "showFilterBar" | "showDatePicker" | "showAutoRefreshOnly" | "isRefreshPaused" | "dateRangeFrom" | "dateRangeTo" | "showSaveQuery" | "savedQuery" | "onQueryChange" | "onQuerySubmit" | "onSaved" | "onSavedQueryUpdated" | "onClearSavedQuery" | "indicateNoData" | "onFiltersUpdated">, any> & { + WrappedComponent: React.ComponentType & ReactIntl.InjectedIntlProps>; }; // Warning: (ae-forgotten-export) The symbol "SearchBarOwnProps" needs to be exported by the entry point index.d.ts diff --git a/src/plugins/navigation/public/top_nav_menu/top_nav_menu.tsx b/src/plugins/navigation/public/top_nav_menu/top_nav_menu.tsx index a1a40b49cc8f0..b284c60bac5de 100644 --- a/src/plugins/navigation/public/top_nav_menu/top_nav_menu.tsx +++ b/src/plugins/navigation/public/top_nav_menu/top_nav_menu.tsx @@ -23,39 +23,44 @@ import classNames from 'classnames'; import { MountPoint } from '../../../../core/public'; import { MountPointPortal } from '../../../kibana_react/public'; -import { StatefulSearchBarProps, DataPublicPluginStart } from '../../../data/public'; +import { + StatefulSearchBarProps, + DataPublicPluginStart, + SearchBarProps, +} from '../../../data/public'; import { TopNavMenuData } from './top_nav_menu_data'; import { TopNavMenuItem } from './top_nav_menu_item'; -export type TopNavMenuProps = StatefulSearchBarProps & { - config?: TopNavMenuData[]; - showSearchBar?: boolean; - showQueryBar?: boolean; - showQueryInput?: boolean; - showDatePicker?: boolean; - showFilterBar?: boolean; - data?: DataPublicPluginStart; - className?: string; - /** - * If provided, the menu part of the component will be rendered as a portal inside the given mount point. - * - * This is meant to be used with the `setHeaderActionMenu` core API. - * - * @example - * ```ts - * export renderApp = ({ element, history, setHeaderActionMenu }: AppMountParameters) => { - * const topNavConfig = ...; // TopNavMenuProps - * return ( - * - * - * - * - * ) - * } - * ``` - */ - setMenuMountPoint?: (menuMount: MountPoint | undefined) => void; -}; +export type TopNavMenuProps = StatefulSearchBarProps & + Omit & { + config?: TopNavMenuData[]; + showSearchBar?: boolean; + showQueryBar?: boolean; + showQueryInput?: boolean; + showDatePicker?: boolean; + showFilterBar?: boolean; + data?: DataPublicPluginStart; + className?: string; + /** + * If provided, the menu part of the component will be rendered as a portal inside the given mount point. + * + * This is meant to be used with the `setHeaderActionMenu` core API. + * + * @example + * ```ts + * export renderApp = ({ element, history, setHeaderActionMenu }: AppMountParameters) => { + * const topNavConfig = ...; // TopNavMenuProps + * return ( + * + * + * + * + * ) + * } + * ``` + */ + setMenuMountPoint?: (menuMount: MountPoint | undefined) => void; + }; /* * Top Nav Menu is a convenience wrapper component for: diff --git a/x-pack/plugins/maps/public/lazy_load_bundle/index.ts b/x-pack/plugins/maps/public/lazy_load_bundle/index.ts index 5f2a640aa9d0f..03752a1c3e11e 100644 --- a/x-pack/plugins/maps/public/lazy_load_bundle/index.ts +++ b/x-pack/plugins/maps/public/lazy_load_bundle/index.ts @@ -7,7 +7,7 @@ import { AnyAction } from 'redux'; // eslint-disable-next-line @kbn/eslint/no-restricted-paths import { IndexPatternsContract } from 'src/plugins/data/public/index_patterns'; -import { ReactElement } from 'react'; +import { AppMountContext, AppMountParameters } from 'kibana/public'; import { IndexPattern } from 'src/plugins/data/public'; import { Embeddable, IContainer } from '../../../../../src/plugins/embeddable/public'; import { LayerDescriptor } from '../../common/descriptor_types'; @@ -40,7 +40,7 @@ interface LazyLoadedMapModules { initialLayers?: LayerDescriptor[] ) => LayerDescriptor[]; mergeInputWithSavedMap: any; - renderApp: (context: unknown, params: unknown) => ReactElement; + renderApp: (context: AppMountContext, params: AppMountParameters) => Promise<() => void>; createSecurityLayerDescriptors: ( indexPatternId: string, indexPatternTitle: string @@ -57,7 +57,6 @@ export async function lazyLoadMapModules(): Promise { loadModulesPromise = new Promise(async (resolve) => { const { - // @ts-expect-error getMapsSavedObjectLoader, getQueryableUniqueIndexPatternIds, MapEmbeddable, @@ -68,7 +67,6 @@ export async function lazyLoadMapModules(): Promise { addLayerWithoutDataSync, getInitialLayers, mergeInputWithSavedMap, - // @ts-expect-error renderApp, createSecurityLayerDescriptors, registerLayerWizard, diff --git a/x-pack/plugins/maps/public/lazy_load_bundle/lazy/index.ts b/x-pack/plugins/maps/public/lazy_load_bundle/lazy/index.ts index e55160383a8f3..28f5acdc17656 100644 --- a/x-pack/plugins/maps/public/lazy_load_bundle/lazy/index.ts +++ b/x-pack/plugins/maps/public/lazy_load_bundle/lazy/index.ts @@ -7,7 +7,6 @@ // These are map-dependencies of the embeddable. // By lazy-loading these, the Maps-app can register the embeddable when the plugin mounts, without actually pulling all the code. -// @ts-expect-error export * from '../../routing/bootstrap/services/gis_map_saved_object_loader'; export * from '../../embeddable/map_embeddable'; export * from '../../kibana_services'; @@ -16,7 +15,6 @@ export * from '../../actions'; export * from '../../selectors/map_selectors'; export * from '../../routing/bootstrap/get_initial_layers'; export * from '../../embeddable/merge_input_with_saved_map'; -// @ts-expect-error export * from '../../routing/maps_router'; export * from '../../classes/layers/solution_layers/security'; export { registerLayerWizard } from '../../classes/layers/layer_wizard_registry'; diff --git a/x-pack/plugins/maps/public/plugin.ts b/x-pack/plugins/maps/public/plugin.ts index b08135b4e486c..00ee7f376efc6 100644 --- a/x-pack/plugins/maps/public/plugin.ts +++ b/x-pack/plugins/maps/public/plugin.ts @@ -123,7 +123,6 @@ export class MapsPlugin icon: `plugins/${APP_ID}/icon.svg`, euiIconType: APP_ICON, category: DEFAULT_APP_CATEGORIES.kibana, - // @ts-expect-error async mount(context, params) { const { renderApp } = await lazyLoadMapModules(); return renderApp(context, params); diff --git a/x-pack/plugins/maps/public/routing/bootstrap/get_initial_layers.d.ts b/x-pack/plugins/maps/public/routing/bootstrap/get_initial_layers.d.ts deleted file mode 100644 index a23e715a08295..0000000000000 --- a/x-pack/plugins/maps/public/routing/bootstrap/get_initial_layers.d.ts +++ /dev/null @@ -1,12 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License; - * you may not use this file except in compliance with the Elastic License. - */ - -import { LayerDescriptor } from '../../../common/descriptor_types'; - -export function getInitialLayers( - layerListJSON?: string, - initialLayers?: LayerDescriptor[] -): LayerDescriptor[]; diff --git a/x-pack/plugins/maps/public/routing/bootstrap/get_initial_layers.js b/x-pack/plugins/maps/public/routing/bootstrap/get_initial_layers.ts similarity index 87% rename from x-pack/plugins/maps/public/routing/bootstrap/get_initial_layers.js rename to x-pack/plugins/maps/public/routing/bootstrap/get_initial_layers.ts index b47f83d5a6664..e828dc88409cb 100644 --- a/x-pack/plugins/maps/public/routing/bootstrap/get_initial_layers.js +++ b/x-pack/plugins/maps/public/routing/bootstrap/get_initial_layers.ts @@ -15,15 +15,19 @@ import '../../classes/sources/es_pew_pew_source'; import '../../classes/sources/kibana_regionmap_source'; import '../../classes/sources/es_geo_grid_source'; import '../../classes/sources/xyz_tms_source'; +import { LayerDescriptor } from '../../../common/descriptor_types'; +// @ts-expect-error import { KibanaTilemapSource } from '../../classes/sources/kibana_tilemap_source'; import { TileLayer } from '../../classes/layers/tile_layer/tile_layer'; +// @ts-expect-error import { EMSTMSSource } from '../../classes/sources/ems_tms_source'; +// @ts-expect-error import { VectorTileLayer } from '../../classes/layers/vector_tile_layer/vector_tile_layer'; import { getIsEmsEnabled, getToasts } from '../../kibana_services'; import { INITIAL_LAYERS_KEY } from '../../../common/constants'; import { getKibanaTileMap } from '../../meta'; -export function getInitialLayers(layerListJSON, initialLayers = []) { +export function getInitialLayers(layerListJSON?: string, initialLayers: LayerDescriptor[] = []) { if (layerListJSON) { return JSON.parse(layerListJSON); } @@ -58,9 +62,10 @@ export function getInitialLayersFromUrlParam() { try { let mapInitLayers = mapAppParams.get(INITIAL_LAYERS_KEY); - if (mapInitLayers[mapInitLayers.length - 1] === '#') { - mapInitLayers = mapInitLayers.substr(0, mapInitLayers.length - 1); + if (mapInitLayers![mapInitLayers!.length - 1] === '#') { + mapInitLayers = mapInitLayers!.substr(0, mapInitLayers!.length - 1); } + // @ts-ignore return rison.decode_array(mapInitLayers); } catch (e) { getToasts().addWarning({ diff --git a/x-pack/plugins/maps/public/routing/bootstrap/get_initial_query.js b/x-pack/plugins/maps/public/routing/bootstrap/get_initial_query.ts similarity index 73% rename from x-pack/plugins/maps/public/routing/bootstrap/get_initial_query.js rename to x-pack/plugins/maps/public/routing/bootstrap/get_initial_query.ts index 1f2cf27077623..43293d152dbff 100644 --- a/x-pack/plugins/maps/public/routing/bootstrap/get_initial_query.js +++ b/x-pack/plugins/maps/public/routing/bootstrap/get_initial_query.ts @@ -5,8 +5,15 @@ */ import { getData } from '../../kibana_services'; +import { MapsAppState } from '../state_syncing/app_state_manager'; -export function getInitialQuery({ mapStateJSON, appState = {} }) { +export function getInitialQuery({ + mapStateJSON, + appState = {}, +}: { + mapStateJSON?: string; + appState: MapsAppState; +}) { if (appState.query) { return appState.query; } diff --git a/x-pack/plugins/maps/public/routing/bootstrap/get_initial_refresh_config.js b/x-pack/plugins/maps/public/routing/bootstrap/get_initial_refresh_config.ts similarity index 81% rename from x-pack/plugins/maps/public/routing/bootstrap/get_initial_refresh_config.js rename to x-pack/plugins/maps/public/routing/bootstrap/get_initial_refresh_config.ts index d7b3bbf5b4ab2..7d759cb25052f 100644 --- a/x-pack/plugins/maps/public/routing/bootstrap/get_initial_refresh_config.js +++ b/x-pack/plugins/maps/public/routing/bootstrap/get_initial_refresh_config.ts @@ -4,10 +4,17 @@ * you may not use this file except in compliance with the Elastic License. */ +import { QueryState } from 'src/plugins/data/public'; import { getUiSettings } from '../../kibana_services'; import { UI_SETTINGS } from '../../../../../../src/plugins/data/public'; -export function getInitialRefreshConfig({ mapStateJSON, globalState = {} }) { +export function getInitialRefreshConfig({ + mapStateJSON, + globalState = {}, +}: { + mapStateJSON?: string; + globalState: QueryState; +}) { const uiSettings = getUiSettings(); if (mapStateJSON) { diff --git a/x-pack/plugins/maps/public/routing/bootstrap/get_initial_time_filters.js b/x-pack/plugins/maps/public/routing/bootstrap/get_initial_time_filters.ts similarity index 75% rename from x-pack/plugins/maps/public/routing/bootstrap/get_initial_time_filters.js rename to x-pack/plugins/maps/public/routing/bootstrap/get_initial_time_filters.ts index 9c11dabe03923..549cc154fe487 100644 --- a/x-pack/plugins/maps/public/routing/bootstrap/get_initial_time_filters.js +++ b/x-pack/plugins/maps/public/routing/bootstrap/get_initial_time_filters.ts @@ -4,9 +4,16 @@ * you may not use this file except in compliance with the Elastic License. */ +import { QueryState } from 'src/plugins/data/public'; import { getUiSettings } from '../../kibana_services'; -export function getInitialTimeFilters({ mapStateJSON, globalState }) { +export function getInitialTimeFilters({ + mapStateJSON, + globalState, +}: { + mapStateJSON?: string; + globalState: QueryState; +}) { if (mapStateJSON) { const mapState = JSON.parse(mapStateJSON); if (mapState.timeFilters) { diff --git a/x-pack/plugins/maps/public/routing/bootstrap/services/gis_map_saved_object_loader.js b/x-pack/plugins/maps/public/routing/bootstrap/services/gis_map_saved_object_loader.ts similarity index 100% rename from x-pack/plugins/maps/public/routing/bootstrap/services/gis_map_saved_object_loader.js rename to x-pack/plugins/maps/public/routing/bootstrap/services/gis_map_saved_object_loader.ts diff --git a/x-pack/plugins/maps/public/routing/bootstrap/services/saved_gis_map.ts b/x-pack/plugins/maps/public/routing/bootstrap/services/saved_gis_map.ts index 6f8e7777f671b..511f015b0ff80 100644 --- a/x-pack/plugins/maps/public/routing/bootstrap/services/saved_gis_map.ts +++ b/x-pack/plugins/maps/public/routing/bootstrap/services/saved_gis_map.ts @@ -27,7 +27,6 @@ import { copyPersistentState } from '../../../reducers/util'; // @ts-expect-error import { extractReferences, injectReferences } from '../../../../common/migrations/references'; import { getExistingMapPath, MAP_SAVED_OBJECT_TYPE } from '../../../../common/constants'; -// @ts-expect-error import { getStore } from '../../store_operations'; import { MapStoreState } from '../../../reducers/store'; import { LayerDescriptor } from '../../../../common/descriptor_types'; diff --git a/x-pack/plugins/maps/public/routing/maps_router.js b/x-pack/plugins/maps/public/routing/maps_router.tsx similarity index 80% rename from x-pack/plugins/maps/public/routing/maps_router.js rename to x-pack/plugins/maps/public/routing/maps_router.tsx index f0f5234e3f989..5291d9c361161 100644 --- a/x-pack/plugins/maps/public/routing/maps_router.js +++ b/x-pack/plugins/maps/public/routing/maps_router.tsx @@ -6,8 +6,10 @@ import React from 'react'; import { render, unmountComponentAtNode } from 'react-dom'; -import { Router, Switch, Route, Redirect } from 'react-router-dom'; +import { Router, Switch, Route, Redirect, RouteComponentProps } from 'react-router-dom'; import { i18n } from '@kbn/i18n'; +import { Provider } from 'react-redux'; +import { AppMountContext, AppMountParameters } from 'kibana/public'; import { getCoreChrome, getCoreI18n, @@ -18,16 +20,19 @@ import { import { createKbnUrlStateStorage, withNotifyOnErrors, + IKbnUrlStateStorage, } from '../../../../../src/plugins/kibana_utils/public'; import { getStore } from './store_operations'; -import { Provider } from 'react-redux'; import { LoadListAndRender } from './routes/list/load_list_and_render'; import { LoadMapAndRender } from './routes/maps_app/load_map_and_render'; -export let goToSpecifiedPath; -export let kbnUrlStateStorage; +export let goToSpecifiedPath: (path: string) => void; +export let kbnUrlStateStorage: IKbnUrlStateStorage; -export async function renderApp(context, { appBasePath, element, history, onAppLeave }) { +export async function renderApp( + context: AppMountContext, + { appBasePath, element, history, onAppLeave }: AppMountParameters +) { goToSpecifiedPath = (path) => history.push(path); kbnUrlStateStorage = createKbnUrlStateStorage({ useHash: false, @@ -42,11 +47,19 @@ export async function renderApp(context, { appBasePath, element, history, onAppL }; } -const App = ({ history, appBasePath, onAppLeave }) => { +interface Props { + history: AppMountParameters['history'] | RouteComponentProps['history']; + appBasePath: AppMountParameters['appBasePath']; + onAppLeave: AppMountParameters['onAppLeave']; +} + +const App: React.FC = ({ history, appBasePath, onAppLeave }) => { const store = getStore(); const I18nContext = getCoreI18n().Context; - const stateTransfer = getEmbeddableService()?.getStateTransfer(history); + const stateTransfer = getEmbeddableService()?.getStateTransfer( + history as AppMountParameters['history'] + ); const { originatingApp } = stateTransfer?.getIncomingEditorState({ keysToRemoveAfterFetch: ['originatingApp'] }) || {}; @@ -66,7 +79,7 @@ const App = ({ history, appBasePath, onAppLeave }) => { return ( - + getMapsSavedObjectLoader().find(search, this.state.listingLimit); + _find = (search: string) => getMapsSavedObjectLoader().find(search, this.state.listingLimit); - _delete = (ids) => getMapsSavedObjectLoader().delete(ids); + _delete = (ids: string[]) => getMapsSavedObjectLoader().delete(ids); debouncedFetch = _.debounce(async (filter) => { const response = await this._find(filter); @@ -135,10 +163,10 @@ export class MapsListView extends React.Component { this.setState({ showDeleteModal: true }); }; - onTableChange = ({ page, sort = {} }) => { + onTableChange = ({ page, sort }: CriteriaWithPagination) => { const { index: pageIndex, size: pageSize } = page; - let { field: sortField, direction: sortDirection } = sort; + let { field: sortField, direction: sortDirection } = sort || {}; // 3rd sorting state that is not captured by sort - native order (no sort) // when switching from desc to asc for the same field - use native order @@ -147,8 +175,8 @@ export class MapsListView extends React.Component { this.state.sortDirection === 'desc' && sortDirection === 'asc' ) { - sortField = null; - sortDirection = null; + sortField = undefined; + sortDirection = undefined; } this.setState({ @@ -165,8 +193,8 @@ export class MapsListView extends React.Component { if (this.state.sortField) { itemsCopy.sort((a, b) => { - const fieldA = _.get(a, this.state.sortField, ''); - const fieldB = _.get(b, this.state.sortField, ''); + const fieldA = _.get(a, this.state.sortField!, ''); + const fieldB = _.get(b, this.state.sortField!, ''); let order = 1; if (this.state.sortDirection === 'desc') { order = -1; @@ -320,7 +348,7 @@ export class MapsListView extends React.Component { } renderTable() { - const tableColumns = [ + const tableColumns: Array> = [ { field: 'title', name: i18n.translate('xpack.maps.mapListing.titleFieldTitle', { @@ -329,7 +357,7 @@ export class MapsListView extends React.Component { sortable: true, render: (field, record) => ( { + onClick={(e: MouseEvent) => { e.preventDefault(); goToSpecifiedPath(`/map/${record.id}`); }} @@ -355,12 +383,12 @@ export class MapsListView extends React.Component { pageSizeOptions: [10, 20, 50], }; - let selection = false; + let selection; if (!this.state.readOnly) { selection = { - onSelectionChange: (selection) => { + onSelectionChange: (s: SelectionItem[]) => { this.setState({ - selectedIds: selection.map((item) => { + selectedIds: s.map((item) => { return item.id; }), }); @@ -368,11 +396,11 @@ export class MapsListView extends React.Component { }; } - const sorting = {}; + const sorting: EuiTableSortingType = {}; if (this.state.sortField) { sorting.sort = { field: this.state.sortField, - direction: this.state.sortDirection, + direction: this.state.sortDirection!, }; } const items = this.state.items.length === 0 ? [] : this.getPageOfItems(); diff --git a/x-pack/plugins/maps/public/routing/routes/maps_app/get_breadcrumbs.tsx b/x-pack/plugins/maps/public/routing/routes/maps_app/get_breadcrumbs.tsx index 1ccf890597edc..149c04b414c18 100644 --- a/x-pack/plugins/maps/public/routing/routes/maps_app/get_breadcrumbs.tsx +++ b/x-pack/plugins/maps/public/routing/routes/maps_app/get_breadcrumbs.tsx @@ -6,7 +6,6 @@ import { i18n } from '@kbn/i18n'; import { getNavigateToApp } from '../../../kibana_services'; -// @ts-expect-error import { goToSpecifiedPath } from '../../maps_router'; export const unsavedChangesWarning = i18n.translate( @@ -25,7 +24,7 @@ export function getBreadcrumbs({ title: string; getHasUnsavedChanges: () => boolean; originatingApp?: string; - getAppNameFromId?: (id: string) => string; + getAppNameFromId?: (id: string) => string | undefined; }) { const breadcrumbs = []; if (originatingApp && getAppNameFromId) { diff --git a/x-pack/plugins/maps/public/routing/routes/maps_app/index.js b/x-pack/plugins/maps/public/routing/routes/maps_app/index.ts similarity index 62% rename from x-pack/plugins/maps/public/routing/routes/maps_app/index.js rename to x-pack/plugins/maps/public/routing/routes/maps_app/index.ts index 326db7289e60d..812d7fcf30981 100644 --- a/x-pack/plugins/maps/public/routing/routes/maps_app/index.js +++ b/x-pack/plugins/maps/public/routing/routes/maps_app/index.ts @@ -5,6 +5,9 @@ */ import { connect } from 'react-redux'; +import { ThunkDispatch } from 'redux-thunk'; +import { AnyAction } from 'redux'; +import { Filter, Query, TimeRange } from 'src/plugins/data/public'; import { MapsAppView } from './maps_app_view'; import { getFlyoutDisplay, getIsFullScreen } from '../../../selectors/ui_selectors'; import { @@ -33,8 +36,15 @@ import { import { FLYOUT_STATE } from '../../../reducers/ui'; import { getMapsCapabilities } from '../../../kibana_services'; import { getInspectorAdapters } from '../../../reducers/non_serializable_instances'; +import { MapStoreState } from '../../../reducers/store'; +import { + MapRefreshConfig, + MapCenterAndZoom, + LayerDescriptor, +} from '../../../../common/descriptor_types'; +import { MapSettings } from '../../../reducers/map'; -function mapStateToProps(state = {}) { +function mapStateToProps(state: MapStoreState) { return { isFullScreen: getIsFullScreen(state), isOpenSettingsDisabled: getFlyoutDisplay(state) !== FLYOUT_STATE.NONE, @@ -50,9 +60,19 @@ function mapStateToProps(state = {}) { }; } -function mapDispatchToProps(dispatch) { +function mapDispatchToProps(dispatch: ThunkDispatch) { return { - dispatchSetQuery: ({ forceRefresh, filters, query, timeFilters }) => { + dispatchSetQuery: ({ + forceRefresh, + filters, + query, + timeFilters, + }: { + filters?: Filter[]; + query?: Query; + timeFilters?: TimeRange; + forceRefresh?: boolean; + }) => { dispatch( setQuery({ filters, @@ -62,12 +82,13 @@ function mapDispatchToProps(dispatch) { }) ); }, - setRefreshConfig: (refreshConfig) => dispatch(setRefreshConfig(refreshConfig)), - replaceLayerList: (layerList) => dispatch(replaceLayerList(layerList)), - setGotoWithCenter: (latLonZoom) => dispatch(setGotoWithCenter(latLonZoom)), - setMapSettings: (mapSettings) => dispatch(setMapSettings(mapSettings)), - setIsLayerTOCOpen: (isLayerTOCOpen) => dispatch(setIsLayerTOCOpen(isLayerTOCOpen)), - setOpenTOCDetails: (openTOCDetails) => dispatch(setOpenTOCDetails(openTOCDetails)), + setRefreshConfig: (refreshConfig: MapRefreshConfig) => + dispatch(setRefreshConfig(refreshConfig)), + replaceLayerList: (layerList: LayerDescriptor[]) => dispatch(replaceLayerList(layerList)), + setGotoWithCenter: (latLonZoom: MapCenterAndZoom) => dispatch(setGotoWithCenter(latLonZoom)), + setMapSettings: (mapSettings: MapSettings) => dispatch(setMapSettings(mapSettings)), + setIsLayerTOCOpen: (isLayerTOCOpen: boolean) => dispatch(setIsLayerTOCOpen(isLayerTOCOpen)), + setOpenTOCDetails: (openTOCDetails: string[]) => dispatch(setOpenTOCDetails(openTOCDetails)), clearUi: () => { dispatch(setSelectedLayer(null)); dispatch(updateFlyout(FLYOUT_STATE.NONE)); diff --git a/x-pack/plugins/maps/public/routing/routes/maps_app/load_map_and_render.js b/x-pack/plugins/maps/public/routing/routes/maps_app/load_map_and_render.tsx similarity index 75% rename from x-pack/plugins/maps/public/routing/routes/maps_app/load_map_and_render.js rename to x-pack/plugins/maps/public/routing/routes/maps_app/load_map_and_render.tsx index eebbb17582821..7ab138300dc4c 100644 --- a/x-pack/plugins/maps/public/routing/routes/maps_app/load_map_and_render.js +++ b/x-pack/plugins/maps/public/routing/routes/maps_app/load_map_and_render.tsx @@ -5,15 +5,31 @@ */ import React from 'react'; -import { MapsAppView } from '.'; -import { getMapsSavedObjectLoader } from '../../bootstrap/services/gis_map_saved_object_loader'; -import { getCoreChrome, getToasts } from '../../../kibana_services'; import { i18n } from '@kbn/i18n'; import { Redirect } from 'react-router-dom'; +import { AppMountParameters } from 'kibana/public'; +import { EmbeddableStateTransfer } from 'src/plugins/embeddable/public'; +import { getCoreChrome, getToasts } from '../../../kibana_services'; +import { getMapsSavedObjectLoader } from '../../bootstrap/services/gis_map_saved_object_loader'; +import { MapsAppView } from '.'; +import { ISavedGisMap } from '../../bootstrap/services/saved_gis_map'; + +interface Props { + savedMapId?: string; + onAppLeave: AppMountParameters['onAppLeave']; + stateTransfer: EmbeddableStateTransfer; + originatingApp?: string; +} + +interface State { + savedMap?: ISavedGisMap; + failedToLoad: boolean; +} -export const LoadMapAndRender = class extends React.Component { - state = { - savedMap: null, +export const LoadMapAndRender = class extends React.Component { + _isMounted: boolean = false; + state: State = { + savedMap: undefined, failedToLoad: false, }; diff --git a/x-pack/plugins/maps/public/routing/routes/maps_app/maps_app_view.js b/x-pack/plugins/maps/public/routing/routes/maps_app/maps_app_view.tsx similarity index 73% rename from x-pack/plugins/maps/public/routing/routes/maps_app/maps_app_view.js rename to x-pack/plugins/maps/public/routing/routes/maps_app/maps_app_view.tsx index 485b0ed7682fa..b3377547b2dd1 100644 --- a/x-pack/plugins/maps/public/routing/routes/maps_app/maps_app_view.js +++ b/x-pack/plugins/maps/public/routing/routes/maps_app/maps_app_view.tsx @@ -7,6 +7,9 @@ import React from 'react'; import 'mapbox-gl/dist/mapbox-gl.css'; import _ from 'lodash'; +import { AppLeaveAction, AppMountParameters } from 'kibana/public'; +import { EmbeddableStateTransfer, Adapters } from 'src/plugins/embeddable/public'; +import { Subscription } from 'rxjs'; import { DEFAULT_IS_LAYER_TOC_OPEN } from '../../../reducers/ui'; import { getData, @@ -23,29 +26,91 @@ import { getGlobalState, updateGlobalState, startGlobalStateSyncing, + MapsGlobalState, } from '../../state_syncing/global_sync'; import { AppStateManager } from '../../state_syncing/app_state_manager'; import { startAppStateSyncing } from '../../state_syncing/app_sync'; -import { esFilters } from '../../../../../../../src/plugins/data/public'; +import { + esFilters, + Filter, + Query, + TimeRange, + IndexPattern, + SavedQuery, + QueryStateChange, + QueryState, +} from '../../../../../../../src/plugins/data/public'; import { MapContainer } from '../../../connected_components/map_container'; import { getIndexPatternsFromIds } from '../../../index_pattern_util'; import { getTopNavConfig } from './top_nav_config'; import { getBreadcrumbs, unsavedChangesWarning } from './get_breadcrumbs'; +import { + LayerDescriptor, + MapRefreshConfig, + MapCenterAndZoom, + MapQuery, +} from '../../../../common/descriptor_types'; +import { MapSettings } from '../../../reducers/map'; +import { ISavedGisMap } from '../../bootstrap/services/saved_gis_map'; + +interface Props { + savedMap: ISavedGisMap; + onAppLeave: AppMountParameters['onAppLeave']; + stateTransfer: EmbeddableStateTransfer; + originatingApp?: string; + layerListConfigOnly: LayerDescriptor[]; + replaceLayerList: (layerList: LayerDescriptor[]) => void; + filters: Filter[]; + isFullScreen: boolean; + isOpenSettingsDisabled: boolean; + enableFullScreen: () => void; + openMapSettings: () => void; + inspectorAdapters: Adapters; + nextIndexPatternIds: string[]; + dispatchSetQuery: ({ + forceRefresh, + filters, + query, + timeFilters, + }: { + filters?: Filter[]; + query?: Query; + timeFilters?: TimeRange; + forceRefresh?: boolean; + }) => void; + timeFilters: TimeRange; + refreshConfig: MapRefreshConfig; + setRefreshConfig: (refreshConfig: MapRefreshConfig) => void; + isSaveDisabled: boolean; + clearUi: () => void; + setGotoWithCenter: (latLonZoom: MapCenterAndZoom) => void; + setMapSettings: (mapSettings: MapSettings) => void; + setIsLayerTOCOpen: (isLayerTOCOpen: boolean) => void; + setOpenTOCDetails: (openTOCDetails: string[]) => void; + query: MapQuery | undefined; +} -export class MapsAppView extends React.Component { - _globalSyncUnsubscribe = null; - _globalSyncChangeMonitorSubscription = null; - _appSyncUnsubscribe = null; +interface State { + initialized: boolean; + initialLayerListConfig?: LayerDescriptor[]; + indexPatterns: IndexPattern[]; + savedQuery?: SavedQuery; + originatingApp?: string; +} + +export class MapsAppView extends React.Component { + _globalSyncUnsubscribe: (() => void) | null = null; + _globalSyncChangeMonitorSubscription: Subscription | null = null; + _appSyncUnsubscribe: (() => void) | null = null; _appStateManager = new AppStateManager(); - _prevIndexPatternIds = null; + _prevIndexPatternIds: string[] | null = null; + _isMounted: boolean = false; - constructor(props) { + constructor(props: Props) { super(props); this.state = { indexPatterns: [], initialized: false, - savedQuery: '', - initialLayerListConfig: null, // tracking originatingApp in state so the connection can be broken by users originatingApp: props.originatingApp, }; @@ -60,10 +125,11 @@ export class MapsAppView extends React.Component { this._updateFromGlobalState ); - const initialSavedQuery = this._appStateManager.getAppState().savedQuery; - if (initialSavedQuery) { - this._updateStateFromSavedQuery(initialSavedQuery); - } + // savedQuery must be fetched from savedQueryId + // const initialSavedQuery = this._appStateManager.getAppState().savedQuery; + // if (initialSavedQuery) { + // this._updateStateFromSavedQuery(initialSavedQuery as SavedQuery); + // } this._initMap(); @@ -72,10 +138,10 @@ export class MapsAppView extends React.Component { this.props.onAppLeave((actions) => { if (this._hasUnsavedChanges()) { if (!window.confirm(unsavedChangesWarning)) { - return; + return {} as AppLeaveAction; } } - return actions.default(); + return actions.default() as AppLeaveAction; }); } @@ -121,7 +187,13 @@ export class MapsAppView extends React.Component { getCoreChrome().setBreadcrumbs(breadcrumbs); }; - _updateFromGlobalState = ({ changes, state: globalState }) => { + _updateFromGlobalState = ({ + changes, + state: globalState, + }: { + changes: QueryStateChange; + state: QueryState; + }) => { if (!this.state.initialized || !changes || !globalState) { return; } @@ -144,7 +216,17 @@ export class MapsAppView extends React.Component { } } - _onQueryChange = ({ filters, query, time, forceRefresh = false }) => { + _onQueryChange = ({ + filters, + query, + time, + forceRefresh = false, + }: { + filters?: Filter[]; + query?: Query; + time?: TimeRange; + forceRefresh?: boolean; + }) => { const { filterManager } = getData().query; if (filters) { @@ -165,7 +247,9 @@ export class MapsAppView extends React.Component { }); // sync globalState - const updatedGlobalState = { filters: filterManager.getGlobalFilters() }; + const updatedGlobalState: MapsGlobalState = { + filters: filterManager.getGlobalFilters(), + }; if (time) { updatedGlobalState.time = time; } @@ -173,7 +257,7 @@ export class MapsAppView extends React.Component { }; _initMapAndLayerSettings() { - const globalState = getGlobalState(); + const globalState: MapsGlobalState = getGlobalState(); const mapStateJSON = this.props.savedMap.mapStateJSON; let savedObjectFilters = []; @@ -219,14 +303,14 @@ export class MapsAppView extends React.Component { }); } - _onFiltersChange = (filters) => { + _onFiltersChange = (filters: Filter[]) => { this._onQueryChange({ filters, }); }; // mapRefreshConfig: MapRefreshConfig - _onRefreshConfigChange(mapRefreshConfig) { + _onRefreshConfigChange(mapRefreshConfig: MapRefreshConfig) { this.props.setRefreshConfig(mapRefreshConfig); updateGlobalState( { @@ -239,9 +323,9 @@ export class MapsAppView extends React.Component { ); } - _updateStateFromSavedQuery = (savedQuery) => { + _updateStateFromSavedQuery = (savedQuery: SavedQuery) => { this.setState({ savedQuery: { ...savedQuery } }); - this._appStateManager.setQueryAndFilters({ savedQuery }); + this._appStateManager.setQueryAndFilters({ savedQueryId: savedQuery.id }); const { filterManager } = getData().query; const savedQueryFilters = savedQuery.attributes.filters || []; @@ -328,7 +412,13 @@ export class MapsAppView extends React.Component { dateRangeTo={this.props.timeFilters.to} isRefreshPaused={this.props.refreshConfig.isPaused} refreshInterval={this.props.refreshConfig.interval} - onRefreshChange={({ isPaused, refreshInterval }) => { + onRefreshChange={({ + isPaused, + refreshInterval, + }: { + isPaused: boolean; + refreshInterval: number; + }) => { this._onRefreshConfigChange({ isPaused, interval: refreshInterval, @@ -337,14 +427,14 @@ export class MapsAppView extends React.Component { showSearchBar={true} showFilterBar={true} showDatePicker={true} - showSaveQuery={getMapsCapabilities().saveQuery} + showSaveQuery={!!getMapsCapabilities().saveQuery} savedQuery={this.state.savedQuery} onSaved={this._updateStateFromSavedQuery} onSavedQueryUpdated={this._updateStateFromSavedQuery} onClearSavedQuery={() => { const { filterManager, queryString } = getData().query; - this.setState({ savedQuery: '' }); - this._appStateManager.setQueryAndFilters({ savedQuery: '' }); + this.setState({ savedQuery: undefined }); + this._appStateManager.setQueryAndFilters({ savedQueryId: '' }); this._onQueryChange({ filters: filterManager.getGlobalFilters(), query: queryString.getDefaultQuery(), @@ -354,7 +444,7 @@ export class MapsAppView extends React.Component { ); } - _addFilter = (newFilters) => { + _addFilter = async (newFilters: Filter[]) => { newFilters.forEach((filter) => { filter.$state = { store: esFilters.FilterStateStore.APP_STATE }; }); diff --git a/x-pack/plugins/maps/public/routing/routes/maps_app/top_nav_config.tsx b/x-pack/plugins/maps/public/routing/routes/maps_app/top_nav_config.tsx index 497c87ad533a6..47f41f2b76f3e 100644 --- a/x-pack/plugins/maps/public/routing/routes/maps_app/top_nav_config.tsx +++ b/x-pack/plugins/maps/public/routing/routes/maps_app/top_nav_config.tsx @@ -21,7 +21,6 @@ import { showSaveModal, } from '../../../../../../../src/plugins/saved_objects/public'; import { MAP_SAVED_OBJECT_TYPE } from '../../../../common/constants'; -// @ts-expect-error import { goToSpecifiedPath } from '../../maps_router'; import { ISavedGisMap } from '../../bootstrap/services/saved_gis_map'; import { EmbeddableStateTransfer } from '../../../../../../../src/plugins/embeddable/public'; diff --git a/x-pack/plugins/maps/public/routing/state_syncing/app_state_manager.js b/x-pack/plugins/maps/public/routing/state_syncing/app_state_manager.ts similarity index 58% rename from x-pack/plugins/maps/public/routing/state_syncing/app_state_manager.js rename to x-pack/plugins/maps/public/routing/state_syncing/app_state_manager.ts index 4cdba13bd85d2..122b50f823a95 100644 --- a/x-pack/plugins/maps/public/routing/state_syncing/app_state_manager.js +++ b/x-pack/plugins/maps/public/routing/state_syncing/app_state_manager.ts @@ -5,20 +5,27 @@ */ import { Subject } from 'rxjs'; +import { Filter, Query } from 'src/plugins/data/public'; + +export interface MapsAppState { + query?: Query | null; + savedQueryId?: string; + filters?: Filter[]; +} export class AppStateManager { - _query = ''; - _savedQuery = ''; - _filters = []; + _query: Query | null = null; + _savedQueryId: string = ''; + _filters: Filter[] = []; _updated$ = new Subject(); - setQueryAndFilters({ query, savedQuery, filters }) { + setQueryAndFilters({ query, savedQueryId, filters }: MapsAppState) { if (query && this._query !== query) { this._query = query; } - if (savedQuery && this._savedQuery !== savedQuery) { - this._savedQuery = savedQuery; + if (savedQueryId && this._savedQueryId !== savedQueryId) { + this._savedQueryId = savedQueryId; } if (filters && this._filters !== filters) { this._filters = filters; @@ -34,10 +41,10 @@ export class AppStateManager { return this._filters; } - getAppState() { + getAppState(): MapsAppState { return { query: this._query, - savedQuery: this._savedQuery, + savedQueryId: this._savedQueryId, filters: this._filters, }; } diff --git a/x-pack/plugins/maps/public/routing/state_syncing/app_sync.js b/x-pack/plugins/maps/public/routing/state_syncing/app_sync.ts similarity index 88% rename from x-pack/plugins/maps/public/routing/state_syncing/app_sync.js rename to x-pack/plugins/maps/public/routing/state_syncing/app_sync.ts index 60e8dc9cd574c..b346822913bec 100644 --- a/x-pack/plugins/maps/public/routing/state_syncing/app_sync.js +++ b/x-pack/plugins/maps/public/routing/state_syncing/app_sync.ts @@ -4,13 +4,14 @@ * you may not use this file except in compliance with the Elastic License. */ -import { connectToQueryState, esFilters } from '../../../../../../src/plugins/data/public'; -import { syncState } from '../../../../../../src/plugins/kibana_utils/public'; import { map } from 'rxjs/operators'; +import { connectToQueryState, esFilters } from '../../../../../../src/plugins/data/public'; +import { syncState, BaseStateContainer } from '../../../../../../src/plugins/kibana_utils/public'; import { getData } from '../../kibana_services'; import { kbnUrlStateStorage } from '../maps_router'; +import { AppStateManager } from './app_state_manager'; -export function startAppStateSyncing(appStateManager) { +export function startAppStateSyncing(appStateManager: AppStateManager) { // get appStateContainer // sync app filters with app state container from data.query to state container const { query } = getData(); @@ -19,7 +20,7 @@ export function startAppStateSyncing(appStateManager) { // clear app state filters to prevent application filters from other applications being transfered to maps query.filterManager.setAppFilters([]); - const stateContainer = { + const stateContainer: BaseStateContainer = { get: () => ({ query: appStateManager.getQuery(), filters: appStateManager.getFilters(), @@ -48,6 +49,7 @@ export function startAppStateSyncing(appStateManager) { // merge initial state from app state container and current state in url const initialAppState = { ...stateContainer.get(), + // @ts-ignore ...kbnUrlStateStorage.get('_a'), }; // trigger state update. actually needed in case some data was in url diff --git a/x-pack/plugins/maps/public/routing/state_syncing/global_sync.ts b/x-pack/plugins/maps/public/routing/state_syncing/global_sync.ts index 4e17241752f53..1e779831c5e0c 100644 --- a/x-pack/plugins/maps/public/routing/state_syncing/global_sync.ts +++ b/x-pack/plugins/maps/public/routing/state_syncing/global_sync.ts @@ -3,27 +3,30 @@ * or more contributor license agreements. Licensed under the Elastic License; * you may not use this file except in compliance with the Elastic License. */ - +import { TimeRange, RefreshInterval, Filter } from 'src/plugins/data/public'; import { syncQueryStateWithUrl } from '../../../../../../src/plugins/data/public'; import { getData } from '../../kibana_services'; -// @ts-ignore import { kbnUrlStateStorage } from '../maps_router'; +export interface MapsGlobalState { + time?: TimeRange; + refreshInterval?: RefreshInterval; + filters?: Filter[]; +} + export function startGlobalStateSyncing() { const { stop } = syncQueryStateWithUrl(getData().query, kbnUrlStateStorage); return stop; } -export function getGlobalState() { - return kbnUrlStateStorage.get('_g'); +export function getGlobalState(): MapsGlobalState { + return kbnUrlStateStorage.get('_g') as MapsGlobalState; } -export function updateGlobalState(newState: unknown, flushUrlState = false) { +export function updateGlobalState(newState: MapsGlobalState, flushUrlState = false) { const globalState = getGlobalState(); kbnUrlStateStorage.set('_g', { - // @ts-ignore ...globalState, - // @ts-ignore ...newState, }); if (flushUrlState) { diff --git a/x-pack/plugins/maps/public/routing/store_operations.js b/x-pack/plugins/maps/public/routing/store_operations.ts similarity index 100% rename from x-pack/plugins/maps/public/routing/store_operations.js rename to x-pack/plugins/maps/public/routing/store_operations.ts