From d42cd3d988efa1abc00ba93644ef1b810a86c370 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Wed, 28 Jan 2026 16:47:15 +0000
Subject: [PATCH 1/4] Initial plan


From d8ead9b79c90ca72a375f9a7ed8a4ee3e2f15894 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Wed, 28 Jan 2026 16:50:33 +0000
Subject: [PATCH 2/4] Add toggle button to hide/show reviews-bottom-bar

Co-authored-by: marcoacierno <3382153+marcoacierno@users.noreply.github.com>
---
 backend/reviews/templates/grants-recap.html   | 71 +++++++++++++++++++
 .../reviews/templates/proposals-recap.html    | 71 +++++++++++++++++++
 2 files changed, 142 insertions(+)

diff --git a/backend/reviews/templates/grants-recap.html b/backend/reviews/templates/grants-recap.html
index bdf87ad6ac..c41dcf8b52 100644
--- a/backend/reviews/templates/grants-recap.html
+++ b/backend/reviews/templates/grants-recap.html
@@ -75,6 +75,11 @@
     z-index: 500;
     background-color: #417690;
     color: #fff;
+    transition: transform 0.3s ease-in-out;
+  }
+
+  .reviews-bottom-bar.hidden {
+    transform: translateY(100%);
   }
 
   .reviews-bottom-bar-content {
@@ -105,6 +110,37 @@
     max-width: 800px;
   }
 
+  .reviews-bottom-bar-toggle {
+    position: fixed;
+    bottom: 10px;
+    right: 20px;
+    z-index: 501;
+    background-color: #417690;
+    color: #fff;
+    border: 2px solid #fff;
+    border-radius: 50%;
+    width: 50px;
+    height: 50px;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 24px;
+    transition: bottom 0.3s ease-in-out, background-color 0.2s;
+  }
+
+  .reviews-bottom-bar-toggle:hover {
+    background-color: #2a5d75;
+  }
+
+  .reviews-bottom-bar.hidden ~ .reviews-bottom-bar-toggle {
+    bottom: 10px;
+  }
+
+  .reviews-bottom-bar:not(.hidden) ~ .reviews-bottom-bar-toggle {
+    bottom: 100px;
+  }
+
   .results-table ul {
     margin-left: 0;
     padding: 0;
@@ -537,6 +573,38 @@
   };
 
   window.addEventListener('load', initSorting);
+
+  // Toggle bottom bar visibility
+  const toggleBottomBar = () => {
+    const bottomBar = document.querySelector('.reviews-bottom-bar');
+    const toggleIcon = document.getElementById('toggle-icon');
+    
+    bottomBar.classList.toggle('hidden');
+    
+    if (bottomBar.classList.contains('hidden')) {
+      toggleIcon.textContent = '▲';
+    } else {
+      toggleIcon.textContent = '▼';
+    }
+    
+    // Save preference in localStorage
+    localStorage.setItem('bottomBarHidden', bottomBar.classList.contains('hidden'));
+  };
+
+  // Restore bottom bar state from localStorage
+  window.addEventListener('load', () => {
+    const bottomBarHidden = localStorage.getItem('bottomBarHidden') === 'true';
+    const bottomBar = document.querySelector('.reviews-bottom-bar');
+    const toggleIcon = document.getElementById('toggle-icon');
+    const toggleButton = document.getElementById('bottom-bar-toggle');
+    
+    if (bottomBarHidden) {
+      bottomBar.classList.add('hidden');
+      toggleIcon.textContent = '▲';
+    }
+    
+    toggleButton.addEventListener('click', toggleBottomBar);
+  });
 </script>
 <ul class="object-tools">
   <li>
@@ -904,5 +972,8 @@ <h2 class="current-grants-num">
     </div>
   </div>
   {% endif %}
+  <button type="button" class="reviews-bottom-bar-toggle" id="bottom-bar-toggle" title="Toggle bottom bar visibility">
+    <span id="toggle-icon">▼</span>
+  </button>
 </form>
 {% endblock %}
diff --git a/backend/reviews/templates/proposals-recap.html b/backend/reviews/templates/proposals-recap.html
index f22ba08e20..21bfb57682 100644
--- a/backend/reviews/templates/proposals-recap.html
+++ b/backend/reviews/templates/proposals-recap.html
@@ -70,6 +70,11 @@
     z-index: 500;
     background-color: #417690;
     color: #fff;
+    transition: transform 0.3s ease-in-out;
+  }
+
+  .reviews-bottom-bar.hidden {
+    transform: translateY(100%);
   }
 
   .reviews-bottom-bar-content {
@@ -93,6 +98,37 @@
     max-width: 800px;
   }
 
+  .reviews-bottom-bar-toggle {
+    position: fixed;
+    bottom: 10px;
+    right: 20px;
+    z-index: 501;
+    background-color: #417690;
+    color: #fff;
+    border: 2px solid #fff;
+    border-radius: 50%;
+    width: 50px;
+    height: 50px;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 24px;
+    transition: bottom 0.3s ease-in-out, background-color 0.2s;
+  }
+
+  .reviews-bottom-bar-toggle:hover {
+    background-color: #2a5d75;
+  }
+
+  .reviews-bottom-bar.hidden ~ .reviews-bottom-bar-toggle {
+    bottom: 10px;
+  }
+
+  .reviews-bottom-bar:not(.hidden) ~ .reviews-bottom-bar-toggle {
+    bottom: 100px;
+  }
+
   ul.proposal-ranking {
     margin-top: 0;
     margin-left: 30px;
@@ -324,6 +360,38 @@
       }
     );
   };
+
+  // Toggle bottom bar visibility
+  const toggleBottomBar = () => {
+    const bottomBar = document.querySelector('.reviews-bottom-bar');
+    const toggleIcon = document.getElementById('toggle-icon');
+    
+    bottomBar.classList.toggle('hidden');
+    
+    if (bottomBar.classList.contains('hidden')) {
+      toggleIcon.textContent = '▲';
+    } else {
+      toggleIcon.textContent = '▼';
+    }
+    
+    // Save preference in localStorage
+    localStorage.setItem('bottomBarHidden', bottomBar.classList.contains('hidden'));
+  };
+
+  // Restore bottom bar state from localStorage
+  window.addEventListener('load', () => {
+    const bottomBarHidden = localStorage.getItem('bottomBarHidden') === 'true';
+    const bottomBar = document.querySelector('.reviews-bottom-bar');
+    const toggleIcon = document.getElementById('toggle-icon');
+    const toggleButton = document.getElementById('bottom-bar-toggle');
+    
+    if (bottomBarHidden) {
+      bottomBar.classList.add('hidden');
+      toggleIcon.textContent = '▲';
+    }
+    
+    toggleButton.addEventListener('click', toggleBottomBar);
+  });
 </script>
 
 <form id="changelist-form" method="post" novalidate="">
@@ -591,5 +659,8 @@ <h2>Waiting List: <span id="waitinglist-proposals-num">0</span></h2>
       </div>
     </div>
   </div>
+  <button type="button" class="reviews-bottom-bar-toggle" id="bottom-bar-toggle" title="Toggle bottom bar visibility">
+    <span id="toggle-icon">▼</span>
+  </button>
 </form>
 {% endblock %}

From 6317a2ea57c1aede6f3765ab754a7c52cb986644 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Wed, 28 Jan 2026 16:54:08 +0000
Subject: [PATCH 3/4] Fix accessibility, consolidate event listeners, and use
 page-specific localStorage keys

Co-authored-by: marcoacierno <3382153+marcoacierno@users.noreply.github.com>
---
 backend/reviews/templates/grants-recap.html   | 44 +++++++++++--------
 .../reviews/templates/proposals-recap.html    | 40 +++++++++--------
 2 files changed, 47 insertions(+), 37 deletions(-)

diff --git a/backend/reviews/templates/grants-recap.html b/backend/reviews/templates/grants-recap.html
index c41dcf8b52..d4a799266d 100644
--- a/backend/reviews/templates/grants-recap.html
+++ b/backend/reviews/templates/grants-recap.html
@@ -572,39 +572,45 @@
       });
   };
 
-  window.addEventListener('load', initSorting);
+  window.addEventListener('load', () => {
+    initSorting();
+    
+    // Initialize bottom bar toggle functionality
+    const bottomBarHidden = localStorage.getItem('grantsBottomBarHidden') === 'true';
+    const bottomBar = document.querySelector('.reviews-bottom-bar');
+    const toggleIcon = document.getElementById('toggle-icon');
+    const toggleButton = document.getElementById('bottom-bar-toggle');
+    
+    if (bottomBarHidden) {
+      bottomBar.classList.add('hidden');
+      toggleIcon.textContent = '▲';
+      toggleButton.setAttribute('aria-expanded', 'false');
+    } else {
+      toggleButton.setAttribute('aria-expanded', 'true');
+    }
+    
+    toggleButton.addEventListener('click', toggleBottomBar);
+  });
 
   // Toggle bottom bar visibility
   const toggleBottomBar = () => {
     const bottomBar = document.querySelector('.reviews-bottom-bar');
     const toggleIcon = document.getElementById('toggle-icon');
+    const toggleButton = document.getElementById('bottom-bar-toggle');
     
     bottomBar.classList.toggle('hidden');
     
     if (bottomBar.classList.contains('hidden')) {
       toggleIcon.textContent = '▲';
+      toggleButton.setAttribute('aria-expanded', 'false');
     } else {
       toggleIcon.textContent = '▼';
+      toggleButton.setAttribute('aria-expanded', 'true');
     }
     
     // Save preference in localStorage
-    localStorage.setItem('bottomBarHidden', bottomBar.classList.contains('hidden'));
+    localStorage.setItem('grantsBottomBarHidden', bottomBar.classList.contains('hidden'));
   };
-
-  // Restore bottom bar state from localStorage
-  window.addEventListener('load', () => {
-    const bottomBarHidden = localStorage.getItem('bottomBarHidden') === 'true';
-    const bottomBar = document.querySelector('.reviews-bottom-bar');
-    const toggleIcon = document.getElementById('toggle-icon');
-    const toggleButton = document.getElementById('bottom-bar-toggle');
-    
-    if (bottomBarHidden) {
-      bottomBar.classList.add('hidden');
-      toggleIcon.textContent = '▲';
-    }
-    
-    toggleButton.addEventListener('click', toggleBottomBar);
-  });
 </script>
 <ul class="object-tools">
   <li>
@@ -972,8 +978,8 @@ <h2 class="current-grants-num">
     </div>
   </div>
   {% endif %}
-  <button type="button" class="reviews-bottom-bar-toggle" id="bottom-bar-toggle" title="Toggle bottom bar visibility">
-    <span id="toggle-icon">▼</span>
+  <button type="button" class="reviews-bottom-bar-toggle" id="bottom-bar-toggle" aria-label="Toggle bottom bar visibility" aria-expanded="true">
+    <span id="toggle-icon" aria-hidden="true">▼</span>
   </button>
 </form>
 {% endblock %}
diff --git a/backend/reviews/templates/proposals-recap.html b/backend/reviews/templates/proposals-recap.html
index 21bfb57682..2100aedb85 100644
--- a/backend/reviews/templates/proposals-recap.html
+++ b/backend/reviews/templates/proposals-recap.html
@@ -192,6 +192,22 @@
     getRefs();
     updateBottomBarUI();
 
+    // Initialize bottom bar toggle functionality
+    const bottomBarHidden = localStorage.getItem('proposalsBottomBarHidden') === 'true';
+    const bottomBar = document.querySelector('.reviews-bottom-bar');
+    const toggleIcon = document.getElementById('toggle-icon');
+    const toggleButton = document.getElementById('bottom-bar-toggle');
+    
+    if (bottomBarHidden) {
+      bottomBar.classList.add('hidden');
+      toggleIcon.textContent = '▲';
+      toggleButton.setAttribute('aria-expanded', 'false');
+    } else {
+      toggleButton.setAttribute('aria-expanded', 'true');
+    }
+    
+    toggleButton.addEventListener('click', toggleBottomBar);
+
     submissions.forEach((submissionData) => {
       const submissionId = submissionData.id;
       const acceptInput = document.getElementById(
@@ -365,33 +381,21 @@
   const toggleBottomBar = () => {
     const bottomBar = document.querySelector('.reviews-bottom-bar');
     const toggleIcon = document.getElementById('toggle-icon');
+    const toggleButton = document.getElementById('bottom-bar-toggle');
     
     bottomBar.classList.toggle('hidden');
     
     if (bottomBar.classList.contains('hidden')) {
       toggleIcon.textContent = '▲';
+      toggleButton.setAttribute('aria-expanded', 'false');
     } else {
       toggleIcon.textContent = '▼';
+      toggleButton.setAttribute('aria-expanded', 'true');
     }
     
     // Save preference in localStorage
-    localStorage.setItem('bottomBarHidden', bottomBar.classList.contains('hidden'));
+    localStorage.setItem('proposalsBottomBarHidden', bottomBar.classList.contains('hidden'));
   };
-
-  // Restore bottom bar state from localStorage
-  window.addEventListener('load', () => {
-    const bottomBarHidden = localStorage.getItem('bottomBarHidden') === 'true';
-    const bottomBar = document.querySelector('.reviews-bottom-bar');
-    const toggleIcon = document.getElementById('toggle-icon');
-    const toggleButton = document.getElementById('bottom-bar-toggle');
-    
-    if (bottomBarHidden) {
-      bottomBar.classList.add('hidden');
-      toggleIcon.textContent = '▲';
-    }
-    
-    toggleButton.addEventListener('click', toggleBottomBar);
-  });
 </script>
 
 <form id="changelist-form" method="post" novalidate="">
@@ -659,8 +663,8 @@ <h2>Waiting List: <span id="waitinglist-proposals-num">0</span></h2>
       </div>
     </div>
   </div>
-  <button type="button" class="reviews-bottom-bar-toggle" id="bottom-bar-toggle" title="Toggle bottom bar visibility">
-    <span id="toggle-icon">▼</span>
+  <button type="button" class="reviews-bottom-bar-toggle" id="bottom-bar-toggle" aria-label="Toggle bottom bar visibility" aria-expanded="true">
+    <span id="toggle-icon" aria-hidden="true">▼</span>
   </button>
 </form>
 {% endblock %}

From 07ffc9cc6b5660d3c8836979bbab91489f0f85cb Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Wed, 28 Jan 2026 16:56:49 +0000
Subject: [PATCH 4/4] Add null checks and fix permission-based button placement

Co-authored-by: marcoacierno <3382153+marcoacierno@users.noreply.github.com>
---
 backend/reviews/templates/grants-recap.html   | 25 ++++++++++++-------
 .../reviews/templates/proposals-recap.html    | 23 +++++++++++------
 2 files changed, 31 insertions(+), 17 deletions(-)

diff --git a/backend/reviews/templates/grants-recap.html b/backend/reviews/templates/grants-recap.html
index d4a799266d..4dd7b33449 100644
--- a/backend/reviews/templates/grants-recap.html
+++ b/backend/reviews/templates/grants-recap.html
@@ -581,15 +581,17 @@
     const toggleIcon = document.getElementById('toggle-icon');
     const toggleButton = document.getElementById('bottom-bar-toggle');
     
-    if (bottomBarHidden) {
-      bottomBar.classList.add('hidden');
-      toggleIcon.textContent = '▲';
-      toggleButton.setAttribute('aria-expanded', 'false');
-    } else {
-      toggleButton.setAttribute('aria-expanded', 'true');
+    if (bottomBar && toggleIcon && toggleButton) {
+      if (bottomBarHidden) {
+        bottomBar.classList.add('hidden');
+        toggleIcon.textContent = '▲';
+        toggleButton.setAttribute('aria-expanded', 'false');
+      } else {
+        toggleButton.setAttribute('aria-expanded', 'true');
+      }
+      
+      toggleButton.addEventListener('click', toggleBottomBar);
     }
-    
-    toggleButton.addEventListener('click', toggleBottomBar);
   });
 
   // Toggle bottom bar visibility
@@ -598,6 +600,11 @@
     const toggleIcon = document.getElementById('toggle-icon');
     const toggleButton = document.getElementById('bottom-bar-toggle');
     
+    if (!bottomBar || !toggleIcon || !toggleButton) {
+      console.warn('Required elements for bottom bar toggle not found');
+      return;
+    }
+    
     bottomBar.classList.toggle('hidden');
     
     if (bottomBar.classList.contains('hidden')) {
@@ -977,9 +984,9 @@ <h2 class="current-grants-num">
       </div>
     </div>
   </div>
-  {% endif %}
   <button type="button" class="reviews-bottom-bar-toggle" id="bottom-bar-toggle" aria-label="Toggle bottom bar visibility" aria-expanded="true">
     <span id="toggle-icon" aria-hidden="true">▼</span>
   </button>
+  {% endif %}
 </form>
 {% endblock %}
diff --git a/backend/reviews/templates/proposals-recap.html b/backend/reviews/templates/proposals-recap.html
index 2100aedb85..02ef5d5d5c 100644
--- a/backend/reviews/templates/proposals-recap.html
+++ b/backend/reviews/templates/proposals-recap.html
@@ -198,15 +198,17 @@
     const toggleIcon = document.getElementById('toggle-icon');
     const toggleButton = document.getElementById('bottom-bar-toggle');
     
-    if (bottomBarHidden) {
-      bottomBar.classList.add('hidden');
-      toggleIcon.textContent = '▲';
-      toggleButton.setAttribute('aria-expanded', 'false');
-    } else {
-      toggleButton.setAttribute('aria-expanded', 'true');
+    if (bottomBar && toggleIcon && toggleButton) {
+      if (bottomBarHidden) {
+        bottomBar.classList.add('hidden');
+        toggleIcon.textContent = '▲';
+        toggleButton.setAttribute('aria-expanded', 'false');
+      } else {
+        toggleButton.setAttribute('aria-expanded', 'true');
+      }
+      
+      toggleButton.addEventListener('click', toggleBottomBar);
     }
-    
-    toggleButton.addEventListener('click', toggleBottomBar);
 
     submissions.forEach((submissionData) => {
       const submissionId = submissionData.id;
@@ -383,6 +385,11 @@
     const toggleIcon = document.getElementById('toggle-icon');
     const toggleButton = document.getElementById('bottom-bar-toggle');
     
+    if (!bottomBar || !toggleIcon || !toggleButton) {
+      console.warn('Required elements for bottom bar toggle not found');
+      return;
+    }
+    
     bottomBar.classList.toggle('hidden');
     
     if (bottomBar.classList.contains('hidden')) {