feat: update universal portal and srr versions

full-stack-reasonml-advanced-sample.opam

@@ -14,11 +14,11 @@ depends: [
   "dream"
   "lambdasoup"
   "reason-react-ppx"
-  "reason-react"
-  "server-reason-react"
-  "universal-portal"
-  "styled-ppx"
-  "quickjs"
+  "reason-react" {>= "0.14.0"}
+  "server-reason-react" {>= "0.2.0"}
+  "universal-portal" {>= "0.3.1"}
+  "styled-ppx" {>= "0.59.1"}
+  "quickjs" {>= "0.1.1"}
   "yojson"
   "lwt" {>= "5.7.0"}
   "cohttp-lwt-unix" {>= "5.3.1"}
@@ -44,11 +44,6 @@ build: [
   ]
 ]
 pin-depends: [
-  ["quickjs.0.1.1" "git+https://github.com/ml-in-barcelona/quickjs.ml#0.1.1"]
-  ["reason-react.0.14.0" "git+https://github.com/reasonml/reason-react#0.14.0"]
-  ["reason-react-ppx.0.14.0" "git+https://github.com/reasonml/reason-react#0.14.0"]
-  ["server-reason-react.0.2.0" "git+https://github.com/ml-in-barcelona/server-reason-react#0.2.0"]
-  ["reason.3.11.0" "git+https://github.com/reasonml/reason#3.11.0"]
-  ["universal-portal.0.2.0" "git+https://github.com/pedrobslisboa/universal-portal#0.2.0"]
-  ["styled-ppx.0.56.0" "git+https://github.com/davesnx/styled-ppx#923c9abcf6ef2d64fe83e15cc632fb6e7cab8503"]
-]
+  ["universal-portal.0.3.1" "git+https://github.com/pedrobslisboa/universal-portal#0.3.1"]
+  ["server-reason-react.0.3.1" "git+https://github.com/ml-in-barcelona/server-reason-react#fb6836045f4ee56cf42c409f2830674146e0eea4"]
+]

src/client/Routes_handler.re

@@ -94,7 +94,7 @@ let make = (~pathMappingDetails) => {
     [|url.path|],
   );
 
-  UniversalPortal_Shared.Hooks.UseRemoveServerPortals.make();
+  UniversalPortal_Js.useRemoveServerPortals();
 
   <>
     {loading ? <Shared_js_demo.Components.Loader /> : React.null}

src/client/dune

@@ -2,6 +2,6 @@
  (alias client)
  (target app)
  (module_systems es6)
- (libraries melange shared_js_demo reason-react)
+ (libraries melange universal-portal.js shared_js_demo reason-react)
  (preprocess
-  (pps reason-react-ppx melange.ppx server-reason-react.browser_ppx)))
+  (pps reason-react-ppx melange.ppx)))

src/server/Routes_build.re

@@ -7,7 +7,7 @@ let indexFileString =
 let appendUniversalStyles = (html) => {
   let soup = html |> Soup.parse;
 
-  let stylesElement = (CssJs.style_tag()) |> ReactDOM.renderToString |> Soup.parse;
+  let stylesElement = (CSS.style_tag()) |> ReactDOM.renderToString |> Soup.parse;
 
   switch (soup |> Soup.select_one("head")) {
   | None => ()
@@ -24,7 +24,7 @@ let make = (~path, ~renderApp, ~getInitialProps as getInitialPropsOpt) => [
     path,
     req => {
       let portals:
-        ref(array(UniversalPortal_Shared.Components.Portal.portal)) =
+        ref(array(UniversalPortal_Shared.Portal.portal)) =
         ref([||]);
 
       let getInitialProps =
@@ -44,7 +44,7 @@ let make = (~path, ~renderApp, ~getInitialProps as getInitialPropsOpt) => [
               UniversalPortal_Server.collectPortals(
                 renderApp(props),
                 (
-                  collectedPortal: UniversalPortal_Shared.Components.Portal.portal,
+                  collectedPortal: UniversalPortal_Shared.Portal.portal,
                 ) => {
                 portals := Array.append(portals^, [|collectedPortal|])
               }),

src/server/dune

@@ -6,7 +6,7 @@
   cohttp
   cohttp-lwt
   lwt
-  styled-ppx.emotion_native
+  styled-ppx.native
   lwt.unix
   cohttp-lwt-unix
   universal-portal.server

src/universal/js/dune

@@ -3,7 +3,7 @@
 (library
  (name shared_js_demo)
  (modes melange)
- (libraries reason-react styled-ppx.emotion universal-portal.shared_js)
+ (libraries reason-react styled-ppx.melange universal-portal.shared_js)
  (preprocess
   (pps
    melange.ppx

src/universal/native/dune

@@ -15,7 +15,7 @@
   yojson
   lwt
   lwt.unix
-  styled-ppx.emotion_native
+  styled-ppx.native
   cohttp-lwt-unix)
  (preprocess
   (pps

src/universal/native/lib/Components/Components_Head.re

@@ -1,5 +1,5 @@
 [@react.component]
 let make = (~children) =>
-  <UniversalPortal_Shared.Components.Portal selector="head">
+  <UniversalPortal_Shared.Portal selector="head">
     children
-  </UniversalPortal_Shared.Components.Portal>;
+  </UniversalPortal_Shared.Portal>;

src/universal/native/lib/Components/Components_Loader.re

@@ -52,7 +52,7 @@ module Styles = {
 
 [@react.component]
 let make = () => {
-  <UniversalPortal_Shared.Components.Portal selector="body">
+  <UniversalPortal_Shared.Portal selector="body">
     <div className=Styles.loader> <div className=Styles.loaderBar /> </div>
-  </UniversalPortal_Shared.Components.Portal>;
+  </UniversalPortal_Shared.Portal>;
 };

src/universal/native/lib/Components/Components_TopBar.re

@@ -165,19 +165,29 @@ module MobileMenu = {
   };
 };
 
-[@react.component]
-let make = () => {
-  let url = ReasonReactRouter.useUrl();
-  let (active, setActive) = React.useState(_ => "");
+let useActiveTab = () =>
+  switch%platform () {
+  | Client =>
+    let url = ReasonReactRouter.useUrl();
+    let (active, setActive) = React.useState(_ => "");
+
+    React.useEffect1(
+      () => {
+        setActive(_ => url.path |> joinUrlPaths);
+
+        None;
+      },
+      [|url|],
+    );
 
-  React.useEffect1(
-    () => {
-      setActive(_ => url.path |> joinUrlPaths);
+    active;
 
-      None;
-    },
-    [|url|],
-  );
+  | Server => ""
+  };
+
+[@react.component]
+let make = () => {
+  let active = useActiveTab();
 
   <div className=Styles.wrapper>
     <div className=Styles.topBar>

src/universal/native/lib/Hooks/Hooks_useFetch.re

@@ -9,6 +9,14 @@ let make = url => {
   let (loading, setLoading) = React.useState(_ => true);
   let (error, setError) = React.useState(_ => None);
 
+  switch%platform () {
+  | Server => 
+    let _ = setData;
+    let _ = setLoading;
+    let _ = setError;
+  | Client => ()
+  };
+
   React.useEffect1(
     () => {
       let fetch = () =>

src/universal/native/lib/Pages/Pages_Portal.re

@@ -76,7 +76,7 @@ let make = () => {
         {"Open modal" |> React.string}
       </Components_Button>
       {modalOpen
-         ? <UniversalPortal_Shared.Components.Portal selector="body">
+         ? <UniversalPortal_Shared.Portal selector="body">
              <div className=Styles.modal>
                <div
                  ref={ReactDOM.Ref.domRef(modalRef)}
@@ -90,7 +90,7 @@ let make = () => {
                  </button>
                </div>
              </div>
-           </UniversalPortal_Shared.Components.Portal>
+           </UniversalPortal_Shared.Portal>
          : React.null}
     </div>
   </Components.Layout>;