split heic-to to separate eager chunk

Author: kacper-mikolajczak

config/webpack/webpack.common.ts

@@ -349,6 +349,13 @@ const getCommonConfiguration = ({file = '.env', platform = 'web'}: Environment):
                         name: 'lottiePlayer',
                         chunks: 'all',
                     },
+                    // heic-to library is used sparsely and we want to load it as a separate chunk
+                    // to reduce the potential bundled size of the initial chunk
+                    heicTo: {
+                        test: /[\\/]node_modules[\\/](heic-to)[\\/]/,
+                        name: 'heicTo',
+                        chunks: 'all',
+                    },
                     // Extract all 3rd party dependencies (~75% of App) to separate js file
                     // This gives a more efficient caching - 3rd party deps don't change as often as main source
                     // When dependencies don't change webpack would produce the same js file (and content hash)

src/libs/fileDownload/heicConverter/index.ts

@@ -23,7 +23,7 @@ const convertHeicImage: HeicConverterFunction = (file, {onSuccess = () => {}, on
     }
 
     // Start loading the conversion library in parallel with fetching the file
-    const libraryPromise = import(/* webpackChunkName: "heic-converter" */ 'heic-to').catch((importError) => {
+    const libraryPromise = import(/* webpackMode: "eager" */ 'heic-to').catch((importError) => {
         console.error('Error loading heic-to library:', importError);
         // Re-throw a normalized error so the outer catch can handle it uniformly
         throw new Error('HEIC conversion library unavailable');