diff options
Diffstat (limited to 'opendc-web/opendc-web-ui/src/components')
3 files changed, 15 insertions, 15 deletions
diff --git a/opendc-web/opendc-web-ui/src/components/AppHeader.js b/opendc-web/opendc-web-ui/src/components/AppHeader.js index b33212c4..fd54b3ad 100644 --- a/opendc-web/opendc-web-ui/src/components/AppHeader.js +++ b/opendc-web/opendc-web-ui/src/components/AppHeader.js @@ -22,13 +22,13 @@ import { PageHeader } from '@patternfly/react-core' import React from 'react' -import Image from 'next/image' import AppHeaderTools from './AppHeaderTools' import { AppNavigation } from './AppNavigation' import AppLogo from './AppLogo' export function AppHeader() { - const logo = <Image src="/img/logo.png" layout="fixed" width={30} height={30} alt="OpenDC" /> + // eslint-disable-next-line @next/next/no-img-element + const logo = <img src="/img/logo.png" width={30} height={30} alt="OpenDC" /> return ( <PageHeader diff --git a/opendc-web/opendc-web-ui/src/components/AppHeaderTools.js b/opendc-web/opendc-web-ui/src/components/AppHeaderTools.js index 02e5d265..3e58b209 100644 --- a/opendc-web/opendc-web-ui/src/components/AppHeaderTools.js +++ b/opendc-web/opendc-web-ui/src/components/AppHeaderTools.js @@ -39,7 +39,9 @@ import { useAuth } from '../auth' import { GithubIcon, HelpIcon } from '@patternfly/react-icons' function AppHeaderTools() { - const auth = useAuth() + const { logout, user, isAuthenticated, isLoading } = useAuth() + const username = isAuthenticated || isLoading ? user?.name : 'Anonymous' + const avatar = isAuthenticated || isLoading ? user?.picture : '/img/avatar.svg' const [isKebabDropdownOpen, setKebabDropdownOpen] = useState(false) const kebabDropdownItems = [ @@ -56,7 +58,11 @@ function AppHeaderTools() { const [isDropdownOpen, setDropdownOpen] = useState(false) const userDropdownItems = [ <DropdownGroup key="group 2"> - <DropdownItem key="group 2 logout" onClick={() => auth.logout({ returnTo: window.location.origin })}> + <DropdownItem + key="group 2 logout" + isDisabled={!isAuthenticated} + onClick={() => logout({ returnTo: window.location.origin })} + > Logout </DropdownItem> </DropdownGroup>, @@ -105,7 +111,7 @@ function AppHeaderTools() { isOpen={isDropdownOpen} toggle={ <DropdownToggle onToggle={() => setDropdownOpen(!isDropdownOpen)}> - {auth?.user?.name ?? ( + {username ?? ( <Skeleton fontSize="xs" width="150px" @@ -119,8 +125,8 @@ function AppHeaderTools() { /> </PageHeaderToolsItem> </PageHeaderToolsGroup> - {auth?.user?.picture ? ( - <Avatar src={auth.user.picture} alt="Avatar image" /> + {avatar ? ( + <Avatar src={avatar} alt="Avatar image" /> ) : ( <Skeleton className="pf-c-avatar" shape="circle" width="2.25rem" screenreaderText="Loading avatar" /> )} diff --git a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/MachineComponent.js b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/MachineComponent.js index 921622d6..18c3db3c 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/MachineComponent.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/MachineComponent.js @@ -1,17 +1,11 @@ import PropTypes from 'prop-types' import React from 'react' -import Image from 'next/image' import { Flex, Label } from '@patternfly/react-core' import { Machine } from '../../../../shapes' const UnitIcon = ({ id, type }) => ( - <Image - src={'/img/topology/' + id + '-icon.png'} - alt={'Machine contains ' + type + ' units'} - layout="intrinsic" - height={24} - width={24} - /> + // eslint-disable-next-line @next/next/no-img-element + <img src={'/img/topology/' + id + '-icon.png'} alt={'Machine contains ' + type + ' units'} height={24} width={24} /> ) UnitIcon.propTypes = { |