deps: Upgrade expo & nextjs to react 19 (#1565)

* Attempt to upgrade expo 53

* Attempt upgrade nextjs

* Fix a bunch of peer deps

* upgrade some docs deps

* fix typecheck

* update the shadcn calendar component

* more fixes

* more fixes

* revert ollama upgrade

* update react version to use carets

* remove react-select from landing

* fix the typescript error caused by customFetch

* upgrade the new grid user setting to nextjs 15

* mobile: enable react canary to support react 19.1

* upgrade react native menu

* fix navigation context error

8 files changed, 31 insertions, 37 deletions

diff --git a/apps/web/app/admin/layout.tsx b/apps/web/app/admin/layout.tsx
index 62a6932a..4b589712 100644
--- a/apps/web/app/admin/layout.tsx
+++ b/apps/web/app/admin/layout.tsx
@@ -1,3 +1,4 @@
+import React from "react";
 import { redirect } from "next/navigation";
 import { AdminNotices } from "@/components/admin/AdminNotices";
 import MobileSidebar from "@/components/shared/sidebar/MobileSidebar";
@@ -11,7 +12,7 @@ const adminSidebarItems = (
   t: TFunction,
 ): {
   name: string;
-  icon: JSX.Element;
+  icon: React.ReactElement;
   path: string;
 }[] => [
   {
diff --git a/apps/web/app/dashboard/@modal/(.)preview/[bookmarkId]/page.tsx b/apps/web/app/dashboard/@modal/(.)preview/[bookmarkId]/page.tsx
index 432e7a6c..77d84ec5 100644
--- a/apps/web/app/dashboard/@modal/(.)preview/[bookmarkId]/page.tsx
+++ b/apps/web/app/dashboard/@modal/(.)preview/[bookmarkId]/page.tsx
@@ -1,15 +1,14 @@
 "use client";
 
-import { useState } from "react";
+import { use, useState } from "react";
 import { useRouter } from "next/navigation";
 import BookmarkPreview from "@/components/dashboard/preview/BookmarkPreview";
 import { Dialog, DialogContent } from "@/components/ui/dialog";
 
-export default function BookmarkPreviewPage({
-  params,
-}: {
-  params: { bookmarkId: string };
+export default function BookmarkPreviewPage(props: {
+  params: Promise<{ bookmarkId: string }>;
 }) {
+  const params = use(props.params);
   const router = useRouter();
 
   const [open, setOpen] = useState(true);
diff --git a/apps/web/app/dashboard/feeds/[feedId]/page.tsx b/apps/web/app/dashboard/feeds/[feedId]/page.tsx
index ed5f9e40..a73f0f32 100644
--- a/apps/web/app/dashboard/feeds/[feedId]/page.tsx
+++ b/apps/web/app/dashboard/feeds/[feedId]/page.tsx
@@ -3,11 +3,10 @@ import Bookmarks from "@/components/dashboard/bookmarks/Bookmarks";
 import { api } from "@/server/api/client";
 import { TRPCError } from "@trpc/server";
 
-export default async function FeedPage({
-  params,
-}: {
-  params: { feedId: string };
+export default async function FeedPage(props: {
+  params: Promise<{ feedId: string }>;
 }) {
+  const params = await props.params;
   let feed;
   try {
     feed = await api.feeds.get({ feedId: params.feedId });
diff --git a/apps/web/app/dashboard/lists/[listId]/page.tsx b/apps/web/app/dashboard/lists/[listId]/page.tsx
index de0f5054..4714a71c 100644
--- a/apps/web/app/dashboard/lists/[listId]/page.tsx
+++ b/apps/web/app/dashboard/lists/[listId]/page.tsx
@@ -6,15 +6,14 @@ import { TRPCError } from "@trpc/server";
 
 import { BookmarkListContextProvider } from "@karakeep/shared-react/hooks/bookmark-list-context";
 
-export default async function ListPage({
-  params,
-  searchParams,
-}: {
-  params: { listId: string };
-  searchParams?: {
+export default async function ListPage(props: {
+  params: Promise<{ listId: string }>;
+  searchParams?: Promise<{
     includeArchived?: string;
-  };
+  }>;
 }) {
+  const searchParams = await props.searchParams;
+  const params = await props.params;
   const userSettings = await api.users.settings();
   let list;
   try {
diff --git a/apps/web/app/dashboard/preview/[bookmarkId]/page.tsx b/apps/web/app/dashboard/preview/[bookmarkId]/page.tsx
index 236f5447..ea509207 100644
--- a/apps/web/app/dashboard/preview/[bookmarkId]/page.tsx
+++ b/apps/web/app/dashboard/preview/[bookmarkId]/page.tsx
@@ -3,11 +3,10 @@ import BookmarkPreview from "@/components/dashboard/preview/BookmarkPreview";
 import { api } from "@/server/api/client";
 import { TRPCError } from "@trpc/server";
 
-export default async function BookmarkPreviewPage({
-  params,
-}: {
-  params: { bookmarkId: string };
+export default async function BookmarkPreviewPage(props: {
+  params: Promise<{ bookmarkId: string }>;
 }) {
+  const params = await props.params;
   let bookmark;
   try {
     bookmark = await api.bookmarks.getBookmark({
diff --git a/apps/web/app/dashboard/tags/[tagId]/page.tsx b/apps/web/app/dashboard/tags/[tagId]/page.tsx
index b33a351a..7971da1e 100644
--- a/apps/web/app/dashboard/tags/[tagId]/page.tsx
+++ b/apps/web/app/dashboard/tags/[tagId]/page.tsx
@@ -7,15 +7,14 @@ import { api } from "@/server/api/client";
 import { TRPCError } from "@trpc/server";
 import { MoreHorizontal } from "lucide-react";
 
-export default async function TagPage({
-  params,
-  searchParams,
-}: {
-  params: { tagId: string };
-  searchParams?: {
+export default async function TagPage(props: {
+  params: Promise<{ tagId: string }>;
+  searchParams?: Promise<{
     includeArchived?: string;
-  };
+  }>;
 }) {
+  const searchParams = await props.searchParams;
+  const params = await props.params;
   let tag;
   try {
     tag = await api.tags.get({ tagId: params.tagId });
diff --git a/apps/web/app/public/lists/[listId]/page.tsx b/apps/web/app/public/lists/[listId]/page.tsx
index 4a4ce414..17e6b947 100644
--- a/apps/web/app/public/lists/[listId]/page.tsx
+++ b/apps/web/app/public/lists/[listId]/page.tsx
@@ -6,11 +6,10 @@ import PublicListHeader from "@/components/public/lists/PublicListHeader";
 import { api } from "@/server/api/client";
 import { TRPCError } from "@trpc/server";
 
-export async function generateMetadata({
-  params,
-}: {
-  params: { listId: string };
+export async function generateMetadata(props: {
+  params: Promise<{ listId: string }>;
 }): Promise<Metadata> {
+  const params = await props.params;
   try {
     const resp = await api.publicBookmarks.getPublicListMetadata({
       listId: params.listId,
@@ -38,11 +37,10 @@ export async function generateMetadata({
   };
 }
 
-export default async function PublicListPage({
-  params,
-}: {
-  params: { listId: string };
+export default async function PublicListPage(props: {
+  params: Promise<{ listId: string }>;
 }) {
+  const params = await props.params;
   try {
     const { list, bookmarks, nextCursor } =
       await api.publicBookmarks.getPublicBookmarksInList({
diff --git a/apps/web/app/settings/layout.tsx b/apps/web/app/settings/layout.tsx
index 94a5c4d7..982ac61a 100644
--- a/apps/web/app/settings/layout.tsx
+++ b/apps/web/app/settings/layout.tsx
@@ -25,7 +25,7 @@ const settingsSidebarItems = (
   t: TFunction,
 ): {
   name: string;
-  icon: JSX.Element;
+  icon: React.ReactElement;
   path: string;
 }[] => {
   return [