feat: new Total Metabolic Tumor Volume tmtv (#2866)

* fix: ptDisplaySet metadata problem

* fix: typo in xhrHeader field

* fix: temporary fix for crosshairs on reload data

* fix hotkey bug for input fields

* upgrade docusarusu to stable release

* circle ci node upgrade

* cypress node upgrade

* bump node in netlify

* bump node version

* remove versioned docs

* update resources

* fix: webpack injection of plugins

* fix meaningful label for panels

* add reviews and fix cli for creation

* copy over chunks if exists in the build

* edit templates

* edit templates

* fix yarn lock

* fix(plugin):Deploy on windows is broken

Co-authored-by: Bill Wallace <wayfarer3130@gmail.com>

extensions/tmtv/src/Panels/PanelPetSUV.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useState, useCallback } from 'react';
 import PropTypes from 'prop-types';
 import { Input, Button } from '@ohif/ui';
-import { classes, DicomMetadataStore } from '@ohif/core';
+import { DicomMetadataStore } from '@ohif/core';
 import { useTranslation } from 'react-i18next';
 
 const DEFAULT_MEATADATA = {
@@ -24,7 +24,8 @@ const DEFAULT_MEATADATA = {
  */
 export default function PanelPetSUV({ servicesManager, commandsManager }) {
   const { t } = useTranslation('PanelSUV');
-  const { DisplaySetService } = servicesManager.services;
+  const { DisplaySetService, ToolGroupService, ToolBarService } =
+    servicesManager.services;
   const [metadata, setMetadata] = useState(DEFAULT_MEATADATA);
   const [ptDisplaySet, setPtDisplaySet] = useState(null);
 
@@ -108,6 +109,26 @@ export default function PanelPetSUV({ servicesManager, commandsManager }) {
     if (!ptDisplaySet) {
       throw new Error('No ptDisplaySet found');
     }
+
+    const toolGroupIds = ToolGroupService.getToolGroupIds();
+
+    // Todo: we don't have a proper way to perform a toggle command and update the
+    // state for the toolbar, so here, we manually toggle the toolbar
+
+    // Todo: Crosshairs have bugs for the camera reset currently, so we need to
+    // force turn it off before we update the metadata
+    toolGroupIds.forEach(toolGroupId => {
+      commandsManager.runCommand('toggleCrosshairs', {
+        toolGroupId,
+        toggledState: false,
+      });
+    });
+
+    ToolBarService.state.toggles['Crosshairs'] = false;
+    ToolBarService._broadcastEvent(
+      ToolBarService.EVENTS.TOOL_BAR_STATE_MODIFIED
+    );
+
     // metadata should be dcmjs naturalized
     DicomMetadataStore.updateMetadataForSeries(
       ptDisplaySet.StudyInstanceUID,
@@ -140,7 +161,7 @@ export default function PanelPetSUV({ servicesManager, commandsManager }) {
               }}
             />
             <Input
-              label={t('Patient Weight')}
+              label={t('Patient Weight (kg)')}
               labelClassName="text-white"
               className="mt-1 mb-2 bg-black border-primary-main"
               type="text"
@@ -153,7 +174,7 @@ export default function PanelPetSUV({ servicesManager, commandsManager }) {
               }}
             />
             <Input
-              label={t('Total Dose')}
+              label={t('Total Dose (Mbq)')}
               labelClassName="text-white"
               className="mt-1 mb-2 bg-black border-primary-main"
               type="text"
@@ -171,7 +192,7 @@ export default function PanelPetSUV({ servicesManager, commandsManager }) {
               }}
             />
             <Input
-              label={t('Half Life')}
+              label={t('Half Life (s)')}
               labelClassName="text-white"
               className="mt-1 mb-2 bg-black border-primary-main"
               type="text"
@@ -189,7 +210,7 @@ export default function PanelPetSUV({ servicesManager, commandsManager }) {
               }}
             />
             <Input
-              label={t('Injection Time')}
+              label={t('Injection Time (Seconds)')}
               labelClassName="text-white"
               className="mt-1 mb-2 bg-black border-primary-main"
               type="text"
@@ -207,7 +228,7 @@ export default function PanelPetSUV({ servicesManager, commandsManager }) {
               }}
             />
             <Input
-              label={t('Acquisition Time')}
+              label={t('Acquisition Time (Seconds)')}
               labelClassName="text-white"
               className="mt-1 mb-2 bg-black border-primary-main"
               type="text"

extensions/tmtv/src/Panels/PanelROIThresholdSegmentation/PanelROIThresholdSegmentation.tsx

@@ -297,7 +297,7 @@ export default function PanelRoiThresholdSegmentation({
           name={'info'}
           className={'ml-4 mr-3 text-primary-active'}
         />
-        <span>{'About'}</span>
+        <span>{'User Guide'}</span>
       </div>
     </div>
   );

extensions/tmtv/src/getHangingProtocolModule.js

@@ -325,6 +325,12 @@ const ptCT = {
                 source: true,
                 target: true,
               },
+              {
+                type: 'voi',
+                id: 'ptFusionWLSync',
+                source: true,
+                target: false,
+              },
             ],
           },
           displaySets: [
@@ -360,6 +366,12 @@ const ptCT = {
                 source: true,
                 target: true,
               },
+              {
+                type: 'voi',
+                id: 'ptFusionWLSync',
+                source: true,
+                target: false,
+              },
             ],
           },
           displaySets: [
@@ -395,6 +407,12 @@ const ptCT = {
                 source: true,
                 target: true,
               },
+              {
+                type: 'voi',
+                id: 'ptFusionWLSync',
+                source: true,
+                target: false,
+              },
             ],
           },
           displaySets: [
@@ -439,6 +457,12 @@ const ptCT = {
                 source: true,
                 target: true,
               },
+              {
+                type: 'voi',
+                id: 'ptFusionWLSync',
+                source: false,
+                target: true,
+              },
             ],
           },
           displaySets: [
@@ -486,6 +510,12 @@ const ptCT = {
                 source: true,
                 target: true,
               },
+              {
+                type: 'voi',
+                id: 'ptFusionWLSync',
+                source: false,
+                target: true,
+              },
             ],
           },
           displaySets: [
@@ -533,6 +563,12 @@ const ptCT = {
                 source: true,
                 target: true,
               },
+              {
+                type: 'voi',
+                id: 'ptFusionWLSync',
+                source: false,
+                target: true,
+              },
             ],
           },
           displaySets: [
@@ -558,9 +594,24 @@ const ptCT = {
             orientation: 'sagittal',
             background: [1, 1, 1],
             toolGroupId: 'mipToolGroup',
+            syncGroups: [
+              {
+                type: 'voi',
+                id: 'ptWLSync',
+                source: true,
+                target: true,
+              },
+              {
+                type: 'voi',
+                id: 'ptFusionWLSync',
+                source: true,
+                target: false,
+              },
+            ],
+
             // Custom props can be used to set custom properties which extensions
             // can react on.
-            customViewportOptions: {
+            customViewportProps: {
               // We use viewportDisplay to filter the viewports which are displayed
               // in mip and we set the scrollbar according to their rotation index
               // in the cornerstone extension.

extensions/tmtv/src/getPanelModule.tsx

@@ -36,14 +36,14 @@ function getPanelModule({
       name: 'petSUV',
       iconName: 'edit-patient',
       iconLabel: 'PET SUV',
-      label: 'PET-SUV',
+      label: 'PET SUV',
       component: wrappedPanelPetSuv,
     },
     {
       name: 'ROIThresholdSeg',
       iconName: 'tool-create-threshold',
-      iconLabel: 'Threshold Seg',
-      label: 'Threshold-Seg',
+      iconLabel: 'ROI Threshold',
+      label: 'ROI Threshold',
       component: wrappedROIThresholdSeg,
     },
   ];