diff --git a/frontend/src/metabase/admin/routes.jsx b/frontend/src/metabase/admin/routes.jsx index 7b9678d970d3782c1e5d75e22ab854e3d651beee..79b607e754b55c4f2cc4ce913b10794721c6f5a1 100644 --- a/frontend/src/metabase/admin/routes.jsx +++ b/frontend/src/metabase/admin/routes.jsx @@ -88,11 +88,16 @@ const getRoutes = (store, IsAdmin) => ( title={t`Troubleshooting`} component={TroubleshootingApp} > + <IndexRedirect to="tasks" /> <Route path="tasks" component={TasksApp}> <ModalRoute path=":taskId" modal={TaskModal} /> </Route> <Route path="jobs" component={JobInfoApp}> - <ModalRoute path=":jobKey" modal={JobTriggersModal} /> + <ModalRoute + path=":jobKey" + modal={JobTriggersModal} + modalProps={{ wide: true }} + /> </Route> </Route> diff --git a/frontend/src/metabase/admin/tasks/containers/JobTriggersModal.jsx b/frontend/src/metabase/admin/tasks/containers/JobTriggersModal.jsx index f9250cb0f1f98cdf84208f8914d1260895414ab2..915cb5da031548d16fc31d442cb5c55c3ce77e8a 100644 --- a/frontend/src/metabase/admin/tasks/containers/JobTriggersModal.jsx +++ b/frontend/src/metabase/admin/tasks/containers/JobTriggersModal.jsx @@ -50,6 +50,11 @@ const renderTriggersTable = triggers => { @connect(null, { fetchJobInfo, goBack }) export default class JobTriggersModal extends React.Component { + state = { + triggers: null, + error: null, + }; + async componentDidMount() { try { const { jobKey } = this.props.params; @@ -64,13 +69,13 @@ export default class JobTriggersModal extends React.Component { } render() { - const { jobKey, goBack } = this.props.params; - const { triggers, error } = this.state || {}; + const { params: { jobKey }, goBack } = this.props; + const { triggers, error } = this.state; return ( <ModalContent title={t`Triggers for ${jobKey}`} onClose={goBack}> <LoadingAndErrorWrapper loading={!triggers} error={error}> - <Box p={3}>{renderTriggersTable(triggers)}</Box> + {() => renderTriggersTable(triggers)} </LoadingAndErrorWrapper> </ModalContent> ); diff --git a/frontend/src/metabase/hoc/ModalRoute.jsx b/frontend/src/metabase/hoc/ModalRoute.jsx index 7158a4782ace78ba0ff52ea0b03c435d7599fa94..bf6678b8fe9081da64beb147b989f2c17a0bf159 100644 --- a/frontend/src/metabase/hoc/ModalRoute.jsx +++ b/frontend/src/metabase/hoc/ModalRoute.jsx @@ -4,7 +4,7 @@ import { push } from "react-router-redux"; import { connect } from "react-redux"; import Modal from "metabase/components/Modal"; -const ModalWithRoute = ComposedModal => +const ModalWithRoute = (ComposedModal, modalProps = {}) => connect(null, { onChangeLocation: push })( class extends Component { static displayName = `ModalWithRoute[${ComposedModal.displayName || @@ -21,7 +21,7 @@ const ModalWithRoute = ComposedModal => render() { return ( - <Modal onClose={this.onClose}> + <Modal {...modalProps} onClose={this.onClose}> <ComposedModal {...this.props} onClose={this.onClose} /> </Modal> ); @@ -32,11 +32,11 @@ const ModalWithRoute = ComposedModal => // react-router Route wrapper that handles routed modals export class ModalRoute extends Route { static createRouteFromReactElement(element) { - const { modal } = element.props; + const { modal, modalProps } = element.props; if (modal) { element = React.cloneElement(element, { - component: ModalWithRoute(modal), + component: ModalWithRoute(modal, modalProps), }); return Route.createRouteFromReactElement(element);