Preview image of page not working as expected

Hi,

I have a blueprint for all shows in a theatre.
Each show has it’s own page with the same blueprint for all shows.

When I use cards in the all shows panel, this first image of a show is always used.
I would like to have it use the main image, but I can’t get it working.

See screenshots and relevant parts of blueprints.

Help is appreciated!

all shows:

items:
  width: 1/1
  sections:
    pages:
      type: pages
      limit: 200
      width: 1/1
      label: "Voorstellingen"
      layout: cards
      sortBy: programstart
      flip: true
      image: page.mainImage.toFile
        cover: true
      text: "({{ page.programid}}) {{ page.programstart.toDate('d-m-Y') }}<br/>{{ page.title }}"
      template: programma-item

show:

mainImage:
  label: "Hoofdafbeelding"
  type: files
  multiple: false
  layout: cards
  size: small
  image:
    cover: true
    back: white
    accept: image/jpeg


should be

image:
  query: page.mainImage.toFile
  cover: true

Thanks! :smiling_face: