...

2 files changed, 11 insertions, 12 deletions

diff --git a/FrontEnd/src/app/views/common/AppBar.tsx b/FrontEnd/src/app/views/common/AppBar.tsx
index d0e39f98..e682a308 100644
--- a/FrontEnd/src/app/views/common/AppBar.tsx
+++ b/FrontEnd/src/app/views/common/AppBar.tsx
@@ -4,14 +4,13 @@ import { LinkContainer } from "react-router-bootstrap";
 import { Navbar, Nav } from "react-bootstrap";
 import { NavLink } from "react-router-dom";
 
-import { useUser, useAvatar } from "@/services/user";
+import { useUser } from "@/services/user";
 
 import TimelineLogo from "./TimelineLogo";
-import BlobImage from "./BlobImage";
+import UserAvatar from "./user/UserAvatar";
 
 const AppBar: React.FC = (_) => {
   const user = useUser();
-  const avatar = useAvatar(user?.username);
 
   const { t } = useTranslation();
 
@@ -70,10 +69,9 @@ const AppBar: React.FC = (_) => {
         <Nav className="ml-auto mr-2 align-items-center">
           {user != null ? (
             <LinkContainer to={`/users/${user.username}`}>
-              <BlobImage
+              <UserAvatar
+                username={user.username}
                 className="avatar small rounded-circle bg-white cursor-pointer ml-auto"
-                onClick={collapse}
-                blob={avatar}
               />
             </LinkContainer>
           ) : (
diff --git a/FrontEnd/src/app/views/common/user/UserAvatar.tsx b/FrontEnd/src/app/views/common/user/UserAvatar.tsx
index 73273298..9e822528 100644
--- a/FrontEnd/src/app/views/common/user/UserAvatar.tsx
+++ b/FrontEnd/src/app/views/common/user/UserAvatar.tsx
@@ -1,8 +1,6 @@
 import React from "react";
 
-import { useAvatar } from "@/services/user";
-
-import BlobImage from "../BlobImage";
+import { getHttpUserClient } from "@/http/user";
 
 export interface UserAvatarProps
   extends React.ImgHTMLAttributes<HTMLImageElement> {
@@ -10,9 +8,12 @@ export interface UserAvatarProps
 }
 
 const UserAvatar: React.FC<UserAvatarProps> = ({ username, ...otherProps }) => {
-  const avatar = useAvatar(username);
-
-  return <BlobImage blob={avatar} {...otherProps} />;
+  return (
+    <img
+      src={getHttpUserClient().generateAvatarUrl(username)}
+      {...otherProps}
+    />
+  );
 };
 
 export default UserAvatar;