From 295037012f8fe71776f13ab604d3c81ea408708c Mon Sep 17 00:00:00 2001 From: Jen Huang Date: Thu, 14 May 2020 10:41:58 -0700 Subject: [PATCH] Fixes from review: kuery param, getPath cleanup, use chrome.docTitle, and teardown breadcrumb and doc title --- .../applications/ingest_manager/constants/page_paths.ts | 4 ++-- .../ingest_manager/hooks/use_breadcrumbs.tsx | 6 +++--- .../public/applications/ingest_manager/hooks/use_link.ts | 6 ++---- .../public/applications/ingest_manager/index.tsx | 5 +++++ .../agent_config/components/linked_agent_count.tsx | 6 +++--- x-pack/plugins/ingest_manager/public/plugin.ts | 9 +++++++-- 6 files changed, 22 insertions(+), 14 deletions(-) diff --git a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/constants/page_paths.ts b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/constants/page_paths.ts index b7e7d4044e7e4..73771fa3cb343 100644 --- a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/constants/page_paths.ts +++ b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/constants/page_paths.ts @@ -12,7 +12,6 @@ export type StaticPage = | 'configurations' | 'configurations_list' | 'fleet' - | 'fleet_agent_list' | 'fleet_enrollment_tokens' | 'data_streams'; @@ -22,6 +21,7 @@ export type DynamicPage = | 'add_datasource_from_configuration' | 'add_datasource_from_integration' | 'edit_datasource' + | 'fleet_agent_list' | 'fleet_agent_details'; export type Page = StaticPage | DynamicPage; @@ -77,7 +77,7 @@ export const pagePathGetters: { edit_datasource: ({ configId, datasourceId }) => `/configs/${configId}/edit-datasource/${datasourceId}`, fleet: () => '/fleet', - fleet_agent_list: () => '/fleet/agents', + fleet_agent_list: ({ kuery }) => `/fleet/agents${kuery ? `?kuery=${kuery}` : ''}`, fleet_agent_details: ({ agentId, tabId }) => `/fleet/agents/${agentId}${tabId ? `/${tabId}` : ''}`, fleet_enrollment_tokens: () => '/fleet/enrollment-tokens', diff --git a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/hooks/use_breadcrumbs.tsx b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/hooks/use_breadcrumbs.tsx index 68c228295c384..207c757fd5b16 100644 --- a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/hooks/use_breadcrumbs.tsx +++ b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/hooks/use_breadcrumbs.tsx @@ -219,9 +219,9 @@ export function useBreadcrumbs(page: Page, values: DynamicPagePathValues = {}) { ...breadcrumb, href: breadcrumb.href ? http.basePath.prepend(`${BASE_PATH}#${breadcrumb.href}`) : undefined, })); - document.title = [...breadcrumbs] + const docTitle: string[] = [...breadcrumbs] .reverse() - .map(breadcrumb => breadcrumb.text) - .join(' - '); + .map(breadcrumb => breadcrumb.text as string); + chrome.docTitle.change(docTitle); chrome.setBreadcrumbs(breadcrumbs); } diff --git a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/hooks/use_link.ts b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/hooks/use_link.ts index a3bcb5f441672..1b17c5cb0b1f3 100644 --- a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/hooks/use_link.ts +++ b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/hooks/use_link.ts @@ -13,16 +13,14 @@ import { } from '../constants'; import { useCore } from './'; -const getPath = (page: StaticPage | DynamicPage, values?: DynamicPagePathValues): string => { +const getPath = (page: StaticPage | DynamicPage, values: DynamicPagePathValues = {}): string => { return values ? pagePathGetters[page](values) : pagePathGetters[page as StaticPage](); }; export const useLink = () => { const core = useCore(); return { - getPath: (page: StaticPage | DynamicPage, values?: DynamicPagePathValues) => { - return getPath(page, values); - }, + getPath, getHref: (page: StaticPage | DynamicPage, values?: DynamicPagePathValues) => { const path = getPath(page, values); return core.http.basePath.prepend(`${BASE_PATH}#${path}`); diff --git a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/index.tsx b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/index.tsx index cac8f8a3cb9cf..f6a386314272f 100644 --- a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/index.tsx +++ b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/index.tsx @@ -265,3 +265,8 @@ export function renderApp( ReactDOM.unmountComponentAtNode(element); }; } + +export const teardownIngestManager = (coreStart: CoreStart) => { + coreStart.chrome.docTitle.reset(); + coreStart.chrome.setBreadcrumbs([]); +}; diff --git a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/agent_config/components/linked_agent_count.tsx b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/agent_config/components/linked_agent_count.tsx index 55784cc4b54f0..8294597e43c50 100644 --- a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/agent_config/components/linked_agent_count.tsx +++ b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/agent_config/components/linked_agent_count.tsx @@ -22,9 +22,9 @@ export const LinkedAgentCount = memo<{ count: number; agentConfigId: string }>( ); return count > 0 ? ( {displayValue} diff --git a/x-pack/plugins/ingest_manager/public/plugin.ts b/x-pack/plugins/ingest_manager/public/plugin.ts index 2c6ed9d81744e..fd4e08f619495 100644 --- a/x-pack/plugins/ingest_manager/public/plugin.ts +++ b/x-pack/plugins/ingest_manager/public/plugin.ts @@ -64,8 +64,13 @@ export class IngestManagerPlugin IngestManagerStartDeps, IngestManagerStart ]; - const { renderApp } = await import('./applications/ingest_manager'); - return renderApp(coreStart, params, deps, startDeps, config); + const { renderApp, teardownIngestManager } = await import('./applications/ingest_manager'); + const unmount = renderApp(coreStart, params, deps, startDeps, config); + + return () => { + unmount(); + teardownIngestManager(coreStart); + }; }, }); }