From 409d2560bca1a00c0ba5615080df5238faca26f8 Mon Sep 17 00:00:00 2001
From: Deven Thiel <DevenThiel@gmail.com>
Date: Thu, 5 Mar 2026 19:00:56 -0500
Subject: [PATCH] Changed from color inversion to brightness lowered for ko-fi
 pop up in dark mode, as inversion breaks QR codes

---
 src/__tests__/appStore.test.ts |  7 ++++++-
 src/__tests__/storage.test.ts  |  9 +++++++--
 src/lib/stats/aggregate.ts     |  6 +++---
 src/pages/TaxPage.tsx          |  2 +-
 src/themes/global.css          | 10 +++++-----
 tsconfig.json                  |  3 ++-
 6 files changed, 24 insertions(+), 13 deletions(-)

diff --git a/src/__tests__/appStore.test.ts b/src/__tests__/appStore.test.ts
index 1265b29..62ce62e 100644
--- a/src/__tests__/appStore.test.ts
+++ b/src/__tests__/appStore.test.ts
@@ -9,7 +9,12 @@ describe('appStore — CRUD', () => {
         payments: [],
         expenses: [],
         taxInputs: {},
-        dashboard: { charts: [], widgets: [] },
+        recurringExpenses: [],
+        dashboard: {
+          charts: [], widgets: [],
+          workCharts: [], paymentsCharts: [], expensesCharts: [], taxCharts: [],
+          workTiles: [], paymentsTiles: [], expensesTiles: [], taxTiles: [],
+        },
         settings: { theme: 'standard', mode: 'dark', defaultRate: 50 },
         version: 1,
       },
diff --git a/src/__tests__/storage.test.ts b/src/__tests__/storage.test.ts
index 1b5ef31..60487f9 100644
--- a/src/__tests__/storage.test.ts
+++ b/src/__tests__/storage.test.ts
@@ -57,8 +57,13 @@ describe('Vault', () => {
     payments: [],
     expenses: [],
     taxInputs: {},
-    dashboard: { charts: [], widgets: [] },
-    settings: { theme: 'standard', mode: 'dark', storageMode: 'cookie', defaultRate: 50 },
+    recurringExpenses: [],
+    dashboard: {
+      charts: [], widgets: [],
+      workCharts: [], paymentsCharts: [], expensesCharts: [], taxCharts: [],
+      workTiles: [], paymentsTiles: [], expensesTiles: [], taxTiles: [],
+    },
+    settings: { theme: 'standard', mode: 'dark', defaultRate: 50 },
     version: 1,
   });
 
diff --git a/src/lib/stats/aggregate.ts b/src/lib/stats/aggregate.ts
index e01f17d..adfcb5f 100644
--- a/src/lib/stats/aggregate.ts
+++ b/src/lib/stats/aggregate.ts
@@ -276,7 +276,7 @@ export function buildHierarchyForRange(
         }));
         return {
           key: d,
-          level: 'day',
+          level: 'day' as const,
           label: format(new Date(d + 'T00:00:00'), 'EEE, MMM d'),
           value: itemNodes.reduce((s, n) => s + n.value, 0),
           children: itemNodes,
@@ -284,7 +284,7 @@ export function buildHierarchyForRange(
       });
       return {
         key: month,
-        level: 'month',
+        level: 'month' as const,
         label: format(new Date(month + '-01T00:00:00'), 'MMMM yyyy'),
         value: dayNodes.reduce((s, n) => s + n.value, 0),
         children: dayNodes,
@@ -292,7 +292,7 @@ export function buildHierarchyForRange(
     });
     return {
       key: year,
-      level: 'year',
+      level: 'year' as const,
       label: year,
       value: monthNodes.reduce((s, n) => s + n.value, 0),
       children: monthNodes,
diff --git a/src/pages/TaxPage.tsx b/src/pages/TaxPage.tsx
index 75c4fdb..548f37f 100644
--- a/src/pages/TaxPage.tsx
+++ b/src/pages/TaxPage.tsx
@@ -169,7 +169,7 @@ export function TaxPage() {
                       step="0.01"
                       className="input"
                       placeholder={isAutoFilled ? String(autoValue) : 'Enter value...'}
-                      value={inputs[p.field] ?? ''}
+                      value={(inputs[p.field] as number | undefined) ?? ''}
                       onChange={(e) =>
                         updateInput({ [p.field]: e.target.value ? Number(e.target.value) : undefined })
                       }
diff --git a/src/themes/global.css b/src/themes/global.css
index 7121b31..ec7660e 100644
--- a/src/themes/global.css
+++ b/src/themes/global.css
@@ -781,14 +781,14 @@ select.ss-input { cursor: pointer; }
   min-height: 0;
   display: block;
   width: 100%;
-  background: #fff;
 }
 
-/* In dark mode, invert the iframe content then rotate hue back so colours
-   stay natural while the bright white background becomes dark.
-   Background is set to #fff so it inverts to near-black, matching the theme. */
+/* In dark mode, dim the iframe to reduce glare without inverting colours.
+   Full inversion would break QR codes inside the widget, so we use a gentle
+   brightness reduction instead — enough to soften the bright white background
+   without flipping black/white and making QR codes unreadable. */
 [data-mode='dark'] .kofi-modal iframe {
-  filter: invert(1) hue-rotate(180deg);
+  filter: brightness(0.65);
 }
 
 /* ─── Hamburger / mobile nav ─────────────────────────────────────────────── */
diff --git a/tsconfig.json b/tsconfig.json
index 6289338..0cf6d35 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -20,5 +20,6 @@
       "@/*": ["src/*"]
     }
   },
-  "include": ["src"]
+  "include": ["src"],
+  "exclude": ["src/__tests__"]
 }