@colisweb/rescript-toolkit 2.60.0 → 2.61.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@colisweb/rescript-toolkit",
-  "version": "2.60.0",
+  "version": "2.61.1",
   "scripts": {
     "clean": "rescript clean",
     "build": "rescript build -with-deps",
@@ -78,7 +78,7 @@
     "rescript-classnames": "6.0.0",
     "rescript-react-update": "5.0.0",
     "sanitize-html": "1.27.4",
-    "swr": "1.3.0",
+    "swr": "2.0.0",
     "tailwindcss": "3.2.4"
   },
   "devDependencies": {

package/src/fetcher/Toolkit__Fetcher.res

@@ -4,19 +4,16 @@ module type Config = {
 }
 
 module Make = (Config: Config) => {
-  let key: Config.Request.argument => Swr.SwrKey.t = (arr)=> Config.key(arr)->Js.Array2.joinWith("--")->Swr.SwrKey.make
+  let key: Config.Request.argument => Swr.SwrKey.t = arr =>
+    Config.key(arr)->Js.Array2.joinWith("--")->Swr.SwrKey.make
 
   let use = (
     ~options: option<Swr.fetcherOptions>=?,
     argument: option<Config.Request.argument>,
   ): Toolkit__Hooks.fetcher<Config.Request.response> =>
-    Toolkit__Hooks.useFetcher(
-      ~options?,
-      argument->Option.map(key),
-      () => {
-        Config.Request.exec(argument->Option.getExn)->Promise.Js.fromResult
-      },
-    )
+    Toolkit__Hooks.useFetcher(~options?, argument->Option.map(key), () => {
+      Config.Request.exec(argument->Option.getExn)->Promise.Js.fromResult
+    })
 
   let useOptional = (
     ~options: option<Swr.fetcherOptions>=?,
@@ -26,3 +23,28 @@ module Make = (Config: Config) => {
       Config.Request.exec(argument->Option.getExn)->Promise.Js.fromResult
     })
 }
+
+module type MutationConfig = {
+  module Request: Toolkit__Request.Config
+  let key: string
+}
+
+module MakeMutation = (Config: MutationConfig) => {
+  let key = Config.key->Swr.SwrKey.make
+
+  let useMutation = (
+    ~options: option<Swr.mutationFetcherOptions<Config.Request.response>>=?,
+    key: string,
+  ) => {
+    Swr.useSwrMutation(
+      Swr.SwrKey.make(key),
+      (_url, {arg}) => {
+        Config.Request.exec(arg)->Promise.Js.fromResult
+      },
+      switch options {
+      | Some(options) => options->Obj.magic
+      | None => {revalidate: true}
+      },
+    )
+  }
+}

package/src/ui/Toolkit__Ui_Layout.res

@@ -60,21 +60,23 @@ module App = {
           </a>
         </div>
         <Menu>
-          {_ => <>
-            <MenuButton>
-              <div className="flex items-center flex-col-gap-2 text-neutral-800">
-                <span className="font-semibold"> {username->React.string} </span>
-                <div> <BsReactIcons.MdAccountCircle size=28 /> </div>
-                <div> <BsReactIcons.MdKeyboardArrowDown size=18 /> </div>
+          <MenuButton>
+            <div className="flex items-center flex-col-gap-2 text-neutral-800">
+              <span className="font-semibold"> {username->React.string} </span>
+              <div>
+                <BsReactIcons.MdAccountCircle size=28 />
               </div>
-            </MenuButton>
-            <MenuList
-              className="focus:outline-none focus:shadow-none bg-white z-50 shadow-lg rounded border py-2 ml-2 mt-2 w-48">
-              <MenuItem className="text-lg py-2 px-4 flex items-center" onSelect=logout>
-                logoutLabel
-              </MenuItem>
-            </MenuList>
-          </>}
+              <div>
+                <BsReactIcons.MdKeyboardArrowDown size=18 />
+              </div>
+            </div>
+          </MenuButton>
+          <MenuList
+            className="focus:outline-none focus:shadow-none bg-white z-50 shadow-lg rounded border py-2 ml-2 mt-2 w-48">
+            <MenuItem className="text-lg py-2 px-4 flex items-center" onSelect=logout>
+              logoutLabel
+            </MenuItem>
+          </MenuList>
         </Menu>
       </div>
     }
@@ -106,7 +108,7 @@ module App = {
             "lg:flex border-r px-2 py-3 fixed flex-col bg-white justify-between transition-all duration-300 ease-in-out z-40",
             isNavOpen ? "w-64 overflow-y-auto" : "w-16 hidden sidenav--closed",
           ])}>
-          {children({onLinkClick: onLinkClick, isNavOpen: isNavOpen, openMenu: openMenu})}
+          {children({onLinkClick, isNavOpen, openMenu})}
           {bottom->Option.mapWithDefault(React.null, content =>
             <div className={!isNavOpen ? "overflow-hidden" : ""}>
               <div

package/src/vendors/Swr.res

@@ -12,6 +12,7 @@ type fetcherOptions
 @obj
 external makeFetcherOptions: (
   ~suspense: bool=?,
+  ~keepPreviousData: bool=?,
   ~fetcher: 'fetcher=?,
   ~fallbackData: 'data=?,
   ~revalidateOnFocus: bool=?,
@@ -43,16 +44,39 @@ type fetcher<'data> = {
   data: option<'data>,
   error: option<Js.Exn.t>,
   isValidating: bool,
+  isLoading: bool,
   mutate: (. unit) => Js.Promise.t<bool>,
 }
 
+type mutationFetcherOptions<'optimisticData> = {
+  optimisticData?: 'optimisticData => 'optimisticData,
+  revalidate?: bool,
+  populateCache?: bool,
+}
+
+type mutationFetcher<'params, 'data, 'error> = {
+  data: option<'data>,
+  error: option<Js.Exn.t>,
+  isMutating: bool,
+  trigger: 'params => Promise.Js.t<'data, 'error>,
+}
+
 module SwrKey = Toolkit__Identifier.MakeString()
 
 @module("swr")
 external useSwr: (option<SwrKey.t>, 'fn, 'fetcherOptions) => fetcher<'data> = "default"
 
+type mutationParams<'params> = {arg: 'params}
+@module("swr/mutation")
+external useSwrMutation: (
+  SwrKey.t,
+  (string, mutationParams<'params>) => 'response,
+  mutationFetcherOptions<'optimisticData>,
+) => mutationFetcher<'params, 'data, 'error> = "default"
+
 @module("swr")
-external useSwrOptional: (option<SwrKey.t>, 'fn, 'fetcherOptions) => fetcher<option<'data>> = "default"
+external useSwrOptional: (option<SwrKey.t>, 'fn, 'fetcherOptions) => fetcher<option<'data>> =
+  "default"
 
 type cache
 @module("swr") external cache: cache = "cache"

package/src/vendors/reach-ui/ReachUi_MenuButton.res

@@ -4,7 +4,7 @@ module Menu = {
   type renderProps = {isOpen: bool}
 
   @module("@reach/menu-button") @react.component
-  external make: (~children: renderProps => React.element) => React.element = "Menu"
+  external make: (~children: React.element) => React.element = "Menu"
 }
 
 module MenuButton = {