-
Notifications
You must be signed in to change notification settings - Fork 12
/
MappingOptions.jsx
60 lines (52 loc) · 1.97 KB
/
MappingOptions.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
import React from 'react';
import { Menu, MenuItem, MenuList, IconButton } from '@mui/material';
import { MoreVert as MenuIcon } from '@mui/icons-material';
import { map } from 'lodash';
const MappingOptions = ({ mapping }) => {
const anchorRef = React.useRef(null);
const [open, setOpen] = React.useState(false);
const onMenuToogle = event => {
event.preventDefault()
event.stopPropagation()
setOpen(!open)
return false;
}
const onOptionClick = (event, option) => {
event.preventDefault()
event.stopPropagation()
if(option)
window.location.hash = option.href
return false
}
const compareConceptHref = `/concepts/compare?lhs=${mapping.from_concept_url}&rhs=${mapping.to_concept_url}`
const getOptions = () => {
const options = [{label: 'Open Mapping Details', href: mapping.url},]
const currentURL = window.location.hash.split('?')[0].split('#')[1]
if(mapping.from_concept_url && mapping.from_concept_url !== currentURL)
options.push({label: 'Open From Concept', href: mapping.from_concept_url})
if(mapping.to_concept_url && mapping.to_concept_url !== currentURL)
options.push({label: 'Open To Concept', href: mapping.to_concept_url})
if(mapping.to_concept_url && mapping.from_concept_url)
options.push({label: 'Compare Concepts', href: compareConceptHref})
return options
}
return (
<React.Fragment>
<IconButton size='small' color='primary' ref={anchorRef} onClick={onMenuToogle}>
<MenuIcon fontSize='inherit' />
</IconButton>
<Menu open={open} anchorEl={anchorRef.current} onClose={onMenuToogle}>
<MenuList>
{
map(getOptions(), (option, index) => (
<MenuItem key={index} component='a' href={`/#${option.href}`} onClick={event => onOptionClick(event, option)}>
{option.label}
</MenuItem>
))
}
</MenuList>
</Menu>
</React.Fragment>
)
}
export default MappingOptions;