diff --git a/packages/component-wizard/src/components/SubmissionWizard.js b/packages/component-wizard/src/components/SubmissionWizard.js index 78285ca3423014089ae1475ac140afc17d224937..05541ef452a0167ab5f3d35daa3d4f193dd83462 100644 --- a/packages/component-wizard/src/components/SubmissionWizard.js +++ b/packages/component-wizard/src/components/SubmissionWizard.js @@ -1,5 +1,5 @@ import React, { Fragment } from 'react' -import { get, isNull } from 'lodash' +import { get, isNull, last } from 'lodash' import { connect } from 'react-redux' import { th } from '@pubsweet/ui-toolkit' import { actions } from 'pubsweet-client' @@ -10,6 +10,7 @@ import styled, { css } from 'styled-components' import HTML5Backend from 'react-dnd-html5-backend' import { Button, Spinner, Steps } from '@pubsweet/ui' import { selectCollection, selectFragment } from 'xpub-selectors' +import { Redirect } from 'react-router' import { compose, toClass, @@ -57,58 +58,66 @@ const Wizard = ({ isFirstStep, handleSubmit, getButtonText, + isLastFragment, isFilesFetching, isAuthorsFetching, journal: { manuscriptTypes = [] }, ...rest -}) => ( - <Root className="wizard-root"> - <Steps currentStep={step}> - {wizardSteps.map(({ stepTitle }) => ( - <Steps.Step key={stepTitle} title={stepTitle} /> - ))} - </Steps> +}) => + isLastFragment ? ( + <Root className="wizard-root"> + <Steps currentStep={step}> + {wizardSteps.map(({ stepTitle }) => ( + <Steps.Step key={stepTitle} title={stepTitle} /> + ))} + </Steps> - <StepRoot className="wizard-step" step={step}> - {React.createElement(wizardSteps[step].component, { - manuscriptTypes, - journal, - isAuthorsFetching, - ...rest, - })} - <Row justify="center" mt={2}> - {(isAuthorsFetching || isFilesFetching) && isLastStep ? ( - <Spinner /> - ) : ( - <Fragment> - <Button - data-test-id="submission-back" - mr={1} - onClick={isFirstStep ? history.goBack : prevStep} - > - <IconButton - fontIcon="arrowLeft" - mb={0.1} - paddingBottom={1.2} - paddingRight={0.9} - /> - Back - </Button> - <Button - data-test-id="submission-next" - ml={isFirstStep ? 0 : 1} - onClick={handleSubmit} - primary - > - {getButtonText()} - <IconButton fontIcon="arrowRight" mb={0.1} paddingBottom={0.5} /> - </Button> - </Fragment> - )} - </Row> - </StepRoot> - </Root> -) + <StepRoot className="wizard-step" step={step}> + {React.createElement(wizardSteps[step].component, { + manuscriptTypes, + journal, + isAuthorsFetching, + ...rest, + })} + <Row justify="center" mt={2}> + {(isAuthorsFetching || isFilesFetching) && isLastStep ? ( + <Spinner /> + ) : ( + <Fragment> + <Button + data-test-id="submission-back" + mr={1} + onClick={isFirstStep ? history.goBack : prevStep} + > + <IconButton + fontIcon="arrowLeft" + mb={0.1} + paddingBottom={1.2} + paddingRight={0.9} + /> + Back + </Button> + <Button + data-test-id="submission-next" + ml={isFirstStep ? 0 : 1} + onClick={handleSubmit} + primary + > + {getButtonText()} + <IconButton + fontIcon="arrowRight" + mb={0.1} + paddingBottom={0.5} + /> + </Button> + </Fragment> + )} + </Row> + </StepRoot> + </Root> + ) : ( + <Redirect to="/404" /> + ) // #endregion // #region export @@ -157,7 +166,9 @@ export default compose( ({ step, location, + fragment, formValues, + collection, submitFailed, formSyncErrors, authorEditIndex, @@ -176,6 +187,8 @@ export default compose( authorsError: (submitFailed && get(formSyncErrors, 'authors', '')) || reduxAuthorError, + isLastFragment: + get(fragment, 'id', '') === last(get(collection, 'fragments', [])), }), ), withHandlers({ diff --git a/packages/components-faraday/src/components/UIComponents/NotFound.js b/packages/components-faraday/src/components/UIComponents/NotFound.js index d2c52d41f3d3679ba2409423c241fafb10ba90c2..b65e642f7dfb37beeba3c9da1d849709ada29ebc 100644 --- a/packages/components-faraday/src/components/UIComponents/NotFound.js +++ b/packages/components-faraday/src/components/UIComponents/NotFound.js @@ -13,9 +13,9 @@ const NotFound = ({ history }) => ( The page you are looking for might have been removed, had its name changed, or is temporarily unavailable. </H3> - <Button onClick={() => history.push('/')} primary> + <RedirectButton onClick={() => history.push('/')} primary> Go to dashboard - </Button> + </RedirectButton> </Root> ) @@ -26,6 +26,10 @@ const Root = styled.div` text-align: center; width: 90vw; ` +const RedirectButton = styled(Button)` + display: inline-flex; + align-self: center; +` const H2 = styled.h2` font-size: ${th('fontSizeHeading2')}; `