Upgrade deps 23-11-2024

package.json

@@ -21,13 +21,13 @@
     "@mui/icons-material": "^5.11.16",
     "@mui/material": "^5.12.3",
     "@tanstack/react-query": "5.0.0-alpha.26",
-    "@tanstack/react-query-devtools": "5.0.0-alpha.30",
+    "@tanstack/react-query-devtools": "5.61.0",
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^14.0.0",
     "@testing-library/user-event": "^14.4.3",
     "axios": "^1.4.0",
     "clsx": "^1.2.1",
-    "katex": "^0.16.7",
+    "katex": "^0.16.11",
     "luxon": "^3.3.0",
     "mathjax-full": "^3.2.2",
     "mathjax-react": "^2.0.1",
@@ -42,38 +42,38 @@
     "rehype-katex": "^7.0.1",
     "remark-gfm": "^4.0.0",
     "remark-math": "^6.0.0",
-    "typescript": "^5.0.4",
+    "typescript": "^5.7.2",
     "unstated-next": "^1.1.0",
-    "usehooks-ts": "^2.9.1"
+    "usehooks-ts": "^3.1.0"
   },
   "devDependencies": {
-    "@svgr/webpack": "^8.0.1",
+    "@svgr/webpack": "^8.1.0",
     "@testing-library/dom": "^9.2.0",
     "@types/jest": "^29.5.1",
-    "@types/katex": "^0",
+    "@types/katex": "^0.16.7",
     "@types/luxon": "^3.3.0",
     "@types/node": "^20.1.0",
     "@types/react": "^19.0.0-rc.1",
     "@types/react-dom": "^19.0.0-rc.1",
     "@types/react-router-dom": "^5.3.3",
-    "@typescript-eslint/eslint-plugin": "^5.59.5",
-    "@typescript-eslint/parser": "^5.59.5",
+    "@typescript-eslint/eslint-plugin": "^8.15.0",
+    "@typescript-eslint/parser": "^8.15.0",
     "confusing-browser-globals": "^1.0.11",
-    "eslint": "^8.40.0",
+    "eslint": "^9.15.0",
     "eslint-config-next": "15.0.3",
-    "eslint-config-prettier": "^8.8.0",
+    "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-eslint-comments": "^3.2.0",
     "eslint-plugin-filenames": "^1.3.2",
-    "eslint-plugin-import": "^2.27.5",
-    "eslint-plugin-jest": "^27.2.1",
-    "eslint-plugin-no-secrets": "^0.8.9",
+    "eslint-plugin-import": "^2.31.0",
+    "eslint-plugin-jest": "^28.9.0",
+    "eslint-plugin-no-secrets": "^1.1.2",
     "eslint-plugin-node": "^11.1.0",
-    "eslint-plugin-prettier": "^4.2.1",
-    "eslint-plugin-promise": "^6.1.1",
-    "eslint-plugin-security": "^1.7.1",
-    "eslint-plugin-simple-import-sort": "^10.0.0",
-    "eslint-plugin-unicorn": "^47.0.0",
-    "prettier": "^2.8.8",
+    "eslint-plugin-prettier": "^5.2.1",
+    "eslint-plugin-promise": "^7.1.0",
+    "eslint-plugin-security": "^3.0.1",
+    "eslint-plugin-simple-import-sort": "^12.1.1",
+    "eslint-plugin-unicorn": "^56.0.1",
+    "prettier": "^3.3.3",
     "sass": "^1.62.1",
     "typed-scss-modules": "^7.1.0"
   },

src/components/SchoolSubForm/SchoolSubForm.tsx

@@ -1,9 +1,8 @@
 import {Stack} from '@mui/material'
 import {useQuery} from '@tanstack/react-query'
 import axios from 'axios'
-import {useRef} from 'react'
+import {useEffect, useRef} from 'react'
 import {Control, UseFormSetValue, UseFormWatch} from 'react-hook-form'
-import {useUpdateEffect} from 'usehooks-ts'
 
 import {IGrade} from '@/types/api/competition'
 import {ISchool} from '@/types/api/personal'
@@ -35,6 +34,8 @@ export const SchoolSubForm = ({control, watch, setValue, gap}: SchoolSubFormProp
   const withoutSchoolItem = useRef<SelectOption>(undefined)
   const noGradeItem = useRef<SelectOption>(undefined)
 
+  const firstRender = useRef(true)
+
   // načítanie ročníkov z BE, ktorými vyplníme FormSelect s ročníkmi
   const {data: gradesData} = useQuery({
     queryKey: ['competition', 'grade'],
@@ -60,10 +61,11 @@ export const SchoolSubForm = ({control, watch, setValue, gap}: SchoolSubFormProp
   noGradeItem.current = gradeItems.find(({id}) => id === 13)
 
   // predvyplnenie/zmazania hodnôt pri zakliknutí checkboxu pre užívateľa po škole
-  useUpdateEffect(() => {
+  useEffect(() => {
+    if (!firstRender) return
+
     if (without_school) {
       setValue('school', withoutSchoolItem.current)
-      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
       setValue('grade', noGradeItem.current!)
       setValue('school_not_found', false)
     } else {
@@ -73,14 +75,22 @@ export const SchoolSubForm = ({control, watch, setValue, gap}: SchoolSubFormProp
   }, [without_school])
 
   // predvyplnenie/zmazania hodnôt pri zakliknutí checkboxu pre neznámu školu
-  useUpdateEffect(() => {
+  useEffect(() => {
+    if (!firstRender) return
+
     if (school_not_found) {
       setValue('school', otherSchoolItem.current)
     } else if (!without_school) {
       setValue('school', null)
     }
   }, [school_not_found])
 
+  useEffect(() => {
+    if (firstRender.current) {
+      firstRender.current = false
+    }
+  }, [])
+
   const requiredRule = {required: '* Toto pole nemôže byť prázdne.'}
   return (
     <Stack gap={gap}>

src/utils/PageTitleContainer.tsx

@@ -1,11 +1,19 @@
-import {useState} from 'react'
+import {useEffect, useRef, useState} from 'react'
 import {createContainer} from 'unstated-next'
-import {useUpdateEffect} from 'usehooks-ts'
 
 const usePageTitle = (initial = '') => {
   const [pageTitle, setPageTitle] = useState(initial)
 
-  useUpdateEffect(() => {
+  const firstRender = useRef(true)
+
+  // ked navigujeme napr. z Kos na Matboj, ostavame na /akcie/[[]..params]], preto treba tento effect
+  useEffect(() => {
+    // na konci prveho renderu ale zbytocne budeme nastavovat title na `initial` znovu,
+    // a tym dovolime inym komponentom (napr. SemesterPicker-u) nastavit title zdola
+    if (firstRender.current) {
+      firstRender.current = false
+      return
+    }
     setPageTitle(initial)
   }, [initial])