TrizTech/ohif-viewer
17
0 Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

fix(modal and dialogues): fixes as per specifications (#3438)

Browse Source 
Co-authored-by: Alireza <ar.sedghi@gmail.com>
This commit is contained in:
Joe BoccanfusoandAlireza authored and GitHub committed 2023-06-07 08:31:09 -04:00
1 parent ffaffbdfa3
commit da5c32bce3
27 files changed
+180 -170
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

extensions/cornerstone-dicom-seg/src/panels/callInputDialog.tsx
+18 -19
View File
@@ -24,7 +24,7 @@ function callInputDialog(uiDialogService, label, callback) {
showOverlay: true,
content: Dialog,
contentProps: {
title: 'Enter Segment Label',
title: 'Segment',
value: { label },
noCloseButton: true,
onClose: () => uiDialogService.dismiss({ id: dialogId }),
@@ -35,24 +35,23 @@ function callInputDialog(uiDialogService, label, callback) {
onSubmit: onSubmitHandler,
body: ({ value, setValue }) => {
return (
<div className="p-4 bg-primary-dark">
<Input
autoFocus
className="mt-2 bg-black border-primary-main"
type="text"
containerClassName="mr-2"
value={value.label}
onChange={event => {
event.persist();
setValue(value => ({ ...value, label: event.target.value }));
}}
onKeyPress={event => {
if (event.key === 'Enter') {
onSubmitHandler({ value, action: { id: 'save' } });
}
}}
/>
</div>
<Input
label="Enter the segment label"
labelClassName="text-white text-[14px] leading-[1.2]"
autoFocus
className="bg-black border-primary-main"
type="text"
value={value.label}
onChange={event => {
event.persist();
setValue(value => ({ ...value, label: event.target.value }));
}}
onKeyPress={event => {
if (event.key === 'Enter') {
onSubmitHandler({ value, action: { id: 'save' } });
}
}}
/>
);
},
},
extensions/cornerstone/src/components/DicomUpload/DicomUploadProgressItem.tsx
+1 -1
View File
@@ -97,7 +97,7 @@ const DicomUploadProgressItem = memo(
)}
<div className="flex cursor-pointer ml-auto">
<Icon
className="w-6 h-6 self-center text-primary-active"
className="self-center text-primary-active"
name="close"
onClick={cancelUpload}
/>
extensions/cornerstone/src/utils/callInputDialog.tsx
+20 -23
View File
@@ -27,8 +27,8 @@ function callInputDialog(
: data.label
: '';
const {
dialogTitle = 'Enter your annotation',
inputLabel = '',
dialogTitle = 'Annotation',
inputLabel = 'Enter your annotation',
validateFunc = value => true,
} = dialogConfig;
@@ -66,27 +66,24 @@ function callInputDialog(
onSubmit: onSubmitHandler,
body: ({ value, setValue }) => {
return (
<div className="p-4 bg-primary-dark">
<Input
autoFocus
className="mt-2 bg-black border-primary-main"
type="text"
id="annotation"
containerClassName="mr-2"
label={inputLabel}
labelClassName="text-primary-light"
value={value.label}
onChange={event => {
event.persist();
setValue(value => ({ ...value, label: event.target.value }));
}}
onKeyPress={event => {
if (event.key === 'Enter') {
onSubmitHandler({ value, action: { id: 'save' } });
}
}}
/>
</div>
<Input
autoFocus
className="bg-black border-primary-main"
type="text"
id="annotation"
label={inputLabel}
labelClassName="text-white text-[14px] leading-[1.2]"
value={value.label}
onChange={event => {
event.persist();
setValue(value => ({ ...value, label: event.target.value }));
}}
onKeyPress={event => {
if (event.key === 'Enter') {
onSubmitHandler({ value, action: { id: 'save' } });
}
}}
/>
);
},
},
extensions/default/src/Panels/PanelMeasurementTable.tsx
+12 -13
View File
@@ -160,7 +160,7 @@ export default function PanelMeasurementTable({
showOverlay: true,
content: Dialog,
contentProps: {
title: 'Enter your annotation',
title: 'Annotation',
noCloseButton: true,
value: { label: measurement.label || '' },
body: ({ value, setValue }) => {
@@ -175,18 +175,17 @@ export default function PanelMeasurementTable({
}
};
return (
<div className="p-4 bg-primary-dark">
<Input
autoFocus
id="annotation"
className="mt-2 bg-black border-primary-main"
type="text"
containerClassName="mr-2"
value={value.label}
onChange={onChangeHandler}
onKeyPress={onKeyPressHandler}
/>
</div>
<Input
label="Enter your annotation"
labelClassName="text-white text-[14px] leading-[1.2]"
autoFocus
id="annotation"
className="bg-black border-primary-main"
type="text"
value={value.label}
onChange={onChangeHandler}
onKeyPress={onKeyPressHandler}
/>
);
},
actions: [
extensions/default/src/Panels/createReportDialogPrompt.tsx
+29 -33
View File
@@ -11,7 +11,7 @@ export default function createReportDialogPrompt(
uiDialogService,
{ extensionManager }
) {
return new Promise(function (resolve, reject) {
return new Promise(function(resolve, reject) {
let dialogId = undefined;
const _handleClose = () => {
@@ -73,7 +73,7 @@ export default function createReportDialogPrompt(
useLastPosition: false,
showOverlay: true,
contentProps: {
title: 'Provide a name for your report',
title: 'Create Report',
value: {
label: '',
dataSourceName: extensionManager.activeDataSource,
@@ -102,38 +102,34 @@ export default function createReportDialogPrompt(
};
return (
<>
<div className="p-4 bg-primary-dark">
{dataSourcesOpts.length > 1 && (
<Select
closeMenuOnSelect={true}
className="mr-2 bg-black border-primary-main"
options={dataSourcesOpts}
placeholder={
dataSourcesOpts.find(
option => option.value === value.dataSourceName
).placeHolder
}
value={value.dataSourceName}
onChange={evt => {
setValue(v => ({ ...v, dataSourceName: evt.value }));
}}
isClearable={false}
/>
)}
</div>
<div className="p-4 bg-primary-dark">
<Input
autoFocus
className="mt-2 bg-black border-primary-main"
type="text"
placeholder="Enter Report Name"
containerClassName="mr-2"
value={value.label}
onChange={onChangeHandler}
onKeyPress={onKeyPressHandler}
required
{dataSourcesOpts.length > 1 && (
<Select
closeMenuOnSelect={true}
className="mr-2 bg-black border-primary-main"
options={dataSourcesOpts}
placeholder={
dataSourcesOpts.find(
option => option.value === value.dataSourceName
).placeHolder
}
value={value.dataSourceName}
onChange={evt => {
setValue(v => ({ ...v, dataSourceName: evt.value }));
}}
isClearable={false}
/>
</div>
)}
<Input
autoFocus
label="Enter the report name"
labelClassName="text-white text-[14px] leading-[1.2]"
className="bg-black border-primary-main"
type="text"
value={value.label}
onChange={onChangeHandler}
onKeyPress={onKeyPressHandler}
required
/>
</>
);
},
extensions/dicom-microscopy/src/getCommandsModule.ts
-1
View File
@@ -31,7 +31,6 @@ export default function getCommandsModule({
callInputDialog({
uiDialogService,
title: 'Enter your annotation',
defaultValue: '',
callback: (value: string, action: string) => {
switch (action) {
extensions/dicom-microscopy/src/utils/callInputDialog.tsx
+19 -20
View File
@@ -12,7 +12,7 @@ import { Input, Dialog } from '@ohif/ui';
*/
export default function callInputDialog({
uiDialogService,
title = 'Enter your annotation',
title = 'Annotation',
defaultValue = '',
callback = (value: string, action: string) => {}
}) {
@@ -49,27 +49,26 @@ export default function callInputDialog({
onSubmit: onSubmitHandler,
body: ({ value, setValue }) => {
return (
<div className="p-4 bg-primary-dark">
<Input
autoFocus
className="mt-2 bg-black border-primary-main"
type="text"
containerClassName="mr-2"
value={value.defaultValue}
onChange={event => {
event.persist();
setValue(value => ({ ...value, value: event.target.value }));
}}
onKeyPress={event => {
if (event.key === 'Enter') {
onSubmitHandler({ value, action: { id: 'save' } });
}
}}
/>
</div>
<Input
label="Enter your annotation"
labelClassName="text-white text-[14px] leading-[1.2]"
autoFocus
className="bg-black border-primary-main"
type="text"
value={value.defaultValue}
onChange={event => {
event.persist();
setValue(value => ({ ...value, value: event.target.value }));
}}
onKeyPress={event => {
if (event.key === 'Enter') {
onSubmitHandler({ value, action: { id: 'save' } });
}
}}
/>
);
},
},
});
}
}
}
extensions/measurement-tracking/src/_shared/createReportDialogPrompt.tsx
+5 -4
View File
@@ -38,7 +38,7 @@ export default function createReportDialogPrompt(uiDialogService) {
useLastPosition: false,
showOverlay: true,
contentProps: {
title: 'Provide a name for your report',
title: 'Create Report',
value: { label: '' },
noCloseButton: true,
onClose: _handleClose,
@@ -60,12 +60,13 @@ export default function createReportDialogPrompt(uiDialogService) {
}
};
return (
<div className="p-4 bg-primary-dark">
<div className="">
<Input
label="Enter the report name"
labelClassName="text-white grow leading-[1.2] text-[14px]"
autoFocus
className="mt-2 bg-black border-primary-main"
className="bg-black border-primary-main grow"
type="text"
containerClassName="mr-2"
value={value.label}
onChange={onChangeHandler}
onKeyPress={onKeyPressHandler}
extensions/measurement-tracking/src/panels/PanelMeasurementTableTracking/index.tsx
+12 -13
View File
@@ -188,7 +188,7 @@ function PanelMeasurementTableTracking({ servicesManager, extensionManager }) {
showOverlay: true,
content: Dialog,
contentProps: {
title: 'Enter your annotation',
title: 'Annotation',
noCloseButton: true,
value: { label: measurement.label || '' },
body: ({ value, setValue }) => {
@@ -203,18 +203,17 @@ function PanelMeasurementTableTracking({ servicesManager, extensionManager }) {
}
};
return (
<div className="p-4 bg-primary-dark">
<Input
autoFocus
id="annotation"
className="mt-2 bg-black border-primary-main"
type="text"
containerClassName="mr-2"
value={value.label}
onChange={onChangeHandler}
onKeyPress={onKeyPressHandler}
/>
</div>
<Input
label="Enter your annotation"
labelClassName="text-white grow text-[14px] leading-[1.2]"
autoFocus
id="annotation"
className="bg-black border-primary-main"
type="text"
value={value.label}
onChange={onChangeHandler}
onKeyPress={onKeyPressHandler}
/>
);
},
actions: [