[UXIT-3731][UI-Filecoin] Create shared MarkdownImage [skip percy]#2140
[UXIT-3731][UI-Filecoin] Create shared MarkdownImage [skip percy]#2140barbaraperic wants to merge 7 commits intomainfrom
Conversation
…downImage component for improved image handling in MarkdownContent. This change enhances the rendering of images with error handling for missing src attributes.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
3 Skipped Deployments
|
There was a problem hiding this comment.
Pull request overview
This PR introduces a new MarkdownImage component in the ui-filecoin library to handle markdown images with standardized formatting. The component provides consistent image rendering with a fixed 16:9 aspect ratio, optimized quality settings, and responsive sizing.
Changes:
- Added
MarkdownImagecomponent with configurable dimensions (672px × 378px, 16:9 ratio) - Integrated custom image renderer into
MarkdownContentcomponent - Bumped
@filecoin-foundation/ui-filecoinpackage version from 0.7.2 to 0.7.4
Reviewed changes
Copilot reviewed 2 out of 3 changed files in this pull request and generated 3 comments.
| File | Description |
|---|---|
| packages/ui-filecoin/src/components/Markdown/MarkdownImage.tsx | New component for rendering markdown images with standardized sizing and error handling |
| packages/ui-filecoin/src/components/Markdown/MarkdownContent.tsx | Integrated MarkdownImage as custom img renderer |
| package-lock.json | Updated package version references for ui-filecoin dependency |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
…ving unnecessary props from the img element.
…dationWeb/filecoin-foundation into bp/markdown-image-component
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 2 out of 3 changed files in this pull request and generated 3 comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
packages/ui-filecoin/src/components/Markdown/MarkdownContent.tsx
Outdated
Show resolved
Hide resolved
…improved image rendering and simplify props in MarkdownContent component by removing unused parameters from the img element.
CharlyMartin
left a comment
There was a problem hiding this comment.
Barbara, is this missing a changetset to re-publish the package?
| import { buildImageSizeProp } from '../../utils/buildImageSizeProp' | ||
|
|
||
| const IMAGE_DIMENSIONS = { | ||
| containerWidth: 672, |
There was a problem hiding this comment.
I forgot why we set this value here? Why is it hard-coded to 672?
📝 Description
This PR introduces a new
MarkdownImagecomponent inui-filecoinlibrary, used inMarkdownContentto handle all markdown images through a custom renderer.Bumped
@filecoin-foundation/ui-filecointo version0.7.4🛠️ Key Changes
Configured images with:
buildImageSizeProp📸 Screenshots