feat: fix sight edit

src/widgets/MediaViewer/index.tsx

@@ -12,29 +12,17 @@ export interface MediaData {
 export function MediaViewer({
   media,
   className,
-}: Readonly<{ media?: MediaData; className?: string }>) {
+  fullWidth,
+}: Readonly<{ media?: MediaData; className?: string; fullWidth?: boolean }>) {
   const token = localStorage.getItem("token");
   return (
-    <Box
-      sx={{
-        width: "100%",
-        height: "100%",
-        display: "flex",
-        flexGrow: 1,
-      }}
-      className={className}
-    >
+    <Box className={className} width={fullWidth ? "100%" : "auto"}>
       {media?.media_type === 1 && (
         <img
           src={`${import.meta.env.VITE_KRBL_MEDIA}${
             media?.id
           }/download?token=${token}`}
           alt={media?.filename}
-          style={{
-            width: "100%",
-            height: "100%",
-            objectFit: "contain",
-          }}
         />
       )}
 
@@ -46,7 +34,7 @@ export function MediaViewer({
           style={{
             width: "100%",
             height: "100%",
-            objectFit: "contain",
+            objectFit: "cover",
             borderRadius: 8,
           }}
           controls
@@ -60,12 +48,6 @@ export function MediaViewer({
             media?.id
           }/download?token=${token}`}
           alt={media?.filename}
-          style={{
-            width: "100%",
-            height: "100%",
-            objectFit: "contain",
-            borderRadius: 8,
-          }}
         />
       )}
       {media?.media_type === 4 && (
@@ -75,10 +57,7 @@ export function MediaViewer({
           }/download?token=${token}`}
           alt={media?.filename}
           style={{
-            width: "100%",
-            height: "100%",
-            objectFit: "contain",
-            borderRadius: 8,
+            objectFit: "cover",
           }}
         />
       )}