Optimize preview image size

framework/vendure/lib/normalize.ts

@@ -61,10 +61,10 @@ export function normalizeProduct(productNode: any): Product {
     price: {
       $set: {
         value: prices?.price.value,
-        currencyCode: prices?.price.currencyCode
-      }
+        currencyCode: prices?.price.currencyCode,
       },
-    $unset: ['entityId']
+    },
+    $unset: ['entityId'],
   })
 }
 
@@ -75,14 +75,14 @@ export function normalizeSearchResult(item: SearchResultFragment): Product {
     description: item.description,
     slug: item.slug,
     path: item.slug,
-    images: [{ url: item.productAsset?.preview || '' }],
+    images: [{ url: item.productAsset?.preview + '?preset=medium' || '' }],
     variants: [],
     price: {
-      value: ((item.priceWithTax as any).min / 100),
-      currencyCode: item.currencyCode
+      value: (item.priceWithTax as any).min / 100,
+      currencyCode: item.currencyCode,
     },
     options: [],
-    sku: item.sku
+    sku: item.sku,
   }
 }
 
@@ -93,15 +93,15 @@ export function normalizeCart(order: CartFragment): Cart {
     subTotal: order.subTotalWithTax / 100,
     total: order.totalWithTax / 100,
     customerId: order.customer?.id as number,
-    items: order.lines?.map(l => ({
+    items: order.lines?.map((l) => ({
       id: l.id,
       name: l.productVariant.name,
       quantity: l.quantity,
       url: l.productVariant.product.slug,
       variantId: l.productVariant.id,
       productId: l.productVariant.productId,
-      images: [{ url: l.featuredAsset?.preview || '' }],
-      prices: []
-    }))
+      images: [{ url: l.featuredAsset?.preview + '?preset=thumb' || '' }],
+      prices: [],
+    })),
   }
 }

framework/vendure/product/get-product.ts

@@ -40,7 +40,7 @@ async function getProduct({
   config,
 }: {
   query?: string
-  variables: { slug: string; }
+  variables: { slug: string }
   config?: VendureConfig
   preview?: boolean
 }): Promise<Product | {} | any> {
@@ -57,10 +57,16 @@ async function getProduct({
         name: product.name,
         description: product.description,
         slug: product.slug,
-        images: product.assets.map((a: any) => ({ url: a.preview, alt: a.name })),
+        images: product.assets.map((a: any) => ({
+          url: a.preview,
+          alt: a.name,
+        })),
         variants: product.variants.map((v: any) => ({
           id: v.id,
-          options: v.options.map((o: any) => ({ displayName: o.name, values: [] })),
+          options: v.options.map((o: any) => ({
+            displayName: o.name,
+            values: [],
+          })),
         })),
         price: {
           value: product.variants[0].priceWithTax / 100,
@@ -68,14 +74,13 @@ async function getProduct({
         },
         options: product.optionGroups.map((og: any) => ({
           displayName: og.name,
-          values: og.options.map((o: any) => ({ label: o.name + ' hello' })),
+          values: og.options.map((o: any) => ({ label: o.name })),
         })),
+      },
     }
-    };
   }
 
   return {}
 }
 
 export default getProduct
-