othmane/ohif-viewer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix dropdown title

Browse Source
This commit is contained in:
Rodrigo Antinarelli 2020-06-24 01:27:02 -03:00
parent db0ce2f6f7
commit a19c1acd7b
3 changed files with 51 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
extensions/default/src/ViewerLayout/Header.jsx
View File

@ -67,26 +67,7 @@ function Header({ children }) {
{t('Header:INVESTIGATIONAL USE ONLY')}
</span>
<Dropdown
titleElement={
<>
<IconButton
variant="text"
color="inherit"
size="initial"
className="text-primary-active"
>
<Icon name="settings" />
</IconButton>
<IconButton
variant="text"
color="inherit"
size="initial"
className="text-primary-active"
>
<Icon name="chevron-down" />
</IconButton>
</>
}
showDropdownIcon={false}
list={[
{
title: t('Header:About'),
@ -99,7 +80,24 @@ function Header({ children }) {
onClick: showPreferencesModal,
},
]}
/>
>
<IconButton
variant="text"
color="inherit"
size="initial"
className="text-primary-active"
>
<Icon name="settings" />
</IconButton>
<IconButton
variant="text"
color="inherit"
size="initial"
className="text-primary-active"
>
<Icon name="chevron-down" />
</IconButton>
</Dropdown>
</div>
</div>
</NavBar>

22
platform/ui/src/components/Dropdown/Dropdown.jsx
View File

@ -4,19 +4,17 @@ import classnames from 'classnames';
import { Icon, Typography } from '@ohif/ui';
const Dropdown = ({ titleElement, title, list }) => {
const Dropdown = ({ children, showDropdownIcon, list }) => {
const [open, setOpen] = useState(false);
const element = useRef(null);
const renderTitleElement = () => {
if (titleElement) {
return titleElement;
}
return (
<div className="flex">
<Typography>{title}</Typography>
<Icon name="chevron-down" className="text-white ml-1" />
<div className="flex text-white items-center">
{children}
{showDropdownIcon && (
<Icon name="chevron-down" className="text-white ml-1" />
)}
</div>
);
};
@ -96,9 +94,13 @@ const Dropdown = ({ titleElement, title, list }) => {
);
};
Dropdown.defaultProps = {
showDropdownIcon: true,
};
Dropdown.propTypes = {
titleElement: PropTypes.node,
title: PropTypes.string,
children: PropTypes.node.isRequired,
showDropdownIcon: PropTypes.bool,
/** Items to render in the select's drop down */
list: PropTypes.arrayOf(
PropTypes.shape({

42
platform/viewer/src/components/PreferencesDropdown/PreferencesDropdown.jsx
View File

@ -23,27 +23,7 @@ const PreferencesDropdown = () => {
return (
<Dropdown
titleElement={
<>
<IconButton
variant="text"
color="inherit"
size="initial"
className="text-primary-active"
>
<Icon name="settings" />
</IconButton>
<IconButton
variant="text"
color="inherit"
size="initial"
className="text-primary-active"
onClick={() => {}}
>
<Icon name="chevron-down" />
</IconButton>
</>
}
showDropdownIcon={false}
list={[
{ title: 'About', icon: 'info', onClick: showAboutModal },
{
@ -52,7 +32,25 @@ const PreferencesDropdown = () => {
onClick: showPreferencesModal,
},
]}
/>
>
<IconButton
variant="text"
color="inherit"
size="initial"
className="text-primary-active"
>
<Icon name="settings" />
</IconButton>
<IconButton
variant="text"
color="inherit"
size="initial"
className="text-primary-active"
onClick={() => {}}
>
<Icon name="chevron-down" />
</IconButton>
</Dropdown>
);
};