mirrors/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2025-01-03 14:57:22 +03:00
Code Issues Projects Releases Packages Wiki Activity

Created separated component with servers dropdown

Browse source
This commit is contained in:
Alejandro Celaya 2018-06-03 13:18:33 +02:00
parent 2cad352045
commit b1e97ef022
2 changed files with 28 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
src/common/MainHeader.js
View file

@ -1,20 +1,11 @@
import plusIcon from '@fortawesome/fontawesome-free-solid/faPlus'; import plusIcon from '@fortawesome/fontawesome-free-solid/faPlus';
import FontAwesomeIcon from '@fortawesome/react-fontawesome'; import FontAwesomeIcon from '@fortawesome/react-fontawesome';
import React from 'react'; import React from 'react';
import { import { Link } from 'react-router-dom';
Collapse, DropdownItem, DropdownMenu, import { Collapse, Nav, Navbar, NavbarBrand, NavbarToggler, NavItem, NavLink } from 'reactstrap';
DropdownToggle, import ServersDropdown from '../servers/ServersDropdown';
Nav,
Navbar,
NavbarBrand,
NavbarToggler,
NavItem,
NavLink,
UncontrolledDropdown
} from 'reactstrap';
import './MainHeader.scss'; import './MainHeader.scss';
import shlinkLogo from './shlink-logo-white.png'; import shlinkLogo from './shlink-logo-white.png';
import { Link } from 'react-router-dom';
export default class MainHeader extends React.Component { export default class MainHeader extends React.Component {
constructor(props) { constructor(props) {
@ -27,7 +18,7 @@ export default class MainHeader extends React.Component {
toggle() { toggle() {
this.setState({ this.setState({
isOpen: !this.state.isOpen isOpen: ! this.state.isOpen
}); });
} }
@ -45,20 +36,7 @@ export default class MainHeader extends React.Component {
<FontAwesomeIcon icon={plusIcon}/>&nbsp; Add server <FontAwesomeIcon icon={plusIcon}/>&nbsp; Add server
</NavLink> </NavLink>
</NavItem> </NavItem>
<UncontrolledDropdown nav> <ServersDropdown />
<DropdownToggle nav caret>
Servers
</DropdownToggle>
<DropdownMenu>
<DropdownItem>
Server 1
</DropdownItem>
<DropdownItem>
Server 2
</DropdownItem>
</DropdownMenu>
</UncontrolledDropdown>
</Nav> </Nav>
</Collapse> </Collapse>
</Navbar> </Navbar>

23
src/servers/ServersDropdown.js Normal file
View file

@ -0,0 +1,23 @@
import React from 'react';
import { DropdownItem, DropdownMenu, DropdownToggle, UncontrolledDropdown } from 'reactstrap';
export default class ServersDropdown extends React.Component {
render() {
return (
<UncontrolledDropdown nav>
<DropdownToggle nav caret>
Servers
</DropdownToggle>
<DropdownMenu>
<DropdownItem>
Server 1 foo
</DropdownItem>
<DropdownItem>
Server 2 foo
</DropdownItem>
</DropdownMenu>
</UncontrolledDropdown>
);
}
}