Merge pull request #27 from ondrejhudek/feat/vercel-15

update to vercel 15

package.json

@@ -3,7 +3,7 @@
   "version": "1.0.0",
   "private": true,
   "scripts": {
-    "dev": "next dev --turbo",
+    "dev": "next dev --turbopack",
     "build": "next build",
     "start": "next start",
     "lint": "next lint",
@@ -17,29 +17,33 @@
     "@react-google-maps/api": "^2.20.3",
     "@types/node": "22.10.2",
     "@types/ramda": "^0.30.2",
-    "@types/react": "18.3.11",
-    "@types/react-dom": "18.3.1",
+    "@types/react": "19.0.1",
+    "@types/react-dom": "19.0.2",
     "@vercel/analytics": "^1.4.1",
     "@vercel/blob": "^0.27.0",
     "@vercel/postgres-kysely": "^0.10.0",
     "@vercel/speed-insights": "^1.1.0",
     "cloudinary": "2.5.1",
     "eslint": "8.57.0",
-    "eslint-config-next": "14.2.15",
+    "eslint-config-next": "15.1.0",
     "framer-motion": "^11.14.4",
     "kysely": "^0.27.5",
     "kysely-codegen": "^0.17.0",
-    "next": "14.2.15",
+    "next": "15.1.0",
     "next-auth": "^4.24.11",
     "next-cloudinary": "^6.16.0",
     "pg": "^8.13.1",
     "ramda": "^0.30.1",
-    "react": "18.3.1",
-    "react-dom": "18.3.1",
+    "react": "19.0.0",
+    "react-dom": "19.0.0",
     "react-icons": "^5.4.0",
     "react-photo-album": "^3.0.2",
     "sharp": "^0.33.5",
     "typescript": "5.7.2",
     "yet-another-react-lightbox": "^3.21.7"
+  },
+  "resolutions": {
+    "@types/react": "19.0.1",
+    "@types/react-dom": "19.0.2"
   }
 }

src/app/(pages)/(public)/member/[id]/page.tsx

@@ -59,8 +59,11 @@ const Content = async ({ id }: { id: string }) => {
   );
 };
 
-const Page = async ({ params: { id } }: { params: { id: string } }) => (
-  <Content id={id} />
-);
+type Params = Promise<{ id: string }>;
+
+const Page = async ({ params }: { params: Params }) => {
+  const { id } = await params;
+  return <Content id={id} />;
+};
 
 export default Page;

src/app/(pages)/(public)/photo/[id]/page.tsx

@@ -6,7 +6,11 @@ import Photoalbum from "@/app/components/Photoalbum";
 import { getRowByValue } from "@/app/utils/database";
 import { Trip } from "@/app/utils/types";
 
-const Page = async ({ params: { id } }: { params: { id: string } }) => {
+type Params = Promise<{ id: string }>;
+
+const Page = async ({ params }: { params: Params }) => {
+  const { id } = await params;
+
   const [data, images] = await Promise.all([
     getRowByValue<Trip>("trip", "id", id),
     getImages(id),

src/app/(pages)/(public)/resort/[id]/page.tsx

@@ -43,8 +43,11 @@ const Content = async ({ id }: { id: string }) => {
   );
 };
 
-const Page = async ({ params: { id } }: { params: { id: string } }) => (
-  <Content id={id} />
-);
+type Params = Promise<{ id: string }>;
+
+const Page = async ({ params }: { params: Params }) => {
+  const { id } = await params;
+  return <Content id={id} />;
+};
 
 export default Page;

src/app/(pages)/(public)/trip/[id]/page.tsx

@@ -101,8 +101,11 @@ const Content = async ({ id }: { id: string }) => {
   );
 };
 
-const Page = async ({ params: { id } }: { params: { id: string } }) => (
-  <Content id={id} />
-);
+type Params = Promise<{ id: string }>;
+
+const Page = async ({ params }: { params: Params }) => {
+  const { id } = await params;
+  return <Content id={id} />;
+};
 
 export default Page;

src/app/(pages)/admin/[table]/[id]/page.tsx

@@ -3,11 +3,11 @@ import { TableName, AnyTable } from "@/app/utils/types";
 
 import View from "./view";
 
-const Page = async ({
-  params: { table, id },
-}: {
-  params: { table: TableName; id: string };
-}) => {
+type Params = Promise<{ table: TableName; id: string }>;
+
+const Page = async ({ params }: { params: Params }) => {
+  const { table, id } = await params;
+
   const data = await getRowByValue<AnyTable>(table, "id", id);
   return <View table={table} id={id} data={data} />;
 };

src/app/(pages)/admin/[table]/[id]/view.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useRef, useState } from "react";
+import { useRef, useState, type RefObject } from "react";
 import NextLink from "next/link";
 import { useRouter } from "next/navigation";
 import {
@@ -21,6 +21,7 @@ import {
   useDisclosure,
   useToast,
 } from "@chakra-ui/react";
+import { type FocusableElement } from "@chakra-ui/utils";
 import {
   HiOutlineArrowLongLeft,
   HiOutlineCheck,
@@ -52,7 +53,7 @@ const ConfirmRemove = ({
   return (
     <AlertDialog
       isOpen={isOpen}
-      leastDestructiveRef={cancelRef}
+      leastDestructiveRef={cancelRef as unknown as RefObject<FocusableElement>}
       onClose={onClose}
     >
       <AlertDialogOverlay>

src/app/(pages)/admin/[table]/page.tsx

@@ -14,11 +14,11 @@ const ORDER_BY: Record<TableName, OrderBy[]> = {
   video: [{ column: "id", direction: "desc" }],
 };
 
-const Page = async ({
-  params: { table },
-}: {
-  params: { table: TableName };
-}) => {
+type Params = Promise<{ table: TableName }>;
+
+const Page = async ({ params }: { params: Params }) => {
+  const { table } = await params;
+
   const data = await getRows<AnyTable>(table, ORDER_BY[table]);
 
   return <View table={table} data={data} />;

src/app/(pages)/admin/[table]/view.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { Dispatch, SetStateAction, useEffect, useState } from "react";
+import { Dispatch, SetStateAction, useEffect, useState, type JSX } from "react";
 import NextLink from "next/link";
 import { useRouter } from "next/navigation";
 import {

src/app/components/Navbar.tsx

@@ -1,4 +1,4 @@
-import { type PropsWithChildren, useRef } from "react";
+import { type PropsWithChildren, useRef, type RefObject } from "react";
 import NextLink from "next/link";
 import { useSelectedLayoutSegment } from "next/navigation";
 import {
@@ -16,6 +16,7 @@ import {
   useColorModeValue,
   useDisclosure,
 } from "@chakra-ui/react";
+import { type FocusableElement } from "@chakra-ui/utils";
 import { HiBars3, HiXMark, HiMoon, HiSun } from "react-icons/hi2";
 
 import Logo from "@/app/components/Logo";
@@ -192,7 +193,7 @@ const MobileNavbar = ({
     <Modal
       isOpen={isOpen}
       size="full"
-      initialFocusRef={initialRef}
+      initialFocusRef={initialRef as unknown as RefObject<FocusableElement>}
       onClose={onClose}
     >
       <ModalOverlay />

src/app/components/NotFound.tsx

@@ -60,7 +60,7 @@ const NotFound = () => {
     >
       <AlertIcon boxSize={8} mt={1} mr={3} />
       <Box>
-        <AlertTitle fontSize="lg">HOVNO{alert.title}</AlertTitle>
+        <AlertTitle fontSize="lg">{alert.title}</AlertTitle>
         <AlertDescription>{alert.description}</AlertDescription>
 
         <Box mt={3}>

src/app/layout.tsx

@@ -1,5 +1,5 @@
 import { SpeedInsights } from "@vercel/speed-insights/next";
-import type { Metadata, Viewport } from "next";
+import type { Metadata } from "next";
 import { Ubuntu } from "next/font/google";
 import type { PropsWithChildren } from "react";
 
@@ -26,10 +26,6 @@ export const metadata: Metadata = {
   },
 };
 
-export const viewport: Viewport = {
-  themeColor: "#005f7e",
-};
-
 const RootLayout = ({ children }: PropsWithChildren) => (
   <html lang="en" className={`${ubuntu.variable}`}>
     <body>

src/app/theme.ts

@@ -59,6 +59,18 @@ const colors = {
     800: "#46051d",
     900: "#1d000b",
   },
+  facebook: {
+    50: "#dff2ff",
+    100: "#b3d4ff",
+    200: "#83b8fb",
+    300: "#549cf6",
+    400: "#267ff3",
+    500: "#0c66d9",
+    600: "#044faa",
+    700: "#00387b",
+    800: "#00224c",
+    900: "#000c1f",
+  },
 };
 
 const transition = {