From e7ad2ea63b467c3989e0fc67ab4f099111234e34 Mon Sep 17 00:00:00 2001
From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com>
Date: Wed, 11 Sep 2024 16:03:45 +0000
Subject: [PATCH] [autofix.ci] apply automated fixes

---
 apps/www/components/image-with-blur.tsx |  2 +-
 apps/www/components/mdx-content.tsx     | 23 +++++++++++++++++------
 2 files changed, 18 insertions(+), 7 deletions(-)

diff --git a/apps/www/components/image-with-blur.tsx b/apps/www/components/image-with-blur.tsx
index c267efbd6e..0363169cd2 100644
--- a/apps/www/components/image-with-blur.tsx
+++ b/apps/www/components/image-with-blur.tsx
@@ -8,4 +8,4 @@ export const ImageWithBlur: React.FC<ImageProps> = (props) => {
       blurDataURL="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8+e1bKQAJMQNc5W2CQwAAAABJRU5ErkJggg=="
     />
   );
-};
\ No newline at end of file
+};
diff --git a/apps/www/components/mdx-content.tsx b/apps/www/components/mdx-content.tsx
index e4fc138619..46982d4220 100644
--- a/apps/www/components/mdx-content.tsx
+++ b/apps/www/components/mdx-content.tsx
@@ -1,19 +1,30 @@
 import { useMDXComponent } from "@content-collections/mdx/react";
 import type { ImageProps } from "next/image";
+import Image from "next/image";
 import type { DetailedHTMLProps, ImgHTMLAttributes, JSX } from "react";
 import { BlogCodeBlock, BlogCodeBlockSingle } from "./blog/blog-code-block";
 import { BlogList, BlogListItem, BlogListNumbered, type BlogListProps } from "./blog/blog-list";
 import { BlogQuote, type BlogQuoteProps } from "./blog/blog-quote";
 import { ImageWithBlur } from "./image-with-blur";
 import { Alert } from "./ui/alert/alert";
-import Image from "next/image";
-
-
 
 export const MdxComponents = {
-  Image: (props: ImageProps) => props.width || props.fill ? <Image {...props} placeholder="blur"
-      blurDataURL="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8+e1bKQAJMQNc5W2CQwAAAABJRU5ErkJggg=="/> : <Image {...props} placeholder="blur" width={1920} height={1080}
-      blurDataURL="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8+e1bKQAJMQNc5W2CQwAAAABJRU5ErkJggg=="/>,
+  Image: (props: ImageProps) =>
+    props.width || props.fill ? (
+      <Image
+        {...props}
+        placeholder="blur"
+        blurDataURL="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8+e1bKQAJMQNc5W2CQwAAAABJRU5ErkJggg=="
+      />
+    ) : (
+      <Image
+        {...props}
+        placeholder="blur"
+        width={1920}
+        height={1080}
+        blurDataURL="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8+e1bKQAJMQNc5W2CQwAAAABJRU5ErkJggg=="
+      />
+    ),
   img: (props: DetailedHTMLProps<ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>) => (
     <img src={props.src} alt={props.src} />
   ),