From f106a0154a9e29e5c3abb52ec52d0fea90cb2a30 Mon Sep 17 00:00:00 2001
From: Thomas Belin <thomasbelin4@gmail.com>
Date: Tue, 19 Mar 2024 10:58:24 +0100
Subject: [PATCH] fix: Improve link preview image display (#17100)

---
 .../ContentMessage/asset/LinkPreviewAssetComponent.tsx     | 7 ++++++-
 src/style/components/asset/link-preview-asset.less         | 3 ++-
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/script/components/MessagesList/Message/ContentMessage/asset/LinkPreviewAssetComponent.tsx b/src/script/components/MessagesList/Message/ContentMessage/asset/LinkPreviewAssetComponent.tsx
index 9439131d2d7..d26b84a5f85 100644
--- a/src/script/components/MessagesList/Message/ContentMessage/asset/LinkPreviewAssetComponent.tsx
+++ b/src/script/components/MessagesList/Message/ContentMessage/asset/LinkPreviewAssetComponent.tsx
@@ -93,7 +93,12 @@ const LinkPreviewAsset: React.FC<LinkPreviewAssetProps> = ({header = false, mess
     >
       <div className="link-preview-image-container">
         {preview && previewImage ? (
-          <Image className="link-preview-image" image={previewImage} data-uie-name="link-preview-image" />
+          <Image
+            className="link-preview-image"
+            imageStyles={{height: '100%', objectFit: 'cover', objectPosition: 'center'}}
+            image={previewImage}
+            data-uie-name="link-preview-image"
+          />
         ) : (
           <div className="link-preview-image-placeholder icon-link" />
         )}
diff --git a/src/style/components/asset/link-preview-asset.less b/src/style/components/asset/link-preview-asset.less
index 2bdedc3c910..08d7936a046 100644
--- a/src/style/components/asset/link-preview-asset.less
+++ b/src/style/components/asset/link-preview-asset.less
@@ -18,7 +18,7 @@
  */
 
 // variables
-@link-preview-height: 88px;
+@link-preview-height: 5.5rem;
 
 .link-preview-asset {
   .asset-container-style;
@@ -33,6 +33,7 @@
 
 .link-preview-image-container {
   width: @link-preview-height;
+  height: @link-preview-height;
   flex: 0 0 auto;
   background-color: var(--foreground-fade-24);
 }