feat: Segmentations Settings UI - Phase 1 #1391 (#1392)

* Filter segs and fetch correct metadata. * Initiate seg loading logic on series load into viewport. Need to write. * Automatic consumption of SEG functional. * Pull in master. * Fix issues after pulling in master. * Clean up old segmentation handlers. * WIP * WIP * Poppulate viewport with metadata. * Show hide/segmentation in react-vtkjs-viewport. * feat: 🎸 View segmentations in vtkjs viewport * Filter segs and fetch correct metadata. * Initiate seg loading logic on series load into viewport. Need to write. * Automatic consumption of SEG functional. * Pull in master. * Fix issues after pulling in master. * Clean up old segmentation handlers. * WIP * WIP * Poppulate viewport with metadata. * Show hide/segmentation in react-vtkjs-viewport. * feat: 🎸 View segmentations in vtkjs viewport * Rebase on master. * format format format * add basic extension parts * Updated yarn lock * Fetch derived/referenced displaysets in sidepanel * Add buttons, expose seriesDescription, write notes for Danny. * Add growcut tool extention. -> Move to a seperate repo. * Change some text fields. * expose dialog provider * hide draggable area * No pointer events for now; need to revisit * Don't filter seg from the outset for now * fiddling about * fix path to series data * fix logic to determine next available labelmapindex * Ability to swtich between labelmaps * Return a promise so we can make sure our labelmap is loaded before pulling metadata * Better UI to toggle labelmaps * Fix accidental untoggle of active labelmap for ui * Remove brush tool from cornerstone extension * Add cstools in preInit for seg extension * Add buttons for seg magic * Hide the measurements panel for now * Slightly better seg/scissor icons * Add eraser * ability to switch segments * seg color / switcher * Fix vtk labelmap cache. * sidepanel should scroll if there's overflow * Use a fancier range slider * Slightly prettier buttons * Push in progress * A bit more reactive; handle no-meta * Update to vtk.js 11.14.0 and react-vtkjs-viewport 0.6.0 * chore: kickstart preview * Fix conflict issues * Refactor panel * Isolate increment functions * Wip segment table * Hide selector and add scroll to segmentation * Increase width of segment description * Hide not used items * Add new select for segmentations * Align ui * Fix default segmentation * Fix broken import test * Get measurements panel back and add spacing to grouped buttons * Hide brush and selector and refresh when switching segmentations * Add pointer events back and fix broken tests for measurement table * Update segment list when switching humbnails * CR Update: Minor UI adjustments * CR Update: Set active segment * Move components to components folder * Add new settings ui * Integrate configuration * Improve styles * Float numbers * Improve css * Refresh settings menu if side panel changed * Fix settings rendering logic and remove comments * Extract components * Remove not used tools * Remove non used extension * Use style variables and remove comments * Remove non used dep from lock * Remove tools * Remove segmentation from toolbar * Add todo and brushradius from config * Fix packagejson growcut import * Remove webpack config already defined in parent * Update package json description * Change component name to british english to us * Improve prop types * Rename cornerstone label map event * Scope css * Extract and add doc to helper * Update jsdocs for getDerivedDatasets * Add proptypes and cr updates * Update tablistitem proptypes * config is readonly, rollback destructuring * Remove event for side panel * Add jsdocs for util * Extract getimageid to studymetada * Use ohif log instead of console * Remove specific style from side panel * Fix default props for brush radius * Descructure configuration props from settings component to avoid invalid props * Update proptypes to be required (settings) * Update readme * Remove commandsmodule * Get configuration module inside the component * Set selected segment * Rename extension and use modality to filter * Fix for failing tests (#1423) * hello world * Finish rebase for Igor. * Re-fix cornerstoneTools version that got messed up in merge. * Fix reactivity of isDisabled, write implementation for the SEG panel. * Nuke yarn.lock to stack CST to 4.12.0 * Remove debugger statements. * fix: bump cornerstone-tools version to address toFixed issue * test: force tests for MISTER^MR to navigate to study directly * test: remove eraser tool test * test: count is off by one * test: don't save SR state for the time being * test: disable more tests Co-authored-by: James A. Petts <jamesapetts@gmail.com> Co-authored-by: dannyrb <danny.ri.brown@gmail.com> Co-authored-by: igoroctaviano] <igoroctaviano@users.noreply.github.com> Co-authored-by: Mirna Silva <mirna.silva@radicalimaging.com>
2020-03-13 15:45:26 -04:00
1 parent d426b78967
commit e8842cf8ae
@@ -1,6 +1,5 @@
 .RoundedButtonGroup {
  --height: 25px;
-
  position: relative;
  z-index: 0;
 }
@@ -37,12 +36,7 @@
  z-index: 1;
 }

-.roundedButtonWrapper
-  .roundedButton
-  svg
-  .roundedButtonWrapper
-  .roundedButton
-  span {
+.roundedButtonWrapper .roundedButton svg .roundedButtonWrapper .roundedButton span {
  margin: 0 2px;
 }

@@ -51,6 +45,10 @@
  font-size: 15px;
 }

+.roundedButtonWrapper .bottomLabel {
+  padding: 0 10px 0 10px;
+}
+
 .bottomLabel {
  color: var(--text-secondary-color);
  font-size: 12px;
@@ -79,14 +79,14 @@ function ImageThumbnail(props) {
    return () => {
      purgeCancelablePromise();
    };
-  }, []);
+  }, [purgeCancelablePromise]);

  useEffect(() => {
    if (image.imageId) {
      cornerstone.renderToCanvas(canvasRef.current, image);
      setLoading(false);
    }
-  }, [image.imageId]);
+  }, [canvasRef, image, image.imageId]);

  useEffect(() => {
    if (!image.imageId || image.imageId !== imageId) {
@@ -94,7 +94,7 @@ function ImageThumbnail(props) {
      setImagePromise();
      fetchImagePromise();
    }
-  }, [imageId]);
+  }, [fetchImagePromise, image.imageId, imageId, purgeCancelablePromise, setImagePromise]);

  return (
    <div className="ImageThumbnail">
@@ -10,6 +10,8 @@ export class TableListItem extends Component {
    children: PropTypes.node,
    itemClass: PropTypes.string,
    itemIndex: PropTypes.number,
+    itemMeta: PropTypes.node,
+    itemMetaClass: PropTypes.string,
    itemKey: PropTypes.oneOfType([
      PropTypes.string,
      PropTypes.number,
@@ -17,14 +19,20 @@ export class TableListItem extends Component {
    onItemClick: PropTypes.func.isRequired,
  };

+  static defaultProps = {
+    itemMeta: null,
+    itemMetaClass: ''
+  };
+
  render() {
    return (
      <div
        className={`tableListItem ${this.props.itemClass}`}
        onClick={this.onItemClick}
      >
-        <div className="itemIndex">
+        <div className={`itemIndex ${this.props.itemMetaClass}`}>
          {this.props.itemIndex}
+          {this.props.itemMeta}
          <span className="warning-icon">
            <Icon name="exclamation-triangle" />
          </span>