From 9682a3d026c2814fc471c35d5f2b342881a158ed Mon Sep 17 00:00:00 2001 From: Martin Rohrmeier <martin.ra.rohrmeier@bmw.de> Date: Tue, 30 Jan 2024 11:48:56 +0100 Subject: [PATCH] fix(image): render image with loader when specified --- CHANGELOG.md | 4 ++++ package.json | 2 +- src/components/basic/Image/index.tsx | 15 ++++++++++++--- 3 files changed, 17 insertions(+), 4 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index f8a9d47f..c0ed229e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,9 @@ # Changelog +## 2.1.23 + +- Render images directly with loader when specified + ## 2.1.22 - Select list default value functionality fix diff --git a/package.json b/package.json index dfe2a6d4..48b716f6 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@catena-x/portal-shared-components", - "version": "2.1.22", + "version": "2.1.23", "description": "Catena-X Portal Shared Components", "author": "Catena-X Contributors", "license": "Apache-2.0", diff --git a/src/components/basic/Image/index.tsx b/src/components/basic/Image/index.tsx index c3b7f7de..ac68eab9 100644 --- a/src/components/basic/Image/index.tsx +++ b/src/components/basic/Image/index.tsx @@ -1,6 +1,5 @@ /******************************************************************************** - * Copyright (c) 2021, 2023 BMW Group AG - * Copyright (c) 2021, 2023 Contributors to the Eclipse Foundation + * Copyright (c) 2021, 2024 Contributors to the Eclipse Foundation * * See the NOTICE file(s) distributed with this work for additional * information regarding copyright ownership. @@ -69,13 +68,23 @@ export const Image = ({ src, alt, style, loader }: ImageProps): JSX.Element => { } }, [src, loader]) + const renderByLoader = () => { + setLoad(true) + getData().catch((e) => { + setError(true) + }) + return <img src={LogoGrayData} alt={alt ?? 'Catena-X'} /> + } + useEffect(() => { setError(false) setLoad(false) setData(src) }, [src]) - return ( + return loader ? ( + renderByLoader() + ) : ( <img src={!load && !error && src.startsWith('blob:') ? src : data} alt={alt ?? 'Catena-X'}