Skip to content

Commit

Permalink
fix(components): πŸ› Ensure Image component updates on src prop change
Browse files Browse the repository at this point in the history
- Add useEffect hook to reset `imageSrc`, `hasAttemptedFallback`, and `imageLoaded` states upon `src` prop change. This ensures the component properly handles new image sources and attempts to load the fallback image only when necessary.
- Improve responsiveness of the Image component to prop updates, enhancing its versatility in dynamic UIs where image sources may change.
  • Loading branch information
Zyruks authored and serudda committed Mar 23, 2024
1 parent fd88b5f commit 1a570ae
Showing 1 changed file with 5 additions and 0 deletions.
5 changes: 5 additions & 0 deletions src/components/Image/Image.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -96,6 +96,11 @@ export const Image = React.forwardRef<HTMLImageElement, ImageProps>(
className,
);

useEffect(() => {
setImageSrc(src);
setHasAttemptedFallback(false);
}, [src]);

useEffect(() => {
setIsValidSrc(Boolean(imageSrc));
}, [imageSrc]);
Expand Down

0 comments on commit 1a570ae

Please sign in to comment.