Merge pull request #642 from hubmapconsortium/test-release

v2.0.16 release

VERSION

@@ -1 +1 @@
-2.0.15
+2.0.16

src/package.json

@@ -1,6 +1,6 @@
 {
  "name": "ingest-ui",
- "version": "2.0.15",
+ "version": "2.0.16",
  "private": true,
  "homepage": ".",
  "dependencies": {

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;

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 (<div>
- <LinearProgress />
- </div>
- );
+ renderLoadingBar = () => {
+
+ if( this.state.loading && !this.state.page > 0 ){
+ return (
+ <div>
+ <LinearProgress />
+ </div>
+ )
  }
+
  }
 
  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
  />
  </div>