🐛(frontend) fix svg export

Last upgrade of Blocknote to 0.30.0 broke the SVG
export. The previewWidth can be undefined, which causes the
export to fail. This commit adds a fallback
width in case previewWidth is undefined.

Author: AntoLC

src/frontend/apps/e2e/__tests__/app-impress/assets/test.svg

@@ -21,14 +21,17 @@ export const blockMappingImageDocx: DocsExporterDocx['mappings']['blockMapping']
     const blob = await exporter.resolveFile(block.props.url);
     let pngConverted: string | undefined;
     let dimensions: { width: number; height: number } | undefined;
+    let previewWidth = block.props.previewWidth || undefined;
 
     if (!blob.type.includes('image')) {
       return [];
     }
 
     if (blob.type.includes('svg')) {
       const svgText = await blob.text();
-      pngConverted = await convertSvgToPng(svgText, block.props.previewWidth);
+      const FALLBACK_SIZE = 536;
+      previewWidth = previewWidth || blob.size || FALLBACK_SIZE;
+      pngConverted = await convertSvgToPng(svgText, previewWidth);
       const img = new Image();
       img.src = pngConverted;
       await new Promise((resolve) => {
@@ -47,8 +50,7 @@ export const blockMappingImageDocx: DocsExporterDocx['mappings']['blockMapping']
 
     const { width, height } = dimensions;
 
-    let previewWidth = block.props.previewWidth;
-    if (previewWidth > MAX_WIDTH) {
+    if (previewWidth && previewWidth > MAX_WIDTH) {
       previewWidth = MAX_WIDTH;
     }
 
@@ -69,8 +71,8 @@ export const blockMappingImageDocx: DocsExporterDocx['mappings']['blockMapping']
                 }
               : undefined,
             transformation: {
-              width: previewWidth,
-              height: (previewWidth / width) * height,
+              width: previewWidth || width,
+              height: ((previewWidth || width) / width) * height,
             },
           }),
         ],

src/frontend/apps/impress/src/features/docs/doc-export/blocks-mapping/imageDocx.tsx

@@ -12,22 +12,25 @@ export const blockMappingImagePDF: DocsExporterPDF['mappings']['blockMapping']['
   async (block, exporter) => {
     const blob = await exporter.resolveFile(block.props.url);
     let pngConverted: string | undefined;
+    let width = block.props.previewWidth || undefined;
 
     if (!blob.type.includes('image')) {
       return <View wrap={false} />;
     }
 
     if (blob.type.includes('svg')) {
       const svgText = await blob.text();
-      pngConverted = await convertSvgToPng(svgText, block.props.previewWidth);
+      const FALLBACK_SIZE = 536;
+      width = width || blob.size || FALLBACK_SIZE;
+      pngConverted = await convertSvgToPng(svgText, width);
     }
 
     return (
       <View wrap={false}>
         <Image
           src={pngConverted || blob}
           style={{
-            width: block.props.previewWidth * PIXELS_PER_POINT,
+            width: width ? width * PIXELS_PER_POINT : undefined,
             maxWidth: '100%',
           }}
         />