feat: netlify large media support (#721)

packages/core/src/backends/git-gateway/implementation.tsx

@@ -117,6 +117,7 @@ export default class GitGateway implements BackendClass {
   api?: GitHubAPI | GitLabAPI | BitBucketAPI;
   branch: string;
   mediaFolder?: string;
+  transformImages: boolean;
   gatewayUrl: string;
   netlifyLargeMediaURL: string;
   backendType: string | null;
@@ -140,6 +141,8 @@ export default class GitGateway implements BackendClass {
     this.config = config;
     this.branch = config.backend.branch?.trim() || 'main';
     this.mediaFolder = config.media_folder;
+    const { use_large_media_transforms_in_media_library: transformImages = true } = config.backend;
+    this.transformImages = transformImages;
 
     const netlifySiteURL = localStorage.getItem('netlifySiteURL');
     this.apiUrl = getEndpoint(config.backend.identity_url || defaults.identity, netlifySiteURL);
@@ -437,7 +440,7 @@ export default class GitGateway implements BackendClass {
           rootURL: this.netlifyLargeMediaURL,
           makeAuthorizedRequest: this.requestFunction,
           patterns,
-          transformImages: false,
+          transformImages: this.transformImages ? { nf_resize: 'fit', w: 560, h: 320 } : false,
         });
       },
     );
@@ -470,7 +473,7 @@ export default class GitGateway implements BackendClass {
     return { url, blob };
   }
 
-  async getMediaDisplayURL(displayURL: DisplayURL) {
+  async getMediaDisplayURL(displayURL: DisplayURL): Promise<string> {
     const { path, id } = displayURL as DisplayURLObject;
     const isLargeMedia = await this.isLargeMediaFile(path);
     if (isLargeMedia) {
@@ -481,8 +484,7 @@ export default class GitGateway implements BackendClass {
       return displayURL;
     }
 
-    const url = await this.backend!.getMediaDisplayURL(displayURL);
-    return url;
+    return this.backend!.getMediaDisplayURL(displayURL);
   }
 
   async getMediaFile(path: string) {

packages/core/src/constants/configSchema.tsx

@@ -182,6 +182,7 @@ function getConfigSchema() {
               deleteMedia: { type: 'string' },
             },
           },
+          use_large_media_transforms_in_media_library: { type: 'boolean' },
         },
         required: ['name'],
       },

packages/core/src/interface.ts

@@ -772,6 +772,7 @@ export interface Backend {
     uploadMedia?: string;
     deleteMedia?: string;
   };
+  use_large_media_transforms_in_media_library?: boolean;
 }
 
 export interface Slug {