Merge pull request #6 from sambecker/next-upgrade

Upgrade to Next.js 14

next.config.js

@@ -19,9 +19,6 @@ const nextConfig = {
     }],
     minimumCacheTTL: 31536000,
   },
-  experimental: {
-    serverActions: true,
-  },
 };
 
 module.exports = withBundleAnalyzer(nextConfig);

package.json

@@ -9,29 +9,29 @@
     "analyze": "ANALYZE=true next build"
   },
   "dependencies": {
-    "@next/bundle-analyzer": "^13.5.6",
+    "@next/bundle-analyzer": "^14.0.1",
     "@tailwindcss/forms": "^0.5.6",
     "@testing-library/jest-dom": "^6.1.4",
     "@testing-library/react": "^14.0.0",
-    "@types/jest": "^29.5.6",
-    "@types/node": "^20.8.7",
-    "@types/react": "18.2.29",
-    "@types/react-dom": "18.2.8",
-    "@typescript-eslint/eslint-plugin": "^6.8.0",
-    "@typescript-eslint/parser": "^6.8.0",
+    "@types/jest": "^29.5.7",
+    "@types/node": "^20.8.9",
+    "@types/react": "18.2.33",
+    "@types/react-dom": "18.2.14",
+    "@typescript-eslint/eslint-plugin": "^6.9.1",
+    "@typescript-eslint/parser": "^6.9.1",
     "@vercel/analytics": "^1.1.1",
-    "@vercel/blob": "^0.14.0",
+    "@vercel/blob": "^0.14.1",
     "@vercel/postgres": "0.5.0",
     "autoprefixer": "10.4.16",
     "camelcase-keys": "^9.1.2",
     "date-fns": "^2.30.0",
-    "eslint": "8.51.0",
-    "eslint-config-next": "13.5.6",
+    "eslint": "8.52.0",
+    "eslint-config-next": "14.0.1",
     "framer-motion": "^10.16.4",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
     "nanoid": "^5.0.2",
-    "next": "^13.5.6",
+    "next": "^14.0.1",
     "next-auth": "0.0.0-manual.c885ac1d",
     "next-themes": "^0.2.1",
     "postcss": "8.4.31",
@@ -39,7 +39,7 @@
     "react-dom": "18.2.0",
     "react-icons": "^4.11.0",
     "sonner": "^1.0.3",
-    "tailwindcss": "3.3.3",
+    "tailwindcss": "3.3.5",
     "ts-exif-parser": "^0.2.2",
     "typescript": "5.2.2"
   }

src/app/(static)/home-image/route.tsx

@@ -6,7 +6,7 @@ import {
 } from '@/photo/image-response';
 import HomeImageResponse from '@/photo/image-response/HomeImageResponse';
 import { getIBMPlexMonoMedium } from '@/site/font';
-import { ImageResponse } from 'next/server';
+import { ImageResponse } from 'next/og';
 
 export const runtime = 'edge';
 

src/app/(static)/p/[photoId]/image/route.tsx

@@ -3,7 +3,7 @@ import { getImageCacheHeadersForAuth, getPhotoCached } from '@/cache';
 import { IMAGE_OG_SIZE } from '@/photo/image-response';
 import PhotoImageResponse from '@/photo/image-response/PhotoImageResponse';
 import { getIBMPlexMonoMedium } from '@/site/font';
-import { ImageResponse } from 'next/server';
+import { ImageResponse } from 'next/og';
 
 export const runtime = 'edge';
 

src/app/(static)/shot-on/[camera]/image/route.tsx

@@ -7,7 +7,7 @@ import {
 } from '@/photo/image-response';
 import CameraImageResponse from '@/photo/image-response/CameraImageResponse';
 import { getIBMPlexMonoMedium } from '@/site/font';
-import { ImageResponse } from 'next/server';
+import { ImageResponse } from 'next/og';
 
 export const runtime = 'edge';
 

src/app/(static)/tag/[tag]/image/route.tsx

@@ -6,7 +6,7 @@ import {
 } from '@/photo/image-response';
 import TagImageResponse from '@/photo/image-response/TagImageResponse';
 import { getIBMPlexMonoMedium } from '@/site/font';
-import { ImageResponse } from 'next/server';
+import { ImageResponse } from 'next/og';
 
 export const runtime = 'edge';
 

src/app/(static)/template-image-tight/route.tsx

@@ -7,7 +7,7 @@ import {
 import TemplateImageResponse from
   '@/photo/image-response/TemplateImageResponse';
 import { getIBMPlexMonoMedium } from '@/site/font';
-import { ImageResponse } from 'next/server';
+import { ImageResponse } from 'next/og';
 
 export const runtime = 'edge';
 

src/app/(static)/template-image/route.tsx

@@ -7,7 +7,7 @@ import {
 import TemplateImageResponse from
   '@/photo/image-response/TemplateImageResponse';
 import { getIBMPlexMonoMedium } from '@/site/font';
-import { ImageResponse } from 'next/server';
+import { ImageResponse } from 'next/og';
 
 export const runtime = 'edge';
 

src/components/FieldSetWithStatus.tsx

@@ -1,7 +1,8 @@
 'use client';
 
 import { LegacyRef } from 'react';
-import { experimental_useFormStatus as useFormStatus } from 'react-dom';
+// @ts-ignore
+import { useFormStatus } from 'react-dom';
 import Spinner from './Spinner';
 import { cc } from '@/utility/css';
 

src/components/SubmitButtonWithStatus.tsx

@@ -1,7 +1,8 @@
 'use client';
 
 import { HTMLProps } from 'react';
-import { experimental_useFormStatus as useFormStatus } from 'react-dom';
+// @ts-ignore
+import { useFormStatus } from 'react-dom';
 import Spinner from './Spinner';
 import { cc } from '@/utility/css';