fix(ui): fix "no image" fallbacks

This commit is contained in:
psychedelicious 2023-05-13 21:15:19 +10:00
parent 0e9470503f
commit 6d3e8507cc
2 changed files with 13 additions and 4 deletions

View File

@ -4,10 +4,10 @@ import { useAppSelector } from 'app/store/storeHooks';
import { systemSelector } from 'features/system/store/systemSelectors';
import { isEqual } from 'lodash-es';
import { MdPhoto } from 'react-icons/md';
import { selectedImageSelector } from '../store/gallerySelectors';
import CurrentImageButtons from './CurrentImageButtons';
import CurrentImagePreview from './CurrentImagePreview';
import { FaImage } from 'react-icons/fa';
export const currentImageDisplaySelector = createSelector(
[systemSelector, selectedImageSelector],
@ -61,7 +61,7 @@ const CurrentImageDisplay = () => {
</>
) : (
<Icon
as={MdPhoto}
as={FaImage}
sx={{
boxSize: 24,
color: 'base.500',

View File

@ -1,4 +1,4 @@
import { Flex, Image } from '@chakra-ui/react';
import { Flex, Icon, Image } from '@chakra-ui/react';
import { createSelector } from '@reduxjs/toolkit';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import SelectImagePlaceholder from 'common/components/SelectImagePlaceholder';
@ -13,6 +13,7 @@ import { generationSelector } from 'features/parameters/store/generationSelector
import { initialImageSelected } from 'features/parameters/store/actions';
import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
import ImageFallbackSpinner from 'features/gallery/components/ImageFallbackSpinner';
import { FaImage } from 'react-icons/fa';
const selector = createSelector(
[generationSelector],
@ -83,7 +84,15 @@ const InitialImagePreview = () => {
<ImageMetadataOverlay image={initialImage} />
</>
)}
{!initialImage?.url && <SelectImagePlaceholder />}
{!initialImage?.url && (
<Icon
as={FaImage}
sx={{
boxSize: 24,
color: 'base.500',
}}
/>
)}
</Flex>
);
};