From 42fdbadf9943d86e02e85f2965052407fa492c5a Mon Sep 17 00:00:00 2001 From: boriskovar-m2ms Date: Thu, 7 Mar 2024 11:23:07 +0100 Subject: [PATCH] Implements #1376, #1361, #1354 (#412) * - first implementation of #1354 * - updated message for #1354 * - cleanup for #1354 * - implemented #1361 - improvements for #1354 * - implemented #1376 - also fixed bug in download structures dialog where only first download got added to the dropdown menu --- docker-compose.dev.vector.yml | 4 +- .../molecule/moleculeView/moleculeView.js | 17 +++++-- .../observationCmpView/observationCmpView.js | 19 ++++--- js/components/preview/tags/tagView.js | 16 +++--- js/components/preview/tags/utils/tagUtils.js | 14 ++++-- .../projects/legacySnapshotModal/index.js | 49 +++++++++++++++++++ .../projects/projectPreview/index.js | 11 ++++- .../modals/downloadStructuresDialog.js | 47 +++++++++++++----- js/reducers/api/apiReducers.js | 4 +- 9 files changed, 141 insertions(+), 40 deletions(-) create mode 100644 js/components/projects/legacySnapshotModal/index.js diff --git a/docker-compose.dev.vector.yml b/docker-compose.dev.vector.yml index 272e4b83f..e9238a97c 100644 --- a/docker-compose.dev.vector.yml +++ b/docker-compose.dev.vector.yml @@ -53,10 +53,10 @@ services: start_period: 10s web: container_name: web_dock - image: xchem/fragalysis-stack:latest + # image: xchem/fragalysis-stack:latest # image: alanbchristie/fragalysis-backend:1187.3 # image: boriskovarm2ms/fragalysis-stack:experiment2 - # image: kaliif/fragalysis-backend:latest + image: kaliif/fragalysis-backend:latest command: /bin/bash /code/launch-stack.sh volumes: - ../data/logs:/code/logs/ diff --git a/js/components/preview/molecule/moleculeView/moleculeView.js b/js/components/preview/molecule/moleculeView/moleculeView.js index f1b590d24..8245e145b 100644 --- a/js/components/preview/molecule/moleculeView/moleculeView.js +++ b/js/components/preview/molecule/moleculeView/moleculeView.js @@ -455,11 +455,18 @@ const MoleculeView = memo( // const sortedData = [...allData].sort((a, b) => a.tag.localeCompare(b.tag)); const modifiedObjects = allData.map(obj => { - const tagNameShortLength = 3; - if (obj.tag.length > tagNameShortLength) { - return { ...obj, tag: obj.tag.slice(0, tagNameShortLength) }; + let result = obj; + + if (obj.tag_prefix) { + result = { ...obj, tag: obj.tag_prefix }; + } else { + const tagNameShortLength = 3; + if (obj.tag.length > tagNameShortLength) { + result = { ...obj, tag: obj.tag.slice(0, tagNameShortLength) }; + } } - return obj; + + return result; }); const allTagsLength = allData.length > 9 ? 9 : allData.length; @@ -630,7 +637,7 @@ const MoleculeView = memo( xs={allData.length === 1 ? 12 : allData.length === 2 ? 6 : 4} key={index} > -
{item.tag}
+
{item.tag_prefix ? `${item.tag_prefix} - ${item.tag}` : item.tag}
))} diff --git a/js/components/preview/molecule/observationCmpView/observationCmpView.js b/js/components/preview/molecule/observationCmpView/observationCmpView.js index 0fadba08e..ba20bfae7 100644 --- a/js/components/preview/molecule/observationCmpView/observationCmpView.js +++ b/js/components/preview/molecule/observationCmpView/observationCmpView.js @@ -562,15 +562,18 @@ const ObservationCmpView = memo( // const sortedData = [...allData].sort((a, b) => a.tag.localeCompare(b.tag)); const modifiedObjects = allData.map((obj, index) => { - const tagNameShortLength = 3; - if (obj.tag.length > tagNameShortLength) { - let shortened = { ...obj, tag: obj.tag.slice(0, tagNameShortLength) }; - if (index === 0) { - shortened = { ...shortened, tag: shortened.tag.replace('-', '') }; + let result = obj; + + if (obj.tag_prefix) { + result = { ...obj, tag: obj.tag_prefix }; + } else { + const tagNameShortLength = 3; + if (obj.tag.length > tagNameShortLength) { + result = { ...obj, tag: obj.tag.slice(0, tagNameShortLength) }; } - return shortened; } - return obj; + + return result; }); const allTagsLength = allData.length > 9 ? 9 : allData.length; @@ -745,7 +748,7 @@ const ObservationCmpView = memo( xs={allData.length === 1 ? 12 : allData.length === 2 ? 6 : 4} key={index} > -
{item.tag}
+
{item.tag_prefix ? `${item.tag_prefix} - ${item.tag}` : item.tag}
))} diff --git a/js/components/preview/tags/tagView.js b/js/components/preview/tags/tagView.js index 3254fb536..fa6c4b0bf 100644 --- a/js/components/preview/tags/tagView.js +++ b/js/components/preview/tags/tagView.js @@ -207,6 +207,10 @@ const TagView = memo( } }; + const getTagLabel = tag => { + return tag.tag_prefix ? `${tag.tag_prefix} - ${tag.tag}` : tag.tag; + }; + const generateProps = () => { // If in Tag Details if (isTagEditor) { @@ -219,9 +223,9 @@ const TagView = memo( label: assignTagView === false ? tagDetailView === false - ? tagData.tag - : originalTagData.tag - : originalTagData.tag, + ? getTagLabel(tagData) + : getTagLabel(originalTagData) + : getTagLabel(originalTagData), clickable: true, style: style, onClick: () => { @@ -236,7 +240,7 @@ const TagView = memo( className: `${classes.chip} ${selected && !isSpecialTag ? classes.chipSelected : null} ${ tagDetailView === true ? classes.tagDetailsChip : classes.tagDetailsChipList }`, - label: assignTagView === false ? (tagDetailView === false ? tagData.tag : tagData.tag) : tagData.tag, + label: getTagLabel(tagData), clickable: true, style: { backgroundColor: 'white', @@ -259,7 +263,7 @@ const TagView = memo( return { size: 'small', className: `${classes.chip} ${selected && !isSpecialTag ? classes.chipSelected : null}`, - label: partiallySelected ? `${tagData.tag}*` : originalTagData.tag, + label: partiallySelected ? `${getTagLabel(tagData)}*` : getTagLabel(originalTagData), clickable: true, // borderColor: bgColor, style: { ...style, borderColor: bgColor }, @@ -274,7 +278,7 @@ const TagView = memo( return { size: 'small', className: `${classes.chip} ${selected && !isSpecialTag ? classes.chipSelected : null}`, - label: tagDetailView === true && assignTagView === true ? tagData.tag : originalTagData.tag, + label: tagDetailView === true && assignTagView === true ? getTagLabel(tagData) : getTagLabel(originalTagData), clickable: true, // borderColor: bgColor, style: { ...style, borderColor: bgColor }, diff --git a/js/components/preview/tags/utils/tagUtils.js b/js/components/preview/tags/utils/tagUtils.js index e0cc5865c..9faa71c41 100644 --- a/js/components/preview/tags/utils/tagUtils.js +++ b/js/components/preview/tags/utils/tagUtils.js @@ -38,20 +38,26 @@ export const createMoleculeTagObject = ( }; export const compareTagsAsc = (a, b) => { - if (a.tag < b.tag) { + const aName = a.tag_prefix ? `${a.tag_prefix} - ${a.tag}` : a.tag; + const bName = b.tag_prefix ? `${b.tag_prefix} - ${b.tag}` : b.tag; + + if (aName < bName) { return -1; } - if (a.tag > b.tag) { + if (aName > bName) { return 1; } return 0; }; export const compareTagsDesc = (a, b) => { - if (a.tag > b.tag) { + const aName = a.tag_prefix ? `${a.tag_prefix} - ${a.tag}` : a.tag; + const bName = b.tag_prefix ? `${b.tag_prefix} - ${b.tag}` : b.tag; + + if (aName > bName) { return -1; } - if (a.tag < b.tag) { + if (aName < bName) { return 1; } return 0; diff --git a/js/components/projects/legacySnapshotModal/index.js b/js/components/projects/legacySnapshotModal/index.js new file mode 100644 index 000000000..025d0117d --- /dev/null +++ b/js/components/projects/legacySnapshotModal/index.js @@ -0,0 +1,49 @@ +import React, { useState } from 'react'; +import { Button, Modal } from '../../common'; +import { DJANGO_CONTEXT } from '../../../utils/djangoContext'; +import { DialogActions, DialogContent, DialogContentText, DialogTitle } from '@material-ui/core'; +import { updateClipboard } from '../../snapshot/helpers'; + +export const LegacySnapshotModal = ({ open, project, snapshot }) => { + const [legacyLink, setLegacyLink] = useState(''); + + if (DJANGO_CONTEXT['legacy_url'] && DJANGO_CONTEXT['legacy_url'] !== '' && legacyLink === '') { + setLegacyLink(`${DJANGO_CONTEXT['legacy_url']}/viewer/react/projects/${project}/${snapshot}`); + } + + const openInNewTab = () => { + window.open(legacyLink); + }; + + return ( + + <> + Potential legacy link detected + + + Project/Snapshot could not be resolved. It's possible that this is legacy URL and you may try to visit URL + below. + + + {legacyLink} + + + + + + + + {/*

+ Project/Snapshot could not be resolved. It's possible that this is legacy URL and you may try to visit URL + below.
+

+ + Legacy URL + */} + + ); +}; diff --git a/js/components/projects/projectPreview/index.js b/js/components/projects/projectPreview/index.js index 287ffebf0..bfe1c7064 100644 --- a/js/components/projects/projectPreview/index.js +++ b/js/components/projects/projectPreview/index.js @@ -8,8 +8,9 @@ import { restoreCurrentActionsList } from '../../../reducers/tracking/dispatchAc import { setIsSnapshotDirty } from '../../../reducers/tracking/actions'; import { setDownloadStructuresDialogOpen } from '../../snapshot/redux/actions'; import { ToastContext } from '../../toast'; +import { LegacySnapshotModal } from '../legacySnapshotModal'; -export const ProjectPreview = memo(({ }) => { +export const ProjectPreview = memo(({}) => { const { toast } = useContext(ToastContext); const [canShow, setCanShow] = useState(undefined); const isSnapshotLoaded = useRef(undefined); @@ -23,6 +24,8 @@ export const ProjectPreview = memo(({ }) => { const isActionRestoring = useSelector(state => state.trackingReducers.isActionRestoring); const isActionRestored = useSelector(state => state.trackingReducers.isActionRestored); + const [showLegacySnapshotModal, setShowLegacySnapshotModal] = useState(false); + useEffect(() => { if (!snapshotId && currentSnapshotID === null) { dispatch(loadSnapshotByProjectID(projectId)) @@ -49,6 +52,7 @@ export const ProjectPreview = memo(({ }) => { setCanShow(true); } else { setCanShow(false); + setShowLegacySnapshotModal(true); } if (response.data) { const dataObj = JSON.parse(response.data); @@ -59,6 +63,7 @@ export const ProjectPreview = memo(({ }) => { } else { isSnapshotLoaded.current = response; setCanShow(false); + setShowLegacySnapshotModal(true); } } }) @@ -96,5 +101,7 @@ export const ProjectPreview = memo(({ }) => { (currentSessionProject.projectID === null || currentSessionProject.authorID === null)) } /> - ) : null; + ) : ( + + ); }); diff --git a/js/components/snapshot/modals/downloadStructuresDialog.js b/js/components/snapshot/modals/downloadStructuresDialog.js index e4775552e..b41bf4b3b 100644 --- a/js/components/snapshot/modals/downloadStructuresDialog.js +++ b/js/components/snapshot/modals/downloadStructuresDialog.js @@ -470,6 +470,13 @@ export const DownloadStructureDialog = memo(({}) => { } }; + const resetDownloadOnChange = () => { + setSelectedDownload(newDownload); + setDownloadTagUrl(null); + setFileSize(null); + setDownloadUrl(null); + }; + const copyPOSTJson = () => { const requestObject = prepareRequestObject(); const jsonString = JSON.stringify(requestObject); @@ -563,7 +570,14 @@ export const DownloadStructureDialog = memo(({}) => { } + control={ + { + resetDownloadOnChange(); + }} + /> + } label={text} /> ); @@ -578,11 +592,12 @@ export const DownloadStructureDialog = memo(({}) => { control={ + onChange={() => { setMapFiles(prevState => { return { ...prevState, [flag]: !prevState[flag] }; - }) - } + }); + resetDownloadOnChange(); + }} disabled={zipPreparing} /> } @@ -599,11 +614,12 @@ export const DownloadStructureDialog = memo(({}) => { control={ + onChange={() => { setCrystallographicFiles(prevState => { return { ...prevState, [flag]: !prevState[flag] }; - }) - } + }); + resetDownloadOnChange(); + }} disabled={zipPreparing || disabled} /> } @@ -626,6 +642,7 @@ export const DownloadStructureDialog = memo(({}) => { name="radio-group-download-type" onChange={event => { setLinkType(event.currentTarget.value); + resetDownloadOnChange(); }} > {PERMALINK_OPTIONS.map(({ flag, text }) => { @@ -633,7 +650,14 @@ export const DownloadStructureDialog = memo(({}) => { } + control={ + { + resetDownloadOnChange(); + }} + /> + } label={text} /> ); @@ -648,11 +672,12 @@ export const DownloadStructureDialog = memo(({}) => { control={ + onChange={() => { setOthers(prevState => { return { ...prevState, [flag]: !prevState[flag] }; - }) - } + }); + resetDownloadOnChange(); + }} disabled={zipPreparing} /> } diff --git a/js/reducers/api/apiReducers.js b/js/reducers/api/apiReducers.js index b74af2b7a..51fb3ff21 100644 --- a/js/reducers/api/apiReducers.js +++ b/js/reducers/api/apiReducers.js @@ -266,8 +266,8 @@ export default function apiReducers(state = INITIAL_STATE, action = {}) { return { ...state, downloadTags: [...action.downloadTags] }; case constants.APPEND_TO_DOWNLOAD_TAGS: - if (!state.downloadTags.find(dt => action.tag.tag)) { - return { ...state, downloadTags: [...state.downloadTags, action.tag] }; + if (!state.downloadTags.find(dt => dt.tag === action.tag.tag)) { + return { ...state, downloadTags: [...state.downloadTags, { ...action.tag }] }; } else { return state; }