feat(asset-server-plugin): Allow custom AssetPreviewStrategy to be set

Relates to #1650. This is the first step - by allowing the strategy to be
set in config, we can expose options specific to the SharpAssetPreviewStrategy.

packages/asset-server-plugin/src/plugin.ts

@@ -149,10 +149,12 @@ export class AssetServerPlugin implements NestModule, OnApplicationBootstrap {
         const storageStrategyFactory =
             this.options.storageStrategyFactory || defaultAssetStorageStrategyFactory;
         this.assetStorage = await storageStrategyFactory(this.options);
-        config.assetOptions.assetPreviewStrategy = new SharpAssetPreviewStrategy({
-            maxWidth: this.options.previewMaxWidth || 1600,
-            maxHeight: this.options.previewMaxHeight || 1600,
-        });
+        config.assetOptions.assetPreviewStrategy =
+            this.options.previewStrategy ??
+            new SharpAssetPreviewStrategy({
+                maxWidth: this.options.previewMaxWidth,
+                maxHeight: this.options.previewMaxHeight,
+            });
         config.assetOptions.assetStorageStrategy = this.assetStorage;
         config.assetOptions.assetNamingStrategy =
             this.options.namingStrategy || new HashedAssetNamingStrategy();

packages/asset-server-plugin/src/sharp-asset-preview-strategy.ts

@@ -5,17 +5,56 @@ import sharp from 'sharp';
 
 import { loggerCtx } from './constants';
 
+/**
+ * @description
+ * This {@link AssetPreviewStrategy} uses the [Sharp library](https://sharp.pixelplumbing.com/) to generate
+ * preview images of uploaded binary files. For non-image binaries, a generic "file" icon with the mime type
+ * overlay will be generated.
+ *
+ * @docsCategory AssetServerPlugin
+ * @docsPage SharpAssetPreviewStrategy
+ */
+interface SharpAssetPreviewConfig {
+    /**
+     * @description
+     * The max height in pixels of a generated preview image.
+     *
+     * @default 1600
+     */
+    maxHeight?: number;
+    /**
+     * @description
+     * The max width in pixels of a generated preview image.
+     *
+     * @default 1600
+     */
+    maxWidth?: number;
+}
+
+/**
+ * @description
+ * This {@link AssetPreviewStrategy} uses the [Sharp library](https://sharp.pixelplumbing.com/) to generate
+ * preview images of uploaded binary files. For non-image binaries, a generic "file" icon with the mime type
+ * overlay will be generated.
+ *
+ * @docsCategory AssetServerPlugin
+ * @docsPage SharpAssetPreviewStrategy
+ * @docsWeight 0
+ */
 export class SharpAssetPreviewStrategy implements AssetPreviewStrategy {
-    constructor(
-        private config: {
-            maxHeight: number;
-            maxWidth: number;
-        },
-    ) {}
+    constructor(private config: SharpAssetPreviewConfig) {}
+    private readonly defaultConfig: Required<SharpAssetPreviewConfig> = {
+        maxHeight: 1600,
+        maxWidth: 1600,
+    };
 
     async generatePreviewImage(ctx: RequestContext, mimeType: string, data: Buffer): Promise<Buffer> {
         const assetType = getAssetType(mimeType);
-        const { maxWidth, maxHeight } = this.config;
+        const config = {
+            ...this.defaultConfig,
+            ...this.config,
+        };
+        const { maxWidth, maxHeight } = config;
 
         if (assetType === AssetType.IMAGE) {
             try {

packages/asset-server-plugin/src/types.ts

@@ -1,4 +1,9 @@
-import { AssetNamingStrategy, AssetStorageStrategy, RequestContext } from '@vendure/core';
+import {
+    AssetNamingStrategy,
+    AssetPreviewStrategy,
+    AssetStorageStrategy,
+    RequestContext,
+} from '@vendure/core';
 
 /**
  * @description
@@ -70,6 +75,7 @@ export interface AssetServerOptions {
      * The max width in pixels of a generated preview image.
      *
      * @default 1600
+     * @deprecated Use `previewStrategy: new SharpAssetPreviewStrategy({ maxWidth })` instead
      */
     previewMaxWidth?: number;
     /**
@@ -77,6 +83,7 @@ export interface AssetServerOptions {
      * The max height in pixels of a generated preview image.
      *
      * @default 1600
+     * @deprecated Use `previewStrategy: new SharpAssetPreviewStrategy({ maxHeight })` instead
      */
     previewMaxHeight?: number;
     /**
@@ -91,6 +98,14 @@ export interface AssetServerOptions {
      * @default HashedAssetNamingStrategy
      */
     namingStrategy?: AssetNamingStrategy;
+    /**
+     * @description
+     * Defines how previews are generated for a given Asset binary. By default, this uses
+     * the {@link SharpAssetPreviewStrategy}
+     *
+     * @since 1.7.0
+     */
+    previewStrategy?: AssetPreviewStrategy;
     /**
      * @description
      * A function which can be used to configure an {@link AssetStorageStrategy}. This is useful e.g. if you wish to store your assets