-
Notifications
You must be signed in to change notification settings - Fork 12
/
ReferenceCascadeDialog.jsx
151 lines (147 loc) · 6.17 KB
/
ReferenceCascadeDialog.jsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
import React from 'react';
import {
Button, Dialog, DialogActions, DialogContent, DialogTitle, DialogContentText,
FormControlLabel, Tooltip, CircularProgress, FormControl, RadioGroup, Radio, FormHelperText
} from '@mui/material'
import {
Help as HelpIcon,
} from '@mui/icons-material'
const ReferenceCascadeDialog = ({ references, collectionName, onCascadeChange, open, onClose, title, onAdd, isAdding }) => {
const [cascadeMethod, setCascadeMethod] = React.useState('none')
const onChange = event => {
const newValue = event.target.value
setCascadeMethod(newValue)
onCascadeChange({cascadeMappings: newValue === 'cascadeMappings', cascadeToConcepts: newValue === 'cascadeToConcepts', cascadeMethod: newValue})
}
const helperTextStyle = {
marginLeft: '30px',
marginTop: '-8px',
fontStyle: 'italic',
}
const getContent = () => (
<DialogContent>
{
isAdding ?
<div className='col-md-12' style={{textAlign: 'center'}}>
<CircularProgress />
</div> :
<React.Fragment>
<DialogContentText style={{color: 'black', marginBottom: '20px'}}>
{`${references.length} selected reference(s) will be added to collection ${collectionName}`}
</DialogContentText>
<FormControl>
<RadioGroup
aria-labelledby="demo-controlled-radio-buttons-group"
name="controlled-radio-buttons-group"
value={cascadeMethod}
onChange={onChange}
>
<FormControlLabel
value="none"
control={<Radio />}
label={
<span className='flex-vertical-center'>
<span style={{marginRight: '5px', fontSize: '14px'}}>Do not cascade (default)</span>
<Tooltip arrow title="Add reference(s) to the selected resource(s) ONLY">
<HelpIcon fontSize='small' style={{fontSize: '14px'}}/>
</Tooltip>
</span>
}
/>
<FormControlLabel
value="cascadeMappings"
control={<Radio />}
label={
<span className='flex-vertical-center'>
<span style={{marginRight: '5px', fontSize: '14px'}}>
Cascade to associated mappings in the same source
</span>
<Tooltip arrow title="Add reference(s) to the selected resource(s) AND any of those concepts’ mappings (only if the mapping is in the same source as the concept)">
<HelpIcon fontSize='small' style={{fontSize: '14px'}}/>
</Tooltip>
</span>
}
/>
{
cascadeMethod === 'cascadeMappings' &&
<FormHelperText id="cascadeMappings" style={helperTextStyle}>
?cascadeLevels=1&method=sourcemappings
</FormHelperText>
}
<FormControlLabel
value="cascadeToConcepts"
control={<Radio />}
label={
<span className='flex-vertical-center'>
<span style={{marginRight: '5px', fontSize: '14px'}}>
Cascade to associated mappings and target concepts in the same source
</span>
<Tooltip arrow title="Add reference(s) to the selected resource(s) AND any of those concepts’ mappings AND the target concepts of those mappings (only for resources in the same source as the selected resource)">
<HelpIcon fontSize='small' style={{fontSize: '14px'}}/>
</Tooltip>
</span>
}
/>
{
cascadeMethod === 'cascadeToConcepts' &&
<FormHelperText id="cascadeToConcepts" style={helperTextStyle}>
?cascadeLevels=1&method=sourcetoconcepts
</FormHelperText>
}
<FormControlLabel
value="OpenMRSCascade"
control={<Radio />}
label={
<span className='flex-vertical-center'>
<span style={{marginRight: '5px', fontSize: '14px'}}>
OpenMRS-compatible Cascade
</span>
<Tooltip arrow title='A specialized cascade option that adds a concept and all of its mappings, and then recursively adds any of its associated answer or set member concepts (i.e. concepts that are associated by a "Q-AND-A" or "CONCEPT-SET" map type) with all of their mappings, and so on. Resources are only added if they are defined in the same source as the selected concept(s).'>
<HelpIcon fontSize='small' style={{fontSize: '14px'}}/>
</Tooltip>
</span>
}
/>
{
cascadeMethod === 'OpenMRSCascade' &&
<FormHelperText id="OpenMRSCascade" style={helperTextStyle}>
?cascadeLevels=*&method=sourcetoconcepts&mapTypes=Q-AND-A,CONCEPT-SET&returnMapTypes=*&transformReferences=resourceVersions
</FormHelperText>
}
</RadioGroup>
</FormControl>
</React.Fragment>
}
</DialogContent>
);
return (
<React.Fragment>
{
open ?
(
<Dialog open={open} onClose={onClose}>
{
title &&
<DialogTitle>
{title}
</DialogTitle>
}
{ getContent() }
<DialogActions>
<React.Fragment>
<Button onClick={onClose} color="primary" disabled={isAdding}>
Cancel
</Button>
<Button onClick={onAdd} color="primary" disabled={isAdding}>
Add
</Button>
</React.Fragment>
</DialogActions>
</Dialog>
) :
(getContent())
}
</React.Fragment>
)
}
export default ReferenceCascadeDialog;