Skip to content

Commit 4be0506

Browse files
CodeDeadCodeDead
committed
feat: Yarn upgrade, dependency upgrades, refactoring
1 parent 88d5fc1 commit 4be0506

12 files changed

Lines changed: 871 additions & 853 deletions

File tree

.yarn/releases/yarn-4.9.3.cjs renamed to .yarn/releases/yarn-4.10.3.cjs

Lines changed: 332 additions & 332 deletions
Large diffs are not rendered by default.

‎.yarnrc.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
nodeLinker: node-modules
22

3-
yarnPath: .yarn/releases/yarn-4.9.3.cjs
3+
yarnPath: .yarn/releases/yarn-4.10.3.cjs

‎package.json‎

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -10,30 +10,30 @@
1010
"preview": "vite preview"
1111
},
1212
"dependencies": {
13-
"@mantine/core": "^8.2.7",
14-
"@mantine/dropzone": "^8.2.7",
15-
"@mantine/hooks": "^8.2.7",
16-
"@mantine/notifications": "^8.2.7",
17-
"@tabler/icons-react": "^3.34.1",
13+
"@mantine/core": "^8.3.2",
14+
"@mantine/dropzone": "^8.3.2",
15+
"@mantine/hooks": "^8.3.2",
16+
"@mantine/notifications": "^8.3.2",
17+
"@tabler/icons-react": "^3.35.0",
1818
"compressorjs": "^1.2.1",
1919
"react": "^19.1.1",
2020
"react-dom": "^19.1.1",
21-
"react-router-dom": "^7.8.2"
21+
"react-router-dom": "^7.9.3"
2222
},
2323
"devDependencies": {
24-
"@eslint/compat": "^1.3.2",
25-
"@eslint/js": "^9.34.0",
26-
"@types/react": "^19.1.10",
27-
"@types/react-dom": "^19.1.7",
28-
"@vitejs/plugin-react": "^5.0.1",
29-
"eslint": "^9.34.0",
24+
"@eslint/compat": "^1.4.0",
25+
"@eslint/js": "^9.36.0",
26+
"@types/react": "^19.1.15",
27+
"@types/react-dom": "^19.1.9",
28+
"@vitejs/plugin-react": "^5.0.4",
29+
"eslint": "^9.36.0",
3030
"eslint-plugin-react": "^7.37.5",
31-
"globals": "^16.3.0",
31+
"globals": "^16.4.0",
3232
"postcss": "^8.5.6",
3333
"postcss-preset-mantine": "^1.18.0",
3434
"postcss-simple-vars": "^7.0.1",
3535
"prettier": "^3.6.2",
36-
"vite": "^7.1.2"
36+
"vite": "^7.1.7"
3737
},
38-
"packageManager": "yarn@4.9.3"
38+
"packageManager": "yarn@4.10.3"
3939
}

‎postcss.config.cjs‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
module.exports = {
2-
plugins: {
3-
'postcss-preset-mantine': {},
4-
'postcss-simple-vars': {
5-
variables: {
6-
'mantine-breakpoint-xs': '36em',
7-
'mantine-breakpoint-sm': '48em',
8-
'mantine-breakpoint-md': '62em',
9-
'mantine-breakpoint-lg': '75em',
10-
'mantine-breakpoint-xl': '88em',
11-
},
12-
},
2+
plugins: {
3+
'postcss-preset-mantine': {},
4+
'postcss-simple-vars': {
5+
variables: {
6+
'mantine-breakpoint-xs': '36em',
7+
'mantine-breakpoint-sm': '48em',
8+
'mantine-breakpoint-md': '62em',
9+
'mantine-breakpoint-lg': '75em',
10+
'mantine-breakpoint-xl': '88em',
11+
},
1312
},
13+
},
1414
};

‎src/components/App/index.jsx‎

Lines changed: 3 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,15 @@
1-
import React, { useEffect, useContext, Suspense, lazy } from "react";
1+
import React, { Suspense, lazy } from "react";
22
import HeaderBar from "../HeaderBar";
3-
import { Center, Loader, useMantineColorScheme } from "@mantine/core";
3+
import { Center, Loader } from "@mantine/core";
44
import { AppShell } from "@mantine/core";
55
import { BrowserRouter, Routes, Route } from "react-router-dom";
66
import Footer from "../Footer/index.jsx";
7-
import { MainContext } from "../../context/MainContextProvider";
87

98
const Home = lazy(() => import("../../routes/Home"));
109
const About = lazy(() => import("../../routes/About"));
1110
const NotFound = lazy(() => import("../../routes/NotFound"));
1211

1312
const App = () => {
14-
const [state] = useContext(MainContext);
15-
const { setColorScheme } = useMantineColorScheme();
16-
17-
const { themeType } = state;
18-
19-
useEffect(() => {
20-
setColorScheme(themeType);
21-
}, []);
22-
2313
return (
2414
<BrowserRouter>
2515
<AppShell header={{ height: 60 }} footer={{ height: 100 }} padding="md">
@@ -41,7 +31,7 @@ const App = () => {
4131
</Routes>
4232
</Suspense>
4333
</AppShell.Main>
44-
<AppShell.Footer>
34+
<AppShell.Footer visibleFrom="xs">
4535
<Footer />
4636
</AppShell.Footer>
4737
</AppShell>

‎src/components/HeaderBar/index.jsx‎

Lines changed: 25 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -16,13 +16,12 @@ import classes from "./headerbar.module.css";
1616
import { ActionIcon } from "@mantine/core";
1717
import { IconSun, IconSunOff } from "@tabler/icons-react";
1818
import { useNavigate } from "react-router-dom";
19-
import { setThemeType } from "../../reducer/MainReducer/Actions/index.js";
2019
import { MainContext } from "../../context/MainContextProvider/index.jsx";
2120

2221
const HeaderBar = () => {
23-
const { colorScheme, setColorScheme } = useMantineColorScheme();
22+
const { toggleColorScheme } = useMantineColorScheme();
2423
const [opened, { toggle }] = useDisclosure(false);
25-
const [state, d1] = useContext(MainContext);
24+
const [state] = useContext(MainContext);
2625
const navigate = useNavigate();
2726

2827
const { pageIndex } = state;
@@ -45,10 +44,7 @@ const HeaderBar = () => {
4544
* Change the color scheme
4645
*/
4746
const changeTheme = () => {
48-
const newTheme = colorScheme === "dark" ? "light" : "dark";
49-
50-
d1(setThemeType(newTheme));
51-
setColorScheme(newTheme);
47+
toggleColorScheme();
5248
};
5349

5450
/**
@@ -110,13 +106,28 @@ const HeaderBar = () => {
110106
Contact
111107
</a>
112108
</Group>
113-
<Tooltip label={colorScheme === "dark" ? "Light" : "Dark"}>
114-
<ActionIcon aria-label="Theme" variant="subtle" onClick={changeTheme}>
115-
{colorScheme === "dark" ? (
116-
<IconSunOff style={{ width: "70%", height: "70%" }} stroke={1.5} />
117-
) : (
118-
<IconSun style={{ width: "70%", height: "70%" }} stroke={1.5} />
119-
)}
109+
110+
<Tooltip label="Light">
111+
<ActionIcon
112+
aria-label="Theme"
113+
variant="subtle"
114+
onClick={changeTheme}
115+
lightHidden
116+
visibleFrom="xs"
117+
>
118+
<IconSun style={{ width: "70%", height: "70%" }} stroke={1.5} />
119+
</ActionIcon>
120+
</Tooltip>
121+
122+
<Tooltip label="Dark">
123+
<ActionIcon
124+
aria-label="Theme"
125+
variant="subtle"
126+
onClick={changeTheme}
127+
darkHidden
128+
visibleFrom="xs"
129+
>
130+
<IconSunOff style={{ width: "70%", height: "70%" }} stroke={1.5} />
120131
</ActionIcon>
121132
</Tooltip>
122133

‎src/context/MainContextProvider/index.jsx‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,8 @@ import React from "react";
22
import { createContext, useReducer } from "react";
33
import MainReducer from "../../reducer/MainReducer/index.jsx";
44

5-
const themeType = localStorage.themeType ? localStorage.themeType : "auto";
6-
75
const initialState = {
86
pageIndex: 0,
9-
themeType,
107
};
118

129
export const MainContext = createContext(initialState);

‎src/main.jsx‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,19 @@
1-
import React from "react";
2-
import ReactDOM from "react-dom/client";
1+
import React, { StrictMode } from "react";
2+
import { createRoot } from "react-dom/client";
33
import { MantineProvider } from "@mantine/core";
4-
import "@mantine/core/styles.css";
5-
import "@mantine/notifications/styles.css";
64
import App from "./components/App";
75
import MainContextProvider from "./context/MainContextProvider/index.jsx";
86
import { Notifications } from "@mantine/notifications";
7+
import "@mantine/core/styles.css";
8+
import "@mantine/notifications/styles.css";
99

10-
ReactDOM.createRoot(document.getElementById("root")).render(
11-
<React.StrictMode>
12-
<MainContextProvider>
13-
<MantineProvider>
14-
<Notifications />
10+
createRoot(document.getElementById("root")).render(
11+
<StrictMode>
12+
<MantineProvider defaultColorScheme="auto">
13+
<Notifications />
14+
<MainContextProvider>
1515
<App />
16-
</MantineProvider>
17-
</MainContextProvider>
18-
</React.StrictMode>,
16+
</MainContextProvider>
17+
</MantineProvider>
18+
</StrictMode>,
1919
);

‎src/reducer/MainReducer/Actions/ActionTypes/index.js‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,2 +1 @@
11
export const SET_PAGE_INDEX = "SET_PAGE_INDEX";
2-
export const SET_THEME_TYPE = "SET_THEME_TYPE";

‎src/reducer/MainReducer/Actions/index.js‎

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,6 @@
1-
import { SET_PAGE_INDEX, SET_THEME_TYPE } from "./ActionTypes/index.js";
1+
import { SET_PAGE_INDEX } from "./ActionTypes/index.js";
22

33
export const setPageIndex = (index) => ({
44
type: SET_PAGE_INDEX,
55
payload: index,
66
});
7-
8-
export const setThemeType = (type) => ({
9-
type: SET_THEME_TYPE,
10-
payload: type,
11-
});

0 commit comments

Comments
 (0)