website refactor

apps/website/components/shared/SafeImage.tsx

@@ -0,0 +1,24 @@
+import React, { useState } from 'react';
+import { Image as UiImage } from '@/ui/Image';
+
+interface SafeImageProps extends React.ComponentProps<typeof UiImage> {
+  fallbackComponent?: React.ReactNode;
+}
+
+export function SafeImage({ fallbackComponent, ...props }: SafeImageProps) {
+  const [error, setError] = useState(false);
+
+  if (error && fallbackComponent) {
+    return <>{fallbackComponent}</>;
+  }
+
+  return (
+    <UiImage
+      {...props}
+      onError={(e) => {
+        setError(true);
+        props.onError?.(e);
+      }}
+    />
+  );
+}