update default avatar

src/shared/image.tsx

@@ -1,17 +1,27 @@
-import { ImgHTMLAttributes } from 'react';
+import { minidenticon } from 'minidenticons';
+import { ImgHTMLAttributes, useState } from 'react';
+import { useMemo } from 'react';
 
-interface Props extends ImgHTMLAttributes<any> {
-  fallback: string;
-}
+export function Image({ src, ...props }: ImgHTMLAttributes<HTMLImageElement>) {
+  const [isError, setIsError] = useState(false);
+
+  if (isError || !src) {
+    const svgURI = useMemo(
+      () =>
+        'data:image/svg+xml;utf8,' + encodeURIComponent(minidenticon(props.alt, 90, 50)),
+      [props.alt]
+    );
+    return (
+      <img src={svgURI} alt={props.alt} {...props} style={{ backgroundColor: '#000' }} />
+    );
+  }
 
-export function Image({ src, fallback, ...props }: Props) {
   return (
     <img
       {...props}
-      src={src || fallback}
-      onError={({ currentTarget }) => {
-        currentTarget.onerror = null;
-        currentTarget.src = fallback;
+      src={src}
+      onError={() => {
+        setIsError(true);
       }}
       decoding="async"
       alt="lume default img"