From e5d06f91e5a403502f90e8a0cf69dfe2a8dd72f8 Mon Sep 17 00:00:00 2001
From: Konrad du Plessis <konradzar@gmail.com>
Date: Thu, 23 Apr 2026 18:42:19 +0200
Subject: [PATCH] polish(adjustments): rotate chevron on collapse + lock in
 magnitude ordering
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Code-review follow-ups on Task 5:

1. Chevron rotation — Bootstrap 5 collapse sets aria-expanded="false" on
   the toggle when collapsed; two CSS rules off that attribute rotate
   the chevron -90deg with a 150ms transition. No JS needed.

2. test_group_by_type now asserts groups[0]['label'] == 'Bonus', locking
   in the descending-|net_sum| ordering promise (|800| > |100|).

60/60 tests still pass.
---
 core/tests.py         | 3 +++
 static/css/custom.css | 7 +++++++
 2 files changed, 10 insertions(+)

diff --git a/core/tests.py b/core/tests.py
index 8a89f23..b3cdf27 100644
--- a/core/tests.py
+++ b/core/tests.py
@@ -1082,6 +1082,9 @@ class AdjustmentsTabTests(TestCase):
         self.assertEqual(bonus_group['net_sum'], Decimal('800.00'))  # +R 500 + +R 300
         deduction_group = next(g for g in groups if g['label'] == 'Deduction')
         self.assertEqual(deduction_group['net_sum'], Decimal('-100.00'))
+        # Groups must be ordered by descending |net_sum| — biggest impact
+        # first. |800| > |100| so Bonus must come before Deduction.
+        self.assertEqual(groups[0]['label'], 'Bonus')
 
     def test_group_by_worker(self):
         self._login_admin()
diff --git a/static/css/custom.css b/static/css/custom.css
index 1cedb1b..dc7518e 100644
--- a/static/css/custom.css
+++ b/static/css/custom.css
@@ -1986,6 +1986,13 @@ body, .card, .modal-content, .form-control, .form-select,
 .adj-group-header[data-type="Advance Payment"]   { border-left: 4px solid var(--badge-advance-bg); }
 .adj-group-header[data-type="Advance Repayment"] { border-left: 4px solid var(--badge-advance-rep-bg); }
 
+/* --- Chevron rotates to indicate collapsed / expanded state.
+       Bootstrap sets aria-expanded="false" on the toggle when collapsed;
+       we rotate the chevron 90deg counter-clockwise so it points right,
+       a familiar "this is collapsed" signal. --- */
+.adj-group-header .fa-chevron-down { transition: transform 150ms ease; }
+.adj-group-header[aria-expanded="false"] .fa-chevron-down { transform: rotate(-90deg); }
+
 /* --- Floating bulk action bar (appears when >=1 row selected) --- */
 .adj-bulk-bar {
     position: fixed;