merge branch: synced with main

juspay · Jan 23, 2024 · 6747d02 · 6747d02
2 parents 6eec458 + d587598
commit 6747d02
Show file tree

Hide file tree

Showing 16 changed files with 715 additions and 387 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -3,6 +3,37 @@ All notable changes to this project will be documented in this file. See [conven
 
 - - -
 
+## 1.28.0 (2024-01-22)
+
+### Features
+
+- Permission based sidebar navigation ([#265](https://github.com/juspay/hyperswitch-control-center/pull/265)) ([`d545a56`](https://github.com/juspay/hyperswitch-control-center/commit/d545a56ceed84777fac27c7b8ca0ce92042bddaf))
+- ACLButton Added ([#277](https://github.com/juspay/hyperswitch-control-center/pull/277)) ([`1032650`](https://github.com/juspay/hyperswitch-control-center/commit/1032650defeec0ef25eeb31735db116421b2bdfe))
+
+**Full Changelog:** [`v1.27.0...v1.28.0`](https://github.com/juspay/hyperswitch-control-center/compare/v1.27.0...v1.28.0)
+
+- - -
+
+
+## 1.27.0 (2024-01-21)
+
+### Features
+
+- Update pr label on merge to closed ([#207](https://github.com/juspay/hyperswitch-control-center/pull/207)) ([`f8994ff`](https://github.com/juspay/hyperswitch-control-center/commit/f8994ff8faadc73bf89c67048d2c798024701963))
+
+### Bug Fixes
+
+- Make basic details form to accept form input without Save button ([#271](https://github.com/juspay/hyperswitch-control-center/pull/271)) ([`3784090`](https://github.com/juspay/hyperswitch-control-center/commit/3784090a99cf67c4dee69b914b66fe7979a39620))
+
+### Miscellaneous Tasks
+
+- Option Core changes ([#268](https://github.com/juspay/hyperswitch-control-center/pull/268)) ([`94e70d3`](https://github.com/juspay/hyperswitch-control-center/commit/94e70d37fb3fc36104ea3ad412f03afc7d115369))
+
+**Full Changelog:** [`v1.26.0...v1.27.0`](https://github.com/juspay/hyperswitch-control-center/compare/v1.26.0...v1.27.0)
+
+- - -
+
+
 ## 1.26.0 (2024-01-18)
 
 ### Features

diff --git a/config/FeatureFlag.json b/config/FeatureFlag.json
@@ -22,5 +22,6 @@
   "forgot_password": false,
   "user_journey_analytics": false,
   "surcharge": false,
-  "customers_module": false
+  "customers_module": false,
+  "permission_based_module": false
 }
diff --git a/src/components/ACLButton.res b/src/components/ACLButton.res
@@ -0,0 +1,72 @@
+open Button
+
+@react.component
+let make = (
+  ~text=?,
+  ~buttonState: buttonState=Normal,
+  ~buttonType: buttonType=SecondaryFilled,
+  ~buttonVariant: buttonVariant=Fit,
+  ~buttonSize: option<buttonSize>=?,
+  ~leftIcon: iconType=NoIcon,
+  ~rightIcon: iconType=NoIcon,
+  ~showBorder=true,
+  ~type_="button",
+  ~onClick=?,
+  ~textStyle="",
+  ~customIconMargin=?,
+  ~customTextSize=?,
+  ~customIconSize=?,
+  ~textWeight=?,
+  ~fullLength=false,
+  ~disableRipple=false,
+  ~customButtonStyle="",
+  ~textStyleClass=?,
+  ~customTextPaddingClass=?,
+  ~allowButtonTextMinWidth=true,
+  ~customPaddingClass=?,
+  ~customRoundedClass=?,
+  ~customHeightClass=?,
+  ~customBackColor=?,
+  ~showBtnTextToolTip=false,
+  ~access=AuthTypes.Access,
+  ~tooltipText="You do not have the required permissions to access this module. Please contact your administrator for necessary permissions.",
+  ~toolTipPosition=?,
+) => {
+  let buttonState = switch access {
+  | Access => buttonState
+  | NoAccess => Button.Disabled
+  }
+
+  let showBtnTextToolTip = access === NoAccess
+
+  <Button
+    buttonState
+    ?text
+    buttonType
+    buttonVariant
+    ?buttonSize
+    leftIcon
+    rightIcon
+    showBorder
+    type_
+    ?onClick
+    textStyle
+    ?customIconMargin
+    ?customTextSize
+    ?customIconSize
+    ?textWeight
+    fullLength
+    disableRipple
+    customButtonStyle
+    ?textStyleClass
+    ?customTextPaddingClass
+    allowButtonTextMinWidth
+    ?customPaddingClass
+    ?customRoundedClass
+    ?customHeightClass
+    ?customBackColor
+    showBtnTextToolTip
+    tooltipText
+    ?toolTipPosition
+  />
+}
diff --git a/src/components/ACLButton.resi b/src/components/ACLButton.resi
@@ -0,0 +1,32 @@
+@react.component
+let make: (
+  ~text: string=?,
+  ~buttonState: Button.buttonState=?,
+  ~buttonType: Button.buttonType=?,
+  ~buttonVariant: Button.buttonVariant=?,
+  ~buttonSize: Button.buttonSize=?,
+  ~leftIcon: Button.iconType=?,
+  ~rightIcon: Button.iconType=?,
+  ~showBorder: bool=?,
+  ~type_: string=?,
+  ~onClick: JsxEvent.Mouse.t => unit=?,
+  ~textStyle: string=?,
+  ~customIconMargin: string=?,
+  ~customTextSize: string=?,
+  ~customIconSize: int=?,
+  ~textWeight: string=?,
+  ~fullLength: bool=?,
+  ~disableRipple: bool=?,
+  ~customButtonStyle: string=?,
+  ~textStyleClass: string=?,
+  ~customTextPaddingClass: string=?,
+  ~allowButtonTextMinWidth: bool=?,
+  ~customPaddingClass: string=?,
+  ~customRoundedClass: string=?,
+  ~customHeightClass: string=?,
+  ~customBackColor: string=?,
+  ~showBtnTextToolTip: bool=?,
+  ~access: AuthTypes.authorization=?,
+  ~tooltipText: Js.String2.t=?,
+  ~toolTipPosition: ToolTip.toolTipPosition=?,
+) => React.element
diff --git a/src/components/Button.res b/src/components/Button.res
@@ -360,7 +360,9 @@ let make = (
   ~customBackColor=?,
   ~isPhoneDropdown=false,
   ~showBtnTextToolTip=false,
-  ~access=AuthTypes.Access,
+  ~showTooltip=false,
+  ~tooltipText=?,
+  ~toolTipPosition=ToolTip.Top,
 ) => {
   let parentRef = React.useRef(Js.Nullable.null)
   let dummyRef = React.useRef(Js.Nullable.null)
@@ -698,107 +700,106 @@ let make = (
     )} ${customRoundedClass->Option.getWithDefault(roundedClass)}`
   let customJustifyStyle = customButtonStyle->String.includes("justify") ? "" : "justify-center"
 
-  <UIUtils.RenderIf condition={access !== AuthTypes.NoAccess}>
-    <AddDataAttributes attributes=[(dataAttrKey, dataAttrStr)]>
-      <button
-        type_
-        disabled=dis
-        ref={parentRef->ReactDOM.Ref.domRef}
-        onKeyUp={e => e->ReactEvent.Keyboard.preventDefault}
-        onKeyPress={e => {
-          if !onEnterPress {
-            e->ReactEvent.Keyboard.preventDefault
-          }
-        }}
-        className={`flex group ${customJustifyStyle} ${relativeClass} ${heightClass} ${conditionalButtonStyles} items-center ${borderStyle}  ${textColor} ${cursorType} ${paddingClass} ${lengthStyle} ${customButtonStyle}  ${customTextOverFlowClass}`}
-        onClick=handleClick>
-        {if buttonState == Loading {
-          <span className={iconPadding}>
-            <span className={`flex items-center mx-2 animate-spin`}>
-              <Loadericon size=iconSize iconColor=?loaderIconColor />
-            </span>
+  <AddDataAttributes attributes=[(dataAttrKey, dataAttrStr)]>
+    <button
+      type_
+      disabled=dis
+      ref={parentRef->ReactDOM.Ref.domRef}
+      onKeyUp={e => e->ReactEvent.Keyboard.preventDefault}
+      onKeyPress={e => {
+        if !onEnterPress {
+          e->ReactEvent.Keyboard.preventDefault
+        }
+      }}
+      className={`flex group ${customJustifyStyle} ${relativeClass} ${heightClass} ${conditionalButtonStyles} items-center ${borderStyle}  ${textColor} ${cursorType} ${paddingClass} ${lengthStyle} ${customButtonStyle}  ${customTextOverFlowClass}`}
+      onClick=handleClick>
+      {if buttonState == Loading {
+        <span className={iconPadding}>
+          <span className={`flex items-center mx-2 animate-spin`}>
+            <Loadericon size=iconSize iconColor=?loaderIconColor />
           </span>
-        } else {
-          switch leftIcon {
-          | FontAwesome(iconName) =>
-            <span className={`flex items-center ${iconColor} ${iconMargin} ${iconPadding}`}>
-              <Icon
-                className={`align-middle ${strokeColor} ${iconBorderColor}`}
-                size=iconSize
-                name=iconName
-              />
-            </span>
-          | Euler(iconName) =>
-            <span className={`flex items-center ${iconColor} ${iconMargin} ${eulerIconPadding}`}>
-              <Icon className={`align-middle ${strokeColor}`} size=iconSize name=iconName />
-            </span>
-          | CustomIcon(element) =>
-            <span className={`flex items-center ${iconMargin}`}> {element} </span>
-          | _ => React.null
-          }
-        }}
-        {switch text {
-        | Some(textStr) =>
-          if !(textStr->LogicUtils.isEmptyString) {
-            let btnContent =
-              <AddDataAttributes attributes=[("data-button-text", textStr)]>
-                <div
-                  className={`${textPaddingClass} ${textSize} ${textWeight} ${ellipsisClass} whitespace-pre ${textStyle}`}>
-                  {buttonState == Loading ? React.string(loadingText) : React.string(textStr)}
-                </div>
-              </AddDataAttributes>
-
-            if showBtnTextToolTip {
-              <div className=ellipsisParentClass>
-                <ToolTip
-                  description=textStr
-                  toolTipFor=btnContent
-                  contentAlign=Default
-                  justifyClass="justify-start"
-                />
-              </div>
-            } else {
-              <div className=ellipsisParentClass> btnContent </div>
-            }
-          } else {
-            React.null
-          }
-
-        | None => React.null
-        }}
-        {switch badge.color {
-        | NoBadge => React.null
-        | _ =>
-          <AddDataAttributes attributes=[("data-badge-value", badge.value)]>
-            <span
-              className={`flex items-center ${rightIconSpacing} ${badgeColor} ${badgeTextColor} ${badgeSpacing} ${badgeTextSize}  rounded-full`}>
-              {React.string(badge.value)}
-            </span>
-          </AddDataAttributes>
-        }}
-        {switch buttonRightText {
-        | Some(text) =>
-          <UIUtils.RenderIf condition={!(text->LogicUtils.isEmptyString)}>
-            <span className="text-jp-2-light-primary-600 font-semibold text-fs-14">
-              {React.string(text)}
-            </span>
-          </UIUtils.RenderIf>
-        | None => React.null
-        }}
-        {switch rightIcon {
+        </span>
+      } else {
+        switch leftIcon {
         | FontAwesome(iconName) =>
-          <span className={`flex items-center ${rightIconSpacing}`}>
-            <Icon className={`align-middle ${strokeColor}`} size=iconSize name=iconName />
+          <span className={`flex items-center ${iconColor} ${iconMargin} ${iconPadding}`}>
+            <Icon
+              className={`align-middle ${strokeColor} ${iconBorderColor}`}
+              size=iconSize
+              name=iconName
+            />
           </span>
         | Euler(iconName) =>
-          <span className={`flex items-center ${iconMargin} ${eulerIconPadding}`}>
+          <span className={`flex items-center ${iconColor} ${iconMargin} ${eulerIconPadding}`}>
             <Icon className={`align-middle ${strokeColor}`} size=iconSize name=iconName />
           </span>
         | CustomIcon(element) =>
-          <span className={`flex items-center ${iconPadding} `}> {element} </span>
+          <span className={`flex items-center ${iconMargin}`}> {element} </span>
         | _ => React.null
-        }}
-      </button>
-    </AddDataAttributes>
-  </UIUtils.RenderIf>
+        }
+      }}
+      {switch text {
+      | Some(textStr) =>
+        if !(textStr->LogicUtils.isEmptyString) {
+          let btnContent =
+            <AddDataAttributes attributes=[("data-button-text", textStr)]>
+              <div
+                className={`${textPaddingClass} ${textSize} ${textWeight} ${ellipsisClass} whitespace-pre ${textStyle}`}>
+                {buttonState == Loading ? React.string(loadingText) : React.string(textStr)}
+              </div>
+            </AddDataAttributes>
+
+          if showBtnTextToolTip {
+            <div className=ellipsisParentClass>
+              <ToolTip
+                description={tooltipText->Option.getWithDefault("")}
+                toolTipFor=btnContent
+                contentAlign=Default
+                justifyClass="justify-start"
+                toolTipPosition
+              />
+            </div>
+          } else {
+            <div className=ellipsisParentClass> btnContent </div>
+          }
+        } else {
+          React.null
+        }
+
+      | None => React.null
+      }}
+      {switch badge.color {
+      | NoBadge => React.null
+      | _ =>
+        <AddDataAttributes attributes=[("data-badge-value", badge.value)]>
+          <span
+            className={`flex items-center ${rightIconSpacing} ${badgeColor} ${badgeTextColor} ${badgeSpacing} ${badgeTextSize}  rounded-full`}>
+            {React.string(badge.value)}
+          </span>
+        </AddDataAttributes>
+      }}
+      {switch buttonRightText {
+      | Some(text) =>
+        <UIUtils.RenderIf condition={!(text->LogicUtils.isEmptyString)}>
+          <span className="text-jp-2-light-primary-600 font-semibold text-fs-14">
+            {React.string(text)}
+          </span>
+        </UIUtils.RenderIf>
+      | None => React.null
+      }}
+      {switch rightIcon {
+      | FontAwesome(iconName) =>
+        <span className={`flex items-center ${rightIconSpacing}`}>
+          <Icon className={`align-middle ${strokeColor}`} size=iconSize name=iconName />
+        </span>
+      | Euler(iconName) =>
+        <span className={`flex items-center ${iconMargin} ${eulerIconPadding}`}>
+          <Icon className={`align-middle ${strokeColor}`} size=iconSize name=iconName />
+        </span>
+      | CustomIcon(element) =>
+        <span className={`flex items-center ${iconPadding} `}> {element} </span>
+      | _ => React.null
+      }}
+    </button>
+  </AddDataAttributes>
 }
diff --git a/src/components/Button.resi b/src/components/Button.resi
@@ -78,7 +78,7 @@ let make: (
   ~buttonFor: string=?,
   ~loadingText: string=?,
   ~buttonState: buttonState=?,
-  ~text: Js.String2.t=?,
+  ~text: string=?,
   ~isSelectBoxButton: bool=?,
   ~buttonType: buttonType=?,
   ~isDropdownOpen: bool=?,
@@ -115,5 +115,7 @@ let make: (
   ~customBackColor: string=?,
   ~isPhoneDropdown: bool=?,
   ~showBtnTextToolTip: bool=?,
-  ~access: AuthTypes.authorization=?,
+  ~showTooltip: bool=?,
+  ~tooltipText: Js.String2.t=?,
+  ~toolTipPosition: ToolTip.toolTipPosition=?,
 ) => React.element