diff --git a/x-pack/plugins/rollup/public/crud_app/_crud_app.scss b/x-pack/plugins/rollup/public/crud_app/_crud_app.scss index 5f6f6a26d7b4..e1166d0942a5 100644 --- a/x-pack/plugins/rollup/public/crud_app/_crud_app.scss +++ b/x-pack/plugins/rollup/public/crud_app/_crud_app.scss @@ -2,9 +2,17 @@ * 1. Override EUI styles. */ .rollupJobWizardStepActions { - align-items: flex-end; + align-items: flex-end; /* 1 */ } .rollupJobsRoot { display: flex; -} \ No newline at end of file +} + +/** + * 1. Ensure panel fills width of parent when search input yields no matching rollup jobs. + */ +.rollupJobsListPanel { + // sass-lint:disable-block no-important + flex-grow: 1 !important; /* 1 */ +} diff --git a/x-pack/plugins/rollup/public/crud_app/sections/job_list/job_list.container.js b/x-pack/plugins/rollup/public/crud_app/sections/job_list/job_list.container.js index e728a58313a0..e0ad3dc852ca 100644 --- a/x-pack/plugins/rollup/public/crud_app/sections/job_list/job_list.container.js +++ b/x-pack/plugins/rollup/public/crud_app/sections/job_list/job_list.container.js @@ -7,9 +7,9 @@ import { connect } from 'react-redux'; import { - getPageOfJobs, isLoading, - jobLoadError + jobLoadError, + getJobsList, } from '../../store/selectors'; import { @@ -23,7 +23,7 @@ import { JobList as JobListView } from './job_list'; const mapStateToProps = (state) => { return { - jobs: getPageOfJobs(state), + hasJobs: Boolean(getJobsList(state).length), isLoading: isLoading(state), jobLoadError: jobLoadError(state), }; diff --git a/x-pack/plugins/rollup/public/crud_app/sections/job_list/job_list.js b/x-pack/plugins/rollup/public/crud_app/sections/job_list/job_list.js index b970c4a4a828..ec159eadcbd0 100644 --- a/x-pack/plugins/rollup/public/crud_app/sections/job_list/job_list.js +++ b/x-pack/plugins/rollup/public/crud_app/sections/job_list/job_list.js @@ -44,7 +44,7 @@ export class JobListUi extends Component { loadJobs: PropTypes.func, refreshJobs: PropTypes.func, openDetailPanel: PropTypes.func, - jobs: PropTypes.array, + hasJobs: PropTypes.bool, isLoading: PropTypes.bool, } @@ -248,7 +248,7 @@ export class JobListUi extends Component { } render() { - const { isLoading, jobs, jobLoadError } = this.props; + const { isLoading, hasJobs, jobLoadError } = this.props; let content; @@ -258,7 +258,7 @@ export class JobListUi extends Component { } else { content = this.renderError(jobLoadError); } - } else if (!isLoading && !jobs.length) { + } else if (!isLoading && !hasJobs) { content = this.renderEmpty(); } else { content = this.renderList(); @@ -267,6 +267,7 @@ export class JobListUi extends Component { return ( {content} diff --git a/x-pack/plugins/rollup/public/crud_app/sections/job_list/job_table/job_table.js b/x-pack/plugins/rollup/public/crud_app/sections/job_list/job_table/job_table.js index 2871b59e0ea8..9fb56c618057 100644 --- a/x-pack/plugins/rollup/public/crud_app/sections/job_list/job_table/job_table.js +++ b/x-pack/plugins/rollup/public/crud_app/sections/job_list/job_table/job_table.js @@ -7,7 +7,7 @@ import React, { Component, Fragment } from 'react'; import PropTypes from 'prop-types'; import { i18n } from '@kbn/i18n'; -import { injectI18n } from '@kbn/i18n/react'; +import { injectI18n, FormattedMessage } from '@kbn/i18n/react'; import { EuiCheckbox, @@ -25,6 +25,7 @@ import { EuiTableRow, EuiTableRowCell, EuiTableRowCellCheckbox, + EuiText, EuiToolTip, } from '@elastic/eui'; @@ -392,9 +393,14 @@ export class JobTableUi extends Component { ) : ( -
- No rollup jobs to show -
+ +

+ +

+
)}