Improving user management and auto-refreshing user firms

gui/rpk-gui/src/components/auth/Logout.tsx

@@ -1,11 +1,7 @@
-import {Navigate, useSearchParams} from "react-router";
-import {AuthPage} from "@refinedev/mui";
-import GoogleIcon from "@mui/icons-material/Google";
-import DiscordIcon from "../DiscordIcon";
 import { useLogout } from "@refinedev/core";
 
 export const Logout = () => {
   const { mutate: logout } = useLogout();
 
-  return <button onClick={() => logout()}>Logout</button>;
+  return <button onClick={() => logout()} >Logout</button>;
 };

gui/rpk-gui/src/components/header/index.tsx

@@ -10,13 +10,8 @@ import { useGetIdentity } from "@refinedev/core";
 import { HamburgerMenu, RefineThemedLayoutV2HeaderProps } from "@refinedev/mui";
 import React, { useContext } from "react";
 import { ColorModeContext } from "../../contexts/color-mode";
-import {Logout} from "../auth/Logout";
-
-type IUser = {
-  id: number;
-  email: string;
-  avatar: string;
-};
+import { Logout } from "../auth/Logout";
+import { IUser } from "../../interfaces";
 
 export const Header: React.FC<RefineThemedLayoutV2HeaderProps> = ({
   sticky = true,
@@ -50,7 +45,7 @@ export const Header: React.FC<RefineThemedLayoutV2HeaderProps> = ({
               {mode === "dark" ? <LightModeOutlined /> : <DarkModeOutlined />}
             </IconButton>
 
-            {(user?.avatar || user?.email) && (
+            {(user?.email) && (
               <Stack
                 direction="row"
                 gap="16px"
@@ -70,7 +65,7 @@ export const Header: React.FC<RefineThemedLayoutV2HeaderProps> = ({
                     {user?.email}
                   </Typography>
                 )}
-                <Avatar src={user?.avatar} alt={user?.email} />
+                <Avatar src={"user?.avatar"} alt={user?.email} />
                 <Logout />
               </Stack>
             )}