feat: updated dependencies

package.json

@@ -24,110 +24,110 @@
 		"setup": "sh setup.sh"
 	},
 	"dependencies": {
-		"@babel/runtime": "7.25.7",
+		"@babel/runtime": "7.26.0",
 		"classnames": "^2.5.1",
-		"core-js": "^3.38.1",
-		"dotenv": "^16.4.5",
+		"core-js": "^3.39.0",
+		"dotenv": "^16.4.7",
 		"express": "^5.0.0",
 		"morgan": "^1.10.0",
-		"postcss": "^8.4.47",
-		"react": "19.0.0-rc-fb9a90fa48-20240614",
-		"react-cookie": "^7.2.1",
-		"react-dom": "19.0.0-rc-fb9a90fa48-20240614",
-		"react-error-boundary": "^4.0.13",
-		"react-router": "^6.27.0",
-		"react-router-dom": "^6.27.0",
+		"postcss": "^8.4.49",
+		"react": "19.0.0",
+		"react-cookie": "^7.2.2",
+		"react-dom": "19.0.0",
+		"react-error-boundary": "^5.0.0",
+		"react-router": "^7.1.1",
+		"react-router-dom": "^7.1.1",
 		"reflect-metadata": "^0.2.2",
 		"tiny-invariant": "^1.3.3",
-		"universal-cookie-express": "^7.2.1",
+		"universal-cookie-express": "^7.2.2",
 		"url-join": "^5.0.0",
-		"uuid": "^10.0.0",
-		"winston": "^3.15.0",
-		"workbox-window": "^7.1.0",
-		"yup": "^1.4.0"
+		"uuid": "^11.0.3",
+		"winston": "^3.17.0",
+		"workbox-window": "^7.3.0",
+		"yup": "^1.6.1"
 	},
 	"devDependencies": {
-		"@babel/cli": "7.25.7",
-		"@babel/core": "7.25.8",
-		"@babel/plugin-proposal-decorators": "^7.25.7",
-		"@babel/plugin-transform-runtime": "^7.25.7",
-		"@babel/preset-env": "7.25.8",
-		"@babel/preset-react": "^7.25.7",
-		"@babel/preset-typescript": "^7.25.7",
-		"@babel/register": "7.25.7",
-		"@eslint/compat": "^1.2.0",
+		"@babel/cli": "7.26.4",
+		"@babel/core": "7.26.0",
+		"@babel/plugin-proposal-decorators": "^7.25.9",
+		"@babel/plugin-transform-runtime": "^7.25.9",
+		"@babel/preset-env": "7.26.0",
+		"@babel/preset-react": "^7.26.3",
+		"@babel/preset-typescript": "^7.26.0",
+		"@babel/register": "7.25.9",
+		"@eslint/compat": "^1.2.4",
 		"@pmmmwh/react-refresh-webpack-plugin": "^0.5.15",
 		"@svgr/webpack": "^8.1.0",
 		"@testing-library/dom": "^10.4.0",
-		"@testing-library/jest-dom": "^6.5.0",
-		"@testing-library/react": "^16.0.1",
+		"@testing-library/jest-dom": "^6.6.3",
+		"@testing-library/react": "^16.1.0",
 		"@testing-library/user-event": "^14.5.2",
-		"@types/classnames": "^2.3.1",
+		"@types/classnames": "^2.3.4",
 		"@types/express": "^5.0.0",
-		"@types/jest": "^29.5.13",
+		"@types/jest": "^29.5.14",
 		"@types/mini-css-extract-plugin": "^2.5.1",
 		"@types/morgan": "^1.9.9",
-		"@types/node": "^22.7.5",
-		"@types/react": "npm:types-react@rc",
-		"@types/react-dom": "npm:types-react-dom@rc",
+		"@types/node": "^22.10.2",
+		"@types/react": "19.0.2",
+		"@types/react-dom": "19.0.2",
 		"@types/require-from-string": "^1.2.3",
 		"@types/serve-favicon": "^2.5.7",
 		"@types/uuid": "^10.0.0",
 		"@types/webpack-env": "^1.18.5",
 		"@types/webpack-node-externals": "^3.0.4",
 		"@types/webpack-stats-plugin": "^0.3.5",
-		"@typescript-eslint/eslint-plugin": "^8.8.1",
-		"@typescript-eslint/parser": "^8.8.1",
+		"@typescript-eslint/eslint-plugin": "^8.18.2",
+		"@typescript-eslint/parser": "^8.18.2",
 		"autoprefixer": "^10.4.20",
 		"babel-loader": "^9.2.1",
-		"babel-plugin-react-compiler": "^0.0.0-experimental-ad3b12a-20241011",
+		"babel-plugin-react-compiler": "^19.0.0-beta-b2e8e9c-20241220",
 		"copy-webpack-plugin": "^12.0.2",
 		"cross-env": "^7.0.3",
 		"css-loader": "7.1.2",
 		"cssnano": "^7.0.6",
-		"eslint": "^9.12.0",
+		"eslint": "^9.17.0",
 		"eslint-plugin-prettier": "^5.2.1",
-		"eslint-plugin-react": "^7.37.1",
-		"eslint-plugin-react-compiler": "^0.0.0-experimental-45ae4c3-20241011",
+		"eslint-plugin-react": "^7.37.3",
+		"eslint-plugin-react-compiler": "^19.0.0-beta-b2e8e9c-20241220",
 		"fork-ts-checker-webpack-plugin": "^9.0.2",
-		"globals": "^15.11.0",
+		"globals": "^15.14.0",
 		"html-loader": "^5.1.0",
-		"html-webpack-plugin": "^5.6.0",
-		"husky": "^9.1.6",
+		"html-webpack-plugin": "^5.6.3",
+		"husky": "^9.1.7",
 		"identity-obj-proxy": "^3.0.0",
 		"jest": "^29.7.0",
 		"jest-environment-jsdom": "^29.7.0",
-		"lint-staged": "^15.2.10",
-		"mini-css-extract-plugin": "^2.9.1",
-		"nodemon": "^3.1.7",
+		"lint-staged": "^15.2.11",
+		"mini-css-extract-plugin": "^2.9.2",
+		"nodemon": "^3.1.9",
 		"npm-run-all": "^4.1.5",
 		"postcss-loader": "^8.1.1",
 		"postcss-scss": "^4.0.9",
-		"prettier": "^3.3.3",
-		"react-refresh": "^0.14.2",
+		"prettier": "^3.4.2",
+		"react-refresh": "^0.16.0",
 		"require-from-string": "^2.0.2",
 		"rimraf": "^6.0.1",
-		"sass": "^1.79.5",
-		"sass-loader": "^16.0.2",
+		"sass": "^1.83.0",
+		"sass-loader": "^16.0.4",
 		"serve-favicon": "^2.5.0",
-		"stylelint": "^16.10.0",
-		"stylelint-config-standard-scss": "^13.1.0",
+		"stylelint": "^16.12.0",
+		"stylelint-config-standard-scss": "^14.0.0",
 		"stylelint-order": "^6.0.4",
 		"ts-jest": "^29.2.5",
 		"ts-node": "^10.9.2",
-		"tsconfig-paths-webpack-plugin": "^4.1.0",
-		"typescript": "^5.6.3",
-		"webpack": "^5.95.0",
-		"webpack-cli": "^5.1.4",
+		"tsconfig-paths-webpack-plugin": "^4.2.0",
+		"typescript": "^5.7.2",
+		"webpack": "^5.97.1",
+		"webpack-cli": "^6.0.1",
 		"webpack-dev-middleware": "^7.4.2",
-		"webpack-dev-server": "^5.1.0",
+		"webpack-dev-server": "^5.2.0",
 		"webpack-hot-middleware": "2.26.1",
 		"webpack-node-externals": "^3.0.0",
 		"webpack-stats-plugin": "^1.1.3",
-		"workbox-precaching": "^7.1.0",
-		"workbox-recipes": "^7.1.0",
-		"workbox-routing": "^7.1.0",
-		"workbox-strategies": "^7.1.0",
-		"workbox-webpack-plugin": "^7.1.0"
+		"workbox-precaching": "^7.3.0",
+		"workbox-recipes": "^7.3.0",
+		"workbox-routing": "^7.3.0",
+		"workbox-strategies": "^7.3.0",
+		"workbox-webpack-plugin": "^7.3.0"
 	}
 }

src/client/api/index.ts

@@ -0,0 +1 @@
+export * from './todos.api'

src/client/api/todos.api.ts

@@ -0,0 +1,5 @@
+export type PostsResponse = Array<{ id: string; title: string }>
+
+export async function fetchPosts(): Promise<PostsResponse> {
+	return fetch('https://jsonplaceholder.typicode.com/todos').then(res => res.json())
+}

src/client/components/home/index.tsx

@@ -1,11 +1,13 @@
-import { Suspense } from 'react'
+import { Suspense, cache } from 'react'
 import { logger, getENV } from 'src/common'
+import { fetchPosts } from 'client/api'
 import { CookieDemo } from './cookie-demo'
 import { Posts } from './posts'
 import { State } from './state'
 import css from './styles.scss'
 
 export const Home = () => {
+	const fetchData = cache(fetchPosts)
 	const host = getENV('CLIENT_HOST')
 	logger.info('Env host: %s', host)
 
@@ -17,7 +19,7 @@ export const Home = () => {
 			<CookieDemo />
 			<hr />
 			<Suspense fallback={<p>fetching posts...</p>}>
-				<Posts />
+				<Posts promise={fetchData()} />
 			</Suspense>
 		</div>
 	)

src/client/components/home/posts/index.tsx

@@ -1,16 +1,18 @@
-import { use, useState } from 'react'
-import { fetchPosts } from './posts.api'
+import { type FC, use } from 'react'
+import type { PostsResponse } from 'client/api'
 
-export const Posts = () => {
-	const [promise] = useState(() => fetchPosts())
+interface Props {
+	promise: Promise<PostsResponse>
+}
+export const Posts: FC<Props> = ({ promise }) => {
 	const posts = use(promise)
 
 	return (
 		<div>
 			<b>Data fetching demo</b>
 			<ul>
 				{posts.map(post => (
-					<li key={post.id}>{post.text}</li>
+					<li key={post.id}>{post.title}</li>
 				))}
 			</ul>
 		</div>

src/client/components/home/styles.scss

@@ -1,5 +1,5 @@
-@import 'mixins';
+@use 'mixins';
 
 .wrapper {
-	background: $background;
+	background: mixins.$background;
 }

src/server/middleware/render/index.tsx

@@ -1,6 +1,6 @@
+import { StaticRouter } from 'react-router-dom'
 import { renderToPipeableStream } from 'react-dom/server'
 import type { NextFunction, Request, Response } from 'express'
-import { StaticRouter } from 'react-router-dom/server'
 import { logger, setEnvVars, basename } from 'src/common'
 import { ChunkExtractor } from 'server/utils'
 import { getApp, getStats } from './render.util'