test: fix next-form tests when running on react 18

test/e2e/app-dir/next-form/default/pages/pages-dir/forms/with-function/action-client/index.tsx

@@ -1,18 +1,25 @@
 'use client'
 import * as React from 'react'
-import { useActionState, useState } from 'react'
 import Form from 'next/form'
 import { useRouter } from 'next/router'
 
-export default function Page() {
+const isReact18 = typeof React.useActionState !== 'function'
+
+export default isReact18 ? DummyPage : Page
+
+function DummyPage() {
+  return <>This test cannot run in React 18</>
+}
+
+function Page() {
   const destination = '/pages-dir/redirected-from-action'
   const router = useRouter()
-  const [, dispatch] = useActionState(() => {
+  const [, dispatch] = React.useActionState(() => {
     const to = destination + '?' + new URLSearchParams({ query })
     router.push(to)
   }, undefined)
 
-  const [query, setQuery] = useState('')
+  const [query, setQuery] = React.useState('')
   return (
     <Form action={dispatch} id="search-form">
       <input

test/e2e/app-dir/next-form/default/pages/pages-dir/forms/with-function/button-formaction-client/index.tsx

@@ -1,12 +1,19 @@
 'use client'
 import * as React from 'react'
-import { type ComponentProps, useActionState, useState } from 'react'
 import Form from 'next/form'
 import { useRouter } from 'next/router'
 
-export default function Page() {
+const isReact18 = typeof React.useActionState !== 'function'
+
+export default isReact18 ? DummyPage : Page
+
+function DummyPage() {
+  return <>This test cannot run in React 18</>
+}
+
+function Page() {
   const destination = '/pages-dir/redirected-from-action'
-  const [query, setQuery] = useState('')
+  const [query, setQuery] = React.useState('')
   return (
     <Form action="/pages-dir/search" id="search-form">
       <input
@@ -25,9 +32,9 @@ export default function Page() {
 function NavigateButton({
   to,
   ...props
-}: { to: string } & ComponentProps<'button'>) {
+}: { to: string } & React.ComponentProps<'button'>) {
   const router = useRouter()
-  const [, dispatch] = useActionState(() => {
+  const [, dispatch] = React.useActionState(() => {
     router.push(to)
   }, undefined)
   return <button type="submit" formAction={dispatch} {...props} />