front-end-monorepo: Image URLs are broken on project About pages

Package

lib-react-components

Describe the bug

Project About pages are generating invalid URLs for thumbnail images, which then give a 415 error from the thumbnail server.

eg. https://thumbnails.zooniverse.org/200xnone/panoptes-uploads.zooniverse.org/project_attached_image/84f76c20-5c6e-4d6f-81f2-7b2f8cacec13.jpeg

200xnone isn’t a valid size for the thumbnail generator. Both parameters should be numbers.

To Reproduce

Watch the network requests for images while loading this page. https://www.zooniverse.org/projects/hughdickinson/superwasp-black-hole-hunters/about/team

Expected behavior

Images should be loaded from the thumbnail server, rather than falling back to the original uploaded file.

About this issue

  • Original URL
  • State: closed
  • Created 3 years ago
  • Comments: 22 (22 by maintainers)

Most upvoted comments

Sounds like CSS dimensions are being passed straight through to the thumbnail URL. There could be a small transformer function which takes a CSS dimension and returns a number.

It might still be convenient to have a URL syntax that tells the resizer to resize only on width, but let’s try replacing ‘none’ with ‘999’ first. That’s what PFE currently does.

Good point. Maybe for background images, or if we ever wanted to run subjects though the thumbnail service. Otherwise, 999px seems like a reasonable maximum size.