From fcc68704c10c983305c4c9c5e2d6e31c48f4520f Mon Sep 17 00:00:00 2001
From: Spythere <spythere@protonmail.com>
Date: Wed, 11 Mar 2026 13:46:59 +0100
Subject: [PATCH] chore: package upgrade & migration fixes

---
 package.json                          | 29 ++++++++++++++-------------
 src/components/Navbar.tsx             |  1 +
 src/components/TechScroller.tsx       |  4 ++--
 src/components/styles/About.styled.ts |  2 +-
 src/styled.d.ts                       | 20 ++++++++++++++++++
 src/theme.ts                          |  4 +++-
 6 files changed, 42 insertions(+), 18 deletions(-)
 create mode 100644 src/styled.d.ts

diff --git a/package.json b/package.json
index 590ba2b..9b27149 100644
--- a/package.json
+++ b/package.json
@@ -12,24 +12,25 @@
   },
   "dependencies": {
     "@gsap/react": "^2.1.0",
-    "i18next": "^23.4.6",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-i18next": "^13.2.1",
-    "react-icons": "^4.12.0",
+    "gsap": "^3.14.2",
+    "i18next": "^25.8.17",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4",
+    "react-i18next": "^16.5.7",
+    "react-icons": "^5.6.0",
     "styled-components": "^6.0.7"
   },
   "devDependencies": {
-    "@types/react": "^18.2.15",
-    "@types/react-dom": "^18.2.7",
-    "@typescript-eslint/eslint-plugin": "^6.0.0",
-    "@typescript-eslint/parser": "^6.0.0",
-    "@vitejs/plugin-react": "^4.0.3",
-    "eslint": "^8.45.0",
-    "eslint-plugin-react-hooks": "^4.6.0",
-    "eslint-plugin-react-refresh": "^0.4.3",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "@typescript-eslint/eslint-plugin": "^8.57.0",
+    "@typescript-eslint/parser": "^8.57.0",
+    "@vitejs/plugin-react": "^5.1.4",
+    "eslint": "^10.0.3",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "eslint-plugin-react-refresh": "^0.5.2",
     "sass": "^1.66.1",
     "typescript": "^5.0.2",
-    "vite": "^4.4.5"
+    "vite": "^7.3.1"
   }
 }
diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
index bcf073b..5f000ea 100644
--- a/src/components/Navbar.tsx
+++ b/src/components/Navbar.tsx
@@ -1,6 +1,7 @@
 import { useTranslation } from 'react-i18next';
 import { StyledLangButton, StyledNavbar, StyledNavBrand, StyledNavlinksWrapper } from './styles/Navbar.styled';
 import { FaBookOpen, FaUser } from 'react-icons/fa';
+import { JSX } from 'react';
 
 interface NavLink {
   title: string;
diff --git a/src/components/TechScroller.tsx b/src/components/TechScroller.tsx
index 7ae1b20..a737ef5 100644
--- a/src/components/TechScroller.tsx
+++ b/src/components/TechScroller.tsx
@@ -1,5 +1,5 @@
 import { FaHtml5, FaCss3Alt, FaJs, FaVuejs, FaReact } from 'react-icons/fa';
-import { SiNestjs, SiNuxtdotjs, SiPrisma, SiTypescript, SiPostgresql } from 'react-icons/si';
+import { SiNestjs, SiNuxt, SiPrisma, SiTypescript, SiPostgresql } from 'react-icons/si';
 import { styled } from 'styled-components';
 
 // Styled
@@ -17,7 +17,7 @@ const StyledTechScroller = styled.ul`
 `;
 
 // Component
-const techs = [FaHtml5, FaCss3Alt, FaJs, FaVuejs, FaReact, SiNestjs, SiNuxtdotjs, SiPrisma, SiTypescript, SiPostgresql];
+const techs = [FaHtml5, FaCss3Alt, FaJs, FaVuejs, FaReact, SiNestjs, SiNuxt, SiPrisma, SiTypescript, SiPostgresql];
 
 function TechScroller() {
   return (
diff --git a/src/components/styles/About.styled.ts b/src/components/styles/About.styled.ts
index 61dd138..87d88af 100644
--- a/src/components/styles/About.styled.ts
+++ b/src/components/styles/About.styled.ts
@@ -14,7 +14,7 @@ export const StyledAbout = styled.section`
     .about-content {
       h2 {
         font-size: 1.5em;
-        color: ${({ theme }) => theme.colors['200']};
+        color: ${({ theme }) => theme.colors};
       }
 
       p {
diff --git a/src/styled.d.ts b/src/styled.d.ts
new file mode 100644
index 0000000..e0bba23
--- /dev/null
+++ b/src/styled.d.ts
@@ -0,0 +1,20 @@
+import "styled-components";
+
+declare module "styled-components" {
+  export interface DefaultTheme {
+    colors: {
+      200: string;
+      300: string;
+      400: string;
+      500: string;
+      600: string;
+      bg: string;
+      accent: string;
+    };
+
+    fonts: {
+      primary: string;
+      monospace: string;
+    };
+  }
+}
diff --git a/src/theme.ts b/src/theme.ts
index 260d0f0..2f635a0 100644
--- a/src/theme.ts
+++ b/src/theme.ts
@@ -1,4 +1,6 @@
-export const theme = {
+import { DefaultTheme } from "styled-components";
+
+export const theme: DefaultTheme = {
   colors: {
     200: '#e0e1dd',
     300: '#bbc1c9',