Querying Images from S3

  • Goal:

Display images from S3 in two different methods. The first is the "profile image" which should just be a singular image. The second is the "image grid" which is the remainder of images.

The images themselves sit in a field called "Photos" which is a comma separated list of the photo names. It does not contain the full URL. Each of the photo names sits in the same S3 bucket and has the same URL prefix: "https://whatsgood-public.s3.amazonaws.com/photos/"....

  • Steps:

I have created a singular image component which works when I only have a single image in the "photos" field. The query I'm using is: https://whatsgood-public.s3.amazonaws.com/photos/{{ table_approved_data.selectedRow.photos }}

I need to figure out how enhance this to achieve the following:

  1. When there are multiple images listed in the "photos" field, only return the first image for the single image "profile image" component.
  2. Populate the "image grid" component with all of the images. For context, there can be up to 10 images attached to each record of data by using the comma separated list in "Photos"
  3. Allow users to populate the "Photos" field by querying S3 and choose multiple photos that should be attached to the selected record.
  4. (nice to have) - add the ability to re-order the photos.
  • Screenshots:

This has been solved.