From f301b1a5a0b2f2bd6e58d2725e85765f97a96996 Mon Sep 17 00:00:00 2001
From: Test User <test@example.com>
Date: Fri, 17 Apr 2026 00:56:05 +0000
Subject: [PATCH] fix(GRO-642): add real-time validation for tip split
 percentages

Add pre-submit validation in markPaid() that checks tip split percentages
sum to 100% before allowing the payment to be processed. This addresses
Finding #7 from the frontend code quality review (GRO-628).

Co-Authored-By: Paperclip <noreply@paperclip.ing>
---
 apps/web/src/pages/Invoices.tsx | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/apps/web/src/pages/Invoices.tsx b/apps/web/src/pages/Invoices.tsx
index 8363695..2cbf3ae 100644
--- a/apps/web/src/pages/Invoices.tsx
+++ b/apps/web/src/pages/Invoices.tsx
@@ -211,6 +211,15 @@ function InvoiceDetailModal({
     setSaving(true);
     setError(null);
     const tipCents = Math.round(parseFloat(tipStr) * 100) || 0;
+    // Real-time validation: prevent submit if tip splits don't sum to 100%
+    if (showSplits && tipCents > 0 && tipSplits.length > 0) {
+      const totalPct = tipSplits.reduce((s, r) => s + r.pct, 0);
+      if (Math.abs(totalPct - 100) >= 0.01) {
+        setError("Tip split percentages must sum to 100%");
+        setSaving(false);
+        return;
+      }
+    }
     try {
       const res = await fetch(`/api/invoices/${invoice.id}`, {
         method: "PATCH",