Skip to content

Commit 90fe890

Browse files
Squashed commit of the following: (#441)
commit e613216 Author: Boris Kovar <boris.kovar@m2ms.sk> Date: Wed Jul 31 13:57:02 2024 +0200 - implemented #1251
1 parent 2ee9c82 commit 90fe890

22 files changed

+1232
-1001
lines changed

js/components/datasets/compoundSetList.js

-1
Original file line numberDiff line numberDiff line change
@@ -73,7 +73,6 @@ export const CompoundSetList = () => {
7373
const greenInput = useSelector(state => state.previewReducers.compounds[compoundsColors.green.key]);
7474
const purpleInput = useSelector(state => state.previewReducers.compounds[compoundsColors.purple.key]);
7575
const apricotInput = useSelector(state => state.previewReducers.compounds[compoundsColors.apricot.key]);
76-
const targetName = useSelector(state => state.apiReducers.target_on_name);
7776

7877
const inputs = {
7978
[compoundsColors.blue.key]: blueInput,

js/components/header/index.js

+4-2
Original file line numberDiff line numberDiff line change
@@ -67,6 +67,7 @@ import { getVersions } from '../../utils/version';
6767
import { AddProjectDetail } from '../projects/addProjectDetail';
6868
import { ServicesStatusWrapper } from '../services';
6969
import { COMPANIES, get_logo } from '../funders/constants';
70+
import { setEditTargetDialogOpen } from '../target/redux/actions';
7071

7172
const useStyles = makeStyles(theme => ({
7273
padding: {
@@ -271,8 +272,8 @@ export default memo(
271272
targetName !== undefined ? (
272273
<>
273274
{currentProject.authorID === null ||
274-
currentProject.projectID === null ||
275-
currentProject.authorID === userId ? (
275+
currentProject.projectID === null ||
276+
currentProject.authorID === userId ? (
276277
<Button
277278
onClick={() => {
278279
isProjectModalLoading === false
@@ -551,6 +552,7 @@ export default memo(
551552
</ListItemIcon>
552553
<ListItemText primary="Home" />
553554
</ListItem>
555+
554556
<Divider />
555557

556558
<ListItem button onClick={() => history.push(URLS.projects)}>

js/components/landing/Landing.js

+60-26
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
import { Grid, Link, makeStyles } from '@material-ui/core';
55
import React, { memo, useCallback, useContext, useEffect, useState } from 'react';
66
import { TargetList } from '../target/targetList';
7-
import { connect } from 'react-redux';
7+
import { connect, useDispatch, useSelector } from 'react-redux';
88
import * as apiActions from '../../reducers/api/actions';
99
import * as selectionActions from '../../reducers/selection/actions';
1010
import { DJANGO_CONTEXT } from '../../utils/djangoContext';
@@ -13,6 +13,8 @@ import { resetCurrentCompoundsSettings } from '../preview/compounds/redux/action
1313
import { resetProjectsReducer } from '../projects/redux/actions';
1414
import { withLoadingProjects } from '../target/withLoadingProjects';
1515
import { ToastContext } from '../toast';
16+
import { EditTargetDialog } from '../target/editTargetDialog';
17+
import { TOAST_LEVELS } from '../toast/constants';
1618

1719
const useStyles = makeStyles(theme => ({
1820
root: {
@@ -25,17 +27,43 @@ const useStyles = makeStyles(theme => ({
2527

2628
const Landing = memo(
2729
({ resetSelectionState, resetTargetState, resetCurrentCompoundsSettings, resetProjectsReducer }) => {
30+
const dispatch = useDispatch();
2831
const classes = useStyles();
2932

3033
const projectWidth = window.innerWidth;
3134
const [isResizing, setIsResizing] = useState(false);
3235
const [targetListWidth, setTargetListWidth] = useState(450);
3336
const [projectListWidth, setProjectListWidth] = useState(projectWidth);
3437

35-
const { toast } = useContext(ToastContext);
38+
const { toast, toastSuccess, toastError, toastInfo, toastWarning } = useContext(ToastContext);
3639
const [loginText, setLoginText] = useState(
3740
DJANGO_CONTEXT['username'] === 'NOT_LOGGED_IN' ? '' : "You're logged in as " + DJANGO_CONTEXT['username']
3841
);
42+
const toastMessages = useSelector(state => state.selectionReducers.toastMessages);
43+
44+
useEffect(() => {
45+
if (toastMessages?.length > 0) {
46+
toastMessages.forEach(message => {
47+
switch (message.level) {
48+
case TOAST_LEVELS.SUCCESS:
49+
toastSuccess(message.text);
50+
break;
51+
case TOAST_LEVELS.ERROR:
52+
toastError(message.text);
53+
break;
54+
case TOAST_LEVELS.INFO:
55+
toastInfo(message.text);
56+
break;
57+
case TOAST_LEVELS.WARNING:
58+
toastWarning(message.text);
59+
break;
60+
default:
61+
break;
62+
}
63+
});
64+
dispatch(selectionActions.setToastMessages([]));
65+
}
66+
}, [dispatch, toastError, toastInfo, toastMessages, toastSuccess, toastWarning]);
3967

4068
useEffect(() => {
4169
if (DJANGO_CONTEXT['authenticated'] !== true) {
@@ -67,13 +95,16 @@ const Landing = memo(
6795
setIsResizing(true);
6896
};
6997

70-
const handleMouseMove = useCallback(e => {
71-
if (!isResizing) return;
72-
const targetListWidth = e.clientX;
73-
const projectListWidth = window.innerWidth - targetListWidth;
74-
setTargetListWidth(targetListWidth);
75-
setProjectListWidth(projectListWidth);
76-
}, [isResizing]);
98+
const handleMouseMove = useCallback(
99+
e => {
100+
if (!isResizing) return;
101+
const targetListWidth = e.clientX;
102+
const projectListWidth = window.innerWidth - targetListWidth;
103+
setTargetListWidth(targetListWidth);
104+
setProjectListWidth(projectListWidth);
105+
},
106+
[isResizing]
107+
);
77108

78109
const handleMouseUp = useCallback(() => {
79110
setIsResizing(false);
@@ -92,24 +123,27 @@ const Landing = memo(
92123
}, [isResizing, handleMouseMove, handleMouseUp]);
93124

94125
return (
95-
<Grid container className={classes.root}>
96-
<Grid item style={{ width: targetListWidth }}>
97-
<TargetList />
98-
</Grid>
99-
<div
100-
style={{
101-
cursor: 'col-resize',
102-
width: 3,
103-
height: '100%',
104-
backgroundColor: '#eeeeee',
105-
borderRadius: '3px'
106-
}}
107-
onMouseDown={handleMouseDownResizer}
108-
></div>
109-
<Grid item style={{ width: projectListWidth }}>
110-
<Projects />
126+
<>
127+
<Grid container className={classes.root}>
128+
<Grid item style={{ width: targetListWidth }}>
129+
<TargetList />
130+
</Grid>
131+
<div
132+
style={{
133+
cursor: 'col-resize',
134+
width: 3,
135+
height: '100%',
136+
backgroundColor: '#eeeeee',
137+
borderRadius: '3px'
138+
}}
139+
onMouseDown={handleMouseDownResizer}
140+
></div>
141+
<Grid item style={{ width: projectListWidth }}>
142+
<Projects />
143+
</Grid>
111144
</Grid>
112-
</Grid>
145+
<EditTargetDialog />
146+
</>
113147
);
114148
}
115149
);

js/components/preview/projectHistoryPanel/JobConfigurationDialog.js

-2
Original file line numberDiff line numberDiff line change
@@ -195,8 +195,6 @@ const JobConfigurationDialog = ({ snapshots }) => {
195195
const currentSnapshotSelectedCompoundsIDs = useSelector(state => state.selectionReducers.moleculesToEdit);
196196
const currentSnapshotVisibleCompoundsIDs = useSelector(state => state.selectionReducers.fragmentDisplayList);
197197

198-
const target_on_name = useSelector(state => state.apiReducers.target_on_name);
199-
200198
const getMoleculeTitle = title => {
201199
return title.replace(new RegExp(':.*$', 'i'), '');
202200
};

js/components/preview/redux/dispatchActions.js

+10-3
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,10 @@ export const shouldLoadProtein = ({
5252
}) => (dispatch, getState) => {
5353
const state = getState();
5454
const targetIdList = state.apiReducers.target_id_list;
55-
const targetOnName = state.apiReducers.target_on_name;
55+
const targetOnId = state.apiReducers.target_on;
56+
57+
const targetOn = targetIdList.find(target => target.id === targetOnId);
58+
5659
const isRestoring = state.trackingReducers.isActionRestoring;
5760
if (
5861
targetIdList &&
@@ -90,8 +93,12 @@ export const shouldLoadProtein = ({
9093
dispatch(restoreAfterTargetActions(nglViewList, routeProjectID, currentSnapshotID));
9194
}
9295

93-
if (targetOnName !== undefined) {
94-
document.title = targetOnName + ': Fragalysis';
96+
if (targetOn !== undefined) {
97+
document.title = targetOn?.display_name
98+
? targetOn.display_name
99+
: targetOn?.title
100+
? targetOn.title
101+
: 'Unknown' + ': Fragalysis';
95102
}
96103
}
97104
};

js/components/projects/addProjectDetail/index.js

+6-3
Original file line numberDiff line numberDiff line change
@@ -44,14 +44,15 @@ const useStyles = makeStyles(theme => ({
4444
}
4545
}));
4646

47-
export const AddProjectDetail = memo(({ }) => {
47+
export const AddProjectDetail = memo(({}) => {
4848
const classes = useStyles();
4949
const [state, setState] = useState();
5050
let [createDiscourse, setCreateDiscourse] = useState(true);
5151

5252
const dispatch = useDispatch();
5353
const targetId = useSelector(state => state.apiReducers.target_on);
5454
const targetName = useSelector(state => state.apiReducers.target_on_name);
55+
const targetList = useSelector(state => state.apiReducers.target_id_list);
5556
const sessionProjectID = useSelector(state => state.projectReducers.currentProject.projectID);
5657
const isProjectModalLoading = useSelector(state => state.projectReducers.isProjectModalLoading);
5758
const currentProject = useSelector(state => state.targetReducers.currentProject);
@@ -71,6 +72,8 @@ export const AddProjectDetail = memo(({ }) => {
7172

7273
createDiscourse &= dicourseUserAvailable;
7374

75+
const target = targetList.find(target => target.id === targetId);
76+
7477
const validateProjectName = async value => {
7578
let error;
7679

@@ -100,8 +103,8 @@ export const AddProjectDetail = memo(({ }) => {
100103
<ModalNewProject open={isProjectModalLoading}>
101104
<Formik
102105
initialValues={{
103-
title: targetName + actualDate,
104-
description: 'Project created from ' + targetName,
106+
title: target?.display_name + actualDate,
107+
description: 'Project created from ' + target?.display_name,
105108
tags: ''
106109
}}
107110
validate={values => {

js/components/projects/projectModal/index.js

+20-16
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@ const useStyles = makeStyles(theme => ({
5555
}));
5656
let currantTargetId = 1;
5757

58-
export const ProjectModal = memo(({ }) => {
58+
export const ProjectModal = memo(({}) => {
5959
const classes = useStyles();
6060
const [state, setState] = useState();
6161
const [selectedTarget, setSelectedTarget] = useState(false);
@@ -77,7 +77,9 @@ export const ProjectModal = memo(({ }) => {
7777
);
7878
const targetList = useSelector(state => state.apiReducers.target_id_list);
7979
const currantProject = useSelector(state => state.targetReducers.currantProject);
80-
const currantTarget = useSelector(state => state.apiReducers.target_on_name);
80+
const targetId = useSelector(state => state.apiReducers.target_on);
81+
82+
const currentTarget = targetList.find(target => target.id === targetId);
8183

8284
const actualDate = moment().format('-YYYY-MM-DD');
8385

@@ -123,33 +125,32 @@ export const ProjectModal = memo(({ }) => {
123125
};
124126

125127
let selectedValue = '';
126-
if (currantTarget !== undefined) {
127-
selectedValue = currantTarget;
128+
if (currentTarget?.display_name !== undefined) {
129+
selectedValue = currentTarget?.display_name;
128130
}
129131
targetList.map(target => {
130132
if (selectedValue === target.title && selectedTarget === false) {
131-
currantTargetId = target.id
133+
currantTargetId = target.id;
132134
}
133-
})
135+
});
134136

135-
const handleChangeTarget = (event) => {
137+
const handleChangeTarget = event => {
136138
setSelectedTarget(true);
137139
selectedValue = event.target.value;
138140
targetList.map(target => {
139141
if (selectedValue === target.title) {
140-
currantTargetId = target.id
142+
currantTargetId = target.id;
141143
}
142-
})
143-
}
144-
144+
});
145+
};
145146

146147
return (
147148
<ModalNewProject open={isProjectModalOpen} onClose={handleCloseModal}>
148149
<Formik
149150
initialValues={{
150151
type: ProjectCreationType.NEW,
151-
title: currantTarget + actualDate,
152-
description: 'Project created from ' + currantTarget,
152+
title: currentTarget?.display_name + actualDate,
153+
description: 'Project created from ' + currentTarget?.display_name,
153154
targetId: currantTargetId,
154155
parentSnapshotId: '',
155156
tags: ''
@@ -307,10 +308,13 @@ export const ProjectModal = memo(({ }) => {
307308
<InputLabel htmlFor="selected-target" required disabled={isProjectModalLoading}>
308309
Target
309310
</InputLabel>
310-
<NativeSelect defaultValue={currantTarget} onChange={() => handleChangeTarget(event)}>
311+
<NativeSelect
312+
defaultValue={currentTarget?.display_name}
313+
onChange={() => handleChangeTarget(event)}
314+
>
311315
{targetList.map(data => (
312-
<option key={data.id} defaultValue={currantTarget}>
313-
{data.title}
316+
<option key={data.id} defaultValue={currentTarget?.display_name}>
317+
{data.display_name}
314318
</option>
315319
))}
316320
</NativeSelect>

js/components/snapshot/modals/downloadStructuresDialog.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -139,6 +139,8 @@ export const DownloadStructureDialog = memo(({}) => {
139139
const isOpen = useSelector(state => state.snapshotReducers.downloadStructuresDialogOpen);
140140
const targetId = useSelector(state => state.apiReducers.target_on);
141141
const targetName = useSelector(state => state.apiReducers.target_on_name);
142+
const targetIdList = useSelector(state => state.apiReducers.target_id_list);
143+
const target = targetIdList.find(t => t.id === targetId);
142144
const allMolecules = useSelector(state => state.apiReducers.all_mol_lists);
143145
const ligandsTurnedOnIds = useSelector(state => state.selectionReducers.fragmentDisplayList);
144146
const selectedMoleculesIds = useSelector(state => state.selectionReducers.moleculesToEdit);
@@ -500,7 +502,7 @@ export const DownloadStructureDialog = memo(({}) => {
500502
<div className={classes.root}>
501503
{!zipPreparing && !(generalError || backendError) && (
502504
<DialogTitle id="form-dialog-structures-title" disableTypography>
503-
<Typography variant="h5">{`Download structures and data for target ${targetName}`}</Typography>
505+
<Typography variant="h5">{`Download structures and data for target ${target?.display_name}`}</Typography>
504506
</DialogTitle>
505507
)}
506508
{zipPreparing && (

js/components/snapshot/withSnapshotManagement.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,9 @@ export const withSnapshotManagement = WrappedComponent => {
2727
const currentSnapshotID = useSelector(state => state.projectReducers.currentSnapshot.id);
2828

2929
const targetIdList = useSelector(state => state.apiReducers.target_id_list);
30-
const targetName = useSelector(state => state.apiReducers.target_on_name);
30+
const targetId = useSelector(state => state.apiReducers.target_on);
31+
const targetObj = targetIdList.find(t => t.id === targetId);
32+
const targetName = targetObj?.display_name;
3133
const currentSessionProject = useSelector(state => state.projectReducers.currentProject);
3234
const currentSnapshot = useSelector(state => state.projectReducers.currentSnapshot);
3335
const directDisplay = useSelector(state => state.apiReducers.direct_access);

0 commit comments

Comments
 (0)