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 (
+