/* * Copyright (c) [2020] SUSE LLC * * All Rights Reserved. * * This program is free software; you can redistribute it and/or modify it * under the terms of version 2 of the GNU General Public License as published * by the Free Software Foundation. * * This program is distributed in the hope that it will be useful, but WITHOUT * ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or * FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for * more details. * * You should have received a copy of the GNU General Public License along * with this program; if not, contact SUSE LLC. * * To contact SUSE LLC about this file by physical or electronic mail, you may * find current contact information at www.suse.com. */ import React, { useState } from 'react'; import { Dropdown, DropdownItem, DropdownToggle } from '@patternfly/react-core'; import BridgeForm from './BridgeForm'; import BondForm from './BondForm'; import VlanForm from './VlanForm'; import cockpit from 'cockpit'; const _ = cockpit.gettext; const formComponents = { BondForm: BondForm, BridgeForm: BridgeForm, VlanForm: VlanForm }; const AddConnectionMenu = () => { const [isOpen, setOpen] = useState(false); const [formComponent, setFormComponent] = useState(null); const Component = formComponents[formComponent]; const toggle = () => { setOpen(!isOpen); if (isOpen) { const toggle = document.getElementById('add-buttons-toggle'); toggle.focus(); } }; const dropdownItems = [ <DropdownItem key="bond" component="button" onClick={() => setFormComponent('BondForm')}> {_("Bond")} </DropdownItem>, <DropdownItem key="bridge" component="button" onClick={() => setFormComponent('BridgeForm')}> {_("Bridge")} </DropdownItem>, <DropdownItem key="vlan" component="button" onClick={() => setFormComponent('VlanForm')}> {_("VLAN")} </DropdownItem>, ]; return ( <> <Dropdown onSelect={toggle} toggle={<DropdownToggle id="add-buttons-toggle" onToggle={toggle}>{_("Add")}</DropdownToggle>} isOpen={isOpen} dropdownItems={dropdownItems} /> { Component && <Component isOpen onClose={() => setFormComponent(null)} /> } </> ); }; export default AddConnectionMenu;