diff --git a/packages/component-faraday-ui/src/ActionLink.js b/packages/component-faraday-ui/src/ActionLink.js index 9f27cec30d1ba8e1584fed2f753653c952e23f77..05ad25cd28ff0ec15c333469b13f6ec6c16e9402 100644 --- a/packages/component-faraday-ui/src/ActionLink.js +++ b/packages/component-faraday-ui/src/ActionLink.js @@ -78,7 +78,7 @@ const Root = styled.div` ${marginHelper}; ${paddingHelper}; - height: max-content; + height: ${props => (props.height ? `${props.height}px` : 'max-content')}; width: max-content; & span { diff --git a/packages/component-faraday-ui/src/ManuscriptCard.js b/packages/component-faraday-ui/src/ManuscriptCard.js index ae360b12e7ae2b3220528f7e771b5cac322bd377..17e9e176354403406b6066cf5b09f589a9a93cfa 100644 --- a/packages/component-faraday-ui/src/ManuscriptCard.js +++ b/packages/component-faraday-ui/src/ManuscriptCard.js @@ -24,6 +24,7 @@ import { OpenModal } from './modals' const ManuscriptCard = ({ onDelete, canDelete, + isFetching, onCardClick, canViewReports, fragment = {}, @@ -87,16 +88,17 @@ const ManuscriptCard = ({ <Item justify="flex-end" onClick={e => e.stopPropagation()}> <OpenModal confirmText="Delete" + isFetching={isFetching} modalKey={`delete-${collId}`} onConfirm={onDelete} title="Are you sure you want to delete this submission?" > - {onClickEvent => ( + {showModal => ( <ActionLink + height={16} icon="trash" - onClick={onClickEvent} + onClick={showModal} size="small" - style={{ height: 16 }} > Delete </ActionLink> diff --git a/packages/components-faraday/src/components/Dashboard/Dashboard.js b/packages/components-faraday/src/components/Dashboard/Dashboard.js index 0c106443fd6d2da18ebbdce662c5d738bc6b8dd8..a03dce5045de7b34967ca35b9bc7c8d7ec24180c 100644 --- a/packages/components-faraday/src/components/Dashboard/Dashboard.js +++ b/packages/components-faraday/src/components/Dashboard/Dashboard.js @@ -4,12 +4,13 @@ import { compose, withProps } from 'recompose' import { DashboardItems, DashboardFilters } from './' const Dashboard = ({ - deleteProject, + journal, + isFetching, dashboardItems, + deleteCollection, getFilterOptions, changeFilterValue, getDefaultFilterValue, - journal, }) => ( <Fragment> <DashboardFilters @@ -17,7 +18,11 @@ const Dashboard = ({ getDefaultFilterValue={getDefaultFilterValue} getFilterOptions={getFilterOptions} /> - <DashboardItems deleteProject={deleteProject} list={dashboardItems} /> + <DashboardItems + deleteCollection={deleteCollection} + isFetching={isFetching} + list={dashboardItems} + /> </Fragment> ) diff --git a/packages/components-faraday/src/components/Dashboard/DashboardItems.js b/packages/components-faraday/src/components/Dashboard/DashboardItems.js index f5a5e24df3fff52a255f0a70b427cec11726a782..72d16891c5a40b967a4f7e5491dd9180c05e186d 100644 --- a/packages/components-faraday/src/components/Dashboard/DashboardItems.js +++ b/packages/components-faraday/src/components/Dashboard/DashboardItems.js @@ -5,9 +5,9 @@ import { connect } from 'react-redux' import styled from 'styled-components' import { th } from '@pubsweet/ui-toolkit' import { withRouter } from 'react-router-dom' -import { compose, setDisplayName, withHandlers, withProps } from 'recompose' import { ManuscriptCard, Row } from 'pubsweet-component-faraday-ui' import { canViewReports } from 'pubsweet-component-faraday-selectors' +import { compose, setDisplayName, withHandlers, withProps } from 'recompose' const DashboardItem = compose( connect((state, { collection }) => ({ @@ -18,7 +18,13 @@ const DashboardItem = compose( })), )(ManuscriptCard) -const DashboardItems = ({ list, onClick, deleteProject, canViewReports }) => ( +const DashboardItems = ({ + list, + onClick, + isFetching, + canViewReports, + deleteCollection, +}) => ( <Root data-test-id="dashboard-list-items"> {!list.length ? ( <Row justify="center" mt={4}> @@ -29,9 +35,10 @@ const DashboardItems = ({ list, onClick, deleteProject, canViewReports }) => ( <HideLoading key={collection.id}> <DashboardItem collection={collection} + isFetching={isFetching} key={collection.id} onClick={onClick} - onDelete={() => deleteProject(collection)} + onDelete={deleteCollection(collection)} /> </HideLoading> )) diff --git a/packages/components-faraday/src/components/Dashboard/DashboardPage.js b/packages/components-faraday/src/components/Dashboard/DashboardPage.js index eda5819b44ca04a7b91afc876a6cec42bba2569c..2aadccce522ce995b4387b64b0f1b891433befe9 100644 --- a/packages/components-faraday/src/components/Dashboard/DashboardPage.js +++ b/packages/components-faraday/src/components/Dashboard/DashboardPage.js @@ -4,8 +4,9 @@ import { actions } from 'pubsweet-client' import { withJournal } from 'xpub-journal' import { ConnectPage } from 'xpub-connect' import { withRouter } from 'react-router-dom' -import { compose, withContext } from 'recompose' import { selectCurrentUser } from 'xpub-selectors' +import { compose, withHandlers, withContext } from 'recompose' +import { handleError, withFetching } from 'pubsweet-component-faraday-ui' import { getUserPermissions, @@ -32,13 +33,13 @@ export default compose( userPermissions, } }, - dispatch => ({ - deleteProject: collection => - dispatch(actions.deleteCollection(collection)), - }), + { + deleteCollection: actions.deleteCollection, + }, ), withRouter, withJournal, + withFetching, withFiltersHOC({ priority: priorityFilter, order: orderFilter, @@ -50,4 +51,23 @@ export default compose( }, ({ journal, currentUser }) => ({ journal, currentUser }), ), + withHandlers({ + deleteCollection: ({ setFetching, deleteCollection }) => collection => ({ + hideModal, + setModalError, + }) => { + setFetching(true) + deleteCollection(collection) + .then(() => { + setFetching(false) + hideModal() + }) + // again, the error is not being thrown from deleteCollection action and + // the catch is never run + .catch(err => { + setFetching(false) + handleError(setModalError)(err) + }) + }, + }), )(Dashboard)