From 2ed62e553acbbd29ec17d182c15b33818f90bb07 Mon Sep 17 00:00:00 2001
From: Josh Krebs <joddykrebs4@gmail.com>
Date: Mon, 21 Aug 2023 16:41:21 -0700
Subject: [PATCH 1/2] refactor MonthCountSelector to tsx

---
 ...hCountSelector.js => MonthCountSelector.tsx} | 17 +++++++++++++++--
 1 file changed, 15 insertions(+), 2 deletions(-)
 rename packages/desktop-client/src/components/budget/{MonthCountSelector.js => MonthCountSelector.tsx} (79%)

diff --git a/packages/desktop-client/src/components/budget/MonthCountSelector.js b/packages/desktop-client/src/components/budget/MonthCountSelector.tsx
similarity index 79%
rename from packages/desktop-client/src/components/budget/MonthCountSelector.js
rename to packages/desktop-client/src/components/budget/MonthCountSelector.tsx
index d34dbf7a7f7..a31b627248b 100644
--- a/packages/desktop-client/src/components/budget/MonthCountSelector.js
+++ b/packages/desktop-client/src/components/budget/MonthCountSelector.tsx
@@ -6,7 +6,12 @@ import View from '../common/View';
 
 import { useBudgetMonthCount } from './BudgetMonthCountContext';
 
-function Calendar({ color, onClick }) {
+type CalendarProps = {
+  color: string;
+  onClick: () => void;
+};
+
+function Calendar({ color, onClick }: CalendarProps) {
   return (
     <CalendarIcon
       style={{ width: 13, height: 13, color, marginRight: 5 }}
@@ -15,7 +20,15 @@ function Calendar({ color, onClick }) {
   );
 }
 
-export function MonthCountSelector({ maxMonths, onChange }) {
+type MonthCountSelectorProps = {
+  maxMonths?: number;
+  onChange: () => void;
+};
+
+export function MonthCountSelector({
+  maxMonths,
+  onChange,
+}: MonthCountSelectorProps) {
   let { displayMax } = useBudgetMonthCount();
 
   // It doesn't make sense to show anything if we can only fit one

From 1f92f10df7677f645e424c32469a725036754bf8 Mon Sep 17 00:00:00 2001
From: Josh Krebs <joddykrebs4@gmail.com>
Date: Mon, 21 Aug 2023 17:23:15 -0700
Subject: [PATCH 2/2] refactor to pass tests

---
 .../src/components/budget/MonthCountSelector.tsx              | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/desktop-client/src/components/budget/MonthCountSelector.tsx b/packages/desktop-client/src/components/budget/MonthCountSelector.tsx
index a31b627248b..d5bba0f3a20 100644
--- a/packages/desktop-client/src/components/budget/MonthCountSelector.tsx
+++ b/packages/desktop-client/src/components/budget/MonthCountSelector.tsx
@@ -21,8 +21,8 @@ function Calendar({ color, onClick }: CalendarProps) {
 }
 
 type MonthCountSelectorProps = {
-  maxMonths?: number;
-  onChange: () => void;
+  maxMonths: number;
+  onChange: (value: number) => Promise<void>;
 };
 
 export function MonthCountSelector({