From 991c0bbee054c7985f65ab6032cccdfefd0fc22b Mon Sep 17 00:00:00 2001 From: Birdie Date: Fri, 13 Aug 2021 09:34:49 -0400 Subject: [PATCH 01/15] colorize the dataset table entries for the Uploads entity view --- src/src/components/uploads/editUploads.jsx | 17 +++++++++++++++-- 1 file changed, 15 insertions(+), 2 deletions(-) diff --git a/src/src/components/uploads/editUploads.jsx b/src/src/components/uploads/editUploads.jsx index 0078fb21..a1e86fa3 100644 --- a/src/src/components/uploads/editUploads.jsx +++ b/src/src/components/uploads/editUploads.jsx @@ -2,7 +2,9 @@ import React, { Component } from "react"; import Divider from '@material-ui/core/Divider'; import Paper from '@material-ui/core/Paper'; import axios from "axios"; +import { DataGrid } from '@material-ui/data-grid'; import { validateRequired } from "../../utils/validators"; +import { getPublishStatusColor } from "../../utils/badgeClasses"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { faQuestionCircle, @@ -23,6 +25,7 @@ import TableRow from '@material-ui/core/TableRow'; import TablePagination from '@material-ui/core/TablePagination'; import { ingest_api_get_globus_url, ingest_api_validate_upload } from '../../service/ingest_api'; +import { COLUMN_DEF_DATASET} from '../search/table_constants'; class EditUploads extends Component { @@ -167,6 +170,10 @@ class EditUploads extends Component { }); }); + this.setState({ + datarows: this.state.datasets, // Object.values(response.results) + results_total: this.state.datasets.length, + column_def: COLUMN_DEF_DATASET}) console.debug(this.state); @@ -263,6 +270,7 @@ class EditUploads extends Component { }; + highlightInvalidDatasets(){ @@ -474,7 +482,7 @@ class EditUploads extends Component { if(this.state.datasets && this.state.datasets.length > 0 ){ - + // @TODO: use the Datatables used elsewhere across the site var compiledCollection = []; for (var i in datasetCollection){ console.debug(datasetCollection[i].lab_dataset_id) @@ -510,7 +518,12 @@ class EditUploads extends Component { {row.hubmap_id} {row.lab_dataset_id} {row.group_name} - {row.status} + + + {row.status} + + ))} From 3f191d7f748ba0998d3d216ee68ba6474d87e5d3 Mon Sep 17 00:00:00 2001 From: Birdie Date: Fri, 13 Aug 2021 09:43:26 -0400 Subject: [PATCH 02/15] Midwork on fixinf URLs for datasets inside uplod tables --- src/src/components/uploads/editUploads.jsx | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/src/src/components/uploads/editUploads.jsx b/src/src/components/uploads/editUploads.jsx index a1e86fa3..76687547 100644 --- a/src/src/components/uploads/editUploads.jsx +++ b/src/src/components/uploads/editUploads.jsx @@ -1,6 +1,7 @@ import React, { Component } from "react"; import Divider from '@material-ui/core/Divider'; import Paper from '@material-ui/core/Paper'; +import { Link } from 'react-router-dom'; import axios from "axios"; import { DataGrid } from '@material-ui/data-grid'; import { validateRequired } from "../../utils/validators"; @@ -515,7 +516,13 @@ class EditUploads extends Component { key={row.hubmap_id} onClick={this.handleDatasetCellSelection(row)} > - {row.hubmap_id} + + + + {row.hubmap_id} + + {row.lab_dataset_id} {row.group_name} From b83bacff0aadb72f48c61c7cfa72bfba64600f3f Mon Sep 17 00:00:00 2001 From: Birdie Date: Wed, 18 Aug 2021 09:24:41 -0400 Subject: [PATCH 03/15] Dataset table inside an Upload now links to that dataset's page --- src/src/App.js | 12 +++++----- src/src/components/search/SearchComponent.jsx | 2 +- src/src/components/uploads/editUploads.jsx | 22 +++++++++++++------ 3 files changed, 23 insertions(+), 13 deletions(-) diff --git a/src/src/App.js b/src/src/App.js index abebebf2..79e539a0 100644 --- a/src/src/App.js +++ b/src/src/App.js @@ -143,13 +143,15 @@ class App extends Component { document.addEventListener("keydown", this.handleKeyDown); + var type; + var fauxEvent; if (this.props.match){ console.debug("APP this.props.match"); - var type = this.props.match.params.type; + type = this.props.match.params.type; console.log(type); if(type === "new"){ console.log("NEW PAGE"); - var fauxEvent = { + fauxEvent = { currentTarget:{ innerText:type } @@ -162,10 +164,10 @@ class App extends Component { var url = window.location.href; var urlsplit = url.split("/"); var firstSegment = (urlsplit[3]); - var type = (urlsplit[4]); + type = (urlsplit[4]); console.log("NEW PAGE"); console.log(firstSegment, type); - var fauxEvent = { + fauxEvent = { currentTarget:{ innerText:type } @@ -232,7 +234,7 @@ class App extends Component { handleUrlChange = (targetPath) =>{ console.debug("handleUrlChange "+targetPath) console.debug(this.state.creatingNewEntity) - window.history.replaceState( + window.history.pushState( null, "", "/"+targetPath.toLowerCase()); diff --git a/src/src/components/search/SearchComponent.jsx b/src/src/components/search/SearchComponent.jsx index f281cb4b..b9ab82a2 100644 --- a/src/src/components/search/SearchComponent.jsx +++ b/src/src/components/search/SearchComponent.jsx @@ -400,7 +400,7 @@ class SearchComponent extends Component { handleUrlChange = (targetPath) =>{ console.debug("handleUrlChange "+targetPath) if(targetPath!=="----"){ - window.history.replaceState( + window.history.pushState( null, "", "/"+targetPath); diff --git a/src/src/components/uploads/editUploads.jsx b/src/src/components/uploads/editUploads.jsx index 76687547..04fb9079 100644 --- a/src/src/components/uploads/editUploads.jsx +++ b/src/src/components/uploads/editUploads.jsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import React, { Component, useEffect } from "react"; import Divider from '@material-ui/core/Divider'; import Paper from '@material-ui/core/Paper'; import { Link } from 'react-router-dom'; @@ -209,7 +209,7 @@ class EditUploads extends Component { !this.props.editingUpload && this.state.groups.length > 1 && !this.state.GroupSelectShow - ) { + ){ this.setState({ GroupSelectShow: true }); } else { this.setState({ @@ -442,10 +442,17 @@ class EditUploads extends Component { this.handleSearchClick(); }); } - - handleDatasetCellSelection (row,column,event) { + handleDatasetCellSelection = (row,column,event) =>{ console.log("handleDatasetCellSelection"); console.debug(row,column,event); + console.debug("/datasets/"+row.uuid); + + window.history.pushState( + null, + "", + "/datasets/"+row.uuid); + window.location.reload() + } @@ -487,12 +494,13 @@ class EditUploads extends Component { var compiledCollection = []; for (var i in datasetCollection){ console.debug(datasetCollection[i].lab_dataset_id) - console.debug("/uploads/"+datasetCollection[i].uuid) + console.debug("/datasets/"+datasetCollection[i].uuid) compiledCollection.push({ hubmap_id: datasetCollection[i].hubmap_id, lab_dataset_id: datasetCollection[i].lab_dataset_id, group_name: datasetCollection[i].group_name, - status: datasetCollection[i].status + status: datasetCollection[i].status, + uuid: datasetCollection[i].uuid }); } return ( @@ -514,7 +522,7 @@ class EditUploads extends Component { {compiledCollection.map((row) => ( this.handleDatasetCellSelection(row)} > From 82e506904966d7c7d4a57d5ef2165c21d61b776f Mon Sep 17 00:00:00 2001 From: Birdie Date: Wed, 18 Aug 2021 09:28:15 -0400 Subject: [PATCH 04/15] adds missing Badge class util file --- src/src/utils/badgeClasses.jsx | 48 ++++++++++++++++++++++++++++++++++ 1 file changed, 48 insertions(+) create mode 100644 src/src/utils/badgeClasses.jsx diff --git a/src/src/utils/badgeClasses.jsx b/src/src/utils/badgeClasses.jsx new file mode 100644 index 00000000..370806e0 --- /dev/null +++ b/src/src/utils/badgeClasses.jsx @@ -0,0 +1,48 @@ + +export function getPublishStatusColor(status) { + var badge_class = ""; + //console.log('status', status) + switch (status.toUpperCase()) { + case "NEW": + badge_class = "badge-purple"; + break; + case "REOPENED": + badge_class = "badge-purple"; + break; + case "REORGANIZED": + badge_class = "badge-info"; + break; + case "VALID": + badge_class = "badge-success"; + break; + case "INVALID": + badge_class = "badge-danger"; + break; + case "QA": + badge_class = "badge-info"; + break; + case "LOCKED": + badge_class = "badge-secondary"; + break; + case "PROCESSING": + badge_class = "badge-secondary"; + break; + case "PUBLISHED": + badge_class = "badge-success"; + break; + case "UNPUBLISHED": + badge_class = "badge-light"; + break; + case "DEPRECATED": + break; + case "ERROR": + badge_class = "badge-danger"; + break; + case "HOLD": + badge_class = "badge-dark"; + break; + default: + break; + } + return badge_class; +} From a81246de8b82fe32e9b5887099a6aa769b498167 Mon Sep 17 00:00:00 2001 From: yuanzhou Date: Fri, 10 Sep 2021 12:53:45 -0400 Subject: [PATCH 05/15] Bump version to 2.0.16 --- VERSION | 2 +- src/package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/VERSION b/VERSION index e6f474a0..d845ccb1 100644 --- a/VERSION +++ b/VERSION @@ -1 +1 @@ -2.0.15 \ No newline at end of file +2.0.16 \ No newline at end of file diff --git a/src/package.json b/src/package.json index 9b60c619..ca412535 100644 --- a/src/package.json +++ b/src/package.json @@ -1,6 +1,6 @@ { "name": "ingest-ui", - "version": "2.0.15", + "version": "2.0.16", "private": true, "homepage": ".", "dependencies": { From ddf83b616d01babbdd84343fed8b64824bc1238d Mon Sep 17 00:00:00 2001 From: Birdie Date: Fri, 10 Sep 2021 15:00:33 -0400 Subject: [PATCH 06/15] midflow, dealing with Removal Interaction --- src/src/App.css | 9 + src/src/components/ingest/dataset_edit.jsx | 442 +++++++++++------- src/src/components/search/SearchComponent.jsx | 2 +- 3 files changed, 280 insertions(+), 173 deletions(-) diff --git a/src/src/App.css b/src/src/App.css index c5349f0b..f0029d2f 100755 --- a/src/src/App.css +++ b/src/src/App.css @@ -382,6 +382,11 @@ caption { .App .bg-primary, .App .button-primary { background-color: #444a65 !important; } +.title-error.bg-error{ + color: #fff; + font-weight: 500; + background-color: #f44336; + } .container { width:100% !important; @@ -673,4 +678,8 @@ a.disabled { border-bottom: 1px solid rgba(224, 224, 224, 1); text-overflow: ellipsis; cursor: pointer; +} + +.interaction-icon{ + cursor: pointer; } \ No newline at end of file diff --git a/src/src/components/ingest/dataset_edit.jsx b/src/src/components/ingest/dataset_edit.jsx index 362ceeb7..065fe7fe 100644 --- a/src/src/components/ingest/dataset_edit.jsx +++ b/src/src/components/ingest/dataset_edit.jsx @@ -4,10 +4,12 @@ import Divider from '@material-ui/core/Divider'; import Dialog from '@material-ui/core/Dialog'; import DialogActions from '@material-ui/core/DialogActions'; import DialogContent from '@material-ui/core/DialogContent'; +import DialogContentText from '@material-ui/core/DialogContentText'; +import DialogTitle from '@material-ui/core/DialogTitle'; import Button from '@material-ui/core/Button'; import '../../App.css'; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import { faQuestionCircle, faSpinner } from "@fortawesome/free-solid-svg-icons"; +import { faQuestionCircle, faSpinner, faEye, faUnlink, faPlus } from "@fortawesome/free-solid-svg-icons"; import ReactTooltip from "react-tooltip"; //import IDSearchModal from "../uuid/tissue_form_components/idSearchModal"; //import CreateCollectionModal from "./createCollectionModal"; @@ -27,6 +29,15 @@ import SearchComponent from "../search/SearchComponent"; import { ingest_api_allowable_edit_states, ingest_api_create_dataset, ingest_api_dataset_submit } from '../../service/ingest_api'; import { entity_api_update_entity } from '../../service/entity_api'; + +import Table from '@material-ui/core/Table'; +import TableBody from '@material-ui/core/TableBody'; +import TableCell from '@material-ui/core/TableCell'; +import TableContainer from '@material-ui/core/TableContainer'; +import TableHead from '@material-ui/core/TableHead'; +import TableRow from '@material-ui/core/TableRow'; + + class DatasetEdit extends Component { state = { status: "", @@ -39,6 +50,7 @@ class DatasetEdit extends Component { // description: "", // }, source_uuid: undefined, + editingSource:[], source_uuid_list: [], contains_human_genetic_sequences: undefined, description: "", @@ -50,6 +62,7 @@ class DatasetEdit extends Component { lookUpCancelled: false, LookUpShow: false, GroupSelectShow: false, + confirmDialog: false, // is_curator: null, source_uuid_type: "", data_types: new Set(), @@ -225,7 +238,7 @@ class DatasetEdit extends Component { // description: "", // }, source_uuid: this.getSourceAncestor(this.props.editingDataset.direct_ancestors), - source_uuid_list: this.props.editingDataset.direct_ancestors, + source_uuid_list: this.sourceDuplicator(this.props.editingDataset.direct_ancestors), source_entity: this.getSourceAncestorEntity(this.props.editingDataset.direct_ancestors), // source_uuid_type: this.props.editingDataset.properties.specimen_type, //contains_human_genetic_sequences: this.props.editingDataset.contains_human_genetic_sequences, @@ -345,6 +358,22 @@ class DatasetEdit extends Component { }); }; + showConfirmDialog(row) { + console.debug("ShowConfDia") + this.setState({ + confirmDialog: true, + editingSource: row + }); +}; + +hideConfirmDialog = () => { + this.setState({ + confirmDialog: false , + editingSource: [] + }); +}; + + handleLookUpClick = () => { //////console.debug('IM HERE TRYING TO SHOW THE DIALOG', this.state.source_uuid) if (!this.state.lookUpCancelled) { @@ -520,13 +549,31 @@ class DatasetEdit extends Component { // ////console.log('handleSelectClick', ids) //let id = this.getSourceAncestor(ids); //////console.log('Dataset selected', selection.row.uuid) - var slist = []; - slist.push({uuid: selection.row.uuid}); + var slist = this.state.source_uuid_list; + slist.push(selection.row); + ////console.debug('SLIST', slist) + this.setState( + { + source_uuid: selection.row.hubmap_id, + source_uuid_list: this.sourceDuplicator(slist), + source_entity: selection.row, // save the entire entity to use for information + LookUpShow: false, + } + ); + this.cancelLookUpModal(); + }; + + handleUnlinkClick = (selection) => { + // ////console.log('handleSelectClick', ids) + //let id = this.getSourceAncestor(ids); + //////console.log('Dataset selected', selection.row.uuid) + var sdlist = this.state.source_uuid_list; + sdlist.push(selection.row); ////console.debug('SLIST', slist) this.setState( { source_uuid: selection.row.hubmap_id, - source_uuid_list: slist, + source_uuid_list: this.sourceDuplicator(sdlist), source_entity: selection.row, // save the entire entity to use for information LookUpShow: false, } @@ -534,6 +581,7 @@ class DatasetEdit extends Component { this.cancelLookUpModal(); }; + // handleSelectClick = (ids) => { // // ////console.log('handleSelectClick', ids) // let id = this.getSourceAncestor(ids); @@ -548,21 +596,194 @@ class DatasetEdit extends Component { // ); // }; - getUuidList = (new_uuid_list) => { - //this.setState({uuid_list: new_uuid_list}); - //////console.log('**getUuidList', new_uuid_list) - this.setState( - { - source_uuid: this.getSourceAncestor(new_uuid_list), - source_uuid_list: new_uuid_list, - - LookUpShow: false, - }, - () => { - this.validateUUID(); + sourceDuplicator = (sources) => { + // For the testing of the multi-source Interface + console.debug("Sources ",sources) + console.debug("Sources ",sources) + if(sources){ + console.debug("sourceDuplicator: ", sources); + if(sources && sources.length===1){ + + var ns1 = sources[0]; + ns1.ID = sources.length+1 + + var ns2 = sources[0]; + ns2.ID = sources.length+2 + + console.debug("One Source") + sources.push(ns1, ns2); + return sources; + }else if(sources.length>1){ + sources[0].ID = 0; + console.debug("Already Multi Source") + return sources + }else{ + console.debug("Sourse Dupli Error") + return "err" } - ); - }; + }else{ + return {err: "err"} + } + + } + + + sourcePop(){ + return( + "hi" + // this.state.editingSource.filter(item => item.uuid !== this.state.editingSource.uuid) + ) + } + sourceRemover = () => { + // For the testing of the multi-source Interface + console.debug("Removing Source ",this.state.editingSource) + var slist=this.state.source_uuid_list; + this.setState( { + source_uuid_list: slist + }); + + + + } + renderSources = () => { + if(this.state.source_uuid_list && this.state.source_uuid_list.length > 0 ){ + return ( +
+ + + + + + + + +

+ The HuBMAP Unique identifier of the direct origin entity, +
+ other sample or doner, where this sample came from. +

+ + + Source Type + Organ Type + {/* make the above rename 'Organ' to whatever type's aprops for the Source type */} + Group Name + Submission ID + Description + Status + Action + + + + {this.state.source_uuid_list.map((row, index) => ( + this.handleSourceCellSelection(row)} + className="row-selection" + > + {row.hubmap_id} + {row.entity_type} + {row.data_type} + {row.group_name} + {row.lab_tissue_sample_id} + {row.description} + {row.status} + + {this.state.writeable && ( + + this.showConfirmDialog(row)} + /> + + )} + + + ))} + +
+ + {this.state.writeable && ( + +
+ +
+ + )} + + +
+ )} + + } + + renderConfirmDialog = () => { + return ( + + {"Removing Source"} + + + +

Are you sure you want to unlink Source {this.state.editingSource.hubmap_id}?

+ Source remains in the database. To delete the entity itself, please use the Entity page + + + + + + + + ) + } + + + // getUuidList = (new_uuid_list) => { + // //this.setState({uuid_list: new_uuid_list}); + // //////console.log('**getUuidList', new_uuid_list) + // this.setState( + // { + // source_uuid: this.sourceDuplicator(this.getSourceAncestor(new_uuid_list)) , + // source_uuid_list: new_uuid_list, + // LookUpShow: false, + // }, + // () => { + // this.validateUUID(); + // } + // ); + // }; handleAddNewCollection = () => { this.setState({ @@ -1487,18 +1708,7 @@ class DatasetEdit extends Component {

Dataset Information

-
- - Do not upload any - data containing any of the{" "} - - 18 identifiers specified by HIPAA - - . -
+

{this.props.editingDataset && @@ -1530,6 +1740,8 @@ class DatasetEdit extends Component {

+ +
+ + + + + Entity Details Saved! + + + ); } diff --git a/src/src/components/search/SearchComponent.jsx b/src/src/components/search/SearchComponent.jsx index 29961071..f6daef6d 100644 --- a/src/src/components/search/SearchComponent.jsx +++ b/src/src/components/search/SearchComponent.jsx @@ -473,8 +473,8 @@ class SearchComponent extends Component { //console.debug(this.props) this.setState({ updateSuccess: true, - editingEntity: null, - show_search: true, + // editingEntity: null, + // show_search: true, }); setTimeout(() => { this.setState({ updateSuccess: null }); From fc97a47abb78fe90b19baa12bc4d106dbae96547 Mon Sep 17 00:00:00 2001 From: Birdie Date: Fri, 10 Sep 2021 17:39:38 -0400 Subject: [PATCH 12/15] Nix the SourceDuplicator used in testing --- src/src/components/ingest/dataset_edit.jsx | 37 ++-------------------- 1 file changed, 3 insertions(+), 34 deletions(-) diff --git a/src/src/components/ingest/dataset_edit.jsx b/src/src/components/ingest/dataset_edit.jsx index b2451d8a..5f2b894b 100644 --- a/src/src/components/ingest/dataset_edit.jsx +++ b/src/src/components/ingest/dataset_edit.jsx @@ -247,7 +247,7 @@ class DatasetEdit extends Component { // description: "", // }, source_uuid: this.getSourceAncestor(this.props.editingDataset.direct_ancestors), - source_uuid_list: this.sourceDuplicator(this.props.editingDataset.direct_ancestors), + source_uuid_list: this.props.editingDataset.direct_ancestors, source_entity: this.getSourceAncestorEntity(this.props.editingDataset.direct_ancestors), // source_uuid_type: this.props.editingDataset.properties.specimen_type, //contains_human_genetic_sequences: this.props.editingDataset.contains_human_genetic_sequences, @@ -579,7 +579,7 @@ class DatasetEdit extends Component { this.setState( { source_uuid: selection.row.hubmap_id, - source_uuid_list: this.sourceDuplicator(slist), + source_uuid_list: slist, source_entity: selection.row, // save the entire entity to use for information LookUpShow: false, } @@ -597,7 +597,7 @@ class DatasetEdit extends Component { this.setState( { source_uuid: selection.row.hubmap_id, - source_uuid_list: this.sourceDuplicator(sdlist), + source_uuid_list: sdlist, source_entity: selection.row, // save the entire entity to use for information LookUpShow: false, } @@ -620,37 +620,6 @@ class DatasetEdit extends Component { // ); // }; - sourceDuplicator = (sources) => { - // For the testing of the multi-source Interface - console.debug("Sources ",sources) - console.debug("Sources ",sources) - if(sources){ - console.debug("sourceDuplicator: ", sources); - if(sources && sources.length===1){ - - var ns1 = sources[0]; - ns1.ID = sources.length+1 - - var ns2 = sources[0]; - ns2.ID = sources.length+2 - - console.debug("One Source") - sources.push(ns1, ns2); - return sources; - }else if(sources.length>1){ - sources[0].ID = 0; - console.debug("Already Multi Source") - return sources - }else{ - console.debug("Sourse Dupli Error") - return "err" - } - }else{ - return {err: "err"} - } - - } - sourcePop(){ return( From 335fc531ee59bf6b0dc767f7e7d72a289cc1ceed Mon Sep 17 00:00:00 2001 From: Birdie Date: Fri, 10 Sep 2021 17:41:00 -0400 Subject: [PATCH 13/15] Tidyup --- src/src/components/ingest/dataset_edit.jsx | 16 ---------------- 1 file changed, 16 deletions(-) diff --git a/src/src/components/ingest/dataset_edit.jsx b/src/src/components/ingest/dataset_edit.jsx index 5f2b894b..113e48c2 100644 --- a/src/src/components/ingest/dataset_edit.jsx +++ b/src/src/components/ingest/dataset_edit.jsx @@ -620,23 +620,10 @@ class DatasetEdit extends Component { // ); // }; - - sourcePop(){ - return( - "hi" - // this.state.editingSource.filter(item => item.uuid !== this.state.editingSource.uuid) - ) - } sourceRemover = () => { - // For the testing of the multi-source Interface console.debug("Removing Source ",this.state.editingSource,this.state.editingSourceIndex) var slist=this.state.source_uuid_list; - //slist = slist.pop(this.state.editingSourceIndex) - // slist.splice(this.state.editingSource,this.state.editingSourceIndex, 1); - slist = slist.filter(source => source.uuid !== this.state.editingSource.uuid) - - this.setState( { source_uuid_list: slist } , @@ -644,9 +631,6 @@ class DatasetEdit extends Component { console.log("NEW LIST ",this.state.source_uuid_list); this.hideConfirmDialog(); }); - - - } renderSources = () => { if(this.state.source_uuid_list && this.state.source_uuid_list.length > 0 ){ From 355280a68d2c9f6d8c7aca05eb350d58591b8017 Mon Sep 17 00:00:00 2001 From: "Zhou (Joe) Yuan" Date: Mon, 13 Sep 2021 13:17:36 -0400 Subject: [PATCH 14/15] Revert "Loadbar search patch" --- src/src/App.css | 9 - src/src/components/ingest/dataset_edit.jsx | 456 +++++++----------- src/src/components/search/SearchComponent.jsx | 86 ++-- 3 files changed, 212 insertions(+), 339 deletions(-) diff --git a/src/src/App.css b/src/src/App.css index f0029d2f..c5349f0b 100755 --- a/src/src/App.css +++ b/src/src/App.css @@ -382,11 +382,6 @@ caption { .App .bg-primary, .App .button-primary { background-color: #444a65 !important; } -.title-error.bg-error{ - color: #fff; - font-weight: 500; - background-color: #f44336; - } .container { width:100% !important; @@ -678,8 +673,4 @@ a.disabled { border-bottom: 1px solid rgba(224, 224, 224, 1); text-overflow: ellipsis; cursor: pointer; -} - -.interaction-icon{ - cursor: pointer; } \ No newline at end of file diff --git a/src/src/components/ingest/dataset_edit.jsx b/src/src/components/ingest/dataset_edit.jsx index 113e48c2..362ceeb7 100644 --- a/src/src/components/ingest/dataset_edit.jsx +++ b/src/src/components/ingest/dataset_edit.jsx @@ -4,12 +4,10 @@ import Divider from '@material-ui/core/Divider'; import Dialog from '@material-ui/core/Dialog'; import DialogActions from '@material-ui/core/DialogActions'; import DialogContent from '@material-ui/core/DialogContent'; -import DialogContentText from '@material-ui/core/DialogContentText'; -import DialogTitle from '@material-ui/core/DialogTitle'; import Button from '@material-ui/core/Button'; import '../../App.css'; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import { faQuestionCircle, faSpinner, faEye, faUnlink, faPlus } from "@fortawesome/free-solid-svg-icons"; +import { faQuestionCircle, faSpinner } from "@fortawesome/free-solid-svg-icons"; import ReactTooltip from "react-tooltip"; //import IDSearchModal from "../uuid/tissue_form_components/idSearchModal"; //import CreateCollectionModal from "./createCollectionModal"; @@ -29,21 +27,6 @@ import SearchComponent from "../search/SearchComponent"; import { ingest_api_allowable_edit_states, ingest_api_create_dataset, ingest_api_dataset_submit } from '../../service/ingest_api'; import { entity_api_update_entity } from '../../service/entity_api'; -import Snackbar from '@material-ui/core/Snackbar'; -import CloseIcon from '@material-ui/icons/Close'; -import MuiAlert, { AlertProps } from '@material-ui/lab/Alert'; -import Table from '@material-ui/core/Table'; -import TableBody from '@material-ui/core/TableBody'; -import TableCell from '@material-ui/core/TableCell'; -import TableContainer from '@material-ui/core/TableContainer'; -import TableHead from '@material-ui/core/TableHead'; -import TableRow from '@material-ui/core/TableRow'; - - -function Alert(props: AlertProps) { - return ; -} - class DatasetEdit extends Component { state = { status: "", @@ -56,8 +39,6 @@ class DatasetEdit extends Component { // description: "", // }, source_uuid: undefined, - editingSource:[], - editingSourceIndex:0, source_uuid_list: [], contains_human_genetic_sequences: undefined, description: "", @@ -69,9 +50,6 @@ class DatasetEdit extends Component { lookUpCancelled: false, LookUpShow: false, GroupSelectShow: false, - confirmDialog: false, - snackPriotity:'error', - openSnack: false, // is_curator: null, source_uuid_type: "", data_types: new Set(), @@ -345,8 +323,6 @@ class DatasetEdit extends Component { document.removeEventListener("click", this.handleClickOutside, true); } - - showModal = () => { this.setState({ show: true }); }; @@ -369,35 +345,6 @@ class DatasetEdit extends Component { }); }; - showConfirmDialog(row,index) { - console.debug("ShowConfDia") - - console.debug("row", row) - console.debug("row index", index) - this.setState({ - confirmDialog: true, - editingSource: row, - editingSourceIndex: index - }); - }; - - hideConfirmDialog = () => { - this.setState({ - confirmDialog: false , - editingSource: [] - }); - }; - - handleCloseSnack = (event, reason) => { - if (reason === 'clickaway') { - return; - } - this.setState({ - openSnack: false - }) - }; - - handleLookUpClick = () => { //////console.debug('IM HERE TRYING TO SHOW THE DIALOG', this.state.source_uuid) if (!this.state.lookUpCancelled) { @@ -573,8 +520,8 @@ class DatasetEdit extends Component { // ////console.log('handleSelectClick', ids) //let id = this.getSourceAncestor(ids); //////console.log('Dataset selected', selection.row.uuid) - var slist = this.state.source_uuid_list; - slist.push(selection.row); + var slist = []; + slist.push({uuid: selection.row.uuid}); ////console.debug('SLIST', slist) this.setState( { @@ -587,25 +534,6 @@ class DatasetEdit extends Component { this.cancelLookUpModal(); }; - handleUnlinkClick = (selection) => { - // ////console.log('handleSelectClick', ids) - //let id = this.getSourceAncestor(ids); - //////console.log('Dataset selected', selection.row.uuid) - var sdlist = this.state.source_uuid_list; - sdlist.push(selection.row); - ////console.debug('SLIST', slist) - this.setState( - { - source_uuid: selection.row.hubmap_id, - source_uuid_list: sdlist, - source_entity: selection.row, // save the entire entity to use for information - LookUpShow: false, - } - ); - this.cancelLookUpModal(); - }; - - // handleSelectClick = (ids) => { // // ////console.log('handleSelectClick', ids) // let id = this.getSourceAncestor(ids); @@ -620,157 +548,21 @@ class DatasetEdit extends Component { // ); // }; - sourceRemover = () => { - console.debug("Removing Source ",this.state.editingSource,this.state.editingSourceIndex) - var slist=this.state.source_uuid_list; - slist = slist.filter(source => source.uuid !== this.state.editingSource.uuid) - this.setState( { - source_uuid_list: slist - } , - () => { - console.log("NEW LIST ",this.state.source_uuid_list); - this.hideConfirmDialog(); - }); - } - renderSources = () => { - if(this.state.source_uuid_list && this.state.source_uuid_list.length > 0 ){ - return ( -
- - - - - - - - -

- The HuBMAP Unique identifier of the direct origin entity, -
- other sample or doner, where this sample came from. -

- - - Source Type - Organ Type - {/* make the above rename 'Organ' to whatever type's aprops for the Source type */} - Group Name - Submission ID - Description - Status - Action - - - - {this.state.source_uuid_list.map((row, index) => ( - this.handleSourceCellSelection(row)} - className="row-selection" - > - {row.hubmap_id} - {row.entity_type} - {row.data_type} - {row.group_name} - {row.lab_tissue_sample_id} - {row.description} - {row.status} - - {this.state.writeable && ( - - this.showConfirmDialog(row,index)} - /> - - )} - - - ))} - -
- - {this.state.writeable && ( - -
- -
- - )} - - -
- )} - - } - - renderConfirmDialog = () => { - return ( - - {"Removing Source"} - - - - Are you sure you want to unlink Source {this.state.editingSource.hubmap_id}? - Source remains in the database. To delete the entity itself, please use the Entity page - - - - - - - - ) - } - + getUuidList = (new_uuid_list) => { + //this.setState({uuid_list: new_uuid_list}); + //////console.log('**getUuidList', new_uuid_list) + this.setState( + { + source_uuid: this.getSourceAncestor(new_uuid_list), + source_uuid_list: new_uuid_list, - // getUuidList = (new_uuid_list) => { - // //this.setState({uuid_list: new_uuid_list}); - // //////console.log('**getUuidList', new_uuid_list) - // this.setState( - // { - // source_uuid: this.sourceDuplicator(this.getSourceAncestor(new_uuid_list)) , - // source_uuid_list: new_uuid_list, - // LookUpShow: false, - // }, - // () => { - // this.validateUUID(); - // } - // ); - // }; + LookUpShow: false, + }, + () => { + this.validateUUID(); + } + ); + }; handleAddNewCollection = () => { this.setState({ @@ -915,15 +707,6 @@ class DatasetEdit extends Component { }) }; - savedUpdate = (i) => { - console.log("savedUpdate"); - this.setState({ - openSnack: true, - snackPriotity: 'success', - submitting: false - }) - }; - handleSubmit = (i) => { //////console.log('SUBMIT!!'); const data_type_options = new Set(this.state.data_type_dicts.map((elt, idx) => {return elt.name})); @@ -1004,36 +787,30 @@ class DatasetEdit extends Component { axios .put(uri, JSON.stringify(data), config) .then((res) => { - this.savedUpdate(); this.props.onUpdated(res.data); }) .catch((error) => { - console.debug("ERROR ", error) this.setState({ submit_error: true, submitting: false }); }); } else if (i === "processing") { - console.log('Submit Dataset...'); + ////console.log('Submit Dataset...'); ingest_api_dataset_submit(this.props.editingDataset.uuid, JSON.stringify(data), JSON.parse(localStorage.getItem("info")).nexus_token) .then((response) => { if (response.status === 200) { - console.log(response.results); + ////console.log(response.results); this.props.onUpdated(response.results); } else { - console.log(response); this.setState({ submit_error: true, submitting: false }); } }); } else { // just update - entity_api_update_entity(this.props.editingDataset.uuid, JSON.stringify(data), JSON.parse(localStorage.getItem("info")).nexus_token) .then((response) => { if (response.status === 200) { - console.log('Update Dataset...'); - console.log(response.results); - this.savedUpdate(); + ////console.log('Update Dataset...'); + ////console.log(response.results); this.props.onUpdated(response.results); } else { - console.debug("ERROR ",response) this.setState({ submit_error: true, submitting: false }); } }); @@ -1710,7 +1487,18 @@ class DatasetEdit extends Component {

Dataset Information

- +
+ - Do not upload any + data containing any of the{" "} + + 18 identifiers specified by HIPAA + + . +

{this.props.editingDataset && @@ -1742,8 +1530,6 @@ class DatasetEdit extends Component {

- -