mirror of
https://github.com/OpenNebula/one.git
synced 2025-03-16 22:50:10 +03:00
F OpenNebula/one#5422: Add new prop to image component
This commit is contained in:
parent
da048e2300
commit
26cb29c1fb
@ -66,7 +66,12 @@ const ProvisionCard = memo(
|
||||
isSelected={isSelected}
|
||||
mediaProps={{
|
||||
component: 'div',
|
||||
children: <Image src={imageUrl} withSources={image && !isExternalImage} />
|
||||
children: (
|
||||
<Image
|
||||
src={imageUrl}
|
||||
withSources={image && !isExternalImage}
|
||||
/>
|
||||
)
|
||||
}}
|
||||
subheader={`#${ID}`}
|
||||
title={NAME}
|
||||
|
@ -47,7 +47,12 @@ const ProvisionTemplateCard = memo(
|
||||
isSelected={isSelected}
|
||||
mediaProps={{
|
||||
component: 'div',
|
||||
children: <Image src={imageUrl} withSources={image && !isExternalImage} />
|
||||
children: (
|
||||
<Image
|
||||
src={imageUrl}
|
||||
withSources={image && !isExternalImage}
|
||||
/>
|
||||
)
|
||||
}}
|
||||
subheader={description}
|
||||
title={name}
|
||||
|
@ -29,19 +29,15 @@ const INITIAL_STATE = { fail: false, retries: 0 }
|
||||
* @param {string} props.imgProps - Properties to image element
|
||||
* @returns {React.JSXElementConstructor} Picture with all images format
|
||||
*/
|
||||
const Image = memo(({ src = DEFAULT_IMAGE, withSources, imgProps }) => {
|
||||
const Image = memo(({ src, imageInError, withSources, imgProps }) => {
|
||||
const [error, setError] = useState(INITIAL_STATE)
|
||||
|
||||
/**
|
||||
* Increment retries by one in error state.
|
||||
*/
|
||||
/** Increment retries by one in error state. */
|
||||
const addRetry = () => {
|
||||
setError(prev => ({ ...prev, retries: prev.retries + 1 }))
|
||||
}
|
||||
|
||||
/**
|
||||
* Set failed state.
|
||||
*/
|
||||
/** Set failed state. */
|
||||
const onImageFail = () => {
|
||||
setError(prev => ({ fail: true, retries: prev.retries + 1 }))
|
||||
}
|
||||
@ -51,7 +47,7 @@ const Image = memo(({ src = DEFAULT_IMAGE, withSources, imgProps }) => {
|
||||
}
|
||||
|
||||
if (error.fail) {
|
||||
return <img src={DEFAULT_IMAGE} draggable={false} onError={addRetry} />
|
||||
return <img src={imageInError} draggable={false} onError={addRetry} />
|
||||
}
|
||||
|
||||
return (
|
||||
@ -69,6 +65,7 @@ const Image = memo(({ src = DEFAULT_IMAGE, withSources, imgProps }) => {
|
||||
|
||||
Image.propTypes = {
|
||||
src: PropTypes.string,
|
||||
imageInError: PropTypes.string,
|
||||
withSources: PropTypes.bool,
|
||||
imgProps: PropTypes.shape({
|
||||
decoding: PropTypes.oneOf(['sync', 'async', 'auto']),
|
||||
@ -79,6 +76,7 @@ Image.propTypes = {
|
||||
|
||||
Image.defaultProps = {
|
||||
src: undefined,
|
||||
imageInError: DEFAULT_IMAGE,
|
||||
withSources: false,
|
||||
imgProps: {
|
||||
decoding: 'async',
|
||||
|
Loading…
x
Reference in New Issue
Block a user