fix(typescript): rename services to fix typescript (#3165)

* fix: Rename services to lower camel case, hp, measure

* fix: Rename DisplaySetService instances to displaySetService

* fix: Rename CornerstoneViewportService to lower camel case

* fix: Added lower case segmentationService rename

* rename other services (#3166)

* rename uiDialogService

* rename toolGroupService

* rename uiNotificationService

* rename viewportGridService

* rename syncGroupService

* rename CornerstoneCacheService

* Fix a syntax error in hotkeys

* Fix a couple of rename issues that were missed

---------

Co-authored-by: Alireza <ar.sedghi@gmail.com>

extensions/default/package.json

@@ -32,7 +32,7 @@
   "peerDependencies": {
     "@ohif/core": "^3.0.0",
     "@ohif/i18n": "^1.0.0",
-    "dcmjs": "^0.28.3",
+    "dcmjs": "0.29.4",
     "dicomweb-client": "^0.6.0",
     "prop-types": "^15.6.2",
     "react": "^17.0.2",

extensions/default/src/Actions/createReportAsync.tsx

@@ -17,11 +17,11 @@ async function createReportAsync(
   options
 ) {
   const {
-    DisplaySetService,
-    UINotificationService,
-    UIDialogService,
+    displaySetService,
+    uiNotificationService,
+    uiDialogService,
   } = servicesManager.services;
-  const loadingDialogId = UIDialogService.create({
+  const loadingDialogId = uiDialogService.create({
     showOverlay: true,
     isDraggable: false,
     centralize: true,
@@ -46,9 +46,9 @@ async function createReportAsync(
     // automatically calls makeDisplaySets
     DicomMetadataStore.addInstances([naturalizedReport], true);
 
-    const displaySetInstanceUID = DisplaySetService.getMostRecentDisplaySet();
+    const displaySetInstanceUID = displaySetService.getMostRecentDisplaySet();
 
-    UINotificationService.show({
+    uiNotificationService.show({
       title: 'Create Report',
       message: 'Measurements saved successfully',
       type: 'success',
@@ -56,13 +56,13 @@ async function createReportAsync(
 
     return [displaySetInstanceUID];
   } catch (error) {
-    UINotificationService.show({
+    uiNotificationService.show({
       title: 'Create Report',
       message: error.message || 'Failed to store measurements',
       type: 'error',
     });
   } finally {
-    UIDialogService.dismiss({ id: loadingDialogId });
+    uiDialogService.dismiss({ id: loadingDialogId });
   }
 }
 

extensions/default/src/Panels/PanelMeasurementTable.tsx

@@ -21,10 +21,10 @@ export default function PanelMeasurementTable({
   const [viewportGrid, viewportGridService] = useViewportGrid();
   const { activeViewportIndex, viewports } = viewportGrid;
   const {
-    MeasurementService,
-    UIDialogService,
-    UINotificationService,
-    DisplaySetService,
+    measurementService,
+    uiDialogService,
+    uiNotificationService,
+    displaySetService,
   } = servicesManager.services;
   const [displayMeasurements, setDisplayMeasurements] = useState([]);
 
@@ -34,21 +34,21 @@ export default function PanelMeasurementTable({
       100
     );
     // ~~ Initial
-    setDisplayMeasurements(_getMappedMeasurements(MeasurementService));
+    setDisplayMeasurements(_getMappedMeasurements(measurementService));
 
     // ~~ Subscription
-    const added = MeasurementService.EVENTS.MEASUREMENT_ADDED;
-    const addedRaw = MeasurementService.EVENTS.RAW_MEASUREMENT_ADDED;
-    const updated = MeasurementService.EVENTS.MEASUREMENT_UPDATED;
-    const removed = MeasurementService.EVENTS.MEASUREMENT_REMOVED;
-    const cleared = MeasurementService.EVENTS.MEASUREMENTS_CLEARED;
+    const added = measurementService.EVENTS.MEASUREMENT_ADDED;
+    const addedRaw = measurementService.EVENTS.RAW_MEASUREMENT_ADDED;
+    const updated = measurementService.EVENTS.MEASUREMENT_UPDATED;
+    const removed = measurementService.EVENTS.MEASUREMENT_REMOVED;
+    const cleared = measurementService.EVENTS.MEASUREMENTS_CLEARED;
     const subscriptions = [];
 
     [added, addedRaw, updated, removed, cleared].forEach(evt => {
       subscriptions.push(
-        MeasurementService.subscribe(evt, () => {
+        measurementService.subscribe(evt, () => {
           debouncedSetDisplayMeasurements(
-            _getMappedMeasurements(MeasurementService)
+            _getMappedMeasurements(measurementService)
           );
         }).unsubscribe
       );
@@ -63,20 +63,20 @@ export default function PanelMeasurementTable({
   }, []);
 
   async function exportReport() {
-    const measurements = MeasurementService.getMeasurements();
+    const measurements = measurementService.getMeasurements();
 
-    downloadCSVReport(measurements, MeasurementService);
+    downloadCSVReport(measurements, measurementService);
   }
 
   async function clearMeasurements() {
-    MeasurementService.clearMeasurements();
+    measurementService.clearMeasurements();
   }
 
   async function createReport() {
     // filter measurements that are added to the active study
     const activeViewport = viewports[activeViewportIndex];
-    const measurements = MeasurementService.getMeasurements();
-    const displaySet = DisplaySetService.getDisplaySetByUID(
+    const measurements = measurementService.getMeasurements();
+    const displaySet = displaySetService.getDisplaySetByUID(
       activeViewport.displaySetInstanceUIDs[0]
     );
     const trackedMeasurements = measurements.filter(
@@ -84,7 +84,7 @@ export default function PanelMeasurementTable({
     );
 
     if (trackedMeasurements.length <= 0) {
-      UINotificationService.show({
+      uiNotificationService.show({
         title: 'No Measurements',
         message: 'No Measurements are added to the current Study.',
         type: 'info',
@@ -93,7 +93,7 @@ export default function PanelMeasurementTable({
       return;
     }
 
-    const promptResult = await createReportDialogPrompt(UIDialogService, {
+    const promptResult = await createReportDialogPrompt(uiDialogService, {
       extensionManager,
     });
 
@@ -109,7 +109,7 @@ export default function PanelMeasurementTable({
           ? 'Research Derived Series' // default
           : promptResult.value; // provided value
 
-      const SeriesNumber = getNextSRSeriesNumber(DisplaySetService);
+      const SeriesNumber = getNextSRSeriesNumber(displaySetService);
 
       const displaySetInstanceUIDs = await createReportAsync(
         servicesManager,
@@ -125,20 +125,20 @@ export default function PanelMeasurementTable({
   }
 
   const jumpToImage = ({ uid, isActive }) => {
-    MeasurementService.jumpToMeasurement(viewportGrid.activeViewportIndex, uid);
+    measurementService.jumpToMeasurement(viewportGrid.activeViewportIndex, uid);
 
     onMeasurementItemClickHandler({ uid, isActive });
   };
 
   const onMeasurementItemEditHandler = ({ uid, isActive }) => {
-    const measurement = MeasurementService.getMeasurement(uid);
+    const measurement = measurementService.getMeasurement(uid);
     //Todo: why we are jumping to image?
     // jumpToImage({ id, isActive });
 
     const onSubmitHandler = ({ action, value }) => {
       switch (action.id) {
         case 'save': {
-          MeasurementService.update(
+          measurementService.update(
             uid,
             {
               ...measurement,
@@ -148,10 +148,10 @@ export default function PanelMeasurementTable({
           );
         }
       }
-      UIDialogService.dismiss({ id: 'enter-annotation' });
+      uiDialogService.dismiss({ id: 'enter-annotation' });
     };
 
-    UIDialogService.create({
+    uiDialogService.create({
       id: 'enter-annotation',
       centralize: true,
       isDraggable: false,
@@ -234,7 +234,7 @@ export default function PanelMeasurementTable({
 PanelMeasurementTable.propTypes = {
   servicesManager: PropTypes.shape({
     services: PropTypes.shape({
-      MeasurementService: PropTypes.shape({
+      measurementService: PropTypes.shape({
         getMeasurements: PropTypes.func.isRequired,
         subscribe: PropTypes.func.isRequired,
         EVENTS: PropTypes.object.isRequired,
@@ -244,11 +244,11 @@ PanelMeasurementTable.propTypes = {
   }).isRequired,
 };
 
-function _getMappedMeasurements(MeasurementService) {
-  const measurements = MeasurementService.getMeasurements();
+function _getMappedMeasurements(measurementService) {
+  const measurements = measurementService.getMeasurements();
 
   const mappedMeasurements = measurements.map((m, index) =>
-    _mapMeasurementToDisplay(m, index, MeasurementService.VALUE_TYPES)
+    _mapMeasurementToDisplay(m, index, measurementService.VALUE_TYPES)
   );
 
   return mappedMeasurements;

extensions/default/src/Panels/PanelStudyBrowser.tsx

@@ -17,9 +17,9 @@ function PanelStudyBrowser({
   dataSource,
 }) {
   const {
-    HangingProtocolService,
-    DisplaySetService,
-    UINotificationService,
+    hangingProtocolService,
+    displaySetService,
+    uiNotificationService,
   } = servicesManager.services;
   // Normally you nest the components so the tree isn't so deep, and the data
   // doesn't have to have such an intense shape. This works well enough for now.
@@ -42,13 +42,13 @@ function PanelStudyBrowser({
     let updatedViewports = [];
     const viewportIndex = activeViewportIndex;
     try {
-      updatedViewports = HangingProtocolService.getViewportsRequireUpdate(
+      updatedViewports = hangingProtocolService.getViewportsRequireUpdate(
         viewportIndex,
         displaySetInstanceUID
       );
     } catch (error) {
       console.warn(error);
-      UINotificationService.show({
+      uiNotificationService.show({
         title: 'Thumbnail Double Click',
         message:
           'The selected display sets could not be added to the viewport due to a mismatch in the Hanging Protocol rules.',
@@ -103,10 +103,10 @@ function PanelStudyBrowser({
 
   // // ~~ Initial Thumbnails
   useEffect(() => {
-    const currentDisplaySets = DisplaySetService.activeDisplaySets;
+    const currentDisplaySets = displaySetService.activeDisplaySets;
     currentDisplaySets.forEach(async dSet => {
       const newImageSrcEntry = {};
-      const displaySet = DisplaySetService.getDisplaySetByUID(
+      const displaySet = displaySetService.getDisplaySetByUID(
         dSet.displaySetInstanceUID
       );
       const imageIds = dataSource.getImageIdsForDisplaySet(displaySet);
@@ -134,7 +134,7 @@ function PanelStudyBrowser({
   // ~~ displaySets
   useEffect(() => {
     // TODO: Are we sure `activeDisplaySets` will always be accurate?
-    const currentDisplaySets = DisplaySetService.activeDisplaySets;
+    const currentDisplaySets = displaySetService.activeDisplaySets;
     const mappedDisplaySets = _mapDisplaySets(
       currentDisplaySets,
       thumbnailImageSrcMap
@@ -148,13 +148,13 @@ function PanelStudyBrowser({
   // ~~ subscriptions --> displaySets
   useEffect(() => {
     // DISPLAY_SETS_ADDED returns an array of DisplaySets that were added
-    const SubscriptionDisplaySetsAdded = DisplaySetService.subscribe(
-      DisplaySetService.EVENTS.DISPLAY_SETS_ADDED,
+    const SubscriptionDisplaySetsAdded = displaySetService.subscribe(
+      displaySetService.EVENTS.DISPLAY_SETS_ADDED,
       data => {
         const { displaySetsAdded } = data;
         displaySetsAdded.forEach(async dSet => {
           const newImageSrcEntry = {};
-          const displaySet = DisplaySetService.getDisplaySetByUID(
+          const displaySet = displaySetService.getDisplaySetByUID(
             dSet.displaySetInstanceUID
           );
           const imageIds = dataSource.getImageIdsForDisplaySet(displaySet);
@@ -179,8 +179,8 @@ function PanelStudyBrowser({
 
     // TODO: Will this always hold _all_ the displaySets we care about?
     // DISPLAY_SETS_CHANGED returns `DisplaySerService.activeDisplaySets`
-    const SubscriptionDisplaySetsChanged = DisplaySetService.subscribe(
-      DisplaySetService.EVENTS.DISPLAY_SETS_CHANGED,
+    const SubscriptionDisplaySetsChanged = displaySetService.subscribe(
+      displaySetService.EVENTS.DISPLAY_SETS_CHANGED,
       changedDisplaySets => {
         const mappedDisplaySets = _mapDisplaySets(
           changedDisplaySets,
@@ -222,7 +222,7 @@ function PanelStudyBrowser({
     if (!shouldCollapseStudy) {
       const madeInClient = true;
       requestDisplaySetCreationForStudy(
-        DisplaySetService,
+        displaySetService,
         StudyInstanceUID,
         madeInClient
       );

extensions/default/src/Panels/createReportDialogPrompt.tsx

@@ -8,7 +8,7 @@ export const CREATE_REPORT_DIALOG_RESPONSE = {
 };
 
 export default function createReportDialogPrompt(
-  UIDialogService,
+  uiDialogService,
   { extensionManager }
 ) {
   return new Promise(function (resolve, reject) {
@@ -16,7 +16,7 @@ export default function createReportDialogPrompt(
 
     const _handleClose = () => {
       // Dismiss dialog
-      UIDialogService.dismiss({ id: dialogId });
+      uiDialogService.dismiss({ id: dialogId });
       // Notify of cancel action
       resolve({
         action: CREATE_REPORT_DIALOG_RESPONSE.CANCEL,
@@ -31,7 +31,7 @@ export default function createReportDialogPrompt(
      * @param {string} param0.value - value from input field
      */
     const _handleFormSubmit = ({ action, value }) => {
-      UIDialogService.dismiss({ id: dialogId });
+      uiDialogService.dismiss({ id: dialogId });
       switch (action.id) {
         case 'save':
           resolve({
@@ -66,7 +66,7 @@ export default function createReportDialogPrompt(
         };
       });
 
-    dialogId = UIDialogService.create({
+    dialogId = uiDialogService.create({
       centralize: true,
       isDraggable: false,
       content: Dialog,
@@ -93,7 +93,7 @@ export default function createReportDialogPrompt(
           };
           const onKeyPressHandler = event => {
             if (event.key === 'Enter') {
-              UIDialogService.dismiss({ id: dialogId });
+              uiDialogService.dismiss({ id: dialogId });
               resolve({
                 action: CREATE_REPORT_DIALOG_RESPONSE.CREATE_REPORT,
                 value: value.label,

extensions/default/src/Panels/requestDisplaySetCreationForStudy.js

@@ -1,12 +1,12 @@
 function requestDisplaySetCreationForStudy(
   dataSource,
-  DisplaySetService,
+  displaySetService,
   StudyInstanceUID,
   madeInClient
 ) {
   // TODO: is this already short-circuited by the map of Retrieve promises?
   if (
-    DisplaySetService.activeDisplaySets.some(
+    displaySetService.activeDisplaySets.some(
       displaySet => displaySet.StudyInstanceUID === StudyInstanceUID
     )
   ) {

extensions/default/src/Toolbar/ToolbarLayoutSelector.tsx

@@ -20,7 +20,7 @@ function LayoutSelector({
   const [viewportGridState, viewportGridService] = useViewportGrid();
 
   const {
-    HangingProtocolService,
+    hangingProtocolService,
     toolbarService,
   } = (servicesManager as ServicesManager).services;
 
@@ -31,8 +31,8 @@ function LayoutSelector({
   };
 
   useEffect(() => {
-    const { unsubscribe } = HangingProtocolService.subscribe(
-      HangingProtocolService.EVENTS.PROTOCOL_CHANGED,
+    const { unsubscribe } = hangingProtocolService.subscribe(
+      hangingProtocolService.EVENTS.PROTOCOL_CHANGED,
       evt => {
         const { protocol } = evt;
       }
@@ -41,7 +41,7 @@ function LayoutSelector({
     return () => {
       unsubscribe();
     };
-  }, [HangingProtocolService]);
+  }, [hangingProtocolService]);
 
   useEffect(() => {
     window.addEventListener('click', closeOnOutsideClick);
@@ -65,7 +65,7 @@ function LayoutSelector({
 
     // TODO Here the layout change will amount to a change of hanging protocol as specified by the extension for this layout selector tool
     // followed by the change of the grid itself.
-    if (HangingProtocolService.getActiveProtocol().protocol.id === 'mpr') {
+    if (hangingProtocolService.getActiveProtocol().protocol.id === 'mpr') {
       toolbarService.recordInteraction({
         groupId: 'MPR',
         itemId: 'MPR',

extensions/default/src/ViewerLayout/index.tsx

@@ -58,7 +58,7 @@ function ViewerLayout({
     appConfig.showLoadingIndicator
   );
 
-  const { HangingProtocolService } = servicesManager.services;
+  const { hangingProtocolService } = servicesManager.services;
 
   const { hotkeyDefinitions, hotkeyDefaults } = hotkeysManager;
   const versionNumber = process.env.VERSION_NUMBER;
@@ -167,11 +167,11 @@ function ViewerLayout({
   };
 
   useEffect(() => {
-    const { unsubscribe } = HangingProtocolService.subscribe(
-      HangingProtocolService.EVENTS.HANGING_PROTOCOL_APPLIED_FOR_VIEWPORT,
+    const { unsubscribe } = hangingProtocolService.subscribe(
+      hangingProtocolService.EVENTS.HANGING_PROTOCOL_APPLIED_FOR_VIEWPORT,
 
       // Todo: right now to set the loading indicator to false, we need to wait for the
-      // HangingProtocolService to finish applying the viewport matching to each viewport,
+      // hangingProtocolService to finish applying the viewport matching to each viewport,
       // however, this might not be the only approach to set the loading indicator to false. we need to explore this further.
       ({ progress }) => {
         if (progress === 100) {
@@ -183,7 +183,7 @@ function ViewerLayout({
     return () => {
       unsubscribe();
     };
-  }, [HangingProtocolService]);
+  }, [hangingProtocolService]);
 
   const getViewportComponentData = viewportComponent => {
     const { entry } = getComponent(viewportComponent.namespace);

extensions/default/src/commandsModule.js

@@ -3,37 +3,37 @@ import React from 'react';
 
 const commandsModule = ({ servicesManager, commandsManager }) => {
   const {
-    MeasurementService,
-    HangingProtocolService,
-    UINotificationService,
-    ViewportGridService,
-    DisplaySetService,
+    measurementService,
+    hangingProtocolService,
+    uiNotificationService,
+    viewportGridService,
+    displaySetService,
   } = servicesManager.services;
 
   const actions = {
     displayNotification: ({ text, title, type }) => {
-      UINotificationService.show({
+      uiNotificationService.show({
         title: title,
         message: text,
         type: type,
       });
     },
     clearMeasurements: () => {
-      MeasurementService.clear();
+      measurementService.clear();
     },
     nextStage: () => {
       // next stage in hanging protocols
-      HangingProtocolService.nextProtocolStage();
+      hangingProtocolService.nextProtocolStage();
     },
     previousStage: () => {
-      HangingProtocolService.previousProtocolStage();
+      hangingProtocolService.previousProtocolStage();
     },
     openDICOMTagViewer() {
-      const { activeViewportIndex, viewports } = ViewportGridService.getState();
+      const { activeViewportIndex, viewports } = viewportGridService.getState();
       const activeViewportSpecificData = viewports[activeViewportIndex];
       const { displaySetInstanceUIDs } = activeViewportSpecificData;
 
-      const displaySets = DisplaySetService.activeDisplaySets;
+      const displaySets = displaySetService.activeDisplaySets;
       const { UIModalService } = servicesManager.services;
 
       const displaySetInstanceUID = displaySetInstanceUIDs[0];

extensions/default/src/utils/getNextSRSeriesNumber.js

@@ -1,7 +1,7 @@
 const MIN_SR_SERIES_NUMBER = 4700;
 
-export default function getNextSRSeriesNumber(DisplaySetService) {
-  const activeDisplaySets = DisplaySetService.getActiveDisplaySets();
+export default function getNextSRSeriesNumber(displaySetService) {
+  const activeDisplaySets = displaySetService.getActiveDisplaySets();
   const srDisplaySets = activeDisplaySets.filter(ds => ds.Modality === 'SR');
   const srSeriesNumbers = srDisplaySets.map(ds => ds.SeriesNumber);
   const maxSeriesNumber = Math.max(...srSeriesNumbers, MIN_SR_SERIES_NUMBER);