Remove duplication in cards tables

We were using the same code in two places, so we're extracting the code
into a component in order to share it.

app/components/admin/widget/cards/row_component.rb

@@ -0,0 +1,7 @@
+class Admin::Widget::Cards::RowComponent < ApplicationComponent
+  attr_reader :card
+
+  def initialize(card)
+    @card = card
+  end
+end

app/components/admin/widget/cards/table_component.html.erb

@@ -0,0 +1,22 @@
+<% if cards.any? %>
+  <table>
+    <thead>
+      <tr>
+        <th><%= ::Widget::Card.human_attribute_name(:title) %></th>
+        <th class="small-4"><%= ::Widget::Card.human_attribute_name(:description) %></th>
+        <th><%= ::Widget::Card.human_attribute_name(:link_text) %> / <%= ::Widget::Card.human_attribute_name(:link_url) %></th>
+        <th><%= t("admin.shared.image") %></th>
+        <th><%= t("admin.shared.actions") %></th>
+      </tr>
+    </thead>
+    <tbody>
+      <% cards.each do |card| %>
+        <%= render Admin::Widget::Cards::RowComponent.new(card) %>
+      <% end %>
+    </tbody>
+  </table>
+<% else %>
+  <div class="callout primary clear">
+    <%= no_cards_message %>
+  </div>
+<% end %>

app/components/admin/widget/cards/table_component.rb

@@ -0,0 +1,8 @@
+class Admin::Widget::Cards::TableComponent < ApplicationComponent
+  attr_reader :cards, :no_cards_message
+
+  def initialize(cards, no_cards_message:)
+    @cards = cards
+    @no_cards_message = no_cards_message
+  end
+end

app/views/admin/homepage/_cards.html.erb

@@ -1,16 +0,0 @@
-<table>
-  <thead>
-    <tr>
-      <th><%= Widget::Card.human_attribute_name(:title) %></th>
-      <th class="small-4"><%= Widget::Card.human_attribute_name(:description) %></th>
-      <th><%= Widget::Card.human_attribute_name(:link_text) %> / <%= Widget::Card.human_attribute_name(:link_url) %></th>
-      <th><%= t("admin.shared.image") %></th>
-      <th class="small-3"><%= t("admin.shared.actions") %></th>
-    </tr>
-  </thead>
-  <tbody>
-    <% cards.each do |card| %>
-      <%= render "card", card: card %>
-    <% end %>
-  </tbody>
-</table>

app/views/admin/homepage/show.html.erb

@@ -9,13 +9,10 @@
     <%= link_to t("admin.homepage.create_header"), new_admin_widget_card_path(header_card: true), class: "button" %>
   </div>
 
-  <% if @header.present? %>
+  <%= render Admin::Widget::Cards::TableComponent.new(
-    <%= render "cards", cards: @header %>
+    @header,
-  <% else %>
+    no_cards_message: t("admin.homepage.no_header")
-    <div class="callout primary clear">
+  ) %>
-      <%= t("admin.homepage.no_header") %>
-    </div>
-  <% end %>
 </div>
 
 <hr>
@@ -27,13 +24,10 @@
     <%= link_to t("admin.homepage.create_card"), new_admin_widget_card_path, class: "button" %>
   </div>
 
-  <% if @cards.present? %>
+  <%= render Admin::Widget::Cards::TableComponent.new(
-    <%= render "cards", cards: @cards %>
+    @cards,
-  <% else %>
+    no_cards_message: t("admin.homepage.no_cards")
-    <div class="callout primary clear">
+  ) %>
-      <%= t("admin.homepage.no_cards") %>
-    </div>
-  <% end %>
 </div>
 
 <hr>

app/views/admin/site_customization/cards/_card.html.erb

@@ -1,22 +0,0 @@
-<tr id="<%= dom_id(card) %>" class="homepage-card">
-  <td>
-    <%= card.label %><br>
-    <%= card.title %>
-  </td>
-  <td><%= card.description %></td>
-  <td>
-    <%= card.link_text %><br>
-    <%= card.link_url %>
-  </td>
-
-  <!-- remove conditional once specs have image validations -->
-  <td>
-    <% if card.image.present? %>
-      <%= link_to t("admin.shared.show_image"), card.image_url(:large),
-                  title: card.image.title, target: "_blank" %>
-    <% end %>
-  </td>
-  <td>
-    <%= render Admin::TableActionsComponent.new(card) %>
-  </td>
-</tr>

app/views/admin/site_customization/cards/_cards.html.erb

@@ -1,16 +0,0 @@
-<table>
-  <thead>
-    <tr>
-      <th><%= Widget::Card.human_attribute_name(:title) %></th>
-      <th class="small-4"><%= Widget::Card.human_attribute_name(:description) %></th>
-      <th><%= Widget::Card.human_attribute_name(:link_text) %> / <%= Widget::Card.human_attribute_name(:link_url) %></th>
-      <th><%= t("admin.shared.image") %></th>
-      <th class="small-2"><%= t("admin.shared.actions") %></th>
-    </tr>
-  </thead>
-  <tbody>
-    <% cards.each do |card| %>
-      <%= render "card", card: card %>
-    <% end %>
-  </tbody>
-</table>

app/views/admin/site_customization/cards/index.html.erb

@@ -11,11 +11,8 @@
                 new_admin_site_customization_page_widget_card_path(@page), class: "button" %>
   </div>
 
-  <% if @cards.present? %>
+  <%= render Admin::Widget::Cards::TableComponent.new(
-    <%= render "cards", cards: @cards %>
+    @cards,
-  <% else %>
+    no_cards_message: t("admin.site_customization.pages.cards.no_cards")
-    <div class="callout primary clear">
+  ) %>
-      <%= t("admin.site_customization.pages.cards.no_cards") %>
-    </div>
-  <% end %>
 </div>