2020-08-29 21:20:45 +03:00
|
|
|
import { isEmpty, values } from 'ramda';
|
|
|
|
import { DropdownItem, DropdownMenu, DropdownToggle, UncontrolledDropdown } from 'reactstrap';
|
|
|
|
import { Link } from 'react-router-dom';
|
2020-12-12 13:29:15 +03:00
|
|
|
import { faPlus as plusIcon, faFileDownload as exportIcon, faServer as serverIcon } from '@fortawesome/free-solid-svg-icons';
|
|
|
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
2020-08-29 21:20:45 +03:00
|
|
|
import ServersExporter from './services/ServersExporter';
|
|
|
|
import { isServerWithId, SelectedServer, ServersMap } from './data';
|
|
|
|
|
|
|
|
export interface ServersDropdownProps {
|
|
|
|
servers: ServersMap;
|
|
|
|
selectedServer: SelectedServer;
|
|
|
|
}
|
|
|
|
|
|
|
|
const ServersDropdown = (serversExporter: ServersExporter) => ({ servers, selectedServer }: ServersDropdownProps) => {
|
|
|
|
const serversList = values(servers);
|
2020-12-12 13:29:15 +03:00
|
|
|
const createServerItem = (
|
|
|
|
<DropdownItem tag={Link} to="/server/create">
|
|
|
|
<FontAwesomeIcon icon={plusIcon} /> <span className="ml-1">Add server</span>
|
|
|
|
</DropdownItem>
|
|
|
|
);
|
2020-08-29 21:20:45 +03:00
|
|
|
|
|
|
|
const renderServers = () => {
|
|
|
|
if (isEmpty(serversList)) {
|
2020-12-12 13:29:15 +03:00
|
|
|
return createServerItem;
|
2020-08-29 21:20:45 +03:00
|
|
|
}
|
|
|
|
|
|
|
|
return (
|
2020-11-14 00:44:26 +03:00
|
|
|
<>
|
2020-08-29 21:20:45 +03:00
|
|
|
{serversList.map(({ name, id }) => (
|
|
|
|
<DropdownItem
|
|
|
|
key={id}
|
|
|
|
tag={Link}
|
2020-12-08 20:27:36 +03:00
|
|
|
to={`/server/${id}`}
|
2020-08-29 21:20:45 +03:00
|
|
|
active={isServerWithId(selectedServer) && selectedServer.id === id}
|
|
|
|
>
|
|
|
|
{name}
|
|
|
|
</DropdownItem>
|
|
|
|
))}
|
|
|
|
<DropdownItem divider />
|
2020-12-12 13:29:15 +03:00
|
|
|
{createServerItem}
|
2020-08-29 21:20:45 +03:00
|
|
|
<DropdownItem className="servers-dropdown__export-item" onClick={async () => serversExporter.exportServers()}>
|
2020-12-12 13:29:15 +03:00
|
|
|
<FontAwesomeIcon icon={exportIcon} /> <span className="ml-1">Export servers</span>
|
2020-08-29 21:20:45 +03:00
|
|
|
</DropdownItem>
|
2020-11-14 00:44:26 +03:00
|
|
|
</>
|
2020-08-29 21:20:45 +03:00
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
return (
|
|
|
|
<UncontrolledDropdown nav inNavbar>
|
2020-12-12 13:29:15 +03:00
|
|
|
<DropdownToggle nav caret>
|
|
|
|
<FontAwesomeIcon icon={serverIcon} /> <span className="ml-1">Servers</span>
|
|
|
|
</DropdownToggle>
|
2020-08-29 21:20:45 +03:00
|
|
|
<DropdownMenu right>{renderServers()}</DropdownMenu>
|
|
|
|
</UncontrolledDropdown>
|
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
export default ServersDropdown;
|