Specify Rollup Jobs breadcrumbs in header. (#26590)

x-pack/plugins/rollup/public/crud_app/sections/job_create/job_create.js

@@ -11,9 +11,10 @@ import cloneDeep from 'lodash/lang/cloneDeep';
 import debounce from 'lodash/function/debounce';
 import { i18n } from '@kbn/i18n';
 import { injectI18n, FormattedMessage } from '@kbn/i18n/react';
+import chrome from 'ui/chrome';
+import { MANAGEMENT_BREADCRUMB } from 'ui/management';
 
 import {
-  EuiBreadcrumbs,
   EuiCallOut,
   EuiLoadingKibana,
   EuiOverlayMask,
@@ -28,11 +29,11 @@ import {
 
 import { fatalError } from 'ui/notify';
 
-import { CRUD_APP_BASE_PATH } from '../../constants';
 import {
-  getRouterLinkProps,
   validateIndexPattern,
   formatFields,
+  listBreadcrumb,
+  createBreadcrumb,
 } from '../../services';
 
 import { Navigation } from './navigation';
@@ -88,6 +89,8 @@ export class JobCreateUi extends Component {
   constructor(props) {
     super(props);
 
+    chrome.breadcrumbs.set([ MANAGEMENT_BREADCRUMB, listBreadcrumb, createBreadcrumb ]);
+
     const stepsFields = mapValues(stepIdToStepConfigMap, step => cloneDeep(step.defaultFields || {}));
 
     this.state = {
@@ -445,23 +448,6 @@ export class JobCreateUi extends Component {
   render() {
     const { isSaving, saveError } = this.props;
 
-    const breadcrumbs = [{
-      text: (
-        <FormattedMessage
-          id="xpack.rollupJobs.create.breadcrumbs.jobsText"
-          defaultMessage="Rollup jobs"
-        />
-      ),
-      ...getRouterLinkProps(CRUD_APP_BASE_PATH),
-    }, {
-      text: (
-        <FormattedMessage
-          id="xpack.rollupJobs.create.breadcrumbs.createText"
-          defaultMessage="Create"
-        />
-      ),
-    }];
-
     let savingFeedback;
 
     if (isSaving) {
@@ -516,9 +502,6 @@ export class JobCreateUi extends Component {
               horizontalPosition="center"
               className="rollupJobWizardPage"
             >
-              <EuiBreadcrumbs breadcrumbs={breadcrumbs} responsive={false} />
-              <EuiSpacer size="xs" />
-
               <EuiPageContentHeader>
                 <EuiTitle size="l">
                   <h1>

x-pack/plugins/rollup/public/crud_app/sections/job_list/job_list.js

@@ -7,6 +7,8 @@
 import React, { Component, Fragment } from 'react';
 import PropTypes from 'prop-types';
 import { injectI18n, FormattedMessage } from '@kbn/i18n/react';
+import chrome from 'ui/chrome';
+import { MANAGEMENT_BREADCRUMB } from 'ui/management';
 
 import {
   EuiButton,
@@ -27,7 +29,7 @@ import {
 } from '@elastic/eui';
 
 import { CRUD_APP_BASE_PATH } from '../../constants';
-import { getRouterLinkProps, extractQueryParams } from '../../services';
+import { getRouterLinkProps, extractQueryParams, listBreadcrumb } from '../../services';
 
 import {
   JobTable,
@@ -71,9 +73,11 @@ export class JobListUi extends Component {
   constructor(props) {
     super(props);
 
-    this.state = {};
-
     props.loadJobs();
+
+    chrome.breadcrumbs.set([ MANAGEMENT_BREADCRUMB, listBreadcrumb ]);
+
+    this.state = {};
   }
 
   componentDidMount() {

x-pack/plugins/rollup/public/crud_app/services/breadcrumbs.js

@@ -0,0 +1,21 @@
+/*
+ * 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 { i18n } from '@kbn/i18n';
+import { CRUD_APP_BASE_PATH } from '../constants';
+
+export const listBreadcrumb = {
+  text: i18n.translate('xpack.rollupJobs.listBreadcrumbTitle', {
+    defaultMessage: 'Rollups Jobs',
+  }),
+  href: `#${CRUD_APP_BASE_PATH}`,
+};
+
+export const createBreadcrumb = {
+  text: i18n.translate('xpack.rollupJobs.createBreadcrumbTitle', {
+    defaultMessage: 'Create',
+  }),
+};

x-pack/plugins/rollup/public/crud_app/services/index.js

@@ -18,6 +18,11 @@ export {
   showApiWarning,
 } from './api_errors';
 
+export {
+  listBreadcrumb,
+  createBreadcrumb,
+} from './breadcrumbs';
+
 export {
   cronExpressionToParts,
   cronPartsToExpression,