u

src/components/UserMenu.jsx

@@ -81,6 +81,16 @@ class UserMenu extends PureComponent {
     const { user, anchorEl, settingsOpen, numbersOpen } = this.state;
     const open = Boolean(anchorEl);
 
+    const pictureSrc = (() => {
+      const pic = user?.picture;
+      if (!pic || typeof pic !== 'string') return undefined;
+      if (pic.startsWith('http://') || pic.startsWith('https://') || pic.startsWith('data:')) {
+        return pic;
+      }
+      const mime = pic.startsWith('/9j/') ? 'image/jpeg' : 'image/png';
+      return `data:${mime};base64,${pic}`;
+    })();
+
     return (
       <>
         <Box sx={{ px: 1.5, py: 1.5, alignSelf: 'flex-start' }}>
@@ -89,7 +99,7 @@ class UserMenu extends PureComponent {
             onMouseDown={(e) => e.preventDefault()}
             sx={{ p: 0, width: 32, height: 32, borderRadius: '50%' }}
           >
-            <Avatar src={user?.picture} alt={user?.email} sx={{ width: 32, height: 32 }}>
+            <Avatar src={pictureSrc} alt={user?.email} sx={{ width: 32, height: 32 }}>
               {user?.email?.[0]?.toUpperCase()}
             </Avatar>
           </IconButton>