diff --git a/src/plugins/visualize/public/application/components/visualize_byvalue_editor.tsx b/src/plugins/visualize/public/application/components/visualize_byvalue_editor.tsx index 1b7e7bb098009..a78633d6841e5 100644 --- a/src/plugins/visualize/public/application/components/visualize_byvalue_editor.tsx +++ b/src/plugins/visualize/public/application/components/visualize_byvalue_editor.tsx @@ -50,6 +50,9 @@ export const VisualizeByValueEditor = () => { setOriginatingApp(value); setValueInput(valueInputValue); setEmbeddableId(embeddableIdValue); + if (!valueInputValue) { + history.back(); + } }, [services]); const isChromeVisible = useChromeVisibility(services.chrome); @@ -58,7 +61,8 @@ export const VisualizeByValueEditor = () => { services, eventEmitter, isChromeVisible, - valueInput + valueInput, + originatingApp ); const { appState, hasUnappliedChanges } = useVisualizeAppState( services, diff --git a/src/plugins/visualize/public/application/utils/breadcrumbs.ts b/src/plugins/visualize/public/application/utils/breadcrumbs.ts index fa6b74e25694f..f2dfcbf8bb7dc 100644 --- a/src/plugins/visualize/public/application/utils/breadcrumbs.ts +++ b/src/plugins/visualize/public/application/utils/breadcrumbs.ts @@ -21,6 +21,14 @@ import { i18n } from '@kbn/i18n'; import { VisualizeConstants } from '../visualize_constants'; +const appPrefixes: Record = { + dashboards: { + text: i18n.translate('dashboard.listing.breadcrumb', { + defaultMessage: 'Dashboard', + }), + }, +}; + const defaultEditText = i18n.translate('visualize.editor.defaultEditBreadcrumbText', { defaultMessage: 'Edit', }); @@ -47,6 +55,11 @@ export function getCreateBreadcrumbs() { ]; } +export function getBreadcrumbsPrefixedWithApp(originatingApp: string) { + const originatingAppBreadcrumb = appPrefixes[originatingApp]; + return [originatingAppBreadcrumb, ...getLandingBreadcrumbs(), { text: defaultEditText }]; +} + export function getEditBreadcrumbs(text: string = defaultEditText) { return [ ...getLandingBreadcrumbs(), diff --git a/src/plugins/visualize/public/application/utils/get_top_nav_config.tsx b/src/plugins/visualize/public/application/utils/get_top_nav_config.tsx index 3a59af626fc50..b7c0fe21d31a2 100644 --- a/src/plugins/visualize/public/application/utils/get_top_nav_config.tsx +++ b/src/plugins/visualize/public/application/utils/get_top_nav_config.tsx @@ -178,7 +178,7 @@ export const getTopNavConfig = ( }; const topNavMenu: TopNavMenuData[] = [ - ...(originatingApp && (savedVis?.id || embeddableId) + ...(originatingApp && ((savedVis && savedVis.id) || embeddableId) ? [ { id: 'saveAndReturn', diff --git a/src/plugins/visualize/public/application/utils/use/use_vis_byvalue.ts b/src/plugins/visualize/public/application/utils/use/use_vis_byvalue.ts index d743d9540265a..f2758d0cc01a4 100644 --- a/src/plugins/visualize/public/application/utils/use/use_vis_byvalue.ts +++ b/src/plugins/visualize/public/application/utils/use/use_vis_byvalue.ts @@ -22,14 +22,15 @@ import { useEffect, useRef, useState } from 'react'; import { VisualizeInput } from 'src/plugins/visualizations/public'; import { ByValueVisInstance, IEditorController, VisualizeServices } from '../../types'; import { getVisualizationInstanceFromInput } from '../get_visualization_instance'; -import { getEditBreadcrumbs } from '../breadcrumbs'; +import { getBreadcrumbsPrefixedWithApp, getEditBreadcrumbs } from '../breadcrumbs'; import { DefaultEditorController } from '../../../../../vis_default_editor/public'; export const useVisByValue = ( services: VisualizeServices, eventEmitter: EventEmitter, isChromeVisible: boolean | undefined, - valueInput?: VisualizeInput + valueInput?: VisualizeInput, + originatingApp?: string ) => { const [state, setState] = useState<{ byValueVisInstance?: ByValueVisInstance; @@ -53,7 +54,9 @@ export const useVisByValue = ( embeddableHandler ); - if (chrome) { + if (chrome && originatingApp) { + chrome.setBreadcrumbs(getBreadcrumbsPrefixedWithApp(originatingApp)); + } else if (chrome) { chrome.setBreadcrumbs(getEditBreadcrumbs()); } @@ -72,6 +75,7 @@ export const useVisByValue = ( state.byValueVisInstance, state.visEditorController, valueInput, + originatingApp, ]); useEffect(() => {