Help with how to bind an image within a masonry view

I’ll try to make this clear, my project was to 1) create a plage for students to upload images to a folder, then 2) display the images in a masonry grid, 3) with the ability to click on a specific image in a new page or the image in a modal to be used in the next step.

Everything works fine until I reach step 3. No matter what image I click on it opens the first image in the series. I know the masonry grid creates an # $index value but I can’t figure out how to bind it to the image. I am able to click on the image thumbnail and open it but then you can’t do anything with it.

The last thing I tried was adding a container below the images that contained a repeat row. column I placed a button. Each button had used the index value as a label. I thought that perhaps I could click on the button and then open the associated image in a modal. But all I can do is open the first image.

I’m looking for suggestions to try as I’m sure it is not that difficult it’s just not familiar to me.