Skip to content

Add image upload support for product variants#14511

Draft
chahmedejaz wants to merge 7 commits into
openfoodfoundation:masterfrom
chahmedejaz:task/13978-add-image-upload-support-for-variant
Draft

Add image upload support for product variants#14511
chahmedejaz wants to merge 7 commits into
openfoodfoundation:masterfrom
chahmedejaz:task/13978-add-image-upload-support-for-variant

Conversation

@chahmedejaz

@chahmedejaz chahmedejaz commented Jul 7, 2026

Copy link
Copy Markdown
Collaborator

What? Why?

Enterprise users can now upload images for individual product variants from the admin products page. Previously, only product-level images were supported — variant rows showed an empty column with no placeholder, and the image upload overlay only handled products.

This change:

  • Adds a has_one :image association to Spree::Variant, reusing the existing Spree::Image model (which was already polymorphic via viewable_type/viewable_id).
  • Updates the images controller to accept a variant_id param, setting the correct viewable_type (Spree::Variant vs Spree::Product) and redirecting back to the admin products list after save.
  • Replaces the _product_image partial with a generic _image partial that works for both products and variants.
  • Adds a placeholder image (40% opacity, transitioning to full opacity on row hover) for variants without an image.
  • Updates the edit-modal title to "Edit image for {product name}" for products and "Edit image for {product name} - {variant name}" for variants, with an explanatory subtitle recommending 440×440px minimum.
  • Includes an irreversible data migration to clean up any orphan variant images that may exist from before this feature.

What should we test?

  1. Placeholder image for variants without an image

    • Navigate to /admin/products.
    • Verify each variant row shows a default placeholder image at 40% opacity.
    • Hover over a variant row and confirm the placeholder transitions to full opacity.
  2. Upload an image for a variant

    • Click the "Edit" button on a variant's placeholder image.
    • Confirm the modal title reads "Edit image for {product name} - {variant name}".
    • Confirm the subtitle "A square size starting from 440px by 440px is recommended." is visible.
    • Attach a valid image file and save.
    • Verify the success flash message and that the variant row now shows the uploaded thumbnail.
  3. Upload an invalid file type

    • Open the edit modal for a variant.
    • Attach a non-image file (e.g. PDF or CSV).
    • Confirm an error message is displayed within the modal.
  4. Update an existing variant image

    • Upload a second image for a variant that already has one.
    • Verify the thumbnail updates and the success flash message appears.
  5. Product image upload still works

    • Click the "Edit" button on a product image.
    • Confirm the modal title reads "Edit image for {product name}" (no variant suffix).
    • Upload a new product image and confirm it saves correctly.
  6. Readonly product/variant image displays without edit button

    • Set up a producer relationship granting only create_linked_variants permission (not manage_products) on another producer's variant.
    • Navigate to /admin/products.
    • Locate the readonly product row - verify the image thumbnail is present but there is no "Edit" button on the image.
    • Locate the readonly variant row - verify the image thumbnail is present but there is no "Edit" button on the image.
  7. Variant image redirects to product list

    • After uploading or updating a variant image, confirm the browser redirects to the admin products list.
  8. Migration — existing variant images are removed

    • If the environment has any pre-existing Spree::Image records with viewable_type = 'Spree::Variant', verify they are cleaned up after running db:migrate. Product images are unaffected.
    • This will be tested by a dev because right now we don't show existing variant images anywhere.
  9. Any other scenario mentioned in the issue and regression testing of the product page.

Release notes

Changelog Category (reviewers may add a label for the release notes):

  • User facing changes
  • API changes
  • Technical changes only
  • Feature toggled

- Implemented image upload functionality for variants in the images controller.
- Updated helper methods to handle image paths for both products and variants.
- Created new view partials for rendering images and updated existing ones.
- Enhanced tests to cover image upload and update scenarios for variants.
- Modified localization for image edit modal to reflect resource type.
@github-project-automation github-project-automation Bot moved this to All the things 💤 in OFN Delivery board Jul 7, 2026
@chahmedejaz chahmedejaz moved this from All the things 💤 to In Progress ⚙ in OFN Delivery board Jul 7, 2026
@mariocarabotta mariocarabotta added pr-staged-au staging.openfoodnetwork.org.au pr-staged-fr staging.coopcircuits.fr and removed pr-staged-au staging.openfoodnetwork.org.au pr-staged-fr staging.coopcircuits.fr labels Jul 8, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

Status: In Progress ⚙

Development

Successfully merging this pull request may close these issues.

As an enterprise user, I want to upload an image for a variant

2 participants