From b80652f30275a57aa4ed67b7f769fa81124228a8 Mon Sep 17 00:00:00 2001
From: Or Ouziel <or.ouziel@elastic.co>
Date: Mon, 3 Jan 2022 11:47:12 +0200
Subject: [PATCH] Routing fixes (#76)

---
 .../public/application/app.tsx                | 43 +++++++++----------
 .../public/components/unknown_route.tsx       | 26 +++++++++++
 2 files changed, 47 insertions(+), 22 deletions(-)
 create mode 100644 x-pack/plugins/cloud_security_posture/public/components/unknown_route.tsx

diff --git a/x-pack/plugins/cloud_security_posture/public/application/app.tsx b/x-pack/plugins/cloud_security_posture/public/application/app.tsx
index 3fdab253d4600..9f0ae6a25f7c7 100755
--- a/x-pack/plugins/cloud_security_posture/public/application/app.tsx
+++ b/x-pack/plugins/cloud_security_posture/public/application/app.tsx
@@ -4,15 +4,14 @@
  * 2.0; you may not use this file except in compliance with the Elastic License
  * 2.0.
  */
-
 import React from 'react';
 import { I18nProvider } from '@kbn/i18n-react';
 import { Router, Redirect, Switch, Route } from 'react-router-dom';
 import { QueryClient, QueryClientProvider } from 'react-query';
 import { routes } from './routes';
-
+import { UnknownRoute } from '../components/unknown_route';
+import { CSP_DASHBOARD_PATH } from '../common/constants';
 import { KibanaContextProvider } from '../../../../../src/plugins/kibana_react/public';
-
 import type { AppMountParameters, CoreStart } from '../../../../../src/core/public';
 import type { CspStart } from '../types';
 
@@ -24,22 +23,22 @@ interface CspAppDeps {
   params: AppMountParameters;
 }
 
-export const CspApp = ({ core, deps, params }: CspAppDeps) => {
-  return (
-    <KibanaContextProvider services={{ ...deps, ...core }}>
-      <QueryClientProvider client={queryClient}>
-        <Router history={params.history}>
-          <I18nProvider>
-            <Switch>
-              {routes.map((route) => (
-                <Route {...route} />
-              ))}
-              <Route exact path="/" component={() => <Redirect to="/dashboard" />} />
-              <Route path="*" component={() => <div>not found</div>} />
-            </Switch>
-          </I18nProvider>
-        </Router>
-      </QueryClientProvider>
-    </KibanaContextProvider>
-  );
-};
+export const CspApp = ({ core, deps, params }: CspAppDeps) => (
+  <KibanaContextProvider services={{ ...deps, ...core }}>
+    <QueryClientProvider client={queryClient}>
+      <Router history={params.history}>
+        <I18nProvider>
+          <Switch>
+            {routes.map((route) => (
+              <Route key={route.path as string} {...route} />
+            ))}
+            <Route exact path="/" component={RedirectToDashboard} />
+            <Route path="*" component={UnknownRoute} />
+          </Switch>
+        </I18nProvider>
+      </Router>
+    </QueryClientProvider>
+  </KibanaContextProvider>
+);
+
+const RedirectToDashboard = () => <Redirect to={CSP_DASHBOARD_PATH} />;
diff --git a/x-pack/plugins/cloud_security_posture/public/components/unknown_route.tsx b/x-pack/plugins/cloud_security_posture/public/components/unknown_route.tsx
new file mode 100644
index 0000000000000..83740c522cc4e
--- /dev/null
+++ b/x-pack/plugins/cloud_security_posture/public/components/unknown_route.tsx
@@ -0,0 +1,26 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import React from 'react';
+import { FormattedMessage } from '@kbn/i18n-react';
+import { EuiEmptyPrompt } from '@elastic/eui';
+import { CspPageTemplate } from './page_template';
+
+export const UnknownRoute = React.memo(() => (
+  <CspPageTemplate template="centeredContent">
+    <EuiEmptyPrompt
+      data-test-subj="unknownRoute"
+      iconColor="default"
+      iconType="logoElastic"
+      title={
+        <p>
+          <FormattedMessage id="xpack.csp.unknownRoute" defaultMessage="Page not found" />
+        </p>
+      }
+    />
+  </CspPageTemplate>
+));