From 41873c52a650cddadae1d8357df172b000a78535 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Felix=20St=C3=BCrmer?= Date: Thu, 4 Jun 2020 16:30:15 +0200 Subject: [PATCH] Adapt legacy app to more closely follow guidelines --- .../plugins/infra/public/apps/legacy_app.tsx | 98 +++++++++++++++++ .../infra/public/apps/start_legacy_app.tsx | 100 ------------------ x-pack/plugins/infra/public/plugin.ts | 5 +- 3 files changed, 101 insertions(+), 102 deletions(-) create mode 100644 x-pack/plugins/infra/public/apps/legacy_app.tsx delete mode 100644 x-pack/plugins/infra/public/apps/start_legacy_app.tsx diff --git a/x-pack/plugins/infra/public/apps/legacy_app.tsx b/x-pack/plugins/infra/public/apps/legacy_app.tsx new file mode 100644 index 00000000000000..37537fa7f7d6af --- /dev/null +++ b/x-pack/plugins/infra/public/apps/legacy_app.tsx @@ -0,0 +1,98 @@ +/* + * 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 { EuiErrorBoundary } from '@elastic/eui'; +import { createBrowserHistory, History } from 'history'; +import { AppMountParameters } from 'kibana/public'; +import React from 'react'; +import ReactDOM from 'react-dom'; +import { Route, RouteProps, Router, Switch } from 'react-router-dom'; +import url from 'url'; + +// This exists purely to facilitate legacy app/infra URL redirects. +// It will be removed in 8.0.0. +export async function renderApp({ element }: AppMountParameters) { + const history = createBrowserHistory(); + + ReactDOM.render(, element); + + return () => { + ReactDOM.unmountComponentAtNode(element); + }; +} + +const LegacyApp: React.FunctionComponent<{ history: History }> = ({ history }) => { + return ( + + + + { + if (!location) { + return null; + } + + let nextPath = ''; + let nextBasePath = ''; + let nextSearch; + + if ( + location.hash.indexOf('#infrastructure') > -1 || + location.hash.indexOf('#/infrastructure') > -1 + ) { + nextPath = location.hash.replace( + new RegExp( + '#infrastructure/|#/infrastructure/|#/infrastructure|#infrastructure', + 'g' + ), + '' + ); + nextBasePath = location.pathname.replace('app/infra', 'app/metrics'); + } else if ( + location.hash.indexOf('#logs') > -1 || + location.hash.indexOf('#/logs') > -1 + ) { + nextPath = location.hash.replace( + new RegExp('#logs/|#/logs/|#/logs|#logs', 'g'), + '' + ); + nextBasePath = location.pathname.replace('app/infra', 'app/logs'); + } else { + // This covers /app/infra and /app/infra/home (both of which used to render + // the metrics inventory page) + nextPath = 'inventory'; + nextBasePath = location.pathname.replace('app/infra', 'app/metrics'); + nextSearch = undefined; + } + + // app/inra#infrastructure/metrics/:type/:node was changed to app/metrics/detail/:type/:node, this + // accounts for that edge case + nextPath = nextPath.replace('metrics/', 'detail/'); + + // Query parameters (location.search) will arrive as part of location.hash and not location.search + const nextPathParts = nextPath.split('?'); + nextPath = nextPathParts[0]; + nextSearch = nextPathParts[1] ? nextPathParts[1] : undefined; + + let nextUrl = url.format({ + pathname: `${nextBasePath}/${nextPath}`, + hash: undefined, + search: nextSearch, + }); + + nextUrl = nextUrl.replace('//', '/'); + + window.location.href = nextUrl; + + return null; + }} + /> + + + + ); +}; diff --git a/x-pack/plugins/infra/public/apps/start_legacy_app.tsx b/x-pack/plugins/infra/public/apps/start_legacy_app.tsx deleted file mode 100644 index 6e5960ceb2081f..00000000000000 --- a/x-pack/plugins/infra/public/apps/start_legacy_app.tsx +++ /dev/null @@ -1,100 +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 { createBrowserHistory } from 'history'; -import React from 'react'; -import url from 'url'; -import ReactDOM from 'react-dom'; -import { AppMountParameters } from 'kibana/public'; -import { Route, Router, Switch, RouteProps } from 'react-router-dom'; -// TODO use theme provided from parentApp when kibana supports it -import { EuiErrorBoundary } from '@elastic/eui'; - -// This exists purely to facilitate legacy app/infra URL redirects. -// It will be removed in 8.0.0. -export async function startLegacyApp(params: AppMountParameters) { - const { element } = params; - const history = createBrowserHistory(); - - const App: React.FunctionComponent = () => { - return ( - - - - { - if (!location) { - return null; - } - - let nextPath = ''; - let nextBasePath = ''; - let nextSearch; - - if ( - location.hash.indexOf('#infrastructure') > -1 || - location.hash.indexOf('#/infrastructure') > -1 - ) { - nextPath = location.hash.replace( - new RegExp( - '#infrastructure/|#/infrastructure/|#/infrastructure|#infrastructure', - 'g' - ), - '' - ); - nextBasePath = location.pathname.replace('app/infra', 'app/metrics'); - } else if ( - location.hash.indexOf('#logs') > -1 || - location.hash.indexOf('#/logs') > -1 - ) { - nextPath = location.hash.replace( - new RegExp('#logs/|#/logs/|#/logs|#logs', 'g'), - '' - ); - nextBasePath = location.pathname.replace('app/infra', 'app/logs'); - } else { - // This covers /app/infra and /app/infra/home (both of which used to render - // the metrics inventory page) - nextPath = 'inventory'; - nextBasePath = location.pathname.replace('app/infra', 'app/metrics'); - nextSearch = undefined; - } - - // app/inra#infrastructure/metrics/:type/:node was changed to app/metrics/detail/:type/:node, this - // accounts for that edge case - nextPath = nextPath.replace('metrics/', 'detail/'); - - // Query parameters (location.search) will arrive as part of location.hash and not location.search - const nextPathParts = nextPath.split('?'); - nextPath = nextPathParts[0]; - nextSearch = nextPathParts[1] ? nextPathParts[1] : undefined; - - let nextUrl = url.format({ - pathname: `${nextBasePath}/${nextPath}`, - hash: undefined, - search: nextSearch, - }); - - nextUrl = nextUrl.replace('//', '/'); - - window.location.href = nextUrl; - - return null; - }} - /> - - - - ); - }; - - ReactDOM.render(, element); - - return () => { - ReactDOM.unmountComponentAtNode(element); - }; -} diff --git a/x-pack/plugins/infra/public/plugin.ts b/x-pack/plugins/infra/public/plugin.ts index 784769d0e5cfd7..652beef9d94cd7 100644 --- a/x-pack/plugins/infra/public/plugin.ts +++ b/x-pack/plugins/infra/public/plugin.ts @@ -95,8 +95,9 @@ export class Plugin title: 'infra', navLinkStatus: 3, mount: async (params: AppMountParameters) => { - const { startLegacyApp } = await import('./apps/start_legacy_app'); - return startLegacyApp(params); + const { renderApp } = await import('./apps/legacy_app'); + + return renderApp(params); }, }); }