3pp-mirror/pomerium
1
0
Fork 0
mirror of https://github.com/pomerium/pomerium.git synced 2025-04-29 10:26:29 +02:00
Code Issues Projects Releases Packages Wiki Activity

dashboard: fix missing avatar and logout menu (#3819)

Browse source
This commit is contained in:
Caleb Doxsey 2022-12-17 09:04:01 -07:00 • committed by GitHub
parent 539fd51579
commit 191eeceb05
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 31 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

60
ui/src/components/Header.tsx
View file

@ -1,8 +1,3 @@
import { PageData } from "../types";
import { Avatar } from "./Avatar";
import Logo from "./Logo";
import { ToolbarOffset } from "./ToolbarOffset";
import UserSidebarContent from "./UserSidebarContent";
import {
Drawer,
IconButton,
@ -18,7 +13,13 @@ import styled from "@mui/material/styles/styled";
import { get } from "lodash";
import React, { FC, useState } from "react";
import { ChevronLeft, ChevronRight, Menu as MenuIcon } from "react-feather";
import LogoURL from "../static/logo_white.svg";
import { PageData } from "../types";
import { Avatar } from "./Avatar";
import Logo from "./Logo";
import { ToolbarOffset } from "./ToolbarOffset";
import UserSidebarContent from "./UserSidebarContent";
const DrawerHeader = styled("div")(({ theme }) => ({
display: "flex",
@ -47,7 +48,15 @@ const Header: FC<HeaderProps> = ({ includeSidebar, data }) => {
setAnchorEl(null);
};
const userName =
get(data, "user.name") || get(data, "user.claims.given_name");
get(data, "user.name") ||
get(data, "user.claims.given_name") ||
get(data, "profile.claims.name") ||
get(data, "profile.claims.given_name") ||
"";
const userPictureUrl =
get(data, "user.claims.picture") ||
get(data, "profile.claims.picture") ||
null;
const handleDrawerOpen = () => {
setDrawerOpen(true);
@ -109,32 +118,25 @@ const Header: FC<HeaderProps> = ({ includeSidebar, data }) => {
</>
) : (
<a href="/.pomerium">
<Logo src={ data?.logoUrl || LogoURL }/>
<Logo src={data?.logoUrl || LogoURL} />
</a>
)}
<Box flexGrow={1} />
{userName && (
<>
<IconButton color="inherit" onClick={handleMenuOpen}>
<Avatar
name={userName}
url={get(data, "user.claims.picture", null)}
/>
</IconButton>
<Menu
onClose={handleMenuClose}
anchorOrigin={{
vertical: "bottom",
horizontal: "center",
}}
keepMounted
open={!!anchorEl}
anchorEl={anchorEl}
>
<MenuItem onClick={handleLogout}>Logout</MenuItem>
</Menu>
</>
)}
<IconButton color="inherit" onClick={handleMenuOpen}>
<Avatar name={userName} url={userPictureUrl} />
</IconButton>
<Menu
onClose={handleMenuClose}
anchorOrigin={{
vertical: "bottom",
horizontal: "center",
}}
keepMounted
open={!!anchorEl}
anchorEl={anchorEl}
>
<MenuItem onClick={handleLogout}>Logout</MenuItem>
</Menu>
</Toolbar>
</AppBar>
);