@colisweb/rescript-toolkit 2.61.0 → 2.62.0

package/.gitlab-ci.yml

@@ -1,5 +1,8 @@
 include:
-  - "https://colisweb-idl.gitlab.io/colisweb-open-source/ci-common/v14.3.2/templates/colisweb.yml"
+  - "https://colisweb-idl.gitlab.io/colisweb-open-source/ci-common/v16.1.8/templates/scala.yml"
+
+variables:
+  GIT_COMMIT_FILES: ""
 
 # -----------------------------------------------
 # Test

package/locale/fr.json

@@ -54,6 +54,11 @@
     "defaultMessage": "Lundi",
     "message": "Lundi"
   },
+  {
+    "id": "_a7e73ea4",
+    "defaultMessage": "Déconnexion",
+    "message": "Déconnexion"
+  },
   {
     "id": "_aaa4996e",
     "defaultMessage": "Dimanche",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@colisweb/rescript-toolkit",
-  "version": "2.61.0",
+  "version": "2.62.0",
   "scripts": {
     "clean": "rescript clean",
     "build": "rescript build -with-deps",

package/src/ui/Toolkit__Ui_Layout.res

@@ -1,5 +1,3 @@
-open ReachUi
-
 module Container = {
   @react.component
   let make = (~children) =>
@@ -41,7 +39,7 @@ module App = {
 
   module TopNavigationBar = {
     @react.component
-    let make = (~toggleMenu, ~username, ~onLogoClick, ~logout, ~logoutLabel) => {
+    let make = (~toggleMenu, ~username, ~onLogoClick, ~logout) => {
       <div
         className="bg-white h-16 border-b flex items-center px-1 justify-between fixed top-0 left-0 w-full z-40">
         <div className="flex items-center px-1">
@@ -59,23 +57,24 @@ module App = {
             <img src="/assets/logo.svg" alt="Colisweb" className="w-16 ml-4" />
           </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>
-              </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>
+        <Toolkit__Ui_Dropdown
+          buttonClassName="border-none focus:!shadow-none active:!shadow-none"
+          dropdownClassName={"w-40 -mt-1 !shadow-[0_0_8px_rgba(44,44,44,0.20)]"}
+          label={<div className="flex items-center gap-2 text-neutral-800">
+            <span className="font-semibold truncate max-w-[150px]"> {username->React.string} </span>
+            <div>
+              <BsReactIcons.MdAccountCircle size=28 />
+            </div>
+            <div>
+              <BsReactIcons.MdKeyboardArrowDown size=18 />
+            </div>
+          </div>}>
+          <button
+            className="py-1 text-base text-neutral-700 font-semibold block w-full hover:bg-neutral-200"
+            onClick={_ => logout()}>
+            <ReactIntl.FormattedMessage defaultMessage="Déconnexion" />
+          </button>
+        </Toolkit__Ui_Dropdown>
       </div>
     }
   }
@@ -106,7 +105,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
@@ -138,7 +137,6 @@ module App = {
     ~username,
     ~sideNavRender,
     ~logout,
-    ~logoutLabel,
     ~onLogoClick,
     ~bottom=?,
   ) => {
@@ -168,7 +166,7 @@ module App = {
 
     <NavOpenContext.Provider value={isNavOpen}>
       <div>
-        <TopNavigationBar username logout logoutLabel toggleMenu onLogoClick />
+        <TopNavigationBar username logout toggleMenu onLogoClick />
         <div className="flex">
           <LeftNavigationBar isNavOpen ?bottom hideMenu openMenu>
             {sideNavRender}

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 = {