Skip to content

Commit 2bc0b91

Browse files
CrawlerCodeCrawlerCode
committed
chore: Upgrade to react 19
1 parent c97da8e commit 2bc0b91

File tree

12 files changed

+395
-380
lines changed

12 files changed

+395
-380
lines changed

‎package.json‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -38,11 +38,11 @@
3838
"deepmerge": "^4.3.1",
3939
"flatpickr": "^4.6.13",
4040
"formik": "^2.4.6",
41-
"react": "^18.3.1",
42-
"react-dom": "^18.3.1",
41+
"react": "^19.0.0",
42+
"react-dom": "^19.0.0",
4343
"react-flatpickr": "^3.10.13",
44-
"react-intl": "^6.8.7",
45-
"react-router-dom": "^6.28.0",
44+
"react-intl": "^7.0.4",
45+
"react-router-dom": "^7.0.2",
4646
"react-select": "^5.9.0",
4747
"react-tooltip": "^5.28.0",
4848
"tailwind-merge": "^2.5.5",
@@ -54,8 +54,8 @@
5454
"@playwright/test": "^1.49.1",
5555
"@types/chrome": "^0.0.287",
5656
"@types/node": "^22.10.2",
57-
"@types/react": "^18.3.12",
58-
"@types/react-dom": "^18.3.1",
57+
"@types/react": "^19.0.1",
58+
"@types/react-dom": "^19.0.2",
5959
"@types/react-flatpickr": "^3.8.11",
6060
"@typescript-eslint/eslint-plugin": "^8.18.0",
6161
"@typescript-eslint/parser": "^8.18.0",
@@ -75,7 +75,7 @@
7575
"tailwindcss": "^3.4.16",
7676
"tailwindcss-animate": "^1.0.7",
7777
"typescript": "^5.7.2",
78-
"vite": "^5.4.10",
78+
"vite": "^6.0.3",
7979
"vite-plugin-static-copy": "^2.2.0",
8080
"vite-plugin-zip-pack": "^1.2.4"
8181
},

‎pnpm-lock.yaml‎

Lines changed: 334 additions & 315 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/components/general/DateField.tsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@ const DateField = ({ size = "md", title, icon, error, className, value, onChange
4343
id={id}
4444
ref={ref}
4545
{...props}
46+
type="hidden"
4647
options={{
4748
...props.options,
4849
altInput: true,
@@ -53,7 +54,7 @@ const DateField = ({ size = "md", title, icon, error, className, value, onChange
5354
onChange?.({
5455
target: {
5556
name: props.name,
56-
value: instance.config.mode === "single" ? dates[0] ?? null : dates,
57+
value: instance.config.mode === "single" ? (dates[0] ?? null) : dates,
5758
},
5859
// eslint-disable-next-line @typescript-eslint/no-explicit-any
5960
} as any);

‎src/components/general/InputField.tsx‎

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { faAsterisk } from "@fortawesome/free-solid-svg-icons";
22
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
33
import clsx from "clsx";
4-
import { forwardRef, useId } from "react";
4+
import { useId } from "react";
55
import { Tooltip } from "react-tooltip";
66

77
interface PropTypes extends Omit<React.ComponentProps<"input">, "id" | "size"> {
@@ -12,7 +12,7 @@ interface PropTypes extends Omit<React.ComponentProps<"input">, "id" | "size"> {
1212
inputClassName?: string;
1313
}
1414

15-
const InputField = forwardRef<HTMLInputElement, PropTypes>(({ size = "md", title, icon, error, extraText, className, inputClassName, ...props }: PropTypes, ref) => {
15+
const InputField = ({ size = "md", title, icon, error, extraText, className, inputClassName, ...props }: PropTypes) => {
1616
const id = useId();
1717

1818
return (
@@ -32,7 +32,6 @@ const InputField = forwardRef<HTMLInputElement, PropTypes>(({ size = "md", title
3232
<div className="relative">
3333
{icon && <div className="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3">{icon}</div>}
3434
<input
35-
ref={ref}
3635
{...props}
3736
id={id}
3837
required={false} // Remove html required attribute
@@ -73,8 +72,6 @@ const InputField = forwardRef<HTMLInputElement, PropTypes>(({ size = "md", title
7372
)}
7473
</div>
7574
);
76-
});
77-
78-
InputField.displayName = "InputField";
75+
};
7976

8077
export default InputField;

‎src/components/issues/EditIssueModal.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -339,7 +339,7 @@ const EditIssueModal = ({ issue: currentIssue, onClose, onSuccess }: PropTypes)
339339
allowClose={false}
340340
message={
341341
isAxiosError(updateIssueMutation.error)
342-
? (updateIssueMutation.error as AxiosError<TRedmineError>).response?.data?.errors?.join(", ") ?? (updateIssueMutation.error as AxiosError).message
342+
? ((updateIssueMutation.error as AxiosError<TRedmineError>).response?.data?.errors?.join(", ") ?? (updateIssueMutation.error as AxiosError).message)
343343
: (updateIssueMutation.error as Error).message
344344
}
345345
/>

‎src/components/issues/IssueTimer.tsx‎

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { faCircleCheck } from "@fortawesome/free-regular-svg-icons";
22
import { faPause, faPlay, faStop } from "@fortawesome/free-solid-svg-icons";
33
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
44
import clsx from "clsx";
5-
import { ForwardedRef, forwardRef, useEffect, useImperativeHandle, useState } from "react";
5+
import { Ref, useEffect, useImperativeHandle, useState } from "react";
66
import { FormattedMessage, useIntl } from "react-intl";
77
import { Tooltip } from "react-tooltip";
88
import useSettings from "../../hooks/useSettings";
@@ -29,6 +29,7 @@ export type TimerActions = {
2929
type PropTypes = {
3030
issue: TIssue;
3131
data: IssueTimerData;
32+
ref: Ref<TimerRef>;
3233
} & TimerActions;
3334

3435
export type TimerRef = {
@@ -39,7 +40,7 @@ export type TimerRef = {
3940
editTimer: () => void;
4041
};
4142

42-
const IssueTimer = forwardRef(({ issue, data: { active, time, start }, onStart, onPause, onReset, onOverrideTime, onDoneTimer }: PropTypes, ref: ForwardedRef<TimerRef>) => {
43+
const IssueTimer = ({ issue, data: { active, time, start }, onStart, onPause, onReset, onOverrideTime, onDoneTimer, ref }: PropTypes) => {
4344
const { formatMessage } = useIntl();
4445
const { settings } = useSettings();
4546

@@ -196,12 +197,10 @@ const IssueTimer = forwardRef(({ issue, data: { active, time, start }, onStart,
196197
)}
197198
</>
198199
);
199-
});
200+
};
200201

201202
const calcTime = (time: number, start?: number) => {
202203
return time + (start ? new Date().getTime() - start : 0);
203204
};
204205

205-
IssueTimer.displayName = "IssueTimer";
206-
207206
export default IssueTimer;

‎src/components/issues/Search.tsx‎

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { faChevronRight, faSearch, faX } from "@fortawesome/free-solid-svg-icons";
22
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
3-
import { ForwardedRef, ReactNode, forwardRef, useImperativeHandle, useRef, useState } from "react";
3+
import { ReactNode, Ref, useImperativeHandle, useRef, useState } from "react";
44
import { FormattedMessage, useIntl } from "react-intl";
55
import useHotKey from "../../hooks/useHotkey";
66
import useSettings from "../../hooks/useSettings";
@@ -17,13 +17,14 @@ const defaultSearchQuery: SearchQuery = { searching: false, query: "" };
1717

1818
type PropTypes = {
1919
children: (state: { search: SearchQuery }) => ReactNode;
20+
ref: Ref<SearchRef>;
2021
};
2122

2223
export type SearchRef = {
2324
searchInProject: (project: TReference) => void;
2425
};
2526

26-
const Search = forwardRef(({ children }: PropTypes, ref: ForwardedRef<SearchRef>) => {
27+
const Search = ({ children, ref }: PropTypes) => {
2728
const { formatMessage } = useIntl();
2829
const { settings } = useSettings();
2930

@@ -110,8 +111,6 @@ const Search = forwardRef(({ children }: PropTypes, ref: ForwardedRef<SearchRef>
110111
})}
111112
</>
112113
);
113-
});
114-
115-
Search.displayName = "Search";
114+
};
116115

117116
export default Search;

‎src/hooks/useOnClickOutside.ts‎

Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,22 @@
1-
import { RefObject, useEffect } from "react";
2-
3-
const useOnClickOutside = <T extends HTMLElement>(ref: RefObject<T>, handler: (event: Event) => void) => {
4-
useEffect(() => {
5-
const listener = (event: Event) => {
6-
if (!ref.current || ref.current.contains(event.target as Node)) {
7-
return;
8-
}
9-
handler(event);
10-
};
11-
12-
document.addEventListener("mousedown", listener);
13-
document.addEventListener("touchstart", listener);
14-
15-
return () => {
16-
document.removeEventListener("mousedown", listener);
17-
document.removeEventListener("touchstart", listener);
18-
};
19-
}, [ref, handler]);
20-
};
21-
22-
export default useOnClickOutside;
1+
import { RefObject, useEffect } from "react";
2+
3+
const useOnClickOutside = <T extends HTMLElement>(ref: RefObject<T | null>, handler: (event: Event) => void) => {
4+
useEffect(() => {
5+
const listener = (event: Event) => {
6+
if (!ref.current || ref.current.contains(event.target as Node)) {
7+
return;
8+
}
9+
handler(event);
10+
};
11+
12+
document.addEventListener("mousedown", listener);
13+
document.addEventListener("touchstart", listener);
14+
15+
return () => {
16+
document.removeEventListener("mousedown", listener);
17+
document.removeEventListener("touchstart", listener);
18+
};
19+
}, [ref, handler]);
20+
};
21+
22+
export default useOnClickOutside;

‎src/hooks/useSettings.ts‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
1-
import { useContext } from "react";
2-
import { SettingsContext } from "../provider/SettingsProvider";
3-
4-
/**
5-
* Use settings context
6-
*/
7-
const useSettings = () => {
8-
return useContext(SettingsContext);
9-
};
10-
11-
export default useSettings;
1+
import { use } from "react";
2+
import { SettingsContext } from "../provider/SettingsProvider";
3+
4+
/**
5+
* Use settings context
6+
*/
7+
const useSettings = () => {
8+
return use(SettingsContext);
9+
};
10+
11+
export default useSettings;

‎src/pages/IssuesPage.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ import useStorage from "../hooks/useStorage";
1414

1515
const _defaultIssues = {};
1616

17-
const IssuesPage = ({ search, filter, searchRef, isLoading: isPageLoading }: { search: SearchQuery; filter: FilterQuery; searchRef: RefObject<SearchRef>; isLoading: boolean }) => {
17+
const IssuesPage = ({ search, filter, searchRef, isLoading: isPageLoading }: { search: SearchQuery; filter: FilterQuery; searchRef: RefObject<SearchRef | null>; isLoading: boolean }) => {
1818
const { formatMessage } = useIntl();
1919
const { settings } = useSettings();
2020

0 commit comments

Comments
 (0)