Netlify form nextjs app router and next-intl issue

I was unable to submit the form at https://esiva.netlify.app/tr/test.

public/form.html:

<!DOCTYPE html>
<html>
<head>
  <title>Contact Form</title>
</head>
<body>
  <form name="contact" netlify netlify-honeypot="bot-field" hidden>
    <input type="text" name="name" />
    <input type="email" name="email" />
    <textarea name="message"></textarea>
  </form>
</body>
</html>

app/[lang]/test/page.tsx:

"use client";

const TestPage = () => {
  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {
    event.preventDefault();
    const formData = new FormData(event.currentTarget);

    await fetch("/_form.html", {
      method: "POST",
      headers: { "Content-Type": "application/x-www-form-urlencoded" },
      // eslint-disable-next-line @typescript-eslint/no-explicit-any
      body: new URLSearchParams(formData as any).toString(),
    });

    alert("Gönderildi!");
  };

  return (
    <form
      name="contact"
      data-netlify="true"
      netlify-honeypot="bot-field"
      /*  onSubmit={handleSubmit} */
      method="POST"
      data-netlify-recaptcha="true"
      data-netlify-honeypot="bot-field"
    >
      <input type="hidden" name="form-name" value="contact" />
      <input type="text" name="name" placeholder="Name" required />
      <input type="email" name="email" placeholder="Email" />
      <textarea name="message" placeholder="Message"></textarea>
      <button type="submit">Submit</button>
    </form>
  );
};

export default TestPage;

next.config:

import { NextConfig } from "next";
import createNextIntlPlugin from "next-intl/plugin";

const nextConfig: NextConfig = {
  async rewrites() {
    return [
      {
        source: "/form.html",
        destination: "/form.html",
      },
    ];
  },
};

const withNextIntl = createNextIntlPlugin();
export default withNextIntl(nextConfig);

@DenizDurna You cannot submit to a route that’s handled by Next.js

Under the Limitations here:
https://docs.netlify.com/build/frameworks/framework-setup-guides/nextjs/overview/#limitations

See:

  • Forms Integration: Netlify Forms requires a specific workaround when used with Next.js applications. Learn more.

Follow the documentation that it links to:
https://opennext.js.org/netlify/forms