feat: remove confirmation popup from status badge toggle (v0.24.3)

Clicking status badges (Late, Due Soon, Upcoming, Missed) now instantly
toggles paid/unpaid. Removed AlertDialog from TrackerPage.jsx — no more
confirmation dialog blocking the action.

FUTURE.md

@@ -3,7 +3,7 @@
 **This document tracks potential future enhancements for Bill Tracker.**
 
 **Last Updated:** 2026-05-10  
-**Current Version:** v0.24.2
+**Current Version:** v0.24.3
 
 ## How to Use This Document
 

HISTORY.md

@@ -1,5 +1,10 @@
 # Bill Tracker — Changelog
 
+## v0.24.3
+
+### Changed
+- **Status badge toggle is instant** — removed the AlertDialog confirmation popup. Clicking Late/Due Soon/Upcoming/Missed badges now toggles paid/unpaid directly.
+
 ## v0.24.2
 
 ### Fixed

client/lib/version.js

@@ -1,10 +1,10 @@
-export const APP_VERSION = '0.24.2';
+export const APP_VERSION = '0.24.3';
 export const APP_NAME    = 'BillTracker';
 
 export const RELEASE_NOTES = {
-  version: '0.24.2',
+  version: '0.24.3',
   date: '2026-05-10',
   highlights: [
-    { icon: '🐛', title: 'StatusBadge Toggle Fix', desc: 'Fixed clicking status badges (Late, Due Soon, etc.) to toggle paid/unpaid — was passing wrong property name to API.' },
+    { icon: '🖱️', title: 'Instant Status Toggle', desc: 'Clicking status badges (Late, Due Soon, Upcoming, Missed) now toggles paid/unpaid directly — no more confirmation popup.' },
   ],
 };

client/pages/TrackerPage.jsx

@@ -14,16 +14,6 @@ import {
 import {
   Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter,
 } from '@/components/ui/dialog';
-import {
-  AlertDialog,
-  AlertDialogAction,
-  AlertDialogCancel,
-  AlertDialogContent,
-  AlertDialogDescription,
-  AlertDialogFooter,
-  AlertDialogHeader,
-  AlertDialogTitle,
-} from '@/components/ui/alert-dialog';
 import {
   Select, SelectTrigger, SelectValue, SelectContent, SelectItem,
 } from '@/components/ui/select';
@@ -795,7 +785,6 @@ function Row({ row, year, month, refresh, index, onEditBill }) {
   const [editPayment, setEditPayment] = useState(null);
   const [showMbs,     setShowMbs]     = useState(false);
   const [loading,     setLoading]     = useState(false);
-  const [confirmOpen, setConfirmOpen] = useState(false);
 
   // Effective amount threshold for this bill this month:
   // actual_amount (if set by monthly override) takes priority over the template expected_amount.
@@ -843,7 +832,6 @@ function Row({ row, year, month, refresh, index, onEditBill }) {
       toast.error(err.message || 'Failed to toggle payment status');
     } finally {
       setLoading?.(false);
-      setConfirmOpen(false);
     }
   }
 
@@ -943,16 +931,6 @@ function Row({ row, year, month, refresh, index, onEditBill }) {
             clickable
             onClick={() => {
               if (effectiveStatus === 'skipped') return;
-              
-              const isPaid = effectiveStatus === 'paid' || effectiveStatus === 'autodraft';
-              
-              // Show confirmation dialog for toggling Unpaid -> Paid
-              if (!isPaid) {
-                setConfirmOpen(true);
-                return;
-              }
-              
-              // For mark unpaid, proceed directly
               handleTogglePaid();
             }}
             loading={loading}
@@ -1032,22 +1010,6 @@ function Row({ row, year, month, refresh, index, onEditBill }) {
       )}
 
       {/* Payment toggle confirmation dialog */}
-      <AlertDialog open={confirmOpen} onOpenChange={setConfirmOpen}>
-        <AlertDialogContent>
-          <AlertDialogHeader>
-            <AlertDialogTitle>Mark "{row.name}" as paid?</AlertDialogTitle>
-            <AlertDialogDescription>
-              This will record a payment for this bill. You can edit the payment later.
-            </AlertDialogDescription>
-          </AlertDialogHeader>
-          <AlertDialogFooter>
-            <AlertDialogCancel>Cancel</AlertDialogCancel>
-            <AlertDialogAction onClick={handleTogglePaid}>
-              Confirm Payment
-            </AlertDialogAction>
-          </AlertDialogFooter>
-        </AlertDialogContent>
-      </AlertDialog>
     </>
   );
 }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "bill-tracker",
-  "version": "0.24.2",
+  "version": "0.24.3",
   "description": "Monthly bill tracking system",
   "main": "server.js",
   "scripts": {