diff --git a/js/components/header/index.js b/js/components/header/index.js
index 484316a02..11ba81ab1 100644
--- a/js/components/header/index.js
+++ b/js/components/header/index.js
@@ -68,6 +68,7 @@ import { AddProjectDetail } from '../projects/addProjectDetail';
 import { ServicesStatusWrapper } from '../services';
 import { COMPANIES, get_logo } from '../funders/constants';
 import { setEditTargetDialogOpen } from '../target/redux/actions';
+import { Upload } from '@mui/icons-material';
 
 const useStyles = makeStyles(theme => ({
   padding: {
@@ -272,8 +273,8 @@ export default memo(
                   targetName !== undefined ? (
                     <>
                       {currentProject.authorID === null ||
-                      currentProject.projectID === null ||
-                      currentProject.authorID === userId ? (
+                        currentProject.projectID === null ||
+                        currentProject.authorID === userId ? (
                         <Button
                           onClick={() => {
                             isProjectModalLoading === false
@@ -574,6 +575,29 @@ export default memo(
                 </ListItemIcon>
                 <ListItemText primary="Contributors" />
               </ListItem>
+              {DJANGO_CONTEXT.pk &&
+                <>
+                  <Divider />
+                  <ListItem button onClick={() => openLink(URLS.lhsUpload)}>
+                    <ListItemIcon>
+                      <Upload />
+                    </ListItemIcon>
+                    <ListItemText primary="LHS upload" />
+                  </ListItem>
+                  <ListItem button onClick={() => openLink(URLS.rhsUpload)}>
+                    <ListItemIcon>
+                      <Upload />
+                    </ListItemIcon>
+                    <ListItemText primary="RHS upload" />
+                  </ListItem>
+                  <ListItem button onClick={() => openLink(URLS.metadataUpload)}>
+                    <ListItemIcon>
+                      <Upload />
+                    </ListItemIcon>
+                    <ListItemText primary="Metadata upload" />
+                  </ListItem>
+                </>
+              }
               <Divider />
               {authListItem}
             </Grid>
diff --git a/js/components/preview/molecule/moleculeView/moleculeView.js b/js/components/preview/molecule/moleculeView/moleculeView.js
index faa448e84..80c7dedbf 100644
--- a/js/components/preview/molecule/moleculeView/moleculeView.js
+++ b/js/components/preview/molecule/moleculeView/moleculeView.js
@@ -58,6 +58,8 @@ import { DJANGO_CONTEXT } from '../../../../utils/djangoContext';
 import { getFontColorByBackgroundColor } from '../../../../utils/colors';
 import { api, METHOD } from '../../../../utils/api';
 import { base_url } from '../../../routes/constants';
+import { ContentCopyRounded } from '@mui/icons-material';
+import { ToastContext } from '../../../toast';
 
 const useStyles = makeStyles(theme => ({
   container: {
@@ -358,6 +360,8 @@ export const img_data_init = `<svg xmlns="http://www.w3.org/2000/svg" version="1
     <animateTransform attributeName="transform" type="rotate" repeatCount="indefinite" dur="0.689655172413793s" values="0 50 50;360 50 50" keyTimes="0;1"></animateTransform>
   </circle>  '</svg>`;
 
+export const XCA_TAGS_CATEGORIES = ['CanonSites', 'ConformerSites', 'Quatassemblies', 'Crystalforms', 'CrystalformSites'];
+
 const MoleculeView = memo(
   ({
     imageHeight,
@@ -409,6 +413,7 @@ const MoleculeView = memo(
     const [tagEditModalOpenNew, setTagEditModalOpenNew] = useState(tagEditorOpenObs);
 
     const { getNglView } = useContext(NglContext);
+    const { toastInfo } = useContext(ToastContext);
     const stage = getNglView(VIEWS.MAJOR_VIEW) && getNglView(VIEWS.MAJOR_VIEW).stage;
 
     const isLigandOn = L;
@@ -463,6 +468,7 @@ const MoleculeView = memo(
     const [moleculeTooltipOpen, setMoleculeTooltipOpen] = useState(false);
     const [tagPopoverOpen, setTagPopoverOpen] = useState(null);
     const [centroidRes, setCentroidRes] = useState('');
+    const [experimentalPath, setExperimentalPath] = useState('');
 
     const moleculeImgRef = useRef(null);
 
@@ -476,9 +482,6 @@ const MoleculeView = memo(
       setTagEditModalOpenNew(tagEditorOpenObs);
     }, [tagEditorOpenObs]);
 
-    const XCA_TAGS_CATEGORIES = ['CanonSites', 'ConformerSites', 'Quatassemblies', 'Crystalforms', 'CrystalformSites'];
-    const XCA_TAGS_CATEGORIES_EXPANDED = ['Quatassemblies', 'ConformerSites', 'Crystalforms', 'CrystalformSites', 'CanonSites'];
-
     useEffect(() => {
       api({
         url: `${base_url}/api/canon_site_confs/`,
@@ -515,6 +518,26 @@ const MoleculeView = memo(
         });
     }, [data.canon_site_conf]);
 
+    useEffect(() => {
+      api({
+        url: `${base_url}/api/experiments/`,
+        method: METHOD.GET
+      })
+        .then(resp => {
+          const experiment = resp.data.results.find(experiment => experiment.id === data.experiment);
+          if (experiment) {
+            setExperimentalPath(experiment.pdb_info_source_file ?? '');
+          } else {
+            console.log('there is not any matching canonSiteConf object with ' + data.experiment + ' id');
+            setExperimentalPath('');
+          }
+        })
+        .catch(err => {
+          console.log('error fetching experiment from experiments api', err);
+          setExperimentalPath('');
+        });
+    }, [data.experiment]);
+
     useEffect(() => {
       if (showExpandedView) {
         setHeaderWidthsHandler(centroidRes, 'CentroidRes');
@@ -523,7 +546,7 @@ const MoleculeView = memo(
           setHeaderWidthsHandler(getTagLabel(tagCategory), tagCategory);
         })
       }
-    }, [showExpandedView, getTagType, getTagLabel, centroidRes, data.longcode, setHeaderWidthsHandler, XCA_TAGS_CATEGORIES]);
+    }, [showExpandedView, getTagType, getTagLabel, centroidRes, data.longcode, setHeaderWidthsHandler]);
 
     const handlePopoverOpen = event => {
       setTagPopoverOpen(event.currentTarget);
@@ -1135,6 +1158,11 @@ const MoleculeView = memo(
       return tagTooltip;
     }, [getTagType]);
 
+    const copyExperimentalPaths = async () => {
+      await navigator.clipboard.writeText(experimentalPath);
+      toastInfo('Link was copied to the clipboard', { autoHideDuration: 5000 });
+    };
+
     return (
       <>
         <Grid
@@ -1428,7 +1456,6 @@ const MoleculeView = memo(
                   xs={5}
                   container
                   direction="row"
-                  justifyContent="center"
                   alignItems="center"
                   // wrap="nowrap"
                   style={{ height: "100%" }}
@@ -1488,7 +1515,7 @@ const MoleculeView = memo(
               </div>}
           </Grid>
           {showExpandedView && <Grid item container alignItems='center' wrap="nowrap">
-            {XCA_TAGS_CATEGORIES_EXPANDED.map((tagCategory, index) => {
+            {XCA_TAGS_CATEGORIES.map((tagCategory, index) => {
               return <Tooltip title={`${PLURAL_TO_SINGULAR[tagCategory]} - ${getTagTooltip(tagCategory)}`} key={index}>
                 <Grid item align="center" className={classes.categoryCell} style={{ minWidth: headerWidths[tagCategory] }}>
                   {getTagLabel(tagCategory)}
@@ -1505,6 +1532,13 @@ const MoleculeView = memo(
                 {data.longcode}
               </Grid>
             </Tooltip>
+            <Tooltip title={experimentalPath.length > 0 ? experimentalPath : 'empty path'}>
+              <Grid item align="center" style={{ minWidth: headerWidths.Path }}>
+                <IconButton color="inherit" onClick={copyExperimentalPaths} size="small">
+                  <ContentCopyRounded fontSize="small" />
+                </IconButton>
+              </Grid>
+            </Tooltip>
           </Grid>}
         </Grid >
         <SvgTooltip
diff --git a/js/components/preview/molecule/observationCmpList.js b/js/components/preview/molecule/observationCmpList.js
index 7d64179ea..c8df5b25f 100644
--- a/js/components/preview/molecule/observationCmpList.js
+++ b/js/components/preview/molecule/observationCmpList.js
@@ -10,7 +10,10 @@ import {
   Divider,
   Typography,
   IconButton,
-  ButtonGroup
+  ButtonGroup,
+  Select,
+  MenuItem,
+  Checkbox
 } from '@material-ui/core';
 import React, { useState, useEffect, useCallback, memo, useRef, useContext, useMemo } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
@@ -321,6 +324,89 @@ export const ObservationCmpList = memo(({ hideProjects }) => {
 
   const [predefinedFilter, setPredefinedFilter] = useState(filter !== undefined ? filter.predefined : DEFAULT_FILTER);
 
+  const [ascending, setAscending] = useState(true);
+  const handleAscendingChecked = (event) => setAscending(event.target.checked);
+  const SORT_OPTIONS = [
+    'POSE_NAME',
+    'COMPOUND_CODE',
+    'CANONSITE_NUMBER',
+    'CONFORMERSITE_NUMBER',
+    'OBSERVATION_COUNT'
+  ];
+  const sortOptions = {
+    POSE_NAME: {
+      title: 'Pose name',
+      handler: (a, b, asc) => compareByPoseName(a, b, asc)
+    },
+    COMPOUND_CODE: {
+      title: 'Compound code',
+      handler: (a, b, asc) => compareByCompoundCode(a, b, asc)
+    },
+    CANONSITE_NUMBER: {
+      title: 'CanonSite number',
+      handler: (a, b, asc) => compareByCanonSiteNumber(a, b, asc)
+    },
+    CONFORMERSITE_NUMBER: {
+      title: 'ConformerSite number',
+      handler: (a, b, asc) => compareByConformerSiteNumber(a, b, asc)
+    },
+    OBSERVATION_COUNT: {
+      title: 'Observation count',
+      handler: (a, b, asc) => compareByObservationCount(a, b, asc)
+    }
+  };
+  const [sortOption, setSortOption] = useState(SORT_OPTIONS[0]);
+
+  const compareByPoseName = (a, b, asc) => {
+    const aName = a.code;
+    const bName = b.code;
+    return asc ? aName.localeCompare(bName, undefined, { numeric: true, sensitivity: 'base' })
+      : bName.localeCompare(aName, undefined, { numeric: true, sensitivity: 'base' });
+  };
+  const compareByCompoundCode = (a, b, asc) => {
+    const aName = a.main_site_observation_cmpd_code;
+    const bName = b.main_site_observation_cmpd_code;
+    return asc ? aName.localeCompare(bName, undefined, { numeric: true, sensitivity: 'base' })
+      : bName.localeCompare(aName, undefined, { numeric: true, sensitivity: 'base' });
+  };
+  const compareByCanonSiteNumber = (a, b, asc) => {
+    const aName = getCanonSiteTagPrefix(a);
+    const bName = getCanonSiteTagPrefix(b);
+    return asc ? aName.localeCompare(bName, undefined, { numeric: true, sensitivity: 'base' })
+      : bName.localeCompare(aName, undefined, { numeric: true, sensitivity: 'base' });
+  };
+  const compareByConformerSiteNumber = (a, b, asc) => {
+    const aName = getConformerSiteTagPrefix(a);
+    const bName = getConformerSiteTagPrefix(b);
+    return asc ? aName.localeCompare(bName, undefined, { numeric: true, sensitivity: 'base' })
+      : bName.localeCompare(aName, undefined, { numeric: true, sensitivity: 'base' });
+  };
+  const compareByObservationCount = (a, b, asc) => {
+    const aCount = a.site_observations.length;
+    const bCount = b.site_observations.length;
+    return asc ? aCount - bCount : bCount - aCount;
+  };
+
+  /**
+   * Get CanonSites tag for sorting
+   */
+  const getCanonSiteTagPrefix = useCallback(pose => {
+    const mainObservation = pose.associatedObs.find(observation => observation.id === pose.main_site_observation);
+    const canonSitesTag = categories.find(tagCategory => tagCategory.category === 'CanonSites');
+    const canonSite = tags.find(tag => tag.category === canonSitesTag.id && tag.site_observations.includes(mainObservation.id));
+    return canonSite !== undefined ? canonSite.tag_prefix : '';
+  }, [categories, tags]);
+
+  /**
+   * Get ConformerSites tag for sorting
+   */
+  const getConformerSiteTagPrefix = useCallback(pose => {
+    const mainObservation = pose.associatedObs.find(observation => observation.id === pose.main_site_observation);
+    const conformerSitesTag = categories.find(tagCategory => tagCategory.category === 'ConformerSites');
+    const conformerSite = tags.find(tag => tag.category === conformerSitesTag.id && tag.site_observations.includes(mainObservation.id));
+    return conformerSite !== undefined ? conformerSite.tag_prefix : '';
+  }, [categories, tags]);
+
   const isActiveFilter = !!(filter || {}).active;
 
   const { getNglView } = useContext(NglContext);
@@ -718,8 +804,9 @@ export const ObservationCmpList = memo(({ hideProjects }) => {
         compounds.push(compound);
       }
     });
+    compounds.sort((a, b) => sortOptions[sortOption].handler(a, b, ascending));
     return compounds;
-  }, [joinedMoleculeLists, lhsCompoundsList]);
+  }, [joinedMoleculeLists, lhsCompoundsList, sortOptions, sortOption, ascending]);
 
   useEffect(() => {
     if (isObservationDialogOpen && observationsForLHSCmp?.length > 0) {
@@ -1113,7 +1200,7 @@ export const ObservationCmpList = memo(({ hideProjects }) => {
 
         {
           <Tooltip title={selectAllHitsPressed ? 'Unselect all hits' : 'Select all hits'}>
-            <Grid item style={{ marginLeft: '20px' }}>
+            <Grid item style={{ marginLeft: '5px' }}>
               <Button
                 variant="outlined"
                 className={classNames(classes.contColButton, {
@@ -1133,7 +1220,7 @@ export const ObservationCmpList = memo(({ hideProjects }) => {
         }
         {selectedDisplayHits === true ? (
           <Tooltip title={'Unselect displayed hits'}>
-            <Grid item style={{ marginLeft: '20px' }}>
+            <Grid item style={{ marginLeft: '5px' }}>
               <Button
                 variant="outlined"
                 className={classNames(classes.contColButton, {
@@ -1152,7 +1239,7 @@ export const ObservationCmpList = memo(({ hideProjects }) => {
           </Tooltip>
         ) : (
           <Tooltip title={'Select displayed hits'}>
-            <Grid item style={{ marginLeft: '20px' }}>
+            <Grid item style={{ marginLeft: '5px' }}>
               <Button
                 variant="outlined"
                 className={classNames(classes.contColButton, {
@@ -1174,6 +1261,32 @@ export const ObservationCmpList = memo(({ hideProjects }) => {
           <Typography variant="caption" className={classes.noOfSelectedHits}>{`Selected: ${allSelectedMolecules ? allSelectedMolecules.length : 0
             }`}</Typography>
         </Grid>
+        <Grid style={{ marginTop: '4px' }}>
+          <Typography variant="caption" className={classes.noOfSelectedHits}>Sort by</Typography>
+        </Grid>
+        <Grid style={{ marginTop: '4px', marginLeft: '4px' }}>
+          <Tooltip title={sortOption ? sortOptions[sortOption].title : "Sort by"}>
+            <Select
+              value={sortOption}
+              onChange={(event) => setSortOption(event.target.value)}
+              // fullWidth
+              size="small"
+              style={{ fontSize: 10, width: 75 }}
+            >
+              {SORT_OPTIONS.map((option, index) => (
+                <MenuItem key={`${index}-${option}`} value={option} style={{ fontSize: 12, padding: '3px 7px' }}>
+                  {sortOptions[option].title}
+                </MenuItem>
+              ))}
+            </Select>
+          </Tooltip>
+        </Grid>
+        <Tooltip title={ascending ? "Ascending" : "Descending"}>
+          <Grid style={{ marginTop: '4px' }}>
+            <Checkbox checked={ascending} onChange={handleAscendingChecked} size="small" style={{ padding: 3 }} />
+            <Typography variant="caption" className={classes.noOfSelectedHits}>ASC</Typography>
+          </Grid>
+        </Tooltip>
       </Grid>
       <Grid container spacing={1} direction="column" justifyContent="flex-start" className={classes.container}>
         <Grid item>
diff --git a/js/components/preview/molecule/observationCmpView/observationCmpView.js b/js/components/preview/molecule/observationCmpView/observationCmpView.js
index a4e33dffd..efb52fe60 100644
--- a/js/components/preview/molecule/observationCmpView/observationCmpView.js
+++ b/js/components/preview/molecule/observationCmpView/observationCmpView.js
@@ -1611,7 +1611,7 @@ const ObservationCmpView = memo(
             {/* CanonSites */}
             <Grid item xs container direction="column" justifyContent="center" alignItems="stretch" wrap="nowrap">
               <Tooltip
-                title={<div style={{ whiteSpace: 'pre-line' }}>CanonSite - {getCanonSitesTag().upload_name}</div>}
+                title={<div style={{ whiteSpace: 'pre-line' }}>CanonSite - {getCanonSitesTag().tag}</div>}
               >
                 <Grid
                   item
@@ -1631,7 +1631,7 @@ const ObservationCmpView = memo(
               {getConformerSites().map((conformerSite, i, sites) => (
                 <Tooltip
                   key={conformerSite.id + i}
-                  title={<div style={{ whiteSpace: 'pre-line' }}>ConformerSite - {conformerSite.upload_name}</div>}
+                  title={<div style={{ whiteSpace: 'pre-line' }}>ConformerSite - {conformerSite.tag}</div>}
                 >
                   <Grid
                     item
diff --git a/js/components/preview/molecule/observationsDialog.js b/js/components/preview/molecule/observationsDialog.js
index c57e617db..09527cf83 100644
--- a/js/components/preview/molecule/observationsDialog.js
+++ b/js/components/preview/molecule/observationsDialog.js
@@ -53,6 +53,7 @@ import { updateLHSCompound, updateMoleculeInMolLists, updateMoleculeTag, updateT
 import { createPoseErrorMessage } from './api/poseApi';
 import { augumentTagObjectWithId, createMoleculeTagObject, DEFAULT_TAG_COLOR, getMoleculeTagForTag } from '../tags/utils/tagUtils';
 import { updateExistingTag } from '../tags/api/tagsApi';
+import { XCA_TAGS_CATEGORIES } from './moleculeView/moleculeView';
 
 const MIN_PANEL_HEIGHT = 250;
 
@@ -175,9 +176,12 @@ const useStyles = makeStyles(theme => ({
     // fontWeight: 'bold',
     paddingLeft: theme.spacing(1) / 4,
     paddingRight: theme.spacing(1) / 4,
-    '&:hover': {
+    '&:hover:not([disabled])': {
       cursor: 'pointer',
       backgroundColor: theme.palette.primary.light
+    },
+    '&:is([disabled])': {
+      color: theme.palette.dividerDark
     }
   },
   dropdownContentSide: {
@@ -277,13 +281,14 @@ export const ObservationsDialog = memo(
     const [tagEditorAnchorEl, setTagEditorAnchorEl] = useState(null);
     const [expandView, setExpandView] = useState(null);
     const [headerWidths, setHeaderWidths] = useState({
-      Quatassemblies: getCalculatedTagColumnWidth('Quatassemblies'),
+      CanonSites: getCalculatedTagColumnWidth('CanonSites'),
       ConformerSites: getCalculatedTagColumnWidth('ConformerSites'),
+      Quatassemblies: getCalculatedTagColumnWidth('Quatassemblies'),
       Crystalforms: getCalculatedTagColumnWidth('Crystalforms'),
       CrystalformSites: getCalculatedTagColumnWidth('CrystalformSites'),
-      CanonSites: getCalculatedTagColumnWidth('CanonSites'),
       CentroidRes: getCalculatedTagColumnWidth('CentroidRes'),
       LongCode: getCalculatedTagColumnWidth('LongCode'),
+      Path: getCalculatedTagColumnWidth('Path')
     });
 
     /**
@@ -292,7 +297,7 @@ export const ObservationsDialog = memo(
      * @param {*} tagCategory
      */
     const setHeaderWidthsHandler = (tagText, tagCategory) => {
-      const calculatedWidth = getCalculatedTagColumnWidth(tagText, '12px bold');
+      const calculatedWidth = getCalculatedTagColumnWidth(tagText, 'bold 12px');
       if (headerWidths[tagCategory] < calculatedWidth) {
         setHeaderWidths(old => {
           const newWidths = { ...old };
@@ -660,6 +665,16 @@ export const ObservationsDialog = memo(
       }
     };
 
+    /**
+     * Get observation list for un/tagging
+     *
+     * @returns {Object[]} observations
+     */
+    const observationsForTagOperations = useMemo(() => {
+      // observationsDataList - all observations, moleculeList - filtered, allSelectedMolecules - selected
+      return allSelectedMolecules.length > 0 ? allSelectedMolecules : moleculeList;
+    }, [allSelectedMolecules, moleculeList]);
+
     const tagObservations = async (tag, tagToExclude) => {
       try {
         // setTaggingInProgress(true);
@@ -675,7 +690,7 @@ export const ObservationsDialog = memo(
         }
 
         let molTagObjects = [];
-        observationsDataList.forEach(m => {
+        observationsForTagOperations.forEach(m => {
           if (!m.tags_set.some(id => id === tag.id)) {
             let newMol = { ...m };
             newMol.tags_set.push(tag.id);
@@ -743,7 +758,7 @@ export const ObservationsDialog = memo(
         }
 
         let molTagObjects = [];
-        observationsDataList.forEach(m => {
+        observationsForTagOperations.forEach(m => {
           let newMol = { ...m };
           newMol.tags_set = newMol.tags_set.filter(id => id !== tag.id);
 
@@ -837,6 +852,17 @@ export const ObservationsDialog = memo(
       toastInfo(`Tag for observations was changed from "${mainObservationTag.upload_name}" to "${tag.upload_name}". They could disappear based on your tag selection`, { autoHideDuration: 5000 });
     };
 
+    /**
+     * Decide if XCA tag change should not be allowed
+     *
+     * @param {string} category category of tag
+     * @returns {boolean}
+     */
+    const disableXCATagChange = useCallback(category => {
+      // #1522 CanonSite tags should not be allowed to change if there are selected only some observations
+      return category === 'CanonSites' && allSelectedMolecules.length > 0 && (allSelectedMolecules.length !== moleculeList.length);
+    }, [allSelectedMolecules, moleculeList]);
+
     return (
       <Popper id={id} open={open} anchorEl={anchorEl} placement="left-start" ref={ref}>
         <Panel
@@ -984,11 +1010,10 @@ export const ObservationsDialog = memo(
                             item
                             xs
                             container
-                            justifyContent="space-around"
-                            // adjust maxWidth if headers are a bit misplaced
-                            style={{ maxWidth: '74%', marginLeft: 95 }}
+                            alignItems="center"
+                            style={{ marginLeft: 95 }}
                           >
-                            {['Quatassemblies', 'ConformerSites', 'Crystalforms', 'CrystalformSites', 'CanonSites'].map(
+                            {XCA_TAGS_CATEGORIES.map(
                               (tagCategory, index) => (
                                 <Grid item align="center" key={index} className={classes.headerCell} style={{ minWidth: headerWidths[tagCategory] }}>
                                   {PLURAL_TO_SINGULAR[tagCategory]}
@@ -1001,6 +1026,9 @@ export const ObservationsDialog = memo(
                             <Grid item align="center" className={classes.headerCell} style={{ minWidth: headerWidths.LongCode }}>
                               LongCode
                             </Grid>
+                            <Grid item align="center" className={classes.headerCell} style={{ minWidth: headerWidths.Path }}>
+                              Path
+                            </Grid>
                           </Grid>
                         )}
                       </Grid>
@@ -1131,15 +1159,16 @@ export const ObservationsDialog = memo(
                       </Button>
                       <Grid container direction="row" className={classes.dropdownContent}>
                         {XCA_TAG_CATEGORIES.map(category =>
-                          <Grid key={category} item className={classNames(classes.dropdown, classes.dropdownItem)}>
+                          <Grid key={category} item className={classNames(classes.dropdown, classes.dropdownItem)} disabled={disableXCATagChange(category)}>
                             Change {PLURAL_TO_SINGULAR[category]}
-                            <Grid container direction="row" className={classNames(classes.dropdownContent, classes.dropdownContentSide)}>
-                              {getTagsForCategory(category)?.map(tag => (
-                                <Grid key={tag.id} item className={classes.dropdownItem} onClick={() => handleXCAtagChange(tag)}>
-                                  {tag.upload_name}
-                                </Grid>
-                              ))}
-                            </Grid>
+                            {!disableXCATagChange(category) &&
+                              <Grid container direction="row" className={classNames(classes.dropdownContent, classes.dropdownContentSide)}>
+                                {getTagsForCategory(category)?.map(tag => (
+                                  <Grid key={tag.id} item className={classes.dropdownItem} onClick={() => handleXCAtagChange(tag)}>
+                                    {tag.upload_name}
+                                  </Grid>
+                                ))}
+                              </Grid>}
                           </Grid>
                         )}
                       </Grid>
diff --git a/js/components/preview/tags/api/tagsApi.js b/js/components/preview/tags/api/tagsApi.js
index 3e9f52d3b..17f5ad061 100644
--- a/js/components/preview/tags/api/tagsApi.js
+++ b/js/components/preview/tags/api/tagsApi.js
@@ -11,7 +11,7 @@ import { getDefaultTagDiscoursePostText } from '../utils/tagUtils';
 //   });
 // };
 
-export const getTags = targetId => {
+export const getTags = async targetId => {
   return api({ url: `${base_url}/api/siteobservation_tag/?target=${targetId}` }).then(response => {
     if (response?.data) {
       return response.data;
@@ -19,7 +19,7 @@ export const getTags = targetId => {
   });
 };
 
-export const getTagCategories = () => {
+export const getTagCategories = async () => {
   return api({ url: `${base_url}/api/tag_category/` }).then(response => {
     if (response?.data) {
       return response.data?.results;
@@ -67,7 +67,7 @@ export const getTagMolecules = targetId => {
     .catch(err => console.log(err));
 };
 
-export const createNewTag = (tag, targetName) => {
+export const createNewTag = async (tag, targetName) => {
   let url = `${base_url}/api/siteobservation_tag/`;
   if (isDiscourseAvailable()) {
     return createTagPost(tag, targetName, getDefaultTagDiscoursePostText(tag))
@@ -101,7 +101,7 @@ export const createNewTag = (tag, targetName) => {
   }
 };
 
-export const createNewDownloadTag = tag => {
+export const createNewDownloadTag = async tag => {
   let url = `${base_url}/api/siteobservation_tag/`;
   const jsonString = JSON.stringify(tag);
   return api({
@@ -115,7 +115,7 @@ export const createNewDownloadTag = tag => {
     .catch(err => console.log(err));
 };
 
-export const updateExistingTag = (tag, tagId) => {
+export const updateExistingTag = async (tag, tagId) => {
   const jsonString = JSON.stringify(tag);
   let url = `${base_url}/api/siteobservation_tag/${tagId}/`;
   return api({
@@ -129,7 +129,7 @@ export const updateExistingTag = (tag, tagId) => {
     .catch(err => console.log(err));
 };
 
-export const getTagByName = tagName => {
+export const getTagByName = async tagName => {
   let url = `${base_url}/api/siteobservation_tag/?tag=${tagName}`;
   return api({ url: url }).then(response => {
     if (response?.data?.results?.length > 0) {
@@ -138,7 +138,7 @@ export const getTagByName = tagName => {
   });
 };
 
-export const deleteExistingTag = (tag, tagId) => {
+export const deleteExistingTag = async (tag, tagId) => {
   const jsonString = JSON.stringify(tag);
   let url = `${base_url}/api/siteobservation_tag/${tagId}/`;
   return api({
diff --git a/js/components/preview/tags/modal/editTagsModal.js b/js/components/preview/tags/modal/editTagsModal.js
index 77a5d2b36..dc6578102 100644
--- a/js/components/preview/tags/modal/editTagsModal.js
+++ b/js/components/preview/tags/modal/editTagsModal.js
@@ -12,6 +12,7 @@ import { removeSelectedTag, updateTagProp } from "../redux/dispatchActions";
 import { getCategoryById } from "../../molecule/redux/dispatchActions";
 import { ToastContext } from "../../../toast";
 import { TAG_DETAILS_REMOVED_CATEGORIES } from "../../../../constants/constants";
+import { setTagToEdit } from "../../../../reducers/selection/actions";
 
 const useStyles = makeStyles(theme => ({
     leftSide: {
@@ -44,9 +45,9 @@ export const EditTagsModal = memo(({ open, anchorEl, setOpenDialog }) => {
     const allMolList = useSelector(state => state.apiReducers.all_mol_lists);
     const moleculesToEditIds = useSelector(state => state.selectionReducers.moleculesToEdit);
     const selectedTagList = useSelector(state => state.selectionReducers.selectedTagList);
+    const tag = useSelector(state => state.selectionReducers.tagToEdit);
 
     const id = open ? 'simple-popover-tags-editor' : undefined;
-    const [tag, setTag] = useState(null);
     const [tags, setTags] = useState([NEW_TAG]);
     const [newTagColor, setNewTagColor] = useState(DEFAULT_TAG_COLOR);
     const [newTagName, setNewTagName] = useState('');
@@ -90,7 +91,7 @@ export const EditTagsModal = memo(({ open, anchorEl, setOpenDialog }) => {
         });
         setTags([NEW_TAG, ...newTagList.sort(compareTagsByCategoryAndNameAsc)]);
         return () => {
-            setTag(null);
+            // dispatch(setTagToEdit(null)); // uncomment this to reset tag after update - clean up moved to resetTagToEditState
             setTags([NEW_TAG]);
         };
     }, [preTagList, tagCategories]);
@@ -105,7 +106,7 @@ export const EditTagsModal = memo(({ open, anchorEl, setOpenDialog }) => {
             setNewTagLink(tag.discourse_url);
             setNewHidden(tag.hidden || false);
         }
-    }, [dispatch, getColourForTag, tag]);
+    }, [getColourForTag, tag]);
 
     const comboCategories = useMemo(() => {
         return getEditNewTagCategories(tagCategories);
@@ -139,6 +140,7 @@ export const EditTagsModal = memo(({ open, anchorEl, setOpenDialog }) => {
         setNewTagName('');
         setNewTagLink('');
         setNewHidden(false);
+        dispatch(setTagToEdit(null));
     };
 
     const onCategoryForNewTagChange = event => {
@@ -211,7 +213,7 @@ export const EditTagsModal = memo(({ open, anchorEl, setOpenDialog }) => {
         }
     };
 
-    const updateTag = () => {
+    const updateTag = async () => {
         if (validateTag() && tag && newTagCategory && newTagName) {
             if (!tag.hidden && newHidden && selectedTagList.some(selectedTag => selectedTag.id === tag.id)) {
                 dispatch(removeSelectedTag(tag));
@@ -219,7 +221,7 @@ export const EditTagsModal = memo(({ open, anchorEl, setOpenDialog }) => {
             }
             // update all props at once
             if (newTagCategory) {
-                dispatch(
+                const updatedTag = await dispatch(
                     updateTagProp(
                         Object.assign({}, tag, {
                             category: newTagCategory,
@@ -232,8 +234,9 @@ export const EditTagsModal = memo(({ open, anchorEl, setOpenDialog }) => {
                         'tag'
                     )
                 );
+                dispatch(setTagToEdit(updatedTag));
             } else {
-                dispatch(
+                const updatedTag = await dispatch(
                     updateTagProp(
                         Object.assign({}, tag, {
                             colour: newTagColor,
@@ -245,10 +248,9 @@ export const EditTagsModal = memo(({ open, anchorEl, setOpenDialog }) => {
                         'tag'
                     )
                 );
+                dispatch(setTagToEdit(updatedTag));
             }
             toastInfo('Tag was updated', { autoHideDuration: 5000 });
-            // reset tag/fields after updating selected one
-            resetTagToEditState();
         }
     };
 
@@ -278,6 +280,7 @@ export const EditTagsModal = memo(({ open, anchorEl, setOpenDialog }) => {
     const handleCloseModal = () => {
         if (open) {
             setOpenDialog(false);
+            resetTagToEditState();
         }
     };
 
@@ -326,7 +329,7 @@ export const EditTagsModal = memo(({ open, anchorEl, setOpenDialog }) => {
                     {rightSide(
                         <Select
                             value={tag?.id || 0}
-                            onChange={(event) => setTag(tags.find(tag => tag.id === event.target.value))}
+                            onChange={(event) => dispatch(setTagToEdit(tags.find(tag => tag.id === event.target.value)))}
                             fullWidth
                         >
                             {tags?.map(tag => (
diff --git a/js/components/preview/tags/redux/dispatchActions.js b/js/components/preview/tags/redux/dispatchActions.js
index 4ec6820c4..347e71a22 100644
--- a/js/components/preview/tags/redux/dispatchActions.js
+++ b/js/components/preview/tags/redux/dispatchActions.js
@@ -127,9 +127,16 @@ export const storeData = data => (dispatch, getState) => {
   dispatch(setTagSelectorData(categories, tags));
 
   let allMolecules = [];
-  data.molecules.forEach(mol => {});
+  data.molecules.forEach(mol => { });
 };
 
+/**
+ *
+ * @param {Object} tag tag object
+ * @param {*} value new value
+ * @param {*} prop name of the prop to be updated
+ * @returns {Promise<Object>}
+ */
 export const updateTagProp = (tag, value, prop) => (dispatch, getState) => {
   const state = getState();
   const molTags = state.apiReducers.moleculeTags;
diff --git a/js/components/routes/constants.js b/js/components/routes/constants.js
index 0ffb0f797..6f6429d57 100644
--- a/js/components/routes/constants.js
+++ b/js/components/routes/constants.js
@@ -9,6 +9,10 @@ export const URLS = {
   funders: '/viewer/react/funders/',
   target: '/viewer/react/preview/target/',
 
+  lhsUpload: '/api/upload_target_experiments/',
+  rhsUpload: '/viewer/upload_cset/',
+  metadataUpload: '/api/metadata_upload/',
+
   // Projects feature
   projects: '/viewer/react/projects/',
   // Direct feature
diff --git a/js/reducers/selection/selectionReducers.js b/js/reducers/selection/selectionReducers.js
index 5f4e5e4c7..05c265feb 100644
--- a/js/reducers/selection/selectionReducers.js
+++ b/js/reducers/selection/selectionReducers.js
@@ -455,7 +455,21 @@ export function selectionReducers(state = INITIAL_STATE, action = {}) {
 
     case constants.REMOVE_FROM_SELECTED_TAG_LIST:
       let diminishedSelectedTagList = new Set(state.selectedTagList);
-      diminishedSelectedTagList.delete(action.item);
+      // TODO sometimes tag object changes for its updated version
+      // handle it here or replace it in set in every place of change?
+      if (diminishedSelectedTagList.has(action.item)) {
+        diminishedSelectedTagList.delete(action.item);
+      } else {
+        let tagToDelete = null;
+        diminishedSelectedTagList.forEach(tag => {
+          if (tag.id === action.item.id) {
+            tagToDelete = tag;
+          }
+        });
+        if (tagToDelete) {
+          diminishedSelectedTagList.delete(tagToDelete);
+        }
+      }
       return Object.assign({}, state, { selectedTagList: [...diminishedSelectedTagList] });
 
     case constants.SET_IS_TAG_GLOBAL_EDIT: