Skip to content

Commit ca947c8

Browse files
authored
fix: Fit the OGMessage Thumbnail Image to the minimal width length (#859)
### Fix * Add width:100% to the ImageRenderer of OGMessage ### ChangeLog * Fit the OGMessage Thumbnail Image to the minimal width length
1 parent eeebbdc commit ca947c8

File tree

2 files changed

+6
-6
lines changed

2 files changed

+6
-6
lines changed

src/ui/OGMessageItemBody/__tests__/__snapshots__/OGMessageItemBody.spec.js.snap

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,11 +21,11 @@ exports[`ui/OGMessageItemBody should do a snapshot test of the OGMessageItemBody
2121
>
2222
<div
2323
class="sendbird-og-message-item-body__og-thumbnail__image sendbird-image-renderer"
24-
style="width: 100%; min-width: min(400px, 400px); max-width: 400px;"
24+
style="width: 100%; min-width: min(400px, 100%); max-width: 400px;"
2525
>
2626
<div
2727
class="sendbird-image-renderer__image"
28-
style="width: 100%; min-width: min(400px, 400px); max-width: 400px; position: absolute; background-repeat: no-repeat; background-position: center; background-size: cover; background-image: url();"
28+
style="width: 100%; min-width: min(400px, 100%); max-width: 400px; position: absolute; background-repeat: no-repeat; background-position: center; background-size: cover; background-image: url();"
2929
/>
3030
<img
3131
alt=""

src/ui/OGMessageItemBody/index.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -87,6 +87,10 @@ export default function OGMessageItemBody({
8787
onClick={openOGUrl}
8888
>
8989
<ImageRenderer
90+
className="sendbird-og-message-item-body__og-thumbnail__image"
91+
url={message?.ogMetaData?.defaultImage?.url || ''}
92+
alt={message?.ogMetaData?.defaultImage?.alt}
93+
width="100%"
9094
onLoad={onMessageHeightChange}
9195
onError={() => {
9296
try {
@@ -95,10 +99,6 @@ export default function OGMessageItemBody({
9599
// do nothing
96100
}
97101
}}
98-
className="sendbird-og-message-item-body__og-thumbnail__image"
99-
url={message?.ogMetaData?.defaultImage?.url || ''}
100-
alt={message?.ogMetaData?.defaultImage?.alt}
101-
// TODO: Change fixing width and height lengths
102102
defaultComponent={(
103103
<div className="sendbird-og-message-item-body__og-thumbnail__place-holder">
104104
<Icon

0 commit comments

Comments
 (0)