afficher/masquer tous les headers

app/javascript/controllers/email_controller.js

@@ -0,0 +1,18 @@
+import { Controller } from "stimulus"
+
+export default class extends Controller {
+  static targets = [ "buttonMain", "buttonAll", "headersMain", "headersAll" ]
+
+  show_main () {
+    this.buttonMainTarget.classList.add("hidden");
+    this.buttonAllTarget.classList.remove("hidden");
+    this.headersMainTarget.classList.remove("hidden");
+    this.headersAllTarget.classList.add("hidden");
+  }
+  show_all () {
+    this.buttonMainTarget.classList.remove("hidden");
+    this.buttonAllTarget.classList.add("hidden");
+    this.headersMainTarget.classList.add("hidden");
+    this.headersAllTarget.classList.remove("hidden");
+  }
+}

app/views/emails/_email.html.erb

@@ -1,6 +1,9 @@
-<div id="<%= dom_id email %>" class="email_container">
+<div id="<%= dom_id email %>" class="email_container" data-controller="email">
+  <button data-email-target="buttonAll" data-action="email#show_all">Show all headers</button>
+  <button data-email-target="buttonMain" data-action="email#show_main" class="hidden">Show main headers only</button>
+
   <table class="email_content">
-    <thead class="email_main_headers">
+    <thead class="email_main_headers" data-email-target="headersMain">
       <tr>
         <th>Date</th>
         <td><%= email.date %></td>
@@ -58,7 +61,7 @@
         </td>
       </tr>
     </thead>
-    <thead class="email_additional_headers">
+    <thead class="email_additional_headers hidden" data-email-target="headersAll">
       <% email.headers.each do |header| %>
         <tr>
           <th><%= header["name"] %></th>

app/views/emails/_list.html.erb

@@ -8,7 +8,7 @@
     </tr>
   </thead>
 
-  <tbody>
+  <tbody class="text-sm">
     <% emails.each do |email| %>
       <%= render partial: "list_row", object: email, as: :email %>
     <% end %>

app/views/emails/_list_row.html.erb

@@ -1,5 +1,5 @@
 <tr>
-  <td><%= email.date %></td>
+  <td><%= email.date.strftime("%Y-%m-%d %H:%M") %></td>
   <td><%= email.subject %></td>
   <td>
     <% email.organisations.each do |organisation| %>

app/views/layouts/application.html.erb

@@ -23,8 +23,8 @@
               <div class="hidden md:block">
                 <div class="ml-10 flex items-baseline space-x-4">
                   <!-- Current: "bg-gray-900 text-white", Default: "text-gray-300 hover:bg-gray-700 hover:text-white" -->
-                  <%= link_to "Emails", emails_path, class: (current_page?(emails_path) ? "nav-tab--current" : "nav-tab") %>
-                  <%= link_to "Filters", filters_path, class: (current_page?(filters_path) ? "nav-tab--current" : "nav-tab") %>
+                  <%= link_to "Emails", emails_path, class: (controller_name == "emails" ? "nav-tab--current" : "nav-tab") %>
+                  <%= link_to "Filters", filters_path, class: (controller_name == "filters" ? "nav-tab--current" : "nav-tab") %>
                 </div>
               </div>
             </div>
@@ -88,8 +88,8 @@
         <div data-main-nav-target="userMenu" class="hidden md:hidden">
           <div class="px-2 pt-2 pb-3 space-y-1 sm:px-3">
             <!-- Current: "bg-gray-900 text-white", Default: "text-gray-300 hover:bg-gray-700 hover:text-whites" -->
-            <%= link_to "Emails", emails_path, class: (current_page?(emails_path) ? "nav-tab--current" : "nav-tab") %>
-            <%= link_to "Filters", filters_path, class: (current_page?(filters_path) ? "nav-tab--current" : "nav-tab") %>
+            <%= link_to "Emails", emails_path, class: (controller_name == "emails" ? "nav-tab--current" : "nav-tab") %>
+            <%= link_to "Filters", filters_path, class: (controller_name == "filters" ? "nav-tab--current" : "nav-tab") %>
           </div>
           <div class="pt-4 pb-3 border-t border-gray-700">
             <div class="flex items-center px-5">