Merge pull request #3844 from AlchemyCMS/fix-thumbnail-size-in-overlay

Fix thumbnail size in picture overlay

Author: tvdeyen

app/assets/builds/alchemy/admin.css

@@ -75,8 +75,8 @@ alchemy-uploader {
   }
 
   img {
-    max-width: 100%;
-    max-height: 100%;
+    max-width: var(--picture-width);
+    max-height: var(--picture-height);
 
     &:not([src*="alchemy/missing-image"]) {
       background: var(--thumbnail-background);

app/stylesheets/alchemy/admin/archive.scss

@@ -22,7 +22,7 @@
           search_filter_params.merge(
             size: "small",
             form_field_id: @form_field_id
-          )
+          ).to_h
         ),
         class: "icon_button"
       ) %>
@@ -34,7 +34,7 @@
           search_filter_params.merge(
             size: "medium",
             form_field_id: @form_field_id
-          )
+          ).to_h
         ),
         class: "icon_button"
       ) %>
@@ -46,7 +46,7 @@
           search_filter_params.merge(
             size: "large",
             form_field_id: @form_field_id
-          )
+          ).to_h
         ),
         class: "icon_button"
       ) %>

app/views/alchemy/admin/pictures/_filter_and_size_bar.html.erb

@@ -10,7 +10,7 @@
         onclick: '$(self).attr("href", "#").off("click"); return false',
         method: 'put',
       ) do %>
-        <%= render Alchemy::Admin::PictureThumbnail.new(picture_to_assign) %>
+        <%= render Alchemy::Admin::PictureThumbnail.new(picture_to_assign, size: size) %>
       <% end %>
     </sl-tooltip>
   <% else %>

app/views/alchemy/admin/pictures/_picture_to_assign.html.erb

@@ -16,6 +16,15 @@
       visit alchemy.admin_pictures_path(form_field_id: "ingredients_#{ingredient.id}_picture_id")
       expect(page).to have_css %(a[data-method="put"][href*="/admin/pictures/#{picture.id}/assign"])
     end
+
+    scenario "thumbnail renders at the selected size" do
+      expect(Alchemy::Admin::PictureThumbnail).to receive(:new)
+        .with(picture, size: "large").and_call_original
+      visit alchemy.admin_pictures_path(
+        form_field_id: "ingredients_#{ingredient.id}_picture_id",
+        size: "large"
+      )
+    end
   end
 
   describe "filtering the picture list" do