Support melange.5.1.0-53 (#887)

* Install melange.5.1.0-53

* port the testing library `[@mel.send.pipe]` too

* Update nix build

* wip github actions

* Use Js.FormData, remove vendored

* Remove include on RTL

---------

Co-authored-by: Antonio Nuno Monteiro <[email protected]>

Author: davesnx

dune-project

@@ -38,7 +38,7 @@
    (or
     (>= 3.0.0)
     (and
-     (= 5.0.0-52)
+     (<= 5.1.0-53)
      :with-test)))
   (reason-react-ppx
    (= :version))

flake.lock

@@ -10,7 +10,7 @@
       forAllSystems = f: nixpkgs.lib.genAttrs nixpkgs.lib.systems.flakeExposed (system:
         let
           pkgs = nixpkgs.legacyPackages.${system}.extend (self: super: {
-            ocamlPackages = super.ocaml-ng.ocamlPackages_5_2.overrideScope (oself: osuper: {
+            ocamlPackages = super.ocaml-ng.ocamlPackages_5_3.overrideScope (oself: osuper: {
               ppxlib = osuper.ppxlib.overrideAttrs (o: {
                 propagatedBuildInputs = o.propagatedBuildInputs ++ [ osuper.stdio ];
               });

flake.nix

@@ -19,7 +19,7 @@ bug-reports: "https://github.com/reasonml/reason-react/issues"
 depends: [
   "dune" {>= "3.9"}
   "ocaml"
-  "melange" {(>= "3.0.0" & !with-test) | (= "5.0.0-52" & with-test)}
+  "melange" {>= "3.0.0" | <= "5.1.0-53" & with-test}
   "reason-react-ppx" {= version}
   "reason" {>= "3.12.0"}
   "ocaml-lsp-server" {with-dev-setup}

reason-react.opam

@@ -909,57 +909,12 @@ module Experimental = {
     ('state, 'optimisticValue => unit) =
     "useOptimistic";
 
-  module FormData = {
-    /* This file is embeded since https://github.com/melange-re/melange/pull/1153 gets merged */
-
-    type t;
-    type file;
-    type blob;
-    type entryValue;
-
-    [@mel.new] external make: unit => t = "FormData";
-    [@mel.send.pipe: t] external append: (string, string) => unit = "append";
-    [@mel.send.pipe: t] external delete: string => unit = "delete";
-    [@mel.send.pipe: t] external get: string => option(entryValue) = "get";
-    [@mel.send.pipe: t]
-    external getAll: string => array(entryValue) = "getAll";
-    [@mel.send.pipe: t] external set: (string, string) => unit = "set";
-    [@mel.send.pipe: t] external has: string => bool = "has";
-    [@mel.send] external keys: t => Js.Iterator.t(string) = "keys";
-    [@mel.send] external values: t => Js.Iterator.t(entryValue) = "values";
-
-    [@mel.send.pipe: t]
-    external appendObject: (string, Js.t({..}), ~filename: string=?) => unit =
-      "append";
-
-    [@mel.send.pipe: t]
-    external appendBlob: (string, blob, ~filename: string=?) => unit =
-      "append";
-
-    [@mel.send.pipe: t]
-    external appendFile: (string, file, ~filename: string=?) => unit =
-      "append";
-
-    [@mel.send.pipe: t]
-    external setObject: (string, Js.t({..}), ~filename: string=?) => unit =
-      "set";
-
-    [@mel.send.pipe: t]
-    external setBlob: (string, blob, ~filename: string=?) => unit = "set";
-
-    [@mel.send.pipe: t]
-    external setFile: (string, file, ~filename: string=?) => unit = "set";
-
-    [@mel.send]
-    external entries: t => Js.Iterator.t((string, entryValue)) = "entries";
-  };
-
   type formAction;
 
   /* https://react.dev/reference/react/useActionState */
   [@mel.module "react"]
   external useActionState:
-    (('state, FormData.t) => unit, 'state, ~permalink: bool=?) =>
+    (('state, Js.FormData.t) => unit, 'state, ~permalink: bool=?) =>
     ('state, formAction, bool) =
     "useActionState";
 };

src/React.re

@@ -595,56 +595,11 @@ module Experimental: {
     unit => (bool, callbackAsync(callbackAsync(unit, unit), unit)) =
     "useTransition";
 
-  module FormData: {
-    /* This file is embeded since https://github.com/melange-re/melange/pull/1153 gets merged */
-
-    type t;
-    type file;
-    type blob;
-    type entryValue;
-
-    [@mel.new] external make: unit => t = "FormData";
-    [@mel.send.pipe: t] external append: (string, string) => unit = "append";
-    [@mel.send.pipe: t] external delete: string => unit = "delete";
-    [@mel.send.pipe: t] external get: string => option(entryValue) = "get";
-    [@mel.send.pipe: t]
-    external getAll: string => array(entryValue) = "getAll";
-    [@mel.send.pipe: t] external set: (string, string) => unit = "set";
-    [@mel.send.pipe: t] external has: string => bool = "has";
-    [@mel.send] external keys: t => Js.Iterator.t(string) = "keys";
-    [@mel.send] external values: t => Js.Iterator.t(entryValue) = "values";
-
-    [@mel.send.pipe: t]
-    external appendObject: (string, Js.t({..}), ~filename: string=?) => unit =
-      "append";
-
-    [@mel.send.pipe: t]
-    external appendBlob: (string, blob, ~filename: string=?) => unit =
-      "append";
-
-    [@mel.send.pipe: t]
-    external appendFile: (string, file, ~filename: string=?) => unit =
-      "append";
-
-    [@mel.send.pipe: t]
-    external setObject: (string, Js.t({..}), ~filename: string=?) => unit =
-      "set";
-
-    [@mel.send.pipe: t]
-    external setBlob: (string, blob, ~filename: string=?) => unit = "set";
-
-    [@mel.send.pipe: t]
-    external setFile: (string, file, ~filename: string=?) => unit = "set";
-
-    [@mel.send]
-    external entries: t => Js.Iterator.t((string, entryValue)) = "entries";
-  };
-
   type formAction;
 
   [@mel.module "react"]
   external useActionState:
-    (('state, FormData.t) => unit, 'state, ~permalink: bool=?) =>
+    (('state, Js.FormData.t) => unit, 'state, ~permalink: bool=?) =>
     ('state, formAction, bool) =
     "useActionState";
 };

src/React.rei

@@ -1,14 +1,12 @@
 open Jest;
 
-module FormData = React.Experimental.FormData;
-
 type message = {
   text: string,
   sending: bool,
   key: int,
 };
 
-[@mel.send.pipe: Dom.element] external reset: unit = "reset";
+[@mel.send] external reset: Dom.element => unit = "reset";
 
 let (let.await) = (p, f) => Js.Promise.then_(f, p);
 
@@ -29,7 +27,7 @@ module Thread = {
       );
 
     let formAction = formData => {
-      let formMessage = FormData.get("message", formData);
+      let formMessage = Js.FormData.get(~name="message", formData);
       switch (formMessage) {
       | Some(entry) =>
         switch (Js.Types.classify(entry)) {
@@ -95,7 +93,7 @@ module App = {
       );
 
     let sendMessage = formData => {
-      let formMessage = FormData.get("message", formData);
+      let formMessage = Js.FormData.get(~name="message", formData);
       switch (formMessage) {
       | Some(message) =>
         let.await entry = deliverMessage(message);