From 5e900c6cab6363ef66602fbf36319f2249743acd Mon Sep 17 00:00:00 2001
From: Akira Matsuda <ronnie@dio.jp>
Date: Sat, 25 Oct 2025 04:04:43 +0900
Subject: [PATCH 1/3] Move title to the header

---
 app/views/layouts/application.html.erb | 3 ++-
 app/views/messages/index.html.erb      | 5 -----
 2 files changed, 2 insertions(+), 6 deletions(-)

diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index 4f40b01..42cc57d 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -22,8 +22,9 @@
     <header class="bg-white dark:bg-gray-800 shadow-sm border-b border-gray-200 dark:border-gray-700">
       <div class="container mx-auto px-4 py-4">
         <h1 class="text-2xl font-bold text-gray-900 dark:text-gray-100">
-          <%= link_to "blade.ruby-lang.org", root_path, class: "hover:text-red-600 dark:hover:text-red-400 transition-colors" %>
+          <%= link_to @list&.name || 'blade.ruby-lang.org', @list || root_path, class: "hover:text-red-600 dark:hover:text-red-400 transition-colors" %>
         </h1>
+        <p class="text-gray-600 dark:text-gray-400 mt-2">Mailing list archive</p>
       </div>
     </header>
 
diff --git a/app/views/messages/index.html.erb b/app/views/messages/index.html.erb
index e5b2ecb..81195be 100644
--- a/app/views/messages/index.html.erb
+++ b/app/views/messages/index.html.erb
@@ -6,11 +6,6 @@
   </div>
 <% end %>
 
-<div class="mb-4">
-  <h1 class="text-3xl font-bold text-gray-900 dark:text-gray-100"><%= @list.name %></h1>
-  <p class="text-gray-600 dark:text-gray-400 mt-2">Mailing list archive</p>
-</div>
-
 <div class="grid grid-cols-4 gap-6" style="height: calc(100vh - 16rem);" data-controller="message-list">
   <div class="col-span-1 overflow-y-auto space-y-6">
     <%= render partial: 'thread', collection: @messages, as: :message, locals: {list: @list, depth: 0} %>

From afd86c8cfc3872757ba7f36a8e27702c11fcde25 Mon Sep 17 00:00:00 2001
From: Akira Matsuda <ronnie@dio.jp>
Date: Sat, 25 Oct 2025 12:04:44 +0900
Subject: [PATCH 2/3] Paginate messages by published year/month

---
 app/controllers/messages_controller.rb |  9 +++++++--
 app/views/messages/index.html.erb      | 15 +++++++++++++++
 2 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/app/controllers/messages_controller.rb b/app/controllers/messages_controller.rb
index 56e26fc..ae407fa 100644
--- a/app/controllers/messages_controller.rb
+++ b/app/controllers/messages_controller.rb
@@ -2,12 +2,17 @@ class MessagesController < ApplicationController
   PER_PAGE = 50
 
   # GET /ruby-dev or /q=searchterm
-  def index(list_name: nil, q: nil, page: nil)
+  def index(list_name: nil, yyyymm: nil, q: nil, page: nil)
     if list_name
       @list = List.find_by_name list_name
 
-      messages = Message.with_recursive(parent_and_children: [Message.where(list_id: @list, parent_id: nil).order(:id).limit(100), Message.joins('inner join parent_and_children on messages.parent_id = parent_and_children.id')])
+      @yyyymms = Message.where(list_id: @list).order('yyyymm').pluck(Arel.sql "distinct to_char(published_at, 'YYYYMM') as yyyymm")
+      @yyyymm = yyyymm || @yyyymms.last
+
+      root_query = Message.where(list_id: @list, parent_id: nil).where("to_char(published_at, 'YYYYMM') = ?", @yyyymm).order(:id)
+      messages = Message.with_recursive(parent_and_children: [root_query, Message.joins('inner join parent_and_children on messages.parent_id = parent_and_children.id')])
         .joins('inner join parent_and_children on parent_and_children.id = messages.id')
+
       @messages = compose_tree(messages)
     elsif q
       search q, page
diff --git a/app/views/messages/index.html.erb b/app/views/messages/index.html.erb
index 81195be..8975c57 100644
--- a/app/views/messages/index.html.erb
+++ b/app/views/messages/index.html.erb
@@ -6,6 +6,21 @@
   </div>
 <% end %>
 
+<div class="mb-4 border border-gray-200 dark:border-gray-700 rounded-lg p-3 bg-white dark:bg-gray-800">
+  <% @yyyymms.group_by {|yyyymm| yyyymm[0, 4] }.sort.each do |year, months| %>
+    <div class="flex gap-1 items-center mb-1">
+      <span class="text-sm font-medium text-gray-700 dark:text-gray-300 w-12"><%= year %>:</span>
+      <div class="flex gap-1 flex-wrap">
+        <% months.sort.each do |yyyymm| %>
+          <%= link_to [@list, yyyymm: yyyymm], class: "px-2 py-1 text-xs font-medium rounded transition-colors #{@yyyymm == yyyymm ? 'bg-red-600 dark:bg-red-500 text-white border-2 border-red-700 dark:border-red-400' : 'bg-gray-100 dark:bg-gray-900 text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 border-2 border-transparent'}" do %>
+            <%= yyyymm[4..] %>
+          <% end %>
+        <% end %>
+      </div>
+    </div>
+  <% end %>
+</div>
+
 <div class="grid grid-cols-4 gap-6" style="height: calc(100vh - 16rem);" data-controller="message-list">
   <div class="col-span-1 overflow-y-auto space-y-6">
     <%= render partial: 'thread', collection: @messages, as: :message, locals: {list: @list, depth: 0} %>

From fe33111739fad4cf289eb6d4896d296cafa3f7f2 Mon Sep 17 00:00:00 2001
From: Akira Matsuda <ronnie@dio.jp>
Date: Sat, 25 Oct 2025 12:22:46 +0900
Subject: [PATCH 3/3] Compact the yyyymm tabs

---
 app/views/messages/index.html.erb | 32 ++++++++++++++++++++++---------
 1 file changed, 23 insertions(+), 9 deletions(-)

diff --git a/app/views/messages/index.html.erb b/app/views/messages/index.html.erb
index 8975c57..1b563eb 100644
--- a/app/views/messages/index.html.erb
+++ b/app/views/messages/index.html.erb
@@ -7,16 +7,30 @@
 <% end %>
 
 <div class="mb-4 border border-gray-200 dark:border-gray-700 rounded-lg p-3 bg-white dark:bg-gray-800">
-  <% @yyyymms.group_by {|yyyymm| yyyymm[0, 4] }.sort.each do |year, months| %>
-    <div class="flex gap-1 items-center mb-1">
-      <span class="text-sm font-medium text-gray-700 dark:text-gray-300 w-12"><%= year %>:</span>
-      <div class="flex gap-1 flex-wrap">
-        <% months.sort.each do |yyyymm| %>
-          <%= link_to [@list, yyyymm: yyyymm], class: "px-2 py-1 text-xs font-medium rounded transition-colors #{@yyyymm == yyyymm ? 'bg-red-600 dark:bg-red-500 text-white border-2 border-red-700 dark:border-red-400' : 'bg-gray-100 dark:bg-gray-900 text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 border-2 border-transparent'}" do %>
-            <%= yyyymm[4..] %>
-          <% end %>
+  <%
+    selected_year = @yyyymm&.[](0, 4)
+    selected_month = @yyyymm&.[](4, 2)
+    years_with_months = @yyyymms.group_by {|yyyymm| yyyymm[0, 4] }.sort.reverse
+  %>
+
+  <!-- Year tabs -->
+  <div class="flex gap-2 overflow-x-auto pb-2 mb-3 border-b border-gray-200 dark:border-gray-700">
+    <% years_with_months.each do |year, months| %>
+      <%= link_to year, [@list, yyyymm: "#{year}#{months.sort.first[4, 2]}"], class: "px-3 py-1 text-sm font-medium rounded whitespace-nowrap transition-colors #{selected_year == year ? 'bg-red-600 dark:bg-red-500 text-white' : 'bg-gray-100 dark:bg-gray-900 text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100'}" %>
+    <% end %>
+  </div>
+
+  <!-- Month tabs -->
+  <% if selected_year %>
+    <div class="flex gap-1 flex-wrap">
+      <% available_months = years_with_months.detect {|y, _| y == selected_year }&.last&.map {|yyyymm| yyyymm[4, 2] } || [] %>
+      <% ('01'..'12').each do |month| %>
+        <% if available_months.include?(month) %>
+          <%= link_to month, [@list, yyyymm: "#{selected_year}#{month}"], class: "px-2 py-1 text-xs font-medium rounded transition-colors #{selected_month == month ? 'bg-red-600 dark:bg-red-500 text-white border-2 border-red-700 dark:border-red-400' : 'bg-gray-100 dark:bg-gray-900 text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 border-2 border-transparent'}" %>
+        <% else %>
+          <span class="px-2 py-1 text-xs font-medium rounded text-gray-300 dark:text-gray-600 border-2 border-transparent"><%= month %></span>
         <% end %>
-      </div>
+      <% end %>
     </div>
   <% end %>
 </div>