get ViewportDialog to display as a part of machine transition

extensions/measurement-tracking/src/contexts/TrackedMeasurementsContext/TrackedMeasurementsContext.jsx

@@ -0,0 +1,81 @@
+import React, { useContext } from 'react';
+import PropTypes from 'prop-types';
+import { Machine } from 'xstate';
+import { useMachine } from '@xstate/react';
+import {
+  machineConfiguration,
+  defaultOptions,
+} from './measurementTrackingMachine';
+
+const TrackedMeasurementsContext = React.createContext();
+TrackedMeasurementsContext.displayName = 'TrackedMeasurementsContext';
+const useTrackedMeasurements = () => useContext(TrackedMeasurementsContext);
+
+/**
+ *
+ * @param {*} param0
+ */
+function TrackedMeasurementsContextProvider(
+  UIViewportDialogService,
+  { children }
+) {
+  function promptUser() {
+    // TODO: ... ActiveViewport? Or Study + Series --> Viewport?
+    // Let's just use zero for meow?
+    return new Promise(function(resolve, reject) {
+      const handleSubmit = result => {
+        UIViewportDialogService.hide();
+        resolve(result);
+      };
+
+      UIViewportDialogService.show({
+        viewportIndex: 0,
+        type: 'info',
+        message: 'Would you like to track?',
+        actions: [
+          { type: 'cancel', text: 'No', value: 0 },
+          { type: 'secondary', text: 'No, do not ask again', value: -1 },
+          { type: 'primary', text: 'Yes', value: 1 },
+        ],
+        onSubmit: handleSubmit,
+      });
+    });
+  }
+
+  const machOptions = Object.assign({}, defaultOptions);
+  // Merge services
+  machOptions.services = Object.assign({}, machOptions.services, {
+    shouldTrackPrompt: promptUser,
+  });
+
+  console.log(
+    '~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~',
+    machOptions
+  );
+
+  const measurementTrackingMachine = Machine(machineConfiguration, machOptions);
+
+  const [
+    trackedMeasurements,
+    sendTrackedMeasurementsEvent,
+    trackedMeasurementsService,
+  ] = useMachine(measurementTrackingMachine);
+
+  return (
+    <TrackedMeasurementsContext.Provider
+      value={[trackedMeasurements, sendTrackedMeasurementsEvent]}
+    >
+      {children}
+    </TrackedMeasurementsContext.Provider>
+  );
+}
+
+TrackedMeasurementsContextProvider.propTypes = {
+  children: PropTypes.oneOf([PropTypes.func, PropTypes.node]),
+};
+
+export {
+  TrackedMeasurementsContext,
+  TrackedMeasurementsContextProvider,
+  useTrackedMeasurements,
+};

extensions/measurement-tracking/src/contexts/TrackedMeasurementsContext/index.js

@@ -1,45 +1,5 @@
-import React, { useContext } from 'react';
-import PropTypes from 'prop-types';
-import { useMachine } from '@xstate/react';
-import {
-  measurementTrackingMachine,
-  defaultOptions,
-} from './measurementTrackingMachine';
-
-const TrackedMeasurementsContext = React.createContext();
-
-TrackedMeasurementsContext.displayName = 'TrackedMeasurementsContext';
-
-const useTrackedMeasurements = () => useContext(TrackedMeasurementsContext);
-
-/**
- *
- * @param {*} param0
- */
-function TrackedMeasurementsContextProvider({ children }) {
-  // TODO: Configure `UIViewportNotificationService` for appropriate actions
-  const measurementTrackingMachineOptions = Object.assign({}, defaultOptions);
-  const [
-    trackedMeasurements,
-    sendTrackedMeasurementsEvent,
-    trackedMeasurementsService,
-  ] = useMachine(measurementTrackingMachine, measurementTrackingMachineOptions);
-
-  return (
-    <TrackedMeasurementsContext.Provider
-      value={[trackedMeasurements, sendTrackedMeasurementsEvent]}
-    >
-      {children}
-    </TrackedMeasurementsContext.Provider>
-  );
-}
-
-TrackedMeasurementsContextProvider.propTypes = {
-  children: PropTypes.oneOf([PropTypes.func, PropTypes.node]),
-};
-
 export {
   TrackedMeasurementsContext,
   TrackedMeasurementsContextProvider,
   useTrackedMeasurements,
-};
+} from './TrackedMeasurementsContext.jsx';

extensions/measurement-tracking/src/contexts/TrackedMeasurementsContext/measurementTrackingMachine.js

@@ -27,7 +27,7 @@ const machineConfiguration = {
         prompt: {
           invoke: {
             id: 'shouldTrackPrompt',
-            src: () => confirmDialog('Should we start tracking?'),
+            src: 'shouldTrackPrompt',
             onDone: {
               target: 'validateResponse',
               actions: assign({ promptResponse: (ctx, evt) => evt.data }),
@@ -135,6 +135,11 @@ function confirmDialog(msg) {
 }
 
 const defaultOptions = {
+  services: {
+    shouldTrackPrompt: () => {
+      return confirmDialog('Should we start tracking?');
+    },
+  },
   actions: {
     clearContext: assign({
       prevTrackedStudy: '',
@@ -186,11 +191,13 @@ const defaultOptions = {
   },
 };
 
-const measurementTrackingMachine = Machine(machineConfiguration, defaultOptions);
+// const measurementTrackingMachine = Machine(
+//   machineConfiguration,
+//   defaultOptions
+// );
 // .transition(state, eventArgument).value
 // const service = interpret(measurementTrackingMachine).start();
 // .send(event): nextState
 // .state (getter)
 // .onTransition(state => { state.vale })
-export { defaultOptions, machineConfiguration, measurementTrackingMachine };
-export default measurementTrackingMachine;
+export { defaultOptions, machineConfiguration };