Product Image ? CartModelFactory

Questions
1

Hi

We have added ImageUrl (imageUrl) to the product document type, but cart is not showing a image.

CartModelFactory:

 if (product is IProductSnapshotWithImage productWithImage)
 {
     dto.ImageUrl = productWithImage.ImageUrl;
 }

what am I missing ?

Could be nice with a feature where it’s possible to override imageurl like the properties option.

2

Hey,

As documented here, an image needs to have an image alias for it to be used as the product image.

The ImageUrl property on the product snapshot is just the extracted value.

3

Sorry about that.

Is there anyway to override that ? we get images from a external platform

4

You could swap out the Product Adapter which is responsible for extracting product data into something Umbraco Commerce can use

There is an example of overriding a single property on the snapshot in this how to guide

1 Like
5

Great thx Matt, will try the overriding a single property. :flexed_biceps:

1 Like
6

docs need to be updated it says that IProductAdaptor is obsolete

´

public void Compose(IUmbracoBuilder builder)
    {
        builder.Services.AddUnique<*IProductAdapter*, MemberPricingProductAdapter>();
    }

´

7

Hey Anders,

It’s only obsolete to prevent people from inheriting it directly as folk should use the ProductAdaptorBase but we still need the IProductAdaptor interface as the registration type. Not the ideal solution but it’s the only one I could think of to stop people using the wrong type for the base.

8

Hi Matt

We have a product named “Sample”, it’s possible to order samples of some products, so we use 1 product we called Sample and then we add custom product properties to show what “variant” it is, and we added the property name in the store backend so if that property is different its a different product, but when I do the CustomProductAdaptor I only get one call when its the same productReference.

I’m trying to set the imageUrl on each “sample - product”.

Any idea on how to come about that issue ?
Could be nice to override the imageurl if like the properites.

9

Hmmm, good question and yea, I guess the Product Adapter doesn’t have that level of context.

Maybe you could pass the type of sample as a variant product reference key for the order line and use that to decide on the image?

10

I tryed using the productVariantReference but then snapshot is null, I think I have to do a custom build of the CartModelFactory.cs

if (dto.Properties.TryGetValue("imageUrl", out var overrideImageUrl))
{
    dto.ImageUrl = overrideImageUrl;
    dto.Properties.Remove("imageUrl");
}
else
{
    // Fallback: fetch product to get an ImageUrl (if available)
    var product = await ctx.UmbracoCommerceApi.GetProductAsync(
        entity.StoreId,
        entity.ProductReference,
        entity.ProductVariantReference);

    if (product is IProductSnapshotWithImage productWithImage)
    {
        dto.ImageUrl = productWithImage.ImageUrl;
    }
}
1 Like
11

Sure, but if you are overriding the product adapter, when you call base.GetProductSnapshotAsync if you know your variant key is one of your special keys, don’t pass it the variant reference (as the base adapter assumes it’s content node variant).

This should make the base call resolve the correct node which you can then populate the image URL, and probably the product snapshots ProductVariantReference too.

12

this method fails when productVariantReference is set

var order = await _commerceApi.GetOrCreateCurrentOrderAsync(store.Id)
.AsWritableAsync(uow)                
.AddProductAsync(model.ProductReference,
                 model.ProductVariantReference   <------------ here

ProductAdaptor gets called l8r on.

13

You are saying it fails before it hits your product adapter?

14

I just did some more test, and the first time it is added to the cart I hit the ProductAdaptor, and then I can use the ProductVariantReference and just set it to null and then get the Snapshot, but if we in the frontend call _fetchCart() it will trigger the ProductAdaptor again, but now we don’t have a ProductVariantReference, so the old imageUrl will be set to the one on the product model.

15

When you populate the image on the snapshot, do you also update its ProductVarientReference?

16

Hi Matt

I tried to reset the ProductVariantReference in the snapshot, but when at some point it reloads the products, the ProductVariantReference is null, so setting it in the snapshot is not working.

 string parseProductVariantReference = null;
 if (productReference.Contains("60ca7635-e48e-4da2-8137-7391d7ed9ef1")) <--- sample product
 {
     parseProductVariantReference = productVariantReference;
     productVariantReference = null;
 }

 var baseSnapshot = (UmbracoProductSnapshot)await base.GetProductSnapshotAsync(storeId, productReference, productVariantReference, languageIsoCode, cancellationToken);
 if (!string.IsNullOrWhiteSpace(parseProductVariantReference))
 { 
     baseSnapshot.ProductVariantReference = parseProductVariantReference;
     baseSnapshot.ImageUrl = "";
 }
17

Ok, good to know.

I’ll have a think how we can make that a bit easier to override within the Umbraco Commerce Cart package, or maybe just add property override support like you’ve implemented :+1:

18

Cool thanks Matt

Great support :flexed_biceps:

1 Like