fix(dashboard): Fix asset detail preview display

packages/dashboard/src/app/routes/_authenticated/_assets/assets_.$id.tsx

@@ -1,4 +1,4 @@
-import { AssetFocalPointEditor, Point } from '@/vdb/components/shared/asset/asset-focal-point-editor.js';
+import { AssetFocalPointEditor } from '@/vdb/components/shared/asset/asset-focal-point-editor.js';
 import { AssetPreviewSelector } from '@/vdb/components/shared/asset/asset-preview-selector.js';
 import { PreviewPreset } from '@/vdb/components/shared/asset/asset-preview.js';
 import { AssetProperties } from '@/vdb/components/shared/asset/asset-properties.js';
@@ -50,7 +50,6 @@ function AssetDetailPage() {
     const [size, setSize] = useState<PreviewPreset>('medium');
     const [width, setWidth] = useState(0);
     const [height, setHeight] = useState(0);
-    const [focalPoint, setFocalPoint] = useState<Point | undefined>(undefined);
     const [settingFocalPoint, setSettingFocalPoint] = useState(false);
     const { form, submitHandler, entity, isPending, resetForm } = useDetailPage({
         pageId,
@@ -105,7 +104,7 @@ function AssetDetailPage() {
             </PageActionBar>
             <PageLayout>
                 <PageBlock column="main" blockId="asset-preview">
-                    <div className="relative flex items-center justify-center bg-muted/30 rounded-lg min-h-[300px] overflow-auto">
+                    <div className="relative flex items-center justify-center bg-muted/30 rounded-lg min-h-[300px] overflow-auto resize-y">
                         <AssetFocalPointEditor
                             width={width}
                             height={height}
@@ -124,10 +123,9 @@ function AssetDetailPage() {
                                 ref={imageRef}
                                 asset={entity}
                                 preset={size || undefined}
-                                mode="resize"
                                 useFocalPoint={true}
                                 onLoad={updateDimensions}
-                                className="max-w-full max-h-full object-contain"
+                                className="max-w-full object-contain"
                             />
                         </AssetFocalPointEditor>
                     </div>

packages/dashboard/src/lib/components/shared/vendure-image.tsx

@@ -25,7 +25,7 @@ export interface AssetLike {
  * @docsPage VendureImage
  * @since 3.4.0
  */
-export type ImagePreset = 'tiny' | 'thumb' | 'small' | 'medium' | 'large' | null;
+export type ImagePreset = 'tiny' | 'thumb' | 'small' | 'medium' | 'large' | 'full' | null;
 
 /**
  * @description
@@ -219,6 +219,10 @@ function getMinDimensions(preset?: ImagePreset, width?: number, height?: number)
                 return { width: 300, height: 300 };
             case 'medium':
                 return { width: 500, height: 500 };
+            case 'large':
+                return { width: 800, height: 800 };
+            case 'full':
+                return { width: undefined, height: undefined };
         }
     }
 
@@ -258,6 +262,10 @@ export function PlaceholderImage({
                 width = 800;
                 height = 800;
                 break;
+            case 'full':
+                width = 1200;
+                height = 1200;
+                break;
             default:
                 break;
         }