From 95aa8996dad62a7525f7f0713b6d65fcbfd72c7d Mon Sep 17 00:00:00 2001 From: ag-m2ms Date: Mon, 18 Jan 2021 18:52:39 +0100 Subject: [PATCH] Initial implementation --- .../moleculeGroups/redux/dispatchActions.js | 4 +- js/components/routes/Routes.js | 14 +++++- js/components/snapshot/redux/actions.js | 5 +++ js/components/snapshot/redux/constants.js | 4 +- .../snapshot/redux/dispatchActions.js | 44 ++++++++++++++++++- js/components/snapshot/redux/reducer.js | 9 +++- .../snapshot/withSnapshotManagement.js | 32 +++++--------- 7 files changed, 84 insertions(+), 28 deletions(-) diff --git a/js/components/preview/moleculeGroups/redux/dispatchActions.js b/js/components/preview/moleculeGroups/redux/dispatchActions.js index 2c026fd1e..4b4545cfd 100644 --- a/js/components/preview/moleculeGroups/redux/dispatchActions.js +++ b/js/components/preview/moleculeGroups/redux/dispatchActions.js @@ -34,6 +34,7 @@ import { resetCurrentCompoundsSettings } from '../../compounds/redux/actions'; import { reloadSession } from '../../../snapshot/redux/dispatchActions'; import { resetRestoringState } from '../../../../reducers/tracking/dispatchActions'; import { selectJoinedMoleculeList } from '../../molecule/redux/selectors'; +import { URLS } from '../../../routes/constants'; export const clearAfterDeselectingMoleculeGroup = ({ molGroupId, currentMolGroup, majorViewStage }) => ( dispatch, @@ -269,8 +270,9 @@ export const restoreFromCurrentSnapshot = ({ nglViewList }) => (dispatch, getSta dispatch(reloadSession(snapshot, nglViewList)); }; -export const restoreSnapshotActions = ({ nglViewList }) => (dispatch, getState) => { +export const restoreSnapshotActions = ({ nglViewList, projectId, snapshotId, history }) => (dispatch, getState) => { dispatch(resetRestoringState(nglViewList)); + history.replace(`${URLS.projects}${projectId}/${snapshotId}`); }; export const onDeselectMoleculeGroup = ({ moleculeGroup, stageSummaryView, majorViewStage }) => ( diff --git a/js/components/routes/Routes.js b/js/components/routes/Routes.js index 798febe5b..cbf977c25 100644 --- a/js/components/routes/Routes.js +++ b/js/components/routes/Routes.js @@ -1,7 +1,7 @@ -import React, { memo, useContext } from 'react'; +import React, { memo, useContext, useEffect } from 'react'; import { Box, IconButton, makeStyles, Snackbar, useTheme } from '@material-ui/core'; import Header from '../header'; -import { Redirect, Route, Switch } from 'react-router-dom'; +import { Route, Switch, useLocation } from 'react-router-dom'; import { Management } from '../management/management'; import Tindspect from '../tindspect/Tindspect'; import Landing from '../landing/Landing'; @@ -17,6 +17,8 @@ import { Projects } from '../projects'; import { ProjectDetailSessionList } from '../projects/projectDetailSessionList'; import { SessionRedirect } from '../snapshot/sessionRedirect'; import { DirectDisplay } from '../direct/directDisplay'; +import { setSnapshotJustSaved } from '../snapshot/redux/actions'; +import { useDispatch } from 'react-redux'; const useStyles = makeStyles(theme => ({ content: { @@ -31,6 +33,9 @@ const Routes = memo(() => { const { headerHeight, setHeaderHeight, snackBarTitle, setSnackBarTitle } = useContext(HeaderContext); const contentHeight = `calc(100vh - ${headerHeight}px - ${2 * theme.spacing(1)}px)`; const contentWidth = `100%`; + + const dispatch = useDispatch(); + const location = useLocation(); const handleCloseSnackbar = (event, reason) => { if (reason === 'clickaway') { @@ -39,6 +44,11 @@ const Routes = memo(() => { setSnackBarTitle(null); }; + useEffect(() => { + dispatch(setSnapshotJustSaved(undefined)); + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [location]); + return (
diff --git a/js/components/snapshot/redux/actions.js b/js/components/snapshot/redux/actions.js index 517ef5e97..ce99d89c2 100644 --- a/js/components/snapshot/redux/actions.js +++ b/js/components/snapshot/redux/actions.js @@ -45,3 +45,8 @@ export const setDisableRedirect = (disable = false) => ({ type: constants.SET_DISABLE_REDIRECT, payload: disable }); + +export const setSnapshotJustSaved = (saved) => ({ + type: constants.SET_SNAPSHOT_JUST_SAVED, + payload: saved +}); diff --git a/js/components/snapshot/redux/constants.js b/js/components/snapshot/redux/constants.js index 0ae453145..33aee8a8c 100644 --- a/js/components/snapshot/redux/constants.js +++ b/js/components/snapshot/redux/constants.js @@ -17,5 +17,7 @@ export const constants = { SET_IS_OPEN_MODAL_BEFORE_EXIT: prefix + 'SET_IS_OPEN_MODAL_BEFORE_EXIT', SET_SELECTED_SNAPSHOT_TO_SWITCH: prefix + 'SET_SELECTED_SNAPSHOT_TO_SWITCH', - SET_DISABLE_REDIRECT: prefix + 'SET_DISABLE_REDIRECT' + SET_DISABLE_REDIRECT: prefix + 'SET_DISABLE_REDIRECT', + + SET_SNAPSHOT_JUST_SAVED: prefix + 'SET_SNAPSHOT_JUST_SAVED' }; diff --git a/js/components/snapshot/redux/dispatchActions.js b/js/components/snapshot/redux/dispatchActions.js index 6b50a8886..25043d191 100644 --- a/js/components/snapshot/redux/dispatchActions.js +++ b/js/components/snapshot/redux/dispatchActions.js @@ -7,7 +7,8 @@ import { setIsLoadingSnapshotDialog, setListOfSnapshots, setOpenSnapshotSavingDialog, - setSharedSnapshot + setSharedSnapshot, + setSnapshotJustSaved } from './actions'; import { DJANGO_CONTEXT } from '../../../utils/djangoContext'; import { @@ -32,6 +33,7 @@ import { manageSendTrackingActions } from '../../../reducers/tracking/dispatchActions'; import { captureScreenOfSnapshot } from '../../userFeedback/browserApi'; +import { setCurrentProject } from '../../projects/redux/actions'; export const getListOfSnapshots = () => (dispatch, getState) => { const userID = DJANGO_CONTEXT['pk'] || null; @@ -250,11 +252,49 @@ export const createNewSnapshot = ({ if (disableRedirect === false) { // Really bad usage or redirection. Hint for everybody in this line ignore it, but in other parts of code // use react-router ! - window.location.replace( + window.history.replaceState( + null, null, `${URLS.projects}${session_project}/${ selectedSnapshotToSwitch === null ? res.data.id : selectedSnapshotToSwitch }` ); + api({ url: `${base_url}/api/session-projects/${session_project}/` }).then(projectResponse => { + api({ url: `${base_url}/api/snapshots/?session_project=${session_project}&type=INIT` }).then(response => { + if (response.data.results.length === 0) { + dispatch(resetCurrentSnapshot()); + } else if (response.data.results[0] !== undefined) { + dispatch( + setCurrentSnapshot({ + id: response.data.results[0].id, + type: response.data.results[0].type, + title: response.data.results[0].title, + author: response.data.results[0].author, + description: response.data.results[0].description, + created: response.data.results[0].created, + children: response.data.results[0].children, + parent: response.data.results[0].parent, + data: '[]' + }) + ); + dispatch( + setCurrentProject({ + projectID: projectResponse.data.id, + authorID: (projectResponse.data.author && projectResponse.data.author.id) || null, + title: projectResponse.data.title, + description: projectResponse.data.description, + targetID: projectResponse.data.target.id, + tags: JSON.parse(projectResponse.data.tags) + }) + ); + dispatch(setOpenSnapshotSavingDialog(false)); + dispatch(setIsLoadingSnapshotDialog(false)); + dispatch(setSnapshotJustSaved(projectResponse.data.id)); + } + }) + .catch(error => { + dispatch(resetCurrentSnapshot()); + }) + }); } else { dispatch(setOpenSnapshotSavingDialog(false)); dispatch(setIsLoadingSnapshotDialog(false)); diff --git a/js/components/snapshot/redux/reducer.js b/js/components/snapshot/redux/reducer.js index db0c5569c..71ebe8f3c 100644 --- a/js/components/snapshot/redux/reducer.js +++ b/js/components/snapshot/redux/reducer.js @@ -21,7 +21,8 @@ export const INITIAL_STATE = { sharedSnapshot: initSharedSnapshot, isOpenModalSaveSnapshotBeforeExit: false, selectedSnapshotToSwitch: null, - disableRedirect: false + disableRedirect: false, + snapshotJustSaved: false }; export const snapshotReducers = (state = INITIAL_STATE, action = {}) => { @@ -88,6 +89,12 @@ export const snapshotReducers = (state = INITIAL_STATE, action = {}) => { disableRedirect: action.payload }); + case constants.SET_SNAPSHOT_JUST_SAVED: { + return Object.assign({}, state, { + snapshotJustSaved: action.payload + }); + } + default: return state; } diff --git a/js/components/snapshot/withSnapshotManagement.js b/js/components/snapshot/withSnapshotManagement.js index a4ff17cf1..ff5196d76 100644 --- a/js/components/snapshot/withSnapshotManagement.js +++ b/js/components/snapshot/withSnapshotManagement.js @@ -1,10 +1,10 @@ import React, { memo, useContext, useEffect } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import { Button } from '@material-ui/core'; -import { Save, Restore, Share, FormatListNumberedOutlined } from '@material-ui/icons'; +import { Save, Restore, Share } from '@material-ui/icons'; import DownloadPdb from './downloadPdb'; import { HeaderContext } from '../header/headerContext'; -import { useRouteMatch } from 'react-router-dom'; +import { useHistory, useRouteMatch } from 'react-router-dom'; import { DJANGO_CONTEXT } from '../../utils/djangoContext'; // import { useDisableUserInteraction } from '../helpers/useEnableUserInteracion'; import { activateSnapshotDialog, saveAndShareSnapshot } from './redux/dispatchActions'; @@ -17,6 +17,7 @@ import { restoreSnapshotActions } from '../preview/moleculeGroups/redux/dispatch export const withSnapshotManagement = WrappedComponent => { return memo(({ ...rest }) => { + const history = useHistory(); let match = useRouteMatch(); const { setHeaderNavbarTitle, setHeaderButtons, setSnackBarTitle, setSnackBarColor } = useContext(HeaderContext); const { nglViewList } = useContext(NglContext); @@ -28,9 +29,14 @@ export const withSnapshotManagement = WrappedComponent => { const targetIdList = useSelector(state => state.apiReducers.target_id_list); const targetName = useSelector(state => state.apiReducers.target_on_name); const currentProject = useSelector(state => state.projectReducers.currentProject); - const projectId = match && match.params && match.params.projectId; + const currentSnapshot = useSelector(state => state.projectReducers.currentSnapshot); const directDisplay = useSelector(state => state.apiReducers.direct_access); + + const snapshotJustSaved = useSelector(state => state.snapshotReducers.snapshotJustSaved); + let projectId = match && match.params && match.params.projectId; + projectId = snapshotJustSaved || projectId; let target = match && match.params && match.params.target; + target = snapshotJustSaved ? undefined : target; //const disableUserInteraction = useDisableUserInteraction(); if (directDisplay && directDisplay.target) { @@ -64,7 +70,7 @@ export const withSnapshotManagement = WrappedComponent => {