- #1190 - compounds for LHS

xchem · Nov 2, 2023 · 2833754 · 2833754
1 parent 0add335
commit 2833754
Show file tree

Hide file tree

Showing 6 changed files with 91 additions and 96 deletions.
diff --git a/js/components/preview/molecule/moleculeList.js b/js/components/preview/molecule/moleculeList.js
@@ -75,6 +75,7 @@ import useDisableNglControlButtons from './useDisableNglControlButtons';
 import GroupNglControlButtonsContext from './groupNglControlButtonsContext';
 import { extractTargetFromURLParam } from '../utils';
 import { LoadingContext } from '../../loading';
+import { DJANGO_CONTEXT } from '../../../utils/djangoContext';
 
 const useStyles = makeStyles(theme => ({
   container: {
@@ -847,7 +848,7 @@ export const MoleculeList = memo(({ hideProjects }) => {
     return molecules;
   };
 
-  const openGlobalTagEditor = () => { };
+  const openGlobalTagEditor = () => {};
 
   // let filterSearchString = '';
   // const getSearchedString = () => {
@@ -898,7 +899,12 @@ export const MoleculeList = memo(({ hideProjects }) => {
 
     <IconButton
       color={'inherit'}
-      disabled={!joinedMoleculeListsCopy.length || noTagsReceived || !tags.length}
+      disabled={
+        !joinedMoleculeListsCopy.length ||
+        noTagsReceived ||
+        !tags.length ||
+        DJANGO_CONTEXT['username'] === 'NOT_LOGGED_IN'
+      }
       onClick={event => {
         if (isTagEditorOpen === false) {
           setTagEditorAnchorEl(event.currentTarget);
@@ -1003,8 +1009,9 @@ export const MoleculeList = memo(({ hideProjects }) => {
                     {filter.priorityOrder.map(attr => (
                       <Grid item key={`Mol-Tooltip-${attr}`}>
                         <Tooltip
-                          title={`${filter.filter[attr].minValue}-${filter.filter[attr].maxValue} ${filter.filter[attr].order === 1 ? '\u2191' : '\u2193'
-                            }`}
+                          title={`${filter.filter[attr].minValue}-${filter.filter[attr].maxValue} ${
+                            filter.filter[attr].order === 1 ? '\u2191' : '\u2193'
+                          }`}
                           placement="top"
                         >
                           <Chip size="small" label={attr} style={{ backgroundColor: getAttrDefinition(attr).color }} />
@@ -1138,14 +1145,22 @@ export const MoleculeList = memo(({ hideProjects }) => {
           </Tooltip>
         )}
         <Grid style={{ marginTop: '4px' }}>
-          <Typography variant="caption" className={classes.noOfSelectedHits}>{`Selected: ${allSelectedMolecules ? allSelectedMolecules.length : 0
-            }`}</Typography>
+          <Typography variant="caption" className={classes.noOfSelectedHits}>{`Selected: ${
+            allSelectedMolecules ? allSelectedMolecules.length : 0
+          }`}</Typography>
         </Grid>
       </Grid>
       <Grid container spacing={1} direction="column" justifyContent="flex-start" className={classes.container}>
         <Grid item>
           {/* Header */}
-          <Grid container spacing={1} justifyContent="flex-start" direction="row" className={classes.molHeader} wrap="nowrap">
+          <Grid
+            container
+            spacing={1}
+            justifyContent="flex-start"
+            direction="row"
+            className={classes.molHeader}
+            wrap="nowrap"
+          >
             <Grid item container justifyContent="flex-start" direction="row">
               {Object.keys(moleculeProperty).map(key => (
                 <Grid item key={key} className={classes.rightBorder}>
@@ -1264,7 +1279,13 @@ export const MoleculeList = memo(({ hideProjects }) => {
             </Grid>
           </>
         )}
-        {moleculesAndTagsAreLoading && <Grid container direction="row" justifyContent="center"><Grid item><CircularProgress /></Grid></Grid>}
+        {moleculesAndTagsAreLoading && (
+          <Grid container direction="row" justifyContent="center">
+            <Grid item>
+              <CircularProgress />
+            </Grid>
+          </Grid>
+        )}
       </Grid>
     </Panel>
   );

diff --git a/js/components/preview/tags/api/tagsApi.js b/js/components/preview/tags/api/tagsApi.js
@@ -35,6 +35,14 @@ export const getAllDataNew = async targetId => {
   });
 };
 
+export const getCompoundsLHS = async targetId => {
+  return api({ url: `${base_url}/api/cmpdimg/?target=${targetId}` }).then(response => {
+    if (response?.data) {
+      return response.data?.results;
+    }
+  });
+};
+
 export const getTagMolecules = targetId => {
   return api({ url: `${base_url}/api/siteobservation_tag/?target=${targetId}` })
     .then(response => {

diff --git a/js/components/preview/tags/redux/dispatchActions.js b/js/components/preview/tags/redux/dispatchActions.js
@@ -27,11 +27,12 @@ import {
   setCategoryList,
   setTargetDataLoadingInProgress,
   setAllDataLoaded,
-  setMoleculeTags
+  setMoleculeTags,
+  setLHSCompoundsLIst
 } from '../../../../reducers/api/actions';
 import { setSortDialogOpen } from '../../molecule/redux/actions';
 import { resetCurrentCompoundsSettings } from '../../compounds/redux/actions';
-import { updateExistingTag, getTags, getAllDataNew, getTagCategories } from '../api/tagsApi';
+import { updateExistingTag, getTags, getAllDataNew, getTagCategories, getCompoundsLHS } from '../api/tagsApi';
 import {
   getMoleculeTagForTag,
   createMoleculeTagObject,
@@ -169,62 +170,6 @@ export const unselectTag = tag => (dispatch, getState) => {
   }
 };
 
-// export const loadMoleculesAndTags = targetId => async (dispatch, getState) => {
-//   return getAllData(targetId).then(data => {
-//     let tags_info = [];
-//     if (data.tags_info && data.tags_info.length > 0) {
-//       dispatch(setNoTagsReceived(false));
-//       data.tags_info.forEach(tag => {
-//         let newObject = {};
-//         Object.keys(tag.data[0]).forEach(prop => {
-//           newObject[`${prop}`] = tag.data[0][`${prop}`];
-//         });
-//         let coords = {};
-//         if (tag.coords && tag.coords.length > 1) {
-//           Object.keys(tag.coords[0]).forEach(prop => {
-//             coords[`${prop}`] = tag.coords[0][`${prop}`];
-//           });
-//         }
-//         newObject['coords'] = coords;
-
-//         if (!newObject.additional_info) {
-//           tags_info.push(newObject);
-//         }
-//       });
-//     }
-
-//     let allMolecules = [];
-//     data.molecules.forEach(mol => {
-//       let newObject = {};
-//       Object.keys(mol.data).forEach(prop => {
-//         newObject[`${prop}`] = mol.data[`${prop}`];
-//       });
-//       newObject['tags_set'] = mol.tags_set;
-
-//       allMolecules.push(newObject);
-//     });
-//     allMolecules.sort((a, b) => {
-//       if (a.protein_code < b.protein_code) {
-//         return -1;
-//       }
-//       if (a.protein_code > b.protein_code) {
-//         return 1;
-//       }
-//       return 0;
-//     });
-//     dispatch(setAllMolLists([...allMolecules]));
-
-//     //need to do this this way because only categories which have at least one tag assigned are sent from backend
-//     const categories = getCategoryIds();
-//     tags_info = tags_info.sort(compareTagsAsc);
-//     dispatch(setTagSelectorData(categories, tags_info));
-//     dispatch(setAllDataLoaded(true));
-//     // dispatch(setTargetDataLoadingInProgress(false));
-//     //console.log(tags_info);
-//   });
-//   // }
-// };
-
 const getTagsForMol = (molId, tagList) => {
   const result = tagList.filter(t => t.site_observations.includes(molId));
   return result;
@@ -237,34 +182,42 @@ export const loadMoleculesAndTagsNew = targetId => async (dispatch, getState) =>
     dispatch(setNoTagsReceived(false));
   }
   const tagCategories = await getTagCategories();
-  return getAllDataNew(targetId).then(data => {
-    let allMolecules = [];
-    data?.results?.forEach(mol => {
-      let newObject = { ...mol };
-      const tagsForMol = getTagsForMol(mol.id, tags);
-      if (tagsForMol) {
-        newObject['tags_set'] = [...tagsForMol.map(t => t.id)];
-      } else {
-        newObject['tags_set'] = [];
-      }
-      allMolecules.push(newObject);
-    });
 
-    allMolecules?.sort((a, b) => {
-      if (a.code < b.code) {
-        return -1;
-      }
-      if (a.code > b.code) {
-        return 1;
-      }
-      return 0;
-    });
+  const data = await getAllDataNew(targetId);
+  let allMolecules = [];
+  data?.results?.forEach(mol => {
+    let newObject = { ...mol };
+    const tagsForMol = getTagsForMol(mol.id, tags);
+    if (tagsForMol) {
+      newObject['tags_set'] = [...tagsForMol.map(t => t.id)];
+    } else {
+      newObject['tags_set'] = [];
+    }
+    allMolecules.push(newObject);
+  });
 
-    dispatch(setAllMolLists([...allMolecules]));
-    //need to do this this way because only categories which have at least one tag assigned are sent from backend
-    tags = tags.sort(compareTagsAsc);
-    dispatch(setMoleculeTags(tags));
-    dispatch(setTagSelectorData(tagCategories, tags));
-    dispatch(setAllDataLoaded(true));
+  allMolecules?.sort((a, b) => {
+    if (a.code < b.code) {
+      return -1;
+    }
+    if (a.code > b.code) {
+      return 1;
+    }
+    return 0;
+  });
+
+  dispatch(setAllMolLists([...allMolecules]));
+  //need to do this this way because only categories which have at least one tag assigned are sent from backend
+  tags = tags.sort(compareTagsAsc);
+  dispatch(setMoleculeTags(tags));
+  dispatch(setTagSelectorData(tagCategories, tags));
+  dispatch(setAllDataLoaded(true));
+
+  return getCompoundsLHS(targetId).then(compounds => {
+    compounds?.forEach(c => {
+      const siteObs = allMolecules.find(m => m.cmpd === c.id);
+      c['smiles'] = siteObs ? siteObs.smiles : '';
+    });
+    dispatch(setLHSCompoundsLIst([...compounds]));
   });
 };
diff --git a/js/reducers/api/actions.js b/js/reducers/api/actions.js
@@ -98,6 +98,13 @@ export const setAllMolLists = all_mol_lists => {
   };
 };
 
+export const setLHSCompoundsLIst = lhs_compounds_list => {
+  return {
+    type: constants.SET_LHS_COMPOUNDS_LIST,
+    lhs_compounds_list: lhs_compounds_list
+  };
+};
+
 export const setMoleculeTags = moleculeTags => {
   return {
     type: constants.SET_MOLECULE_TAGS,

diff --git a/js/reducers/api/apiReducers.js b/js/reducers/api/apiReducers.js
@@ -49,7 +49,8 @@ export const INITIAL_STATE = {
   tagList: [],
   categoryList: [],
   target_data_loading_in_progress: false,
-  all_data_loaded: false
+  all_data_loaded: false,
+  lhs_compounds_list: []
 };
 
 export const RESET_TARGET_STATE = {
@@ -90,7 +91,8 @@ export const RESET_TARGET_STATE = {
   tagList: [],
   target_data_loading_in_progress: false,
   all_data_loaded: false,
-  snapshotLoadingInProgress: false
+  snapshotLoadingInProgress: false,
+  lhs_compounds_list: []
 };
 
 export default function apiReducers(state = INITIAL_STATE, action = {}) {
@@ -174,6 +176,9 @@ export default function apiReducers(state = INITIAL_STATE, action = {}) {
         return state;
       }
 
+    case constants.SET_LHS_COMPOUNDS_LIST:
+      return { ...state, lhs_compounds_list: action.lhs_compounds_list };
+
     case constants.SET_PANNDA_EVENT_LIST:
       return Object.assign({}, state, {
         pandda_event_list: action.pandda_event_list

diff --git a/js/reducers/api/constants.js b/js/reducers/api/constants.js
@@ -50,5 +50,6 @@ export const constants = {
   SET_CATEGORY_LIST: prefix + 'SET_CATEGORY_LIST',
   SET_TARGET_DATA_LOADING_IN_PROGRESS: prefix + 'SET_TARGET_DATA_LOADING_IN_PROGRESS',
   SET_ALL_DATA_LOADED: prefix + 'SET_ALL_DATA_LOADED',
-  SET_SNAPSHOT_LOADING_IN_PROGRESS: prefix + 'SET_SNAPSHOT_LOADING_IN_PROGRESS'
+  SET_SNAPSHOT_LOADING_IN_PROGRESS: prefix + 'SET_SNAPSHOT_LOADING_IN_PROGRESS',
+  SET_LHS_COMPOUNDS_LIST: prefix + 'SET_LHS_COMPOUNDS_LIST'
 };