feat(ui): init image tweaks

This commit is contained in:
psychedelicious
2023-04-30 15:40:47 +10:00
parent deae5fbaec
commit c8fe12cd91
4 changed files with 10 additions and 57 deletions

View File

@@ -17,7 +17,7 @@ import { ImageType } from 'services/api';
import ImageToImageOverlay from 'common/components/ImageToImageOverlay';
import { initialImageSelector } from 'features/parameters/store/generationSelectors';
const initialImagePreviewSelector = createSelector(
const selector = createSelector(
[initialImageSelector],
(initialImage) => {
return {
@@ -31,7 +31,7 @@ const InitialImagePreview = () => {
const isImageToImageEnabled = useAppSelector(
(state: RootState) => state.generation.isImageToImageEnabled
);
const { initialImage } = useAppSelector(initialImagePreviewSelector);
const { initialImage } = useAppSelector(selector);
const { getUrl } = useGetUrl();
const dispatch = useAppDispatch();
const { t } = useTranslation();
@@ -113,12 +113,7 @@ const InitialImagePreview = () => {
</Flex>
}
/>
{isLoaded && (
<ImageToImageOverlay
setIsLoaded={setIsLoaded}
image={initialImage}
/>
)}
{isLoaded && <ImageToImageOverlay image={initialImage} />}
</Box>
)}
{!initialImage?.url && <SelectImagePlaceholder />}

View File

@@ -15,9 +15,9 @@ const AnimatedImageToImagePanel = () => {
<AnimatePresence>
{isImageToImageEnabled && (
<motion.div
initial={{ opacity: 0, scaleX: 0, width: 0 }}
animate={{ opacity: 1, scaleX: 1, width: '28rem' }}
exit={{ opacity: 0, scaleX: 0, width: 0 }}
initial={{ opacity: 0, scale: 0, width: 0 }}
animate={{ opacity: 1, scale: 1, width: '28rem' }}
exit={{ opacity: 0, scale: 0, width: 0 }}
transition={{ type: 'spring', bounce: 0, duration: 0.35 }}
>
<Box sx={{ h: 'full', w: 'full', pl: 4 }}>