fix [skip test]

alchemy-fr · Mar 27, 2024 · 256ef17 · 256ef17
1 parent 46d73ee
commit 256ef17
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 15 deletions.
diff --git a/databox/client/src/components/AssetList/PreviewPopover.tsx b/databox/client/src/components/AssetList/PreviewPopover.tsx
@@ -71,11 +71,20 @@ export default function PreviewPopover({
                     sx={{
                         padding: 1,
                         maxWidth: width,
+                        maxHeight: height,
                         ...attributesSx(),
                     }}
                 >
-                    <Stack direction={'row'} spacing={1}>
-                        <div>
+                    <Stack
+                        direction={'row'}
+                        spacing={1}
+                        sx={theme => ({
+                            maxHeight: `calc(${height}px - ${theme.spacing(2)})`,
+                        })}
+                    >
+                        <div style={{
+                            maxHeight: height,
+                        }}>
                             <FilePlayer
                                 key={asset.id}
                                 file={asset.preview!.file!}

diff --git a/databox/client/src/components/Media/Asset/Thumb.tsx b/databox/client/src/components/Media/Asset/Thumb.tsx
@@ -4,15 +4,6 @@ import {alpha, Theme} from '@mui/material/styles';
 import assetClasses from '../../AssetList/classes';
 import {createThumbActiveStyle} from './AssetThumb';
 
-type Props = PropsWithChildren<
-    {
-        size: number;
-        selected?: boolean;
-        onMouseOver?: MouseEventHandler | undefined;
-        className?: string | undefined;
-    } & DOMAttributes<HTMLElement>
->;
-
 export function createSizeTransition(theme: Theme) {
     return theme.transitions.create(['height', 'width'], {duration: 300});
 }
@@ -44,18 +35,25 @@ export const thumbSx = (
     },
 });
 
+type Props = PropsWithChildren<
+    {
+        size: number;
+        selected?: boolean;
+        onMouseOver?: MouseEventHandler | undefined;
+    } & DOMAttributes<HTMLElement>
+>;
+
 export default function Thumb({
     selected,
     children,
     onMouseOver,
     onMouseLeave,
-    className,
 }: Props) {
     return (
-        <Box
+        <div
             onMouseOver={onMouseOver}
             onMouseLeave={onMouseLeave}
-            className={className}
+            className={assetClasses.thumbWrapper}
         >
             {selected && (
                 <Box
@@ -71,6 +69,6 @@ export default function Thumb({
                 />
             )}
             {children}
-        </Box>
+        </div>
     );
 }
diff --git a/databox/client/src/components/Upload/FileCard.tsx b/databox/client/src/components/Upload/FileCard.tsx
@@ -3,6 +3,7 @@ import Typography from '@mui/material/Typography';
 import {FileBlobThumb} from '../../lib/upload/fileBlob';
 import {Grid, Paper} from '@mui/material';
 import byteSize from 'byte-size';
+import {thumbSx} from "../Media/Asset/Thumb.tsx";
 
 const size = 100;
 
@@ -17,6 +18,7 @@ export default function FileCard({file, onRemove}: Props) {
             sx={theme => ({
                 padding: theme.spacing(2),
                 margin: 'auto',
+                ...thumbSx(size, theme),
             })}
         >
             <Grid