add "use client"; on the top of the source code, this will fix the error

"use client";


import { Workflow } from "@prisma/client";
import React from "react";
import { ReactFlow, useEdgesState, useNodesState } from "@xyflow/react";

import "@xyflow/react/dist/style.css";

function FlowEditor({ workflow }: { workflow: Workflow }) {

  const [nodes, setNodes, onChangeNodes] = useNodesState([]);
  const [edges, setEdges, onChangeEdges] = useEdgesState([]);


  return (
    <main className="h-full w-full">
      <ReactFlow
        nodes={nodes}
        edges={edges}
        onNodesChange={onChangeNodes}
        onEdgesChange={onChangeEdges}
      >

      </ReactFlow>
    </main>
  );
}

export default FlowEditor;