diff --git a/packages/core/application/core-application-browser-internal/src/ui/app_container.tsx b/packages/core/application/core-application-browser-internal/src/ui/app_container.tsx index 997185e05119c..65f23ed0f9815 100644 --- a/packages/core/application/core-application-browser-internal/src/ui/app_container.tsx +++ b/packages/core/application/core-application-browser-internal/src/ui/app_container.tsx @@ -22,6 +22,11 @@ import { type AppUnmount, type ScopedHistory, } from '@kbn/core-application-browser'; +import { + KibanaErrorBoundary, + KibanaErrorBoundaryKibanaProvider, +} from '@kbn/shared-ux-error-boundary'; + import type { Mounter } from '../types'; import { AppNotFound } from './app_not_found_screen'; @@ -53,6 +58,7 @@ export const AppContainer: FC = ({ }: Props) => { const [showSpinner, setShowSpinner] = useState(true); const [appNotFound, setAppNotFound] = useState(false); + const [appError, setAppError] = useState(null); const elementRef = useRef(null); const unmountRef: MutableRefObject = useRef(null); @@ -87,9 +93,9 @@ export const AppContainer: FC = ({ setHeaderActionMenu: (menuMount) => setAppActionMenu(appId, menuMount), })) || null; } catch (e) { - // TODO: add error UI // eslint-disable-next-line no-console console.error(e); + setAppError(e); } finally { if (elementRef.current) { setShowSpinner(false); @@ -113,7 +119,11 @@ export const AppContainer: FC = ({ theme$, ]); - return ( + return appError ? ( + + + + ) : ( {appNotFound && } {showSpinner && !appNotFound && ( diff --git a/packages/core/application/core-application-browser-internal/tsconfig.json b/packages/core/application/core-application-browser-internal/tsconfig.json index f00a7fdb928f4..497d069efc596 100644 --- a/packages/core/application/core-application-browser-internal/tsconfig.json +++ b/packages/core/application/core-application-browser-internal/tsconfig.json @@ -36,6 +36,7 @@ "@kbn/core-analytics-browser-mocks", "@kbn/core-analytics-browser", "@kbn/shared-ux-router", + "@kbn/shared-ux-error-boundary", ], "exclude": [ "target/**/*",