From 4435673acebe9d1e7823207008163c5ebc574194 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Javi=20Mart=C3=ADn?= <javim@elretirao.net>
Date: Mon, 16 Oct 2023 14:17:41 +0200
Subject: [PATCH] Move admin index to a component

This way we make it easier to modify.

Note that, since the title of the page is "Administration" and it's in
the "Admin" section, we're adding an option to the `header` method in
order to avoid having a confusing title like "Administration - Admin".

Also note that, by removing the `title` HTML class, we avoid inheriting
styles from the `dashboard.scss` stylesheet, and now the heading is
displayed in the position it was meant to.

Finally, the concept of using a `main-class` for the current page comes
from a branch (currently in development) which will replace the <div>
tag with the `admin-content` class with a `main` tag.
---
 app/assets/stylesheets/admin.scss                       | 4 ----
 app/assets/stylesheets/admin/dashboard/index.scss       | 6 ++++++
 app/components/admin/dashboard/index_component.html.erb | 4 ++++
 app/components/admin/dashboard/index_component.rb       | 7 +++++++
 app/components/concerns/header.rb                       | 4 ++--
 app/views/admin/dashboard/index.html.erb                | 4 +---
 app/views/layouts/admin.html.erb                        | 2 +-
 7 files changed, 21 insertions(+), 10 deletions(-)
 create mode 100644 app/assets/stylesheets/admin/dashboard/index.scss
 create mode 100644 app/components/admin/dashboard/index_component.html.erb
 create mode 100644 app/components/admin/dashboard/index_component.rb

diff --git a/app/assets/stylesheets/admin.scss b/app/assets/stylesheets/admin.scss
index 542a765a7..90aa479ad 100644
--- a/app/assets/stylesheets/admin.scss
+++ b/app/assets/stylesheets/admin.scss
@@ -38,10 +38,6 @@ $table-header:   #ecf1f6;
     small {
       color: $text-medium;
     }
-
-    &.title {
-      text-transform: uppercase;
-    }
   }
 
   h3 {
diff --git a/app/assets/stylesheets/admin/dashboard/index.scss b/app/assets/stylesheets/admin/dashboard/index.scss
new file mode 100644
index 000000000..c5e6810a9
--- /dev/null
+++ b/app/assets/stylesheets/admin/dashboard/index.scss
@@ -0,0 +1,6 @@
+.admin-dashboard-index {
+  > header h2 {
+    text-transform: uppercase;
+    border-bottom: 1px solid $border;
+  }
+}
diff --git a/app/components/admin/dashboard/index_component.html.erb b/app/components/admin/dashboard/index_component.html.erb
new file mode 100644
index 000000000..3328ee99a
--- /dev/null
+++ b/app/components/admin/dashboard/index_component.html.erb
@@ -0,0 +1,4 @@
+<% provide :main_class, "admin-dashboard-index" %>
+<%= header(skip_section_title: true) %>
+
+<p><%= t("admin.dashboard.index.description", org: setting["org_name"]) %></p>
diff --git a/app/components/admin/dashboard/index_component.rb b/app/components/admin/dashboard/index_component.rb
new file mode 100644
index 000000000..85b579d63
--- /dev/null
+++ b/app/components/admin/dashboard/index_component.rb
@@ -0,0 +1,7 @@
+class Admin::Dashboard::IndexComponent < ApplicationComponent
+  include Header
+
+  def title
+    t("admin.dashboard.index.title")
+  end
+end
diff --git a/app/components/concerns/header.rb b/app/components/concerns/header.rb
index aa9700c0d..25ca5b3ae 100644
--- a/app/components/concerns/header.rb
+++ b/app/components/concerns/header.rb
@@ -1,10 +1,10 @@
 module Header
   extend ActiveSupport::Concern
 
-  def header(before: nil, &block)
+  def header(before: nil, skip_section_title: false, &block)
     provide(:title) do
       [
-        t("#{namespace}.header.title", default: ""),
+        (t("#{namespace}.header.title", default: "") unless skip_section_title),
         strip_tags(title),
         setting["org_name"]
       ].reject(&:blank?).join(" - ")
diff --git a/app/views/admin/dashboard/index.html.erb b/app/views/admin/dashboard/index.html.erb
index efcc29472..a6f1752fb 100644
--- a/app/views/admin/dashboard/index.html.erb
+++ b/app/views/admin/dashboard/index.html.erb
@@ -1,3 +1 @@
-<h2 class="title inline-block"><%= t("admin.dashboard.index.title") %></h2>
-
-<p><%= t("admin.dashboard.index.description", org: setting["org_name"]) %></p>
+<%= render Admin::Dashboard::IndexComponent.new %>
diff --git a/app/views/layouts/admin.html.erb b/app/views/layouts/admin.html.erb
index e8514de96..7f434cde3 100644
--- a/app/views/layouts/admin.html.erb
+++ b/app/views/layouts/admin.html.erb
@@ -21,7 +21,7 @@
         <% end %>
       </nav>
 
-      <div class="admin-content">
+      <div class="admin-content <%= yield(:main_class) %>">
         <%= label_tag :show_menu, t("admin.menu.admin"),
                       "aria-hidden": true, class: "button hollow expanded" %>