From ba9c0ad953602a1c42d3145e426fa6da3cf5b628 Mon Sep 17 00:00:00 2001
From: f <f@sutty.nl>
Date: Thu, 23 May 2024 18:20:20 -0300
Subject: [PATCH] feat: mostrar los posts relacionados como tarjetas

---
 app/views/bootstrap/_card.haml                |  9 +++++++++
 app/views/bootstrap/_responsive.haml          |  4 ++++
 app/views/posts/_new_related_post.haml        | 16 ++++++++++++++--
 app/views/posts/attributes/_new_has_many.haml |  2 +-
 4 files changed, 28 insertions(+), 3 deletions(-)
 create mode 100644 app/views/bootstrap/_card.haml
 create mode 100644 app/views/bootstrap/_responsive.haml

diff --git a/app/views/bootstrap/_card.haml b/app/views/bootstrap/_card.haml
new file mode 100644
index 00000000..e7e1f108
--- /dev/null
+++ b/app/views/bootstrap/_card.haml
@@ -0,0 +1,9 @@
+.card{ **local_assigns.except(:image, :description) }
+  - if local_assigns[:image]
+    = render 'bootstrap/responsive' do
+      = image_tag url_for(local_assigns[:image]), alt: local_assigns[:description], class: 'img-fluid'
+
+  .card-body
+    .card-title= title
+
+    = yield
diff --git a/app/views/bootstrap/_responsive.haml b/app/views/bootstrap/_responsive.haml
new file mode 100644
index 00000000..1b51de97
--- /dev/null
+++ b/app/views/bootstrap/_responsive.haml
@@ -0,0 +1,4 @@
+- local_assigns[:ratio] ||= '1by1'
+
+.embed-responsive{ class: "embed-responsive-#{local_assigns[:ratio]}" }
+  .embed-responsive-item= yield
diff --git a/app/views/posts/_new_related_post.haml b/app/views/posts/_new_related_post.haml
index f3cc2a94..8425ad3e 100644
--- a/app/views/posts/_new_related_post.haml
+++ b/app/views/posts/_new_related_post.haml
@@ -1,2 +1,14 @@
-.col
-  %p= link_to post.title, post.path
+:ruby
+  image = nil
+  description = nil
+
+  if post.post.attribute?(:image) && (image = post.post.image.static_file)
+    description = post.post.image.value['description']
+  end
+
+.col.mb-3
+  = render('bootstrap/card', image: image, description: description, title: post.title, class: 'h-100') do
+    - if post.post.attribute?(:description)
+      %p.card-text= post.post.description.value
+
+    = link_to 'Editar', post.path, class: 'btn btn-secondary'
diff --git a/app/views/posts/attributes/_new_has_many.haml b/app/views/posts/attributes/_new_has_many.haml
index a9225032..a5d62a84 100644
--- a/app/views/posts/attributes/_new_has_many.haml
+++ b/app/views/posts/attributes/_new_has_many.haml
@@ -33,7 +33,7 @@
 
       Para poder cancelar, mantenemos el estado original y desactivamos
       o activamos los ítemes según estén incluidos en esa lista o no.
-    .row.row-cols-1.row-cols-md-2{ data: { target: 'array.current' } }
+    .row.row-cols-3.row-cols-md-4{ data: { target: 'array.current' } }
       - metadata.values.slice(*metadata.value).each do |value|
         = render 'posts/new_array_value', value: value