feat: introduce firebase authentication

packages/web/src/components/AppIcon/index.tsx

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import Avatar from '@mui/material/Avatar';
 
 type AppIconProps = {
@@ -6,11 +7,22 @@ type AppIconProps = {
   color?: string;
 };
 
+const inlineImgStyle: React.CSSProperties = {
+  objectFit: 'contain',
+};
+
 export default function AppIcon(props: AppIconProps) {
   const { name, url } = props;
   const color = url ? 'white' : props.color
-  
+
   return (
-    <Avatar component="span" variant="square" sx={{ bgcolor: `#${color}` }} src={url} alt={name} />
+    <Avatar
+      component="span"
+      variant="square"
+      sx={{ bgcolor: `#${color}` }}
+      imgProps={{ style: inlineImgStyle }}
+      src={url}
+      alt={name}
+    />
   );
 };