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": {
diff --git a/src/src/App.js b/src/src/App.js
index ee786a79..cf2aba4e 100644
--- a/src/src/App.js
+++ b/src/src/App.js
@@ -142,6 +142,8 @@ class App extends Component {
var type;
var fauxEvent;
+ var type;
+ var fauxEvent;
if (this.props.match){
console.debug("APP this.props.match");
type = this.props.match.params.type;
diff --git a/src/src/components/search/SearchComponent.jsx b/src/src/components/search/SearchComponent.jsx
index d34d6404..e31f846b 100644
--- a/src/src/components/search/SearchComponent.jsx
+++ b/src/src/components/search/SearchComponent.jsx
@@ -1,4 +1,4 @@
-import React, { Component } from "react";
+import React, { Component, useState } from "react";
import { withRouter } from 'react-router-dom';
import { DataGrid } from '@material-ui/data-grid';
import Paper from '@material-ui/core/Paper';
@@ -24,34 +24,35 @@ import Forms from "../uuid/forms";
// import { browserHistory } from 'react-router'
class SearchComponent extends Component {
- state = {
- selectionModel: "",
- filtered_keywords: "",
- filtered: false,
- entity_type_list: SAMPLE_TYPES,
- column_def: COLUMN_DEF_DONOR,
- show_info_panel: true,
- show_search: true,
- results_total: 0,
- page: 0,
- pageSize: 100,
- editForm: false,
- show_modal: false,
- hide_modal: true,
- updateSuccess: false,
- globus_url: "",
- isAuthenticated: false,
- group: "All Components",
- sampleType: "----",
- keywords: "",
- last_keyword: "",
- loading: true,
- modeCheck:"" //@TODO: Patch for loadingsearch within dataset edits, We should move this
- };
constructor(props) {
super(props);
console.debug("SearchCompprops",props);
+ this.state = {
+ selectionModel: "",
+ filtered_keywords: "",
+ filtered: false,
+ entity_type_list: SAMPLE_TYPES,
+ column_def: COLUMN_DEF_DONOR,
+ show_info_panel: true,
+ show_search: true,
+ results_total: 0,
+ page: 0,
+ pageSize: 100,
+ editForm: false,
+ show_modal: false,
+ hide_modal: true,
+ updateSuccess: false,
+ globus_url: "",
+ isAuthenticated: false,
+ group: "All Components",
+ sampleType: "----",
+ keywords: "",
+ last_keyword: "",
+ loading: false,
+ table_loading:false,
+ modeCheck:"" //@TODO: Patch for loadingsearch within dataset edits, We should move this
+ };
}
componentDidMount() {
@@ -70,7 +71,7 @@ class SearchComponent extends Component {
if(this.props.modecheck === "Source"){
this.setState({
loading:false,
- show_search:true
+ show_search:true,
});
}else{
this.setState({
@@ -87,6 +88,7 @@ class SearchComponent extends Component {
this.setState({
sampleType: lastSegment,
sample_type: lastSegment,
+ loading: false
},function(){
this.setFilterType();
if(euuid && euuid !== "new"){
@@ -102,6 +104,13 @@ class SearchComponent extends Component {
this.handleSearchClick();
}
});
+ }else if(window.location.href.includes("/undefined")){
+ // We're running without filter props passed or URL routing
+ console.log("Undefined?!")
+
+ this.handleClearFilter();
+ this.handleUrlChange("");
+
}else{
// We're running without filter props passed or URL routing
console.log("No Props Or URL, Clear Filter")
@@ -118,6 +127,7 @@ class SearchComponent extends Component {
// console.log(type+" | "+euuid);
this.setState({
sampleType: type,
+ loading: false
},function(){
if(euuid){
// console.log("UUID PROVIDED: "+euuid);
@@ -219,7 +229,8 @@ class SearchComponent extends Component {
editingEntity: this.props.editNewEntity,
editForm: true,
show_modal: true,
- show_search: false
+ show_search: false,
+ loading: false
});
}
@@ -312,8 +323,7 @@ class SearchComponent extends Component {
handleSearchClick = () => {
//this.setState({ loading: true, filtered: true, page: 0 });
- this.setState({ loading: true, filtered: true});
-
+ console.debug("handleSearchClick")
const group = this.state.group;
const sample_type = this.state.sampleType;
const keywords = this.state.keywords;
@@ -344,9 +354,9 @@ class SearchComponent extends Component {
}
if (sample_type) {
- //console.debug(sample_type);
+ console.debug("sample_type", sample_type);
console.debug(this.props);
- if(!this.state.uuid && sample_type !=="----"){
+ if(!this.state.uuid && sample_type !=="----"){
this.handleUrlChange(this.handleSingularty(sample_type, "plural"));
}
@@ -371,30 +381,50 @@ class SearchComponent extends Component {
params["search_term"] = keywords;
}
+ console.debug('results_total ', this.state.results_total);
console.debug('From Page ', this.state.page);
console.debug('From Page size', this.state.pageSize);
+
- api_search2(params, JSON.parse(localStorage.getItem("info")).nexus_token, this.state.page, this.state.pageSize)
- .then((response) => {
- console.debug("Search Res", response.results);
- if (response.status === 200) {
- //console.debug('SEARCH RESULTS', response);
- if (response.total === 1) { // for single returned items, customize the columns to match
- which_cols_def = this.columnDefType(response.results[0].entity_type);
- ////console.debug("which_cols_def: ", which_cols_def);
- }
- this.setState(
- {
+ console.debug("this.state.page", this.state.page);
+ if(this.state.page != 0 ){
+ this.setState({
+ table_loading:true,
+ });
+ }
+
+ this.setState({
+ loading: true,
+ filtered: true
+ },() => {
+ api_search2(params, JSON.parse(localStorage.getItem("info")).nexus_token, this.state.page, this.state.pageSize)
+ .then((response) => {
+ console.debug("Search Res", response.results);
+
+ if (response.status === 200) {
+ if (response.total === 1) { // for single returned items, customize the columns to match
+ which_cols_def = this.columnDefType(response.results[0].entity_type);
+ ////console.debug("which_cols_def: ", which_cols_def);
+ }else if(response.total <= 0 ){
+
+ console.log("0 results not mid-load");
+ }
+
+ this.setState({
datarows: response.results, // Object.values(response.results)
results_total: response.total,
- column_def: which_cols_def
- }
- );
-
-
+ column_def: which_cols_def,
+ loading: false,
+ table_loading:false,
+ });
+ }else{
+ console.debug("Error on Search ", response)
}
- this.setState({ loading: false });
+ })
+
});
+
+
};
columnDefType = (et) => {
@@ -413,8 +443,14 @@ class SearchComponent extends Component {
handleUrlChange = (targetPath) =>{
console.debug("handleUrlChange "+targetPath)
- if(targetPath!=="----"){
- window.history.replaceState(
+ if(!targetPath || targetPath === undefined){
+ var targetPath = ""
+ }
+ this.setState({
+ loading: false
+ })
+ if(targetPath!=="----" && targetPath!=="undefined"){
+ window.history.pushState(
null,
"",
"/"+targetPath);
@@ -425,6 +461,7 @@ class SearchComponent extends Component {
console.debug('Page changed', page)
this.setState({
page: page,
+ table_loading:true,
// pageSize: params.pageSize
}, () => { // need to do this in order for it to execute after setting the state or state won't be available
this.handleSearchClick();
@@ -438,8 +475,10 @@ class SearchComponent extends Component {
}
handleSearchButtonClick = () => {
+ console.debug("handleSearchButtonClick")
this.setState({
datarows: [],
+ loading: true,
page: 0 // reset the page
}, () => { // need to do this in order for it to execute after setting the state or state won't be available
this.handleSearchClick();
@@ -455,13 +494,16 @@ class SearchComponent extends Component {
}
cancelEdit = () => {
- this.setState({ editingEntity: null,
+ this.setState({
+ editingEntity: null,
show_modal: false,
- show_search: true
+ show_search: true,
+ loading: false
});
// console.debug("cancelEdit")
// console.debug(this.props.match)
// console.debug(this.props.match.params.type)
+ // this.handleClearFilter();
this.handleUrlChange();
this.handleSearchClick();
//this.filterEntity();
@@ -475,6 +517,7 @@ class SearchComponent extends Component {
updateSuccess: true,
editingEntity: null,
show_search: true,
+ loading: false
});
setTimeout(() => {
this.setState({ updateSuccess: null });
@@ -497,7 +540,8 @@ class SearchComponent extends Component {
open_edit_dialog: false,
creatingNewEntity: false,
showSearch: true,
- show_search:true
+ show_search:true,
+ loading: false
});
//this.handleUrlChange("");
};
@@ -531,6 +575,7 @@ class SearchComponent extends Component {
editForm: true,
show_modal: true,
show_search: false,
+ loading: false
});
//this.props.onEdit();
}
@@ -544,6 +589,7 @@ class SearchComponent extends Component {
editForm: true,
show_modal: true,
show_search: false,
+ loading: false
});
}
this.handleUrlChange(this.handleSingularty(entity_data.entity_type, "plural")+"/"+entity_data.uuid);
@@ -561,7 +607,7 @@ class SearchComponent extends Component {
sampleType: "----",
group: "All Components",
keywords: "",
- page: 0
+ page: 0,
//pageSize: PAGE_SIZE
}, () => {
this.handleSearchClick();
@@ -597,7 +643,9 @@ class SearchComponent extends Component {
{this.state.show_search && (
this.renderFilterControls()
)}
- {this.renderLoadingBar()}
+ {this.state.loading &&(
+ this.renderLoadingBar()
+ )}
{this.state.show_search && this.state.datarows &&
this.state.datarows.length > 0 && (
this.renderTable())
@@ -688,14 +736,16 @@ renderInfoPanel() {
);
}
- renderLoadingBar() {
- console.debug("renderLoadingBar", this.state.loading);
- if (this.state.loading) {
- return (
-
-
- );
+ renderLoadingBar = () => {
+
+ if( this.state.loading && !this.state.page > 0 ){
+ return (
+
+
+
+ )
}
+
}
renderTable() {
@@ -716,7 +766,7 @@ renderInfoPanel() {
onPageSizeChange={(page) =>
this.handlePageSizeSelection(page)
}
- loading={this.state.loading}
+ loading={this.state.table_loading}
onCellClick={this.props.select ? this.props.select : this.handleTableCellClick} // this allows a props handler to override the local handler
/>
diff --git a/src/src/components/uploads/editUploads.jsx b/src/src/components/uploads/editUploads.jsx
index 0078fb21..04fb9079 100644
--- a/src/src/components/uploads/editUploads.jsx
+++ b/src/src/components/uploads/editUploads.jsx
@@ -1,8 +1,11 @@
-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';
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 +26,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 +171,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);
@@ -201,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({
@@ -263,6 +271,7 @@ class EditUploads extends Component {
};
+
highlightInvalidDatasets(){
@@ -433,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()
+
}
@@ -474,16 +490,17 @@ 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)
- 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 (
@@ -505,12 +522,23 @@ class EditUploads extends Component {
{compiledCollection.map((row) => (
this.handleDatasetCellSelection(row)}
>
- {row.hubmap_id}
+
+
+
+ {row.hubmap_id}
+
+
{row.lab_dataset_id}
{row.group_name}
- {row.status}
+
+
+ {row.status}
+
+
))}
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;
+}