From 2081e25cf5435413df7b7865b868936d6a03c378 Mon Sep 17 00:00:00 2001
From: Joshua Krebs <101300086+Jod929@users.noreply.github.com>
Date: Thu, 21 Sep 2023 16:25:40 -0700
Subject: [PATCH] refactor BudgetMonthCountContext to tsx (#1722)

* refactor BudgetMonthCountContext to tsx

* add release notes
---
 .../budget/BudgetMonthCountContext.js         | 17 ---------
 .../budget/BudgetMonthCountContext.tsx        | 35 +++++++++++++++++++
 upcoming-release-notes/1722.md                |  6 ++++
 3 files changed, 41 insertions(+), 17 deletions(-)
 delete mode 100644 packages/desktop-client/src/components/budget/BudgetMonthCountContext.js
 create mode 100644 packages/desktop-client/src/components/budget/BudgetMonthCountContext.tsx
 create mode 100644 upcoming-release-notes/1722.md

diff --git a/packages/desktop-client/src/components/budget/BudgetMonthCountContext.js b/packages/desktop-client/src/components/budget/BudgetMonthCountContext.js
deleted file mode 100644
index 4fda12ed7b..0000000000
--- a/packages/desktop-client/src/components/budget/BudgetMonthCountContext.js
+++ /dev/null
@@ -1,17 +0,0 @@
-import React, { createContext, useContext, useState } from 'react';
-
-let BudgetMonthCountContext = createContext();
-
-export function BudgetMonthCountProvider({ children }) {
-  let [displayMax, setDisplayMax] = useState(1);
-
-  return (
-    <BudgetMonthCountContext.Provider value={{ displayMax, setDisplayMax }}>
-      {children}
-    </BudgetMonthCountContext.Provider>
-  );
-}
-
-export function useBudgetMonthCount() {
-  return useContext(BudgetMonthCountContext);
-}
diff --git a/packages/desktop-client/src/components/budget/BudgetMonthCountContext.tsx b/packages/desktop-client/src/components/budget/BudgetMonthCountContext.tsx
new file mode 100644
index 0000000000..4a825f4ec2
--- /dev/null
+++ b/packages/desktop-client/src/components/budget/BudgetMonthCountContext.tsx
@@ -0,0 +1,35 @@
+import React, {
+  createContext,
+  type Dispatch,
+  type ReactNode,
+  type SetStateAction,
+  useContext,
+  useState,
+} from 'react';
+
+type BudgetMonthCountContextValue = {
+  displayMax: number;
+  setDisplayMax: Dispatch<SetStateAction<number>>;
+};
+
+let BudgetMonthCountContext = createContext<BudgetMonthCountContextValue>(null);
+
+type BudgetMonthCountProviderProps = {
+  children: ReactNode;
+};
+
+export function BudgetMonthCountProvider({
+  children,
+}: BudgetMonthCountProviderProps) {
+  let [displayMax, setDisplayMax] = useState(1);
+
+  return (
+    <BudgetMonthCountContext.Provider value={{ displayMax, setDisplayMax }}>
+      {children}
+    </BudgetMonthCountContext.Provider>
+  );
+}
+
+export function useBudgetMonthCount() {
+  return useContext(BudgetMonthCountContext);
+}
diff --git a/upcoming-release-notes/1722.md b/upcoming-release-notes/1722.md
new file mode 100644
index 0000000000..5eaca206e8
--- /dev/null
+++ b/upcoming-release-notes/1722.md
@@ -0,0 +1,6 @@
+---
+category: Maintenance
+authors: [Jod929]
+---
+
+Refactor budget/BudgetMonthCountContext to tsx.
\ No newline at end of file