Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feat/customization option for viewport notification #4638

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions extensions/cornerstone-dicom-rt/src/utils/promptHydrateRT.ts
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ function promptHydrateRT({

function _askHydrate(uiViewportDialogService: AppTypes.UIViewportDialogService, viewportId) {
return new Promise(function (resolve, reject) {
const message = 'Do you want to open this Segmentation?';
const content = 'Do you want to open this Segmentation?';
const actions = [
{
id: 'no-hydrate',
Expand All @@ -63,7 +63,7 @@ function _askHydrate(uiViewportDialogService: AppTypes.UIViewportDialogService,
id: 'promptHydrateRT',
viewportId,
type: 'info',
message,
content,
actions,
onSubmit,
onOutsideClick: () => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ function promptHydrateSEG({

function _askHydrate(uiViewportDialogService, viewportId) {
return new Promise(function (resolve, reject) {
const message = 'Do you want to open this Segmentation?';
const content = 'Do you want to open this Segmentation?';
const actions = [
{
id: 'no-hydrate',
Expand All @@ -64,7 +64,7 @@ function _askHydrate(uiViewportDialogService, viewportId) {
uiViewportDialogService.show({
viewportId,
type: 'info',
message,
content,
actions,
onSubmit,
onOutsideClick: () => {
Expand Down
10 changes: 8 additions & 2 deletions extensions/cornerstone/src/Viewport/OHIFCornerstoneViewport.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -99,6 +99,7 @@ const OHIFCornerstoneViewport = React.memo(
segmentationService,
cornerstoneCacheService,
viewportActionCornersService,
customizationService,
} = servicesManager.services;

const [viewportDialogState] = useViewportDialog();
Expand Down Expand Up @@ -373,6 +374,11 @@ const OHIFCornerstoneViewport = React.memo(
onResize,
});

const customNotificationComponent = customizationService.get('notificationComponent')?.content;
const NotificationComponent = customNotificationComponent
? customNotificationComponent
: Notification;

return (
<React.Fragment>
<div className="viewport-wrapper">
Expand Down Expand Up @@ -406,9 +412,9 @@ const OHIFCornerstoneViewport = React.memo(
{/* top offset of 24px to account for ViewportActionCorners. */}
<div className="absolute top-[24px] w-full">
{viewportDialogState.viewportId === viewportId && (
<Notification
<NotificationComponent
id="viewport-notification"
message={viewportDialogState.message}
content={viewportDialogState.content}
type={viewportDialogState.type}
actions={viewportDialogState.actions}
onSubmit={viewportDialogState.onSubmit}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ function promptBeginTracking({ servicesManager, extensionManager }, ctx, evt) {

function _askTrackMeasurements(uiViewportDialogService, viewportId) {
return new Promise(function (resolve, reject) {
const message = i18n.t('MeasurementTable:Track measurements for this series?');
const content = i18n.t('MeasurementTable:Track measurements for this series?');
const actions = [
{
id: 'prompt-begin-tracking-cancel',
Expand Down Expand Up @@ -62,7 +62,7 @@ function _askTrackMeasurements(uiViewportDialogService, viewportId) {
viewportId,
id: 'measurement-tracking-prompt-begin-tracking',
type: 'info',
message,
content,
actions,
onSubmit,
onOutsideClick: () => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ function promptHydrateStructuredReport({ servicesManager, extensionManager, appC

function _askTrackMeasurements(uiViewportDialogService, viewportId) {
return new Promise(function (resolve, reject) {
const message = 'Do you want to continue tracking measurements for this study?';
const content = 'Do you want to continue tracking measurements for this study?';
const actions = [
{
id: 'no-hydrate',
Expand All @@ -70,7 +70,7 @@ function _askTrackMeasurements(uiViewportDialogService, viewportId) {
uiViewportDialogService.show({
viewportId,
type: 'info',
message,
content,
actions,
onSubmit,
onOutsideClick: () => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ function promptTrackNewSeries({ servicesManager, extensionManager }, ctx, evt) {

function _askShouldAddMeasurements(uiViewportDialogService, viewportId) {
return new Promise(function (resolve, reject) {
const message = 'Do you want to add this measurement to the existing report?';
const content = 'Do you want to add this measurement to the existing report?';
const actions = [
{
type: ButtonEnums.type.secondary,
Expand All @@ -62,7 +62,7 @@ function _askShouldAddMeasurements(uiViewportDialogService, viewportId) {
uiViewportDialogService.show({
viewportId,
type: 'info',
message,
content,
actions,
onSubmit,
onOutsideClick: () => {
Expand All @@ -75,7 +75,7 @@ function _askShouldAddMeasurements(uiViewportDialogService, viewportId) {

function _askSaveDiscardOrCancel(UIViewportDialogService, viewportId) {
return new Promise(function (resolve, reject) {
const message =
const content =
'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 },
Expand All @@ -98,7 +98,7 @@ function _askSaveDiscardOrCancel(UIViewportDialogService, viewportId) {
UIViewportDialogService.show({
viewportId,
type: 'warning',
message,
content,
actions,
onSubmit,
onOutsideClick: () => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ function _askTrackMeasurements(
viewportId
) {
return new Promise(function (resolve, reject) {
const message = i18n.t('MeasurementTable:Track measurements for this series?');
const content = i18n.t('MeasurementTable:Track measurements for this series?');
const actions = [
{ type: 'cancel', text: i18n.t('MeasurementTable:No'), value: RESPONSE.CANCEL },
{
Expand All @@ -61,7 +61,7 @@ function _askTrackMeasurements(
UIViewportDialogService.show({
viewportId,
type: 'info',
message,
content,
actions,
onSubmit,
onOutsideClick: () => {
Expand All @@ -83,7 +83,7 @@ function _askSaveDiscardOrCancel(
viewportId
) {
return new Promise(function (resolve, reject) {
const message =
const content =
'Measurements cannot span across multiple studies. Do you want to save your tracked measurements?';
const actions = [
{ type: 'cancel', text: 'Cancel', value: RESPONSE.CANCEL },
Expand All @@ -106,7 +106,7 @@ function _askSaveDiscardOrCancel(
UIViewportDialogService.show({
viewportId,
type: 'warning',
message,
content,
actions,
onSubmit,
onOutsideClick: () => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -22,12 +22,12 @@ class UIViewportDialogService extends PubSubService {
};
}

public show({ viewportId, id, type, message, actions, onSubmit, onOutsideClick, onKeyPress }) {
public show({ viewportId, id, type, content, actions, onSubmit, onOutsideClick, onKeyPress }) {
return this.serviceImplementation._show({
viewportId,
id,
type,
message,
content,
actions,
onSubmit,
onOutsideClick,
Expand Down
6 changes: 3 additions & 3 deletions platform/ui/src/components/Notification/Notification.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import { Icons } from '@ohif/ui-next';
const Notification = ({
id,
type = 'info',
message,
content,
actions,
onSubmit,
onOutsideClick = () => {},
Expand Down Expand Up @@ -84,7 +84,7 @@ const Notification = ({
name={icon}
className={classnames('h-6 w-6', color)}
/>
<span className="ml-2 text-[13px] text-black">{message}</span>
<span className="ml-2 text-[13px] text-black">{content}</span>
</div>
<div className="mt-2 flex flex-wrap justify-end gap-2">
{actions?.map((action, index) => {
Expand All @@ -109,7 +109,7 @@ const Notification = ({

Notification.propTypes = {
type: PropTypes.oneOf(['error', 'warning', 'info', 'success']),
message: PropTypes.string.isRequired,
message: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired,
actions: PropTypes.arrayOf(
PropTypes.shape({
text: PropTypes.string.isRequired,
Expand Down
Loading