mirrors/cinny
1
0
Fork 0
mirror of https://github.com/cinnyapp/cinny.git synced 2025-11-14 19:20:28 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Improve spoilered image UX with autoload off

Browse source
This commit is contained in:
Ginger 2025-02-19 10:34:57 -05:00
parent 6af25c5cfe
commit 597c05b86d
1 changed files with 10 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

14
src/app/components/message/content/ImageContent.tsx
View file

@ -151,7 +151,7 @@ export const ImageContent = as<'div', ImageContentProps>(
punch={1}
/>
)}
{!autoPlay && srcState.status === AsyncStatus.Idle && (
{!autoPlay && !markedAsSpoiler && srcState.status === AsyncStatus.Idle && (
<Box className={css.AbsoluteContainer} alignItems="Center" justifyContent="Center">
<Button
variant="Secondary"
@ -178,7 +178,7 @@ export const ImageContent = as<'div', ImageContentProps>(
})}
</Box>
)}
{srcState.status === AsyncStatus.Success && blurred && (
{blurred && (
<Box className={css.AbsoluteContainer} alignItems="Center" justifyContent="Center">
<TooltipProvider
tooltip={
@ -198,7 +198,12 @@ export const ImageContent = as<'div', ImageContentProps>(
radii="Pill"
size="500"
outlined
onClick={() => setBlurred(false)}
onClick={() => {
setBlurred(false);
if (srcState.status === AsyncStatus.Idle) {
loadSrc();
}
}}
>
<Text size="B300">Spoiler</Text>
</Chip>
@ -207,7 +212,8 @@ export const ImageContent = as<'div', ImageContentProps>(
</Box>
)}
{(srcState.status === AsyncStatus.Loading || srcState.status === AsyncStatus.Success) &&
!load && (
!load &&
!markedAsSpoiler && (
<Box className={css.AbsoluteContainer} alignItems="Center" justifyContent="Center">
<Spinner variant="Secondary" />
</Box>