Merge pull request #1832 from dannyrb/dannyrb/fix/viewport-notification-workflow

Update measurement tracking workflow to match requirements
This commit is contained in:
Danny Brown 2020-06-29 23:31:38 -04:00 committed by GitHub
commit 050b260a58
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 362 additions and 60 deletions

View File

@ -6,6 +6,9 @@ import {
machineConfiguration,
defaultOptions,
} from './measurementTrackingMachine';
import promptBeginTracking from './promptBeginTracking';
import promptTrackNewSeries from './promptTrackNewSeries';
import promptTrackNewStudy from './promptTrackNewStudy';
const TrackedMeasurementsContext = React.createContext();
TrackedMeasurementsContext.displayName = 'TrackedMeasurementsContext';
@ -19,41 +22,20 @@ function TrackedMeasurementsContextProvider(
UIViewportDialogService,
{ children }
) {
function promptUser(message, ctx, evt) {
const { viewportIndex, StudyInstanceUID, SeriesInstanceUID } = evt;
return new Promise(function(resolve, reject) {
/**
* TODO: Will have issues if "SeriesInstanceUID" exists in multiple displaySets?
*
* @param {number} result - -1 | 0 | 1 --> deny | cancel | accept
* @return resolve { userResponse: number, StudyInstanceUID: string, SeriesInstanceUID: string }
*/
const handleSubmit = result => {
UIViewportDialogService.hide();
resolve({ userResponse: result, StudyInstanceUID, SeriesInstanceUID });
};
UIViewportDialogService.show({
viewportIndex,
type: 'info',
message,
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,
});
});
}
// Set StateMachine behavior for prompts (invoked services)
const machineOptions = Object.assign({}, defaultOptions);
machineOptions.services = Object.assign({}, machineOptions.services, {
promptBeginTracking: promptUser.bind(null, 'Start tracking?'),
promptTrackNewStudy: promptUser.bind(null, 'New study?'),
promptTrackNewSeries: promptUser.bind(null, 'New series?'),
promptBeginTracking: promptBeginTracking.bind(
null,
UIViewportDialogService
),
promptTrackNewSeries: promptTrackNewSeries.bind(
null,
UIViewportDialogService
),
promptTrackNewStudy: promptTrackNewStudy.bind(
null,
UIViewportDialogService
),
});

View File

@ -1,5 +1,13 @@
import { assign } from 'xstate';
const RESPONSE = {
NO_NEVER: -1,
CANCEL: 0,
CREATE_REPORT: 1,
ADD_SERIES: 2,
SET_STUDY_AND_SERIES: 3,
};
const machineConfiguration = {
id: 'measurementTracking',
initial: 'idle',
@ -24,11 +32,11 @@ const machineConfiguration = {
{
target: 'tracking',
actions: ['setTrackedStudyAndSeries'],
cond: 'promptAccepted',
cond: 'shouldSetStudyAndSeries',
},
{
target: 'off',
cond: 'promptDeclined',
cond: 'shouldKillMachine',
},
{
target: 'idle',
@ -63,15 +71,21 @@ const machineConfiguration = {
],
},
},
promptTrackNewStudy: {
promptTrackNewSeries: {
invoke: {
src: 'promptTrackNewStudy',
src: 'promptTrackNewSeries',
onDone: [
{
target: 'tracking',
actions: ['setTrackedStudyAndSeries'],
cond: 'promptAccepted',
actions: ['addTrackedSeries'],
cond: 'shouldAddSeries',
},
{
target: 'tracking',
actions: ['setTrackedStudyAndSeries'],
cond: 'shouldSetStudyAndSeries',
},
// CREATE_REPORT && CANCEL
{
target: 'tracking',
},
@ -81,14 +95,14 @@ const machineConfiguration = {
},
},
},
promptTrackNewSeries: {
promptTrackNewStudy: {
invoke: {
src: 'promptTrackNewSeries',
src: 'promptTrackNewStudy',
onDone: [
{
target: 'tracking',
actions: ['addTrackedSeries'],
cond: 'promptAccepted',
actions: ['setTrackedStudyAndSeries'],
cond: 'shouldSetStudyAndSeries',
},
{
target: 'tracking',
@ -135,9 +149,12 @@ const defaultOptions = {
})),
},
guards: {
promptAccepted: (ctx, evt) => evt.data && evt.data.userResponse === 1,
promptCanceled: (ctx, evt) => evt.data && evt.data.userResponse === 0,
promptDeclined: (ctx, evt) => evt.data && evt.data.userResponse === -1,
shouldKillMachine: (ctx, evt) =>
evt.data && evt.data.userResponse === RESPONSE.NO_NEVER,
shouldAddSeries: (ctx, evt) =>
evt.data && evt.data.userResponse === RESPONSE.ADD_SERIES,
shouldSetStudyAndSeries: (ctx, evt) =>
evt.data && evt.data.userResponse === RESPONSE.SET_STUDY_AND_SERIES,
// Has more than 1, or SeriesInstanceUID is not in list
// --> Post removal would have non-empty trackedSeries array
hasRemainingTrackedSeries: (ctx, evt) =>
@ -149,13 +166,4 @@ const 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 };

View File

@ -0,0 +1,61 @@
const RESPONSE = {
NO_NEVER: -1,
CANCEL: 0,
CREATE_REPORT: 1,
ADD_SERIES: 2,
SET_STUDY_AND_SERIES: 3,
};
function promptUser(UIViewportDialogService, ctx, evt) {
const { viewportIndex, StudyInstanceUID, SeriesInstanceUID } = evt;
return new Promise(async function(resolve, reject) {
let promptResult = await _askTrackMeasurements(
UIViewportDialogService,
viewportIndex
);
resolve({
userResponse: promptResult,
StudyInstanceUID,
SeriesInstanceUID,
});
});
}
function _askTrackMeasurements(UIViewportDialogService, viewportIndex) {
return new Promise(function(resolve, reject) {
const message = 'Track measurements for this series?';
const actions = [
{ type: 'cancel', text: 'No', value: RESPONSE.CANCEL },
{
type: 'secondary',
text: 'No, do not ask again',
value: RESPONSE.NO_NEVER,
},
{
type: 'primary',
text: 'Yes',
value: RESPONSE.SET_STUDY_AND_SERIES,
},
];
const onSubmit = result => {
UIViewportDialogService.hide();
resolve(result);
};
UIViewportDialogService.show({
viewportIndex,
type: 'info',
message,
actions,
onSubmit,
onOutsideClick: () => {
UIViewportDialogService.hide();
resolve(RESPONSE.CANCEL);
},
});
});
}
export default promptUser;

View File

@ -0,0 +1,110 @@
const RESPONSE = {
NO_NEVER: -1,
CANCEL: 0,
CREATE_REPORT: 1,
ADD_SERIES: 2,
SET_STUDY_AND_SERIES: 3,
};
function promptUser(UIViewportDialogService, ctx, evt) {
const { viewportIndex, StudyInstanceUID, SeriesInstanceUID } = evt;
return new Promise(async function(resolve, reject) {
let promptResult = await _askShouldAddMeasurements(
UIViewportDialogService,
viewportIndex
);
if (promptResult === RESPONSE.CREATE_REPORT) {
promptResult = await _askSaveDiscardOrCancel(
UIViewportDialogService,
viewportIndex
);
}
// TODO: Hook into @JamesAPetts createReport
if (promptResult === RESPONSE.CREATE_REPORT) {
window.alert('CREATE REPORT');
}
resolve({
userResponse: promptResult,
StudyInstanceUID,
SeriesInstanceUID,
});
});
}
function _askShouldAddMeasurements(UIViewportDialogService, viewportIndex) {
return new Promise(function(resolve, reject) {
const message =
'Do you want to add this measurement to the existing report?';
const actions = [
{ type: 'cancel', text: 'Cancel', value: RESPONSE.CANCEL },
{
type: 'secondary',
text: 'Create new report',
value: RESPONSE.CREATE_REPORT,
},
{
type: 'primary',
text: 'Add to existing report',
value: RESPONSE.ADD_SERIES,
},
];
const onSubmit = result => {
UIViewportDialogService.hide();
resolve(result);
};
UIViewportDialogService.show({
viewportIndex,
type: 'info',
message,
actions,
onSubmit,
onOutsideClick: () => {
UIViewportDialogService.hide();
resolve(RESPONSE.CANCEL);
},
});
});
}
function _askSaveDiscardOrCancel(UIViewportDialogService, viewportIndex) {
return new Promise(function(resolve, reject) {
const message =
'You have existing tracked measurements. What would you like to do with your existing tracked measurements?';
const actions = [
{ type: 'cancel', text: 'Cancel', value: RESPONSE.CANCEL },
{
type: 'secondary',
text: 'Save in report',
value: RESPONSE.CREATE_REPORT,
},
{
type: 'primary',
text: 'Discard',
value: RESPONSE.SET_STUDY_AND_SERIES,
},
];
const onSubmit = result => {
UIViewportDialogService.hide();
resolve(result);
};
UIViewportDialogService.show({
viewportIndex,
type: 'warning',
message,
actions,
onSubmit,
onOutsideClick: () => {
UIViewportDialogService.hide();
resolve(RESPONSE.CANCEL);
},
});
});
}
export default promptUser;

View File

@ -0,0 +1,104 @@
const RESPONSE = {
NO_NEVER: -1,
CANCEL: 0,
CREATE_REPORT: 1,
ADD_SERIES: 2,
SET_STUDY_AND_SERIES: 3,
};
function promptUser(UIViewportDialogService, ctx, evt) {
const { viewportIndex, StudyInstanceUID, SeriesInstanceUID } = evt;
return new Promise(async function(resolve, reject) {
let promptResult = await _askTrackMeasurements(
UIViewportDialogService,
viewportIndex
);
if (promptResult === RESPONSE.SET_STUDY_AND_SERIES) {
promptResult = await _askSaveDiscardOrCancel(
UIViewportDialogService,
viewportIndex
);
}
// TODO: Hook into @JamesAPetts createReport
if (promptResult === RESPONSE.CREATE_REPORT) {
window.alert('CREATE REPORT');
}
resolve({
userResponse: promptResult,
StudyInstanceUID,
SeriesInstanceUID,
});
});
}
function _askTrackMeasurements(UIViewportDialogService, viewportIndex) {
return new Promise(function(resolve, reject) {
const message = 'Track measurements for this series?';
const actions = [
{ type: 'cancel', text: 'No', value: RESPONSE.CANCEL },
{
type: 'primary',
text: 'Yes',
value: RESPONSE.SET_STUDY_AND_SERIES,
},
];
const onSubmit = result => {
UIViewportDialogService.hide();
resolve(result);
};
UIViewportDialogService.show({
viewportIndex,
type: 'info',
message,
actions,
onSubmit,
onOutsideClick: () => {
UIViewportDialogService.hide();
resolve(RESPONSE.CANCEL);
},
});
});
}
function _askSaveDiscardOrCancel(UIViewportDialogService, viewportIndex) {
return new Promise(function(resolve, reject) {
const message =
'Measurements cannot span across multiple studies. Do you want to save your tracked measurements?';
const actions = [
{ type: 'cancel', text: 'Cancel', value: RESPONSE.CANCEL },
{
type: 'secondary',
text: 'No, discard previosuly tracked series & measurements',
value: RESPONSE.SET_STUDY_AND_SERIES,
},
{
type: 'primary',
text: 'Yes',
value: RESPONSE.CREATE_REPORT,
},
];
const onSubmit = result => {
UIViewportDialogService.hide();
resolve(result);
};
UIViewportDialogService.show({
viewportIndex,
type: 'warning',
message,
actions,
onSubmit,
onOutsideClick: () => {
UIViewportDialogService.hide();
resolve(RESPONSE.CANCEL);
},
});
});
}
export default promptUser;

View File

@ -277,6 +277,7 @@ function TrackedCornerstoneViewport({
type={viewportDialogState.type}
actions={viewportDialogState.actions}
onSubmit={viewportDialogState.onSubmit}
onOutsideClick={viewportDialogState.onOutsideClick}
/>
)}
</div>

View File

@ -26,13 +26,21 @@ const serviceImplementation = {
*
* @param {ViewportDialogProps} props { content, contentProps, viewportIndex }
*/
function _show({ viewportIndex, type, message, actions, onSubmit }) {
function _show({
viewportIndex,
type,
message,
actions,
onSubmit,
onOutsideClick,
}) {
return serviceImplementation._show({
viewportIndex,
type,
message,
actions,
onSubmit,
onOutsideClick,
});
}

View File

@ -1,16 +1,35 @@
import React from 'react';
import React, { useEffect, useRef } from 'react';
import classnames from 'classnames';
import PropTypes from 'prop-types';
import { Button, Icon } from '@ohif/ui';
const Notification = ({ type, message, actions, onSubmit }) => {
const Notification = ({ type, message, actions, onSubmit, onOutsideClick }) => {
const notificationRef = useRef(null);
useEffect(() => {
const notificationElement = notificationRef.current;
const handleClick = function(event) {
const isClickInside = notificationElement.contains(event.target);
if (!isClickInside) {
onOutsideClick();
}
};
document.addEventListener('mousedown', handleClick);
return () => {
document.removeEventListener('mousedown', handleClick);
};
}, [onOutsideClick]);
const iconsByType = {
error: {
icon: 'info',
color: 'text-red-700',
},
warning: {
icon: 'info',
icon: 'notificationwarning-diamond',
color: 'text-yellow-500',
},
info: {
@ -35,7 +54,10 @@ const Notification = ({ type, message, actions, onSubmit }) => {
const { icon, color } = getIconData();
return (
<div className="flex flex-col p-2 mx-2 mt-2 rounded bg-common-bright">
<div
ref={notificationRef}
className="flex flex-col p-2 mx-2 mt-2 rounded bg-common-bright"
>
<div className="flex flex-grow">
<Icon name={icon} className={classnames('w-5', color)} />
<span className="ml-2 text-base text-black">{message}</span>
@ -65,6 +87,7 @@ const Notification = ({ type, message, actions, onSubmit }) => {
Notification.defaultProps = {
type: 'info',
onOutsideClick: () => {},
};
Notification.propTypes = {
@ -78,6 +101,8 @@ Notification.propTypes = {
})
).isRequired,
onSubmit: PropTypes.func.isRequired,
/** Can be used as a callback to dismiss the notification for clicks that occur outside of it */
onOutsideClick: PropTypes.func,
};
export default Notification;

View File

@ -18,6 +18,9 @@ const DEFAULT_STATE = {
onSubmit: () => {
console.log('btn value?');
},
onOutsideClick: () => {
console.warn('default: onOutsideClick')
},
onDismiss: () => {
console.log('dismiss? -1');
},