⬆️ Upgrade react to v19

karlosos · Jan 7, 2025 · c60907e · c60907e
1 parent 9cfc16e
commit c60907e
Show file tree

Hide file tree

Showing 7 changed files with 51 additions and 73 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -30,9 +30,9 @@
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "lucide-react": "^0.469.0",
-    "react": "^18.3.1",
+    "react": "^19.0.0",
     "react-datepicker": "^7.6.0",
-    "react-dom": "^18.3.1",
+    "react-dom": "^19.0.0",
     "react-dropzone": "^14.3.5",
     "react-redux": "^9.2.0",
     "tailwind-merge": "^2.6.0",
@@ -47,8 +47,8 @@
     "@testing-library/user-event": "^14.5.2",
     "@types/jest": "^29.5.14",
     "@types/node": "^22.10.5",
-    "@types/react": "^18.3.12",
-    "@types/react-dom": "^18.3.1",
+    "@types/react": "^19.0.3",
+    "@types/react-dom": "^19.0.2",
     "@typescript-eslint/eslint-plugin": "^8.19.1",
     "@typescript-eslint/parser": "^8.19.1",
     "autoprefixer": "^10.4.20",

diff --git a/src/app/features/TimeEntries/TimeEntriesList/__tests__/TimeEntryEdit.test.tsx b/src/app/features/TimeEntries/TimeEntriesList/__tests__/TimeEntryEdit.test.tsx
@@ -1,4 +1,4 @@
-import { act, render, screen, within } from "@testing-library/react";
+import { render, screen, within } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import connectStore from "../../../../testUtils/connectStore";
 import { settingsFixture, timeEntriesFixture } from "../../store/fixtures";
@@ -51,9 +51,7 @@ describe("TimeEntry Edit", () => {
     await user.clear(stopTimeInput);
     await user.type(stopTimeInput, "20:10");
 
-    await act(async () => {
-      await user.click(saveButton);
-    });
+    await user.click(saveButton);
 
     // assert
     await user.click(collapseButton);

diff --git a/src/app/features/TimeEntries/TopBar/CurrentTimeEntry.tsx b/src/app/features/TimeEntries/TopBar/CurrentTimeEntry.tsx
@@ -72,7 +72,7 @@ const useElapsedTimeForEntry = (currentTimeEntry: TimeEntry) => {
   const [elapsedTime, setElapsedTime] = useState<number>(
     currentTimeEntry ? Date.now() - currentTimeEntry.startTime : 0,
   );
-  const intervalRef = useRef<ReturnType<typeof setInterval>>();
+  const intervalRef = useRef<ReturnType<typeof setInterval>>(undefined);
 
   useEffect(() => {
     setElapsedTime(

diff --git a/src/app/features/TimeEntries/TopBar/__tests__/TopBar.Editing.test.tsx b/src/app/features/TimeEntries/TopBar/__tests__/TopBar.Editing.test.tsx
@@ -1,4 +1,4 @@
-import { act, render, screen } from "@testing-library/react";
+import { render, screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import connectStore from "../../../../testUtils/connectStore";
 import { TopBar } from "../TopBar";
@@ -51,9 +51,7 @@ describe("TopBar Editing", () => {
     await user.clear(startTimeInput);
     await user.type(startTimeInput, "20:05");
 
-    await act(async () => {
-      await user.click(saveButton);
-    });
+    await user.click(saveButton);
 
     // assert
     expect(screen.getByText("--Completely new task--")).toBeInTheDocument();

diff --git a/src/app/hooks/useKeyPress.ts b/src/app/hooks/useKeyPress.ts
@@ -3,7 +3,7 @@ import { useCallback, useEffect } from "react";
 export function useKeyPress(
   callback: () => void,
   keyCodes: string[],
-  ref: React.RefObject<HTMLElement>,
+  ref: React.RefObject<HTMLElement | null>,
 ): void {
   const handler = useCallback(
     ({ code }: KeyboardEvent) => {

diff --git a/src/app/testUtils/connectStore.tsx b/src/app/testUtils/connectStore.tsx
@@ -12,7 +12,7 @@ const initialState: RootState = {
 };
 
 function connectStore(
-  component: ReactElement,
+  component: ReactElement<any>,
   preloadedState: RootState = initialState,
 ) {
   // TODO: see store.ts regarding preloadedState typing