Resized webp images served in Admin panel: please add link to orignial file

[camwebb]

Situation: the images in the Admin panel are of the form: https://cdn.statically.io/img/treetracker-production-images.s3.eu-central-1.amazonaws.com/f=auto,w=640,h=535.5/2021.11.03.08.29....jpg They are served as webp images. This is inconvenient when one is trying to link to and save the original JPEG image from Amazon S3. I discovered that if you remove the /f=auto,w=640,h=535.5/ part, then the original image is presented. I can see that having a resized image is valuable for the fixed size admin panel.

Request: somewhere on the admin panel popup, please add a (symbol with?) the direct link to the full size jpeg. Thanks.

[nmcharlton]

That's a great suggestion. The resizing is mostly there to improve performance, but a link to the original image would be a sensible addition.

[bedgarone]

Hi @nmcharlton, as a way to get started, I would like to solve this issue. Could you help me by describing the steps I should take?

After a quick walk through the code and the local app, I think this issue relates to the Captures page. Being it mainly a table with all the Trees listed in text rows, I found that the CaptureDetailDialog.js should be the target, since it makes the Capture image pop up after the capture is selected - in an OptimizedImage, which receives the original image (renderImage.imageUrl) as parameter. This issue demands that somewhere on the page we should include a icon/link to this referred url.

Since there is no mockup, I'm not sure how to handle this change.

• It could be added as a link or as a copy feature in the right panel:

• It could be over the image (with an absolute positioning) or next to the image.

Please let me know if I should have a different approach, and, if possible, complement with what I might have missed. I woud also like to know how you're dealing with branching, shall I create a new one to later PR, and what should be the repository-related steps that I should take. Thank you, and very happy to enroll in this team!

[nmcharlton]

Thanks @bedgarone. That's the right place to make the change and I like both of your proposals for a solution. The only additional thing I'd suggest is a clickable link to the original image, perhaps to open in a new tab.

As for the workflow, create a new branch on your fork for the feature and a draft PR that you can push to. That makes it easier to get feedback on ideas as you go along.

[camwebb]

Thanks all. +1 for the suggestion of a clickable link to open image in new tab.

[camwebb]

Just wanted to thank @bedgarone for this feature. Works great!