Revert next 15 (breaks react-leaftlet)

PaulLeCam/react-leaflet#1133
dcramer · Jun 27, 2024 · d745366 · d745366
1 parent 6f1df54
commit d745366
Show file tree

Hide file tree

Showing 5 changed files with 155 additions and 297 deletions.
diff --git a/apps/web/package.json b/apps/web/package.json
@@ -30,11 +30,11 @@
     "isomorphic-dompurify": "^2.12.0",
     "leaflet": "^1.9.4",
     "marked": "^9.1.6",
-    "next": "15.0.0-rc.0",
+    "next": "14.2.4",
     "pica": "^9.0.1",
-    "react": "19.0.0-rc-8971381549-20240625",
+    "react": "^18",
     "react-avatar-editor": "^13.0.2",
-    "react-dom": "19.0.0-rc-8971381549-20240625",
+    "react-dom": "^18",
     "react-error-boundary": "^4.0.13",
     "react-hook-form": "^7.52.0",
     "react-leaflet": "^4.2.1",

diff --git a/apps/web/src/app/(default)/users/[username]/logoutButton.tsx b/apps/web/src/app/(default)/users/[username]/logoutButton.tsx
@@ -2,11 +2,11 @@
 
 import Button from "@peated/web/components/button";
 import { logout } from "@peated/web/lib/auth.actions";
-import { useActionState } from "react";
+import { useFormState } from "react-dom";
 
 export default function LogoutButton() {
   // TODO: this needs to show some kind of loading state
-  const [, formAction] = useActionState(logout, undefined);
+  const [, formAction] = useFormState(logout, undefined);
   return (
     <form action={formAction}>
       <Button type="submit" color="primary">

diff --git a/apps/web/src/components/loginForm.tsx b/apps/web/src/components/loginForm.tsx
@@ -6,8 +6,7 @@ import GoogleLoginButton from "@peated/web/components/googleLoginButton";
 import TextField from "@peated/web/components/textField";
 import config from "@peated/web/config";
 import { authenticate } from "@peated/web/lib/auth.actions";
-import { useActionState } from "react";
-import { useFormStatus } from "react-dom";
+import { useFormState, useFormStatus } from "react-dom";
 import Alert from "./alert";
 
 function BasicLogin({ action }: { action: any }) {
@@ -41,7 +40,7 @@ function BasicLogin({ action }: { action: any }) {
 }
 
 export default function LoginForm() {
-  const [error, formAction] = useActionState(authenticate, undefined);
+  const [error, formAction] = useFormState(authenticate, undefined);
 
   return (
     <div className="min-w-sm mt-8 flex-auto">

diff --git a/apps/web/src/components/logoutButton.tsx b/apps/web/src/components/logoutButton.tsx
@@ -1,11 +1,11 @@
 "use client";
 
 import { logout } from "@peated/web/lib/auth.actions";
-import { useActionState } from "react";
+import { useFormState } from "react-dom";
 
 export default function LogoutButton() {
   // TODO: this needs to show some kind of loading state
-  const [, formAction] = useActionState(logout, undefined);
+  const [, formAction] = useFormState(logout, undefined);
   return (
     <form action={formAction}>
       <button type="submit">Sign out</button>