diff --git a/js/components/landing/Landing.js b/js/components/landing/Landing.js index b8e8ab972..6f4b69f53 100644 --- a/js/components/landing/Landing.js +++ b/js/components/landing/Landing.js @@ -15,7 +15,7 @@ import { resetCurrentCompoundsSettings } from '../preview/compounds/redux/action import { resetProjectsReducer } from '../projects/redux/actions'; const Landing = memo( - ({ resetSelectionState, resetTargetState, resetCurrentCompoundsSettings, resetProjectsReducer, history }) => { + ({ resetSelectionState, resetTargetState, resetCurrentCompoundsSettings, resetProjectsReducer }) => { const { setSnackBarTitle } = useContext(HeaderContext); const [loginText, setLoginText] = useState("You're logged in as " + DJANGO_CONTEXT['username']); @@ -54,7 +54,7 @@ const Landing = memo( {/**/} - + ); diff --git a/js/components/preview/Preview.js b/js/components/preview/Preview.js index 3231b6610..3506bc4a9 100644 --- a/js/components/preview/Preview.js +++ b/js/components/preview/Preview.js @@ -63,7 +63,7 @@ const useStyles = makeStyles(theme => ({ } })); -const Preview = memo(({ isStateLoaded, headerHeight, match }) => { +const Preview = memo(({ isStateLoaded, headerHeight }) => { const classes = useStyles(); const theme = useTheme(); @@ -153,7 +153,7 @@ const Preview = memo(({ isStateLoaded, headerHeight, match }) => { - + ); }); diff --git a/js/components/preview/withLoadingProtein.js b/js/components/preview/withLoadingProtein.js index bb1acadb3..af448d8ca 100644 --- a/js/components/preview/withLoadingProtein.js +++ b/js/components/preview/withLoadingProtein.js @@ -5,18 +5,20 @@ import React, { memo, useContext, useEffect } from 'react'; import { connect } from 'react-redux'; import { NglContext } from '../nglView/nglProvider'; import { shouldLoadProtein } from './redux/dispatchActions'; +import { useRouteMatch } from 'react-router-dom'; // is responsible for loading molecules list export const withLoadingProtein = WrappedComponent => { - const ProteinLoader = memo(({ isStateLoaded, shouldLoadProtein, match, ...rest }) => { + const ProteinLoader = memo(({ isStateLoaded, shouldLoadProtein, ...rest }) => { const { nglViewList } = useContext(NglContext); + let match = useRouteMatch(); const projectId = match && match.params && match.params.projectId; useEffect(() => { shouldLoadProtein(nglViewList, isStateLoaded, projectId); }, [isStateLoaded, nglViewList, projectId, shouldLoadProtein]); - return ; + return ; }); function mapStateToProps(state) { diff --git a/js/components/projects/index.js b/js/components/projects/index.js index dd3796690..9af35dd21 100644 --- a/js/components/projects/index.js +++ b/js/components/projects/index.js @@ -35,7 +35,7 @@ const useStyles = makeStyles(theme => ({ } })); -export const Projects = memo(({ history }) => { +export const Projects = memo(({}) => { const classes = useStyles(); const [page, setPage] = React.useState(0); const [rowsPerPage, setRowsPerPage] = React.useState(10); @@ -146,7 +146,7 @@ export const Projects = memo(({ history }) => { - + ); }); diff --git a/js/components/projects/projectModal/index.js b/js/components/projects/projectModal/index.js index 538cd0f2b..6d01e4e51 100644 --- a/js/components/projects/projectModal/index.js +++ b/js/components/projects/projectModal/index.js @@ -15,6 +15,7 @@ import { } from '@material-ui/core'; import { Title, Description, Label, Link } from '@material-ui/icons'; import { Autocomplete } from '@material-ui/lab'; +import { useHistory } from 'react-router-dom'; import { DJANGO_CONTEXT } from '../../../utils/djangoContext'; import { InputFieldAvatar } from './inputFieldAvatar'; import { ProjectCreationType } from '../redux/constants'; @@ -42,9 +43,10 @@ const useStyles = makeStyles(theme => ({ } })); -export const ProjectModal = memo(({ history }) => { +export const ProjectModal = memo(({}) => { const classes = useStyles(); const [state, setState] = useState(); + let history = useHistory(); const dispatch = useDispatch(); const isProjectModalOpen = useSelector(state => state.projectReducers.isProjectModalOpen); @@ -99,12 +101,12 @@ export const ProjectModal = memo(({ history }) => { .then(response => { const projectID = response.data.id; const title = response.data.title; - const author = response.data.author; + const authorID = response.data.author; const description = response.data.description; - const targetId = response.data.target; + const targetID = response.data.target; const tags = response.data.tags; - dispatch(setCurrentProject({ projectID, author, title, description, targetId, tags })); + dispatch(setCurrentProject({ projectID, authorID, title, description, targetID, tags })); // create project_target relationShip on BE history.push(`${URLS.projects}${projectID}`); }) diff --git a/js/components/projects/redux/actions.js b/js/components/projects/redux/actions.js index 90c5603af..c7b662d69 100644 --- a/js/components/projects/redux/actions.js +++ b/js/components/projects/redux/actions.js @@ -1,8 +1,8 @@ import { constants } from './constants'; -export const setCurrentProject = ({ projectID, author, title, description, targetId, tags, type }) => ({ +export const setCurrentProject = ({ projectID, authorID, title, description, targetID, tags, type }) => ({ type: constants.SET_CURRENT_PROJECT, - payload: { projectID, author, title, description, targetId, tags, type } + payload: { projectID, authorID, title, description, targetID, tags, type } }); export const setCurrentProjectProperty = (key, value) => ({ type: constants.SET_CURRENT_PROJECT_PROPERTY, diff --git a/js/components/projects/redux/reducer.js b/js/components/projects/redux/reducer.js index a391e3767..0cc8a6560 100644 --- a/js/components/projects/redux/reducer.js +++ b/js/components/projects/redux/reducer.js @@ -2,11 +2,11 @@ import { constants } from './constants'; export const INITIAL_STATE = { currentProject: { - projectID: null, // TODO change to null - author: null, + projectID: null, + authorID: null, title: null, description: null, - targetId: null, //TODO change to null, + targetID: null, tags: [], type: null }, diff --git a/js/components/routes/Routes.js b/js/components/routes/Routes.js index 799b70051..3c2550301 100644 --- a/js/components/routes/Routes.js +++ b/js/components/routes/Routes.js @@ -50,7 +50,7 @@ const Routes = memo(() => { exact path={`${URLS.projects}:projectId`} render={routeProps => ( - + )} /> diff --git a/js/components/snapshot/modals/newSnapshotModal.js b/js/components/snapshot/modals/newSnapshotModal.js index 8dbe9f7c9..c8857e54b 100644 --- a/js/components/snapshot/modals/newSnapshotModal.js +++ b/js/components/snapshot/modals/newSnapshotModal.js @@ -4,12 +4,14 @@ import { useDispatch, useSelector } from 'react-redux'; import { setOpenSnapshotSavingDialog } from '../redux/actions'; import { Typography } from '@material-ui/core'; import { AddProjectDetail } from '../../projects/addProjectDetail'; +import { useRouteMatch } from 'react-router-dom'; -export const NewSnapshotModal = memo(({ match }) => { +export const NewSnapshotModal = memo(({}) => { const dispatch = useDispatch(); const openSavingDialog = useSelector(state => state.snapshotReducers.openSavingDialog); const dialogCurrentStep = useSelector(state => state.snapshotReducers.dialogCurrentStep); const currectProject = useSelector(state => state.projectReducers.currentProject); + let match = useRouteMatch(); const projectId = (match && match.params && match.params.projectId) || (currectProject && currectProject.projectID); diff --git a/js/components/snapshot/withSnapshotManagement.js b/js/components/snapshot/withSnapshotManagement.js index fad5e6cf4..c4de33d2d 100644 --- a/js/components/snapshot/withSnapshotManagement.js +++ b/js/components/snapshot/withSnapshotManagement.js @@ -8,15 +8,16 @@ import { NglContext } from '../nglView/nglProvider'; import { HeaderContext } from '../header/headerContext'; import { setTargetAndReloadSession, reloadScene } from './redux/dispatchActions'; import { setOpenSnapshotSavingDialog } from './redux/actions'; +import { useRouteMatch } from 'react-router-dom'; /** * Created by ricgillams on 13/06/2018. */ export const withSnapshotManagement = WrappedComponent => { - return memo(({ match, ...rest }) => { + return memo(({ ...rest }) => { const [state, setState] = useState(); - + let match = useRouteMatch(); const { pathname } = window.location; const { nglViewList } = useContext(NglContext); const { setHeaderNavbarTitle, setHeaderButtons, setSnackBarTitle, setSnackBarColor } = useContext(HeaderContext); @@ -90,6 +91,6 @@ export const withSnapshotManagement = WrappedComponent => { projectId ]); - return ; + return ; }); }; diff --git a/js/components/target/redux/dispatchActions.js b/js/components/target/redux/dispatchActions.js index 958c6cd02..27943cbcb 100644 --- a/js/components/target/redux/dispatchActions.js +++ b/js/components/target/redux/dispatchActions.js @@ -10,6 +10,8 @@ import { import { setOldUrl } from './actions'; import { api } from '../../../utils/api'; import { resetSelectionState } from '../../../reducers/selection/actions'; +import { base_url } from '../../routes/constants'; +import { setCurrentProject } from '../../projects/redux/actions'; export const loadTargetList = onCancel => (dispatch, getState) => { const oldUrl = getState().targetReducers.oldUrl; @@ -24,7 +26,7 @@ export const loadTargetList = onCancel => (dispatch, getState) => { }); }; -export const updateTarget = ({ notCheckTarget, target, setIsLoading, targetIdList, targetId }) => dispatch => { +export const updateTarget = ({ notCheckTarget, target, setIsLoading, targetIdList, projectId }) => dispatch => { if (!notCheckTarget) { // Get from the REST API let targetUnrecognisedFlag = true; @@ -37,29 +39,43 @@ export const updateTarget = ({ notCheckTarget, target, setIsLoading, targetIdLis }); } dispatch(setTargetUnrecognised(targetUnrecognisedFlag)); - } else if (targetId !== undefined) { - if (targetIdList && targetIdList.length > 0) { - targetIdList.forEach(item => { - if (targetId === item.id) { - targetUnrecognisedFlag = false; - } - }); - } + } else if (projectId !== undefined) { + targetUnrecognisedFlag = false; dispatch(setTargetUnrecognised(targetUnrecognisedFlag)); } + // for Targets if (targetUnrecognisedFlag === false) { setIsLoading(true); - let url = ''; + let url = undefined; if (target) { - url = `${window.location.protocol}//${window.location.host}/api/targets/?title=${target}`; - } else if (targetId) { - url = `${window.location.protocol}//${window.location.host}/api/targets/?id=${targetId}`; + url = `${base_url}/api/targets/?title=${target}`; + return api({ url }) + .then(response => { + return dispatch(setTargetOn(response.data['results'][0].id)); + }) + .finally(() => setIsLoading(false)); + } + // for Projects + else if (projectId !== undefined) { + setIsLoading(true); + return api({ url: `${base_url}/api/session-projects/${projectId}/` }) + .then(response => { + return Promise.all([ + dispatch(setTargetOn(response.data.target.id)), + dispatch( + setCurrentProject({ + projectID: response.data.id, + authorID: response.data.author.id, + title: response.data.title, + description: response.data.description, + targetID: response.data.target.id, + tags: JSON.parse(response.data.tags) + }) + ) + ]); + }) + .finally(() => setIsLoading(false)); } - return api({ url }) - .then(response => { - return dispatch(setTargetOn(response.data['results'][0].id)); - }) - .finally(() => setIsLoading(false)); } } return Promise.resolve(); diff --git a/js/components/target/withUpdatingTarget.js b/js/components/target/withUpdatingTarget.js index 7257d6111..fe6a92ac3 100644 --- a/js/components/target/withUpdatingTarget.js +++ b/js/components/target/withUpdatingTarget.js @@ -3,11 +3,11 @@ import { connect } from 'react-redux'; import { HeaderContext } from '../header/headerContext'; import HandleUnrecognisedTarget from './handleUnrecognisedTarget'; import { updateTarget, setTargetUUIDs, resetTargetAndSelection } from './redux/dispatchActions'; +import { useRouteMatch } from 'react-router-dom'; export const withUpdatingTarget = WrappedContainer => { const UpdateTarget = memo( ({ - match, target_on, resetSelection, notCheckTarget, @@ -15,12 +15,14 @@ export const withUpdatingTarget = WrappedContainer => { setTargetUUIDs, resetTargetAndSelection, targetIdList, - targetId, ...rest }) => { + let match = useRouteMatch(); + const target = match && match.params && match.params.target; - const uuid = targetId !== null ? targetId : match && match.params && match.params.uuid; + const uuid = match && match.params && match.params.uuid; const snapshotUuid = match && match.params && match.params.snapshotUuid; + const projectId = match && match.params && match.params.projectId; const { isLoading, setIsLoading } = useContext(HeaderContext); const [state, setState] = useState(); @@ -34,19 +36,19 @@ export const withUpdatingTarget = WrappedContainer => { }, [setTargetUUIDs, snapshotUuid, uuid]); useEffect(() => { - updateTarget({ notCheckTarget, target, targetId, setIsLoading, targetIdList }).catch(error => { + updateTarget({ notCheckTarget, target, setIsLoading, targetIdList, projectId }).catch(error => { setState(() => { throw error; }); }); - }, [notCheckTarget, setIsLoading, target, updateTarget, targetIdList, targetId]); + }, [notCheckTarget, setIsLoading, target, updateTarget, targetIdList, projectId]); if (isLoading === true) { return null; } else if (target_on === undefined) { return ; } else { - return ; + return ; } } ); @@ -54,8 +56,7 @@ export const withUpdatingTarget = WrappedContainer => { function mapStateToProps(state) { return { target_on: state.apiReducers.target_on, - targetIdList: state.apiReducers.target_id_list, - targetId: state.projectReducers.currentProject.targetId + targetIdList: state.apiReducers.target_id_list }; } const mapDispatchToProps = { diff --git a/js/reducers/api/apiReducers.js b/js/reducers/api/apiReducers.js index 32a5ab2a9..7c89b2aa3 100644 --- a/js/reducers/api/apiReducers.js +++ b/js/reducers/api/apiReducers.js @@ -30,7 +30,7 @@ export const INITIAL_STATE = { latestSession: undefined, latestSnapshot: undefined, targetUnrecognised: undefined, - uuid: savingStateConst.UNSET, + uuid: savingStateConst.UNSET, // used only for reloading from scene sessionId: undefined, sessionIdList: [], sessionTitle: undefined, diff --git a/yarn.lock b/yarn.lock index 740736718..9abadbceb 100644 --- a/yarn.lock +++ b/yarn.lock @@ -764,7 +764,14 @@ "@babel/plugin-transform-react-jsx-self" "^7.7.4" "@babel/plugin-transform-react-jsx-source" "^7.7.4" -"@babel/runtime@^7.1.2", "@babel/runtime@^7.3.1", "@babel/runtime@^7.4.0", "@babel/runtime@^7.4.4", "@babel/runtime@^7.4.5", "@babel/runtime@^7.5.5", "@babel/runtime@^7.6.2", "@babel/runtime@^7.6.3": +"@babel/runtime@^7.1.2", "@babel/runtime@^7.4.0": + version "7.8.7" + resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.8.7.tgz#8fefce9802db54881ba59f90bb28719b4996324d" + integrity sha512-+AATMUFppJDw6aiR5NVPHqIQBlV/Pj8wY/EZH+lmvRdUo9xBaz/rF3alAwFJQavvKfeOlPE7oaaDHVbcySbCsg== + dependencies: + regenerator-runtime "^0.13.4" + +"@babel/runtime@^7.3.1", "@babel/runtime@^7.4.4", "@babel/runtime@^7.4.5", "@babel/runtime@^7.5.5", "@babel/runtime@^7.6.2", "@babel/runtime@^7.6.3": version "7.7.2" resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.7.2.tgz#111a78002a5c25fc8e3361bedc9529c696b85a6a" integrity sha512-JONRbXbTXc9WQE2mAZd1p0Z3DZ/6vaQIkgYMSTP3KjRCyd7rCZCcfhCyX+YjwcKxcZ82UrxbRD358bpExNgrjw== @@ -4559,20 +4566,20 @@ hmac-drbg@^1.0.0: minimalistic-assert "^1.0.0" minimalistic-crypto-utils "^1.0.1" -hoist-non-react-statics@^3.1.0, hoist-non-react-statics@^3.2.1, hoist-non-react-statics@^3.3.0: - version "3.3.0" - resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.0.tgz#b09178f0122184fb95acf525daaecb4d8f45958b" - integrity sha512-0XsbTXxgiaCDYDIWFcwkmerZPSwywfUqYmwT4jzewKTQSWoE6FCMoUVOeBJWK3E/CrWbxRG3m5GzY4lnIwGRBA== - dependencies: - react-is "^16.7.0" - -hoist-non-react-statics@^3.3.2: +hoist-non-react-statics@^3.1.0, hoist-non-react-statics@^3.3.2: version "3.3.2" resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45" integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw== dependencies: react-is "^16.7.0" +hoist-non-react-statics@^3.2.1, hoist-non-react-statics@^3.3.0: + version "3.3.0" + resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.0.tgz#b09178f0122184fb95acf525daaecb4d8f45958b" + integrity sha512-0XsbTXxgiaCDYDIWFcwkmerZPSwywfUqYmwT4jzewKTQSWoE6FCMoUVOeBJWK3E/CrWbxRG3m5GzY4lnIwGRBA== + dependencies: + react-is "^16.7.0" + homedir-polyfill@^1.0.1: version "1.0.3" resolved "https://registry.yarnpkg.com/homedir-polyfill/-/homedir-polyfill-1.0.3.tgz#743298cef4e5af3e194161fbadcc2151d3a058e8" @@ -7595,7 +7602,12 @@ react-is@^16.12.0, react-is@^16.8.0, react-is@^16.8.4, react-is@^16.8.6: resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.12.0.tgz#2cc0fe0fba742d97fd527c42a13bec4eeb06241c" integrity sha512-rPCkf/mWBtKc97aLL9/txD8DZdemK0vkA3JMLShjlJB3Pj3s+lpf1KaBzMfQrAmhMQB0n1cU/SUGgKKBCe837Q== -react-is@^16.6.0, react-is@^16.7.0, react-is@^16.8.1, react-is@^16.9.0: +react-is@^16.6.0: + version "16.13.0" + resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.0.tgz#0f37c3613c34fe6b37cd7f763a0d6293ab15c527" + integrity sha512-GFMtL0vHkiBv9HluwNZTggSn/sCyEt9n02aM0dSAjGGyqyNlAyftYm4phPxdvCigG15JreC5biwxCgTAJZ7yAA== + +react-is@^16.7.0, react-is@^16.8.1, react-is@^16.9.0: version "16.11.0" resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.11.0.tgz#b85dfecd48ad1ce469ff558a882ca8e8313928fa" integrity sha512-gbBVYR2p8mnriqAwWx9LbuUrShnAuSCNnuPGyc7GJrMVQtPDAh8iLpv7FRuMPFb56KkaVZIYSz1PrjI9q0QPCw== @@ -7833,6 +7845,11 @@ regenerator-runtime@^0.13.2: resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.3.tgz#7cf6a77d8f5c6f60eb73c5fc1955b2ceb01e6bf5" integrity sha512-naKIZz2GQ8JWh///G7L3X6LaQUAMp2lvb1rvwwsURe/VXwD6VMfr+/1NuNw3ag8v2kY1aQ/go5SNn79O9JU7yw== +regenerator-runtime@^0.13.4: + version "0.13.5" + resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.5.tgz#d878a1d094b4306d10b9096484b33ebd55e26697" + integrity sha512-ZS5w8CpKFinUzOwW3c83oPeVXoNsrLsaCoLtJvAClH135j/R77RuymhiSErhm2lKcwSCIpmvIWSbDkIfAqKQlA== + regenerator-transform@^0.14.0: version "0.14.1" resolved "https://registry.yarnpkg.com/regenerator-transform/-/regenerator-transform-0.14.1.tgz#3b2fce4e1ab7732c08f665dfdb314749c7ddd2fb" @@ -8878,9 +8895,9 @@ timers-browserify@^2.0.4: setimmediate "^1.0.4" tiny-invariant@^1.0.2: - version "1.0.6" - resolved "https://registry.yarnpkg.com/tiny-invariant/-/tiny-invariant-1.0.6.tgz#b3f9b38835e36a41c843a3b0907a5a7b3755de73" - integrity sha512-FOyLWWVjG+aC0UqG76V53yAWdXfH8bO6FNmyZOuUrzDzK8DI3/JRY25UD7+g49JWM1LXwymsKERB+DzI0dTEQA== + version "1.1.0" + resolved "https://registry.yarnpkg.com/tiny-invariant/-/tiny-invariant-1.1.0.tgz#634c5f8efdc27714b7f386c35e6760991d230875" + integrity sha512-ytxQvrb1cPc9WBEI/HSeYYoGD0kWnGEOR8RY6KomWLBVhqz0RgTwVO9dLrGz7dC+nN9llyI7OKAgRq8Vq4ZBSw== tiny-warning@^1.0.0, tiny-warning@^1.0.2: version "1.0.3"