From e520f91df187be993f8583a97a6c7e5fd7a78071 Mon Sep 17 00:00:00 2001
From: Ajay Bura <32841439+ajbura@users.noreply.github.com>
Date: Mon, 30 Oct 2023 10:25:07 +0530
Subject: [PATCH] render blurhash in small size

---
 src/app/organisms/room/message/ImageContent.tsx | 8 +++++++-
 src/app/organisms/room/message/VideoContent.tsx | 8 +++++++-
 2 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/src/app/organisms/room/message/ImageContent.tsx b/src/app/organisms/room/message/ImageContent.tsx
index c8b32cc1..6e288026 100644
--- a/src/app/organisms/room/message/ImageContent.tsx
+++ b/src/app/organisms/room/message/ImageContent.tsx
@@ -98,7 +98,13 @@ export const ImageContent = as<'div', ImageContentProps>(
           </Overlay>
         )}
         {typeof blurHash === 'string' && !load && (
-          <BlurhashCanvas style={{ width: '100%', height: '100%' }} hash={blurHash} punch={1} />
+          <BlurhashCanvas
+            style={{ width: '100%', height: '100%' }}
+            width={32}
+            height={32}
+            hash={blurHash}
+            punch={1}
+          />
         )}
         {!autoPlay && srcState.status === AsyncStatus.Idle && (
           <Box className={css.AbsoluteContainer} alignItems="Center" justifyContent="Center">
diff --git a/src/app/organisms/room/message/VideoContent.tsx b/src/app/organisms/room/message/VideoContent.tsx
index 107d5f9a..8b3bd34d 100644
--- a/src/app/organisms/room/message/VideoContent.tsx
+++ b/src/app/organisms/room/message/VideoContent.tsx
@@ -88,7 +88,13 @@ export const VideoContent = as<'div', VideoContentProps>(
     return (
       <Box className={classNames(css.RelativeBase, className)} {...props} ref={ref}>
         {typeof blurHash === 'string' && !load && (
-          <BlurhashCanvas style={{ width: '100%', height: '100%' }} hash={blurHash} punch={1} />
+          <BlurhashCanvas
+            style={{ width: '100%', height: '100%' }}
+            width={32}
+            height={32}
+            hash={blurHash}
+            punch={1}
+          />
         )}
         {thumbSrcState.status === AsyncStatus.Success && !load && (
           <Box className={css.AbsoluteContainer} alignItems="Center" justifyContent="Center">