Next.js server action Error: An unexpected response was received from the server.

何が起きたか

next.js ver 15...でserver actionを使用している際にError: An unexpected response was received from the server.というエラーが発生しました。

server actionとは？

serverで実行される非同期関数のことです。
'use server'ディレクティブを使用して クライアントサイドのコードから呼び出せる、サーバサイドの関数をマークします。

ディレクトリ構成

src/
  app/
    contact/
      - page.tsx
      complete/
        - page.tsx
  lib/
    - contact.ts

問題が発生するコード

lib/contact.ts
server action

"use server";
import { redirect } from "next/navigation";

export async function submitContactForm(formData: FormData) {
  redirect("contact/complete");
}

contact/page.tsx

import React from "react";
import { submitContactForm } from "@/lib/actions/contact";

export default function Contact() {
  return (
    <form action={submitContactForm}>
        <button>送信</button>
    <form>
  );
}

contact/complete/page.tsx

import React from "react";

export default function Complete() {
  return (
    <p>complete</p>
  );
}

期待する挙動

form送信後にcompleteページへ飛ぶこと

発生したエラー

原因

server action内のnavigationにエラーがあります

x  redirect("contact/complete");
⚪︎ redirect("/contact/complete");

/から始める必要があります