matty/ncd-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

pl-fe: fix upload preview for videos on no static preview

Browse Source 
Signed-off-by: nicole mikołajczyk <git@mkljczk.pl>
This commit is contained in:
nicole mikołajczyk
2026-02-05 23:50:58 +01:00
parent 934f7913f0
commit b5a388fb75
1 changed files with 5 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
packages/pl-fe/src/components/upload.tsx
View File

@ -159,6 +159,9 @@ const Upload: React.FC<IUpload> = ({
/> />
); );
const backgroundImage = (mediaType === 'image' || ['.png', '.jpg', '.jpeg'].some(ext => media.preview_url.endsWith(ext))) ? `url(${media.preview_url})` : undefined;
const hasBackgroundImage = !!(backgroundImage);
return ( return (
<div <div
className='relative m-[5px] min-w-[40%] flex-1 overflow-hidden rounded' className='relative m-[5px] min-w-[40%] flex-1 overflow-hidden rounded'
@ -174,7 +177,7 @@ const Upload: React.FC<IUpload> = ({
className={clsx('compose-form__upload-thumbnail relative h-40 w-full overflow-hidden bg-contain bg-center bg-no-repeat', mediaType)} className={clsx('compose-form__upload-thumbnail relative h-40 w-full overflow-hidden bg-contain bg-center bg-no-repeat', mediaType)}
style={{ style={{
scale: styles.scale, scale: styles.scale,
backgroundImage: mediaType === 'image' ? `url(${media.preview_url})` : undefined, backgroundImage,
backgroundPosition: typeof x === 'number' && typeof y === 'number' ? `${x}% ${y}%` : undefined, backgroundPosition: typeof x === 'number' && typeof y === 'number' ? `${x}% ${y}%` : undefined,
}} }}
> >
@ -226,7 +229,7 @@ const Upload: React.FC<IUpload> = ({
)} )}
</HStack> </HStack>
<div className='absolute inset-0 z-[-1] size-full'> <div className={clsx('absolute inset-0 size-full', { 'z-[-1]': hasBackgroundImage })}>
{mediaType === 'video' && ( {mediaType === 'video' && (
<video className='size-full object-cover' autoPlay playsInline muted loop> <video className='size-full object-cover' autoPlay playsInline muted loop>
<source src={media.preview_url} /> <source src={media.preview_url} />