Убрана темная подолжка у фотографий

This commit is contained in:
RoyceDa
2026-02-18 20:30:07 +02:00
parent 4248abc629
commit 2692c941e1

View File

@@ -18,7 +18,7 @@ export function MessageImage(props: AttachmentProps) {
download, download,
downloadStatus, downloadStatus,
getBlob, getBlob,
getPreview} = useAttachment(props.attachment, props.chacha_key_plain); getPreview } = useAttachment(props.attachment, props.chacha_key_plain);
const mainRef = useRef<HTMLDivElement>(null); const mainRef = useRef<HTMLDivElement>(null);
const error = downloadStatus == DownloadStatus.ERROR; const error = downloadStatus == DownloadStatus.ERROR;
const { open } = useImageViewer(); const { open } = useImageViewer();
@@ -55,7 +55,6 @@ export function MessageImage(props: AttachmentProps) {
return; return;
} }
} }
console.info(downloadStatus);
return ( return (
<AspectRatio onClick={onClick} ref={mainRef} style={{ <AspectRatio onClick={onClick} ref={mainRef} style={{
minWidth: 200, minWidth: 200,
@@ -85,8 +84,34 @@ export function MessageImage(props: AttachmentProps) {
objectFit: 'cover', objectFit: 'cover',
border: '1px solid ' + colors.borderColor border: '1px solid ' + colors.borderColor
}} src={/*block render???*/blurhashToBase64Image(preview, 200, 220)}></img> }} src={/*block render???*/blurhashToBase64Image(preview, 200, 220)}></img>
<Overlay center h={'100%'} radius={8} opacity={1} color="transparent"> </>
<Flex direction={'column'} pos={'absolute'} top={0} justify={'center'} h={'100%'} align={'center'} gap={'xs'}> )}
{(props.delivered == DeliveredMessageState.WAITING && uploadedPercentage > 0 && isMessageDeliveredByTime(props.timestamp || 0, props.attachments.length)) &&
<Portal target={mainRef.current!}>
<Flex direction={'column'} pos={'absolute'} justify={'center'} top={0} h={'100%'} align={'center'} gap={'xs'}>
<Box style={{
backgroundColor: 'rgba(0, 0, 0, 0.3)',
borderRadius: 50,
height: 40,
width: 40,
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
}}>
<AnimatedRoundedProgress size={40} value={uploadedPercentage > 95 ? 95 : uploadedPercentage}></AnimatedRoundedProgress>
</Box>
</Flex>
</Portal>}
{(props.delivered == DeliveredMessageState.ERROR || (props.delivered != DeliveredMessageState.DELIVERED &&
!isMessageDeliveredByTime(props.timestamp || 0, props.attachments.length)
)) && (
<Overlay center h={'100%'} radius={8} color="#000" opacity={0.85}>
<IconCircleX size={40} color={colors.error} />
</Overlay>
)}
{(downloadStatus == DownloadStatus.NOT_DOWNLOADED || downloadStatus == DownloadStatus.DOWNLOADING) && (<Flex direction={'column'} pos={'absolute'} top={0} justify={'center'} h={'100%'} align={'center'} gap={'xs'}>
{!error && ( {!error && (
<Box style={{ <Box style={{
backgroundColor: 'rgba(0, 0, 0, 0.3)', backgroundColor: 'rgba(0, 0, 0, 0.3)',
@@ -121,34 +146,7 @@ export function MessageImage(props: AttachmentProps) {
}} color={'white'} /> }} color={'white'} />
</Box> </Box>
)} )}
</Flex> </Flex>)}
</Overlay>
</>
)}
{(props.delivered == DeliveredMessageState.WAITING && uploadedPercentage > 0 && isMessageDeliveredByTime(props.timestamp || 0, props.attachments.length)) &&
<Portal target={mainRef.current!}>
<Flex direction={'column'} pos={'absolute'} justify={'center'} top={0} h={'100%'} align={'center'} gap={'xs'}>
<Box style={{
backgroundColor: 'rgba(0, 0, 0, 0.3)',
borderRadius: 50,
height: 40,
width: 40,
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
}}>
<AnimatedRoundedProgress size={40} value={uploadedPercentage > 95 ? 95 : uploadedPercentage}></AnimatedRoundedProgress>
</Box>
</Flex>
</Portal>}
{(props.delivered == DeliveredMessageState.ERROR || (props.delivered != DeliveredMessageState.DELIVERED &&
!isMessageDeliveredByTime(props.timestamp || 0, props.attachments.length)
)) && (
<Overlay center h={'100%'} radius={8} color="#000" opacity={0.85}>
<IconCircleX size={40} color={colors.error} />
</Overlay>
)}
</AspectRatio> </AspectRatio>
); );
} }