[api_keys] fix Breadcrumbs and Navigation

elastic · May 21, 2020 · 57cfa83 · 57cfa83
1 parent c04d0b1
commit 57cfa83
Show file tree

Hide file tree

Showing 6 changed files with 24 additions and 9 deletions.
diff --git a/...lic/components/edit_index_pattern/scripted_fields_table/components/header/header.test.tsx b/...lic/components/edit_index_pattern/scripted_fields_table/components/header/header.test.tsx
@@ -20,6 +20,7 @@
 import React from 'react';
 import { render } from 'enzyme';
 import { RouteComponentProps } from 'react-router-dom';
+import { ScopedHistory } from 'kibana/public';
 
 import { Header } from './header';
 
@@ -28,7 +29,7 @@ describe('Header', () => {
     const component = render(
       <Header.WrappedComponent
         indexPatternId="test"
-        history={({} as unknown) as RouteComponentProps['history']}
+        history={({} as unknown) as ScopedHistory}
         location={({} as unknown) as RouteComponentProps['location']}
         match={({} as unknown) as RouteComponentProps['match']}
       />

diff --git a/x-pack/plugins/security/public/management/api_keys/api_keys_grid/api_keys_grid_page.test.tsx b/x-pack/plugins/security/public/management/api_keys/api_keys_grid/api_keys_grid_page.test.tsx
@@ -67,6 +67,7 @@ describe('APIKeysGridPage', () => {
   const getViewProperties = () => {
     const { docLinks, notifications } = coreMock.createStart();
     return {
+      getUrlForApp: (id: string) => id,
       docLinks: new DocumentationLinksService(docLinks),
       notifications,
       apiKeysAPIClient: apiClientMock,

diff --git a/x-pack/plugins/security/public/management/api_keys/api_keys_grid/api_keys_grid_page.tsx b/x-pack/plugins/security/public/management/api_keys/api_keys_grid/api_keys_grid_page.tsx
@@ -26,7 +26,7 @@ import {
 import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n/react';
 import moment from 'moment-timezone';
-import { NotificationsStart } from 'src/core/public';
+import { ApplicationStart, NotificationsStart } from 'src/core/public';
 import { SectionLoading } from '../../../../../../../src/plugins/es_ui_shared/public';
 import { ApiKey, ApiKeyToInvalidate } from '../../../../common/model';
 import { APIKeysAPIClient } from '../api_keys_api_client';
@@ -40,6 +40,7 @@ interface Props {
   notifications: NotificationsStart;
   docLinks: DocumentationLinksService;
   apiKeysAPIClient: PublicMethodsOf<APIKeysAPIClient>;
+  getUrlForApp: ApplicationStart['getUrlForApp'];
 }
 
 interface State {
@@ -137,7 +138,11 @@ export class APIKeysGridPage extends Component<Props, State> {
     if (!isLoadingTable && apiKeys && apiKeys.length === 0) {
       return (
         <EuiPageContent>
-          <EmptyPrompt isAdmin={isAdmin} docLinks={this.props.docLinks} />
+          <EmptyPrompt
+            isAdmin={isAdmin}
+            docLinks={this.props.docLinks}
+            getUrlForApp={this.props.getUrlForApp}
+          />
         </EuiPageContent>
       );
     }

diff --git a/...k/plugins/security/public/management/api_keys/api_keys_grid/empty_prompt/empty_prompt.tsx b/...k/plugins/security/public/management/api_keys/api_keys_grid/empty_prompt/empty_prompt.tsx
@@ -5,16 +5,23 @@
  */
 
 import React, { Fragment } from 'react';
+import { ApplicationStart } from 'kibana/public';
+
 import { EuiEmptyPrompt, EuiButton, EuiLink } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n/react';
 import { DocumentationLinksService } from '../../documentation_links';
 
 interface Props {
   isAdmin: boolean;
   docLinks: DocumentationLinksService;
+  getUrlForApp: ApplicationStart['getUrlForApp'];
 }
 
-export const EmptyPrompt: React.FunctionComponent<Props> = ({ isAdmin, docLinks }) => (
+export const EmptyPrompt: React.FunctionComponent<Props> = ({
+  isAdmin,
+  docLinks,
+  getUrlForApp,
+}) => (
   <EuiEmptyPrompt
     iconType="managementApp"
     title={
@@ -53,7 +60,7 @@ export const EmptyPrompt: React.FunctionComponent<Props> = ({ isAdmin, docLinks
       </Fragment>
     }
     actions={
-      <EuiButton type="primary" href="#/dev_tools" data-test-subj="goToConsoleButton">
+      <EuiButton type="primary" href={getUrlForApp('dev_tools')} data-test-subj="goToConsoleButton">
         <FormattedMessage
           id="xpack.security.management.apiKeys.table.emptyPromptConsoleButtonMessage"
           defaultMessage="Go to Console"

diff --git a/x-pack/plugins/security/public/management/api_keys/api_keys_management_app.test.tsx b/x-pack/plugins/security/public/management/api_keys/api_keys_management_app.test.tsx
@@ -41,7 +41,7 @@ describe('apiKeysManagementApp', () => {
       });
 
     expect(setBreadcrumbs).toHaveBeenCalledTimes(1);
-    expect(setBreadcrumbs).toHaveBeenCalledWith([{ href: '#/some-base-path', text: 'API Keys' }]);
+    expect(setBreadcrumbs).toHaveBeenCalledWith([{ href: '/', text: 'API Keys' }]);
     expect(container).toMatchInlineSnapshot(`
       <div>
         Page: {"notifications":{"toasts":{}},"docLinks":{"esDocBasePath":"https://www.elastic.co/guide/en/elasticsearch/reference/mocked-test-branch/"},"apiKeysAPIClient":{"http":{"basePath":{"basePath":"","serverBasePath":""},"anonymousPaths":{}}}}

diff --git a/x-pack/plugins/security/public/management/api_keys/api_keys_management_app.tsx b/x-pack/plugins/security/public/management/api_keys/api_keys_management_app.tsx
@@ -25,18 +25,18 @@ export const apiKeysManagementApp = Object.freeze({
       title: i18n.translate('xpack.security.management.apiKeysTitle', {
         defaultMessage: 'API Keys',
       }),
-      async mount({ basePath, element, setBreadcrumbs }) {
+      async mount({ basePath, element, setBreadcrumbs, history }) {
         setBreadcrumbs([
           {
             text: i18n.translate('xpack.security.apiKeys.breadcrumb', {
               defaultMessage: 'API Keys',
             }),
-            href: `#${basePath}`,
+            href: `/`,
           },
         ]);
 
         const [
-          [{ docLinks, http, notifications, i18n: i18nStart }],
+          [{ docLinks, http, notifications, i18n: i18nStart, application }],
           { APIKeysGridPage },
           { APIKeysAPIClient },
         ] = await Promise.all([
@@ -48,6 +48,7 @@ export const apiKeysManagementApp = Object.freeze({
         render(
           <i18nStart.Context>
             <APIKeysGridPage
+              getUrlForApp={application.getUrlForApp}
               notifications={notifications}
               docLinks={new DocumentationLinksService(docLinks)}
               apiKeysAPIClient={new APIKeysAPIClient(http)}