From a90d9518c3be295012f5ee692908f70b101e32e5 Mon Sep 17 00:00:00 2001 From: Ross Chapman Date: Fri, 16 Feb 2024 17:52:25 -0800 Subject: [PATCH] =?UTF-8?q?=F0=9F=8C=B8=E2=9C=A8=20`SectionNavigation`=20a?= =?UTF-8?q?nd=20`Section`:=20Show=20`Section#hero=5Fimage`=20(#2188)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app/components/card_component.html.erb | 16 +++++++++++----- app/components/card_component.rb | 17 ++++++++++++++++- .../marketplace/marketplace_component.html.erb | 4 ---- app/furniture/marketplace/product_component.rb | 6 +----- .../_section_navigation.html.erb | 7 +------ app/models/media.rb | 5 +++++ app/views/furnitures/_furniture.html.erb | 4 +--- app/views/rooms/_room.html.erb | 3 +++ 8 files changed, 38 insertions(+), 24 deletions(-) diff --git a/app/components/card_component.html.erb b/app/components/card_component.html.erb index dd83e6f4f..860ab3ed4 100644 --- a/app/components/card_component.html.erb +++ b/app/components/card_component.html.erb @@ -1,7 +1,14 @@ -
> - <% if header? %> - <%= header%> - <%- end %> +
> + <%- if head_image.present? %> +
+ <%= image_tag head_image, class: "rounded-t-lg w-full" %> +
+ <%= header %> +
+
+ <%- else %> + <%= header %> + <%- end %> <%# NOTE: content? is not always working as described, and is returning a proc in some cases rather than a boolean %> @@ -10,7 +17,6 @@ <%= content %>
<% end %> - <% if footer? %> <%= footer %> <% end %> diff --git a/app/components/card_component.rb b/app/components/card_component.rb index c305f9f8a..20ce1a2a2 100644 --- a/app/components/card_component.rb +++ b/app/components/card_component.rb @@ -1,5 +1,16 @@ class CardComponent < ApplicationComponent - HEADER_VARIANTS = {default: "p-2 sm:p-4", no_padding: ""} + attr_accessor :media + + def initialize(media: nil, **kwargs) + super(**kwargs) + + self.media = media + end + + HEADER_VARIANTS = { + default: "p-2 sm:p-4", + no_padding: "" + } renders_one :header, ->(variant: :default, &block) { content_tag(:header, class: HEADER_VARIANTS.fetch(variant), &block) } @@ -14,4 +25,8 @@ class CardComponent < ApplicationComponent classes += " rounded-t-none" unless content? || header? content_tag(:footer, class: classes, &block) } + + def head_image + media&.upload&.variant(resize_to_fill: Media::FULL_WIDTH_16_BY_9) + end end diff --git a/app/furniture/marketplace/marketplace_component.html.erb b/app/furniture/marketplace/marketplace_component.html.erb index ecdc2adaf..b85e316a7 100644 --- a/app/furniture/marketplace/marketplace_component.html.erb +++ b/app/furniture/marketplace/marketplace_component.html.erb @@ -1,9 +1,5 @@
- - <%= render delivery_area_component %> - <%= render Marketplace::MenuComponent.new(marketplace:, cart:) %> - <%= render cart %>
diff --git a/app/furniture/marketplace/product_component.rb b/app/furniture/marketplace/product_component.rb index 0463c7aa0..e7ebc4fff 100644 --- a/app/furniture/marketplace/product_component.rb +++ b/app/furniture/marketplace/product_component.rb @@ -13,12 +13,8 @@ def edit_button super(title: t("marketplace.products.edit.link_to", name: name), href: location(:edit)) end - # 16:9 of 1290 is 1290:725.625 - # We rounded up. - # @see https://www.ios-resolution.com/ - FULL_WIDTH_16_BY_9 = [1290, 726] def hero_image - product.photo.variant(resize_to_fill: FULL_WIDTH_16_BY_9) + product.photo.variant(resize_to_fill: Media::FULL_WIDTH_16_BY_9) end def tax_rates diff --git a/app/furniture/section_navigation/section_navigations/_section_navigation.html.erb b/app/furniture/section_navigation/section_navigations/_section_navigation.html.erb index 02024da27..e737fceec 100644 --- a/app/furniture/section_navigation/section_navigations/_section_navigation.html.erb +++ b/app/furniture/section_navigation/section_navigations/_section_navigation.html.erb @@ -1,13 +1,8 @@
<% policy_scope(section_navigation.rooms).each do |room| %> <%= link_to polymorphic_path(room.location), id: dom_id(room, :link_to), class: "group no-underline" do %> - <%= render CardComponent.new(classes: - "flex flex-col h-full justify-between") do |card| %> - - + <%= render CardComponent.new(media: room.hero_image, classes: "flex flex-col justify-between") do |card| %>

<%= room.description %>

- -

<%= room.name %> diff --git a/app/models/media.rb b/app/models/media.rb index 3d5ccce42..4ae1c9ad6 100644 --- a/app/models/media.rb +++ b/app/models/media.rb @@ -1,5 +1,10 @@ # The Media resource manages file uploads to the platform class Media < ApplicationRecord + # 16:9 of 1290 is 1290:725.625 + # We rounded up. + # @see https://www.ios-resolution.com/ + FULL_WIDTH_16_BY_9 = [1290, 726] + # NOTE: Dependent destroy is defaulted, but when it becomes important to # separate the destroy request and purge operations, let's add the # `dependent: :purge_later` option. diff --git a/app/views/furnitures/_furniture.html.erb b/app/views/furnitures/_furniture.html.erb index f3dbf33d6..28ef082ee 100644 --- a/app/views/furnitures/_furniture.html.erb +++ b/app/views/furnitures/_furniture.html.erb @@ -1,7 +1,6 @@ <% edit_href = nil %> <% edit_href = furniture.location(:edit) if furniture.configurable? %> <% edit_href = furniture.to_kind_class.location(:edit) if furniture.to_kind_class.has_controller_edit? %> -
<%- if local_assigns[:editing] %>
@@ -16,7 +15,6 @@ title: t('.edit_title', name: furniture.furniture.model_name.human.titleize), scheme: :secondary) %> <%- end %> - <%= render ButtonComponent.new( label: t('icons.destroy'), href: [furniture.room.space, furniture.room, furniture], @@ -24,7 +22,7 @@ method: :delete, confirm: t('.confirm_destroy'), scheme: :secondary) %> -

+
<%- if local_assigns[:include_form] %> <%= render partial: 'furnitures/form', locals: { furniture: furniture } %> diff --git a/app/views/rooms/_room.html.erb b/app/views/rooms/_room.html.erb index af2c9ac43..e8da5a578 100644 --- a/app/views/rooms/_room.html.erb +++ b/app/views/rooms/_room.html.erb @@ -1,6 +1,9 @@
+ <%- if room.hero_image&.upload.present? %> + <%= image_tag room.hero_image&.upload&.variant(resize_to_fill: Media::FULL_WIDTH_16_BY_9), class: "w-full" %> + <%- end %> <%= render room.gizmos.rank(:slot) %>