From 2e58d9e26f30782ec57e969558f371f891477975 Mon Sep 17 00:00:00 2001
From: Barely Removable <user@MacBookAir.localdomain>
Date: Wed, 26 Aug 2026 14:00:54 -0700
Subject: [PATCH] Cap Ombi requests to 5 with a Show more toggle

An unbounded request list made the Ombi card grow far taller than the
Prowlarr indexer grid beside it, leaving the row looking lopsided even
after the earlier align-items fix. Reuse the same show-more pattern
already used for the Rotten Tomatoes lists instead of an internal
scrollbar, so both cards land at a comparable height.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 templates/dashboard.html | 25 ++++++++++++-------------
 1 file changed, 12 insertions(+), 13 deletions(-)

diff --git a/templates/dashboard.html b/templates/dashboard.html
index 7371fd2..9602afa 100644
--- a/templates/dashboard.html
+++ b/templates/dashboard.html
@@ -521,14 +521,8 @@
     .indexer-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--text-2); }
 
     /* ── Requests (Ombi) ────────────────────────────────── */
-    .req-list {
-      display: flex;
-      flex-direction: column;
-      gap: 0.5rem;
-      max-height: 30rem;
-      overflow-y: auto;
-      padding-right: 0.3rem;
-    }
+    .req-list { display: flex; flex-direction: column; gap: 0.5rem; }
+    .req-item.is-hidden { display: none; }
     .req-item {
       display: flex;
       align-items: center;
@@ -1008,9 +1002,9 @@
           <div class="card-body">
             {% if ombi.status == 'ok' %}
               {% if ombi.recent %}
-              <div class="req-list">
+              <div class="req-list" id="req-list">
                 {% for req in ombi.recent %}
-                <div class="req-item">
+                <div class="req-item {{ 'is-hidden' if loop.index > 5 }}">
                   <span class="badge {{ 'movie' if req.type == 'Movie' else 'tv' }}">{{ req.type }}</span>
                   <div class="req-info">
                     <div class="req-title">{{ req.title }}</div>
@@ -1020,6 +1014,10 @@
                 </div>
                 {% endfor %}
               </div>
+              {% if ombi.recent | length > 5 %}
+              <button class="btn btn-quiet show-more" onclick="toggleMore(this, 'req-list')"
+                      aria-expanded="false">Show {{ ombi.recent | length - 5 }} more</button>
+              {% endif %}
               {% else %}
               <p class="empty">No recent requests.</p>
               {% endif %}
@@ -1179,16 +1177,17 @@
     function toggleMore(btn, listId) {
       const list = document.getElementById(listId);
       if (!list) return;
-      const hidden = list.querySelectorAll('.rt-item.is-hidden');
+      const items = Array.from(list.children);
+      const hidden = items.filter(el => el.classList.contains('is-hidden'));
       if (hidden.length) {
         hidden.forEach(el => el.classList.remove('is-hidden'));
         btn.textContent = 'Show less';
         btn.setAttribute('aria-expanded', 'true');
       } else {
-        list.querySelectorAll('.rt-item').forEach((el, i) => {
+        items.forEach((el, i) => {
           if (i >= 5) el.classList.add('is-hidden');
         });
-        const n = list.querySelectorAll('.rt-item').length - 5;
+        const n = items.length - 5;
         btn.textContent = 'Show ' + n + ' more';
         btn.setAttribute('aria-expanded', 'false');
       }