avatar: new upload + remove avatar, and placeholder with colour and initials

packages/frontend/src/components/small-user-display.tsx

@@ -4,7 +4,13 @@ import Avatar from "@/components/avatar";
 export default function SmallUserDisplay({ user }: { user: UserRecord }) {
     return (
         <div className="flex gap-2 items-center">
-            <Avatar user={user} size={6} />
+            <Avatar
+                name={user.name}
+                username={user.username}
+                avatarURL={user.avatarURL}
+                size={6}
+                textClass="text-xs"
+            />
             {user.name}
         </div>
     );