fix: Code refactoring

juspay · Dec 6, 2023 · ad57376 · ad57376
1 parent d886d4f
commit ad57376
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 28 deletions.
diff --git a/src/screens/HyperSwitch/Connectors/ConnectorAccountDetails.res b/src/screens/HyperSwitch/Connectors/ConnectorAccountDetails.res
@@ -485,7 +485,7 @@ let make = (
       formClass="flex flex-col ">
       <div className="flex items-center justify-between border-b p-2 md:px-10 md:py-6">
         <div className="flex gap-2 items-center">
-          <GatewayIcon gateway={connector->Js.String2.toUpperCase} className="w-14 h-14" />
+          <GatewayIcon gateway={connector->Js.String2.toUpperCase} />
           <h2 className="text-xl font-semibold">
             {connector->LogicUtils.capitalizeString->React.string}
           </h2>

diff --git a/src/screens/HyperSwitch/Connectors/ConnectorList.res b/src/screens/HyperSwitch/Connectors/ConnectorList.res
@@ -27,23 +27,17 @@ module NewProcessorCards = {
 
     let (showModal, setShowModal) = React.useState(_ => false)
     let (searchedConnector, setSearchedConnector) = React.useState(_ => "")
+    let searchRef = React.useRef(Js.Nullable.null)
 
     let urlPrefix = isPayoutFlow ? "payoutconnectors/new" : "connectors/new"
     let handleClick = connectorName => {
       RescriptReactRouter.push(`${urlPrefix}?name=${connectorName}`)
     }
     let unConfiguredConnectorsCount = unConfiguredConnectors->Js.Array2.length
 
-    let input: ReactFinalForm.fieldRenderPropsInput = {
-      name: "string",
-      onBlur: _ev => (),
-      onChange: ev => {
-        let value = {ev->ReactEvent.Form.target}["value"]
-        setSearchedConnector(_ => value)
-      },
-      onFocus: _ev => (),
-      value: searchedConnector->Js.Json.string,
-      checked: true,
+    let handleSearch = event => {
+      let val = ref(ReactEvent.Form.currentTarget(event)["value"])
+      setSearchedConnector(_ => val.contents)
     }
 
     let descriptedConnectors = (
@@ -68,11 +62,13 @@ module NewProcessorCards = {
           </UIUtils.RenderIf>
         </div>
         <UIUtils.RenderIf condition={showSearch}>
-          <TextInput
-            input
-            placeholder="Search for a processor"
-            customWidth="w-1/3"
-            leftIcon={<Icon size=16 className="text-jp-2-light-gray-1000" name="search" />}
+          <input
+            ref={searchRef->ReactDOM.Ref.domRef}
+            type_="text"
+            value=searchedConnector
+            onChange=handleSearch
+            placeholder="Search processor"
+            className={`rounded-md px-4 py-2 focus:outline-none w-1/3 border`}
           />
         </UIUtils.RenderIf>
         <UIUtils.RenderIf condition={connectorList->Js.Array2.length > 0}>
@@ -137,11 +133,13 @@ module NewProcessorCards = {
           </UIUtils.RenderIf>
         </div>
         <UIUtils.RenderIf condition={showSearch}>
-          <TextInput
-            input
-            placeholder="Search for a processor"
-            customWidth="w-1/3"
-            leftIcon={<Icon size=16 className="text-jp-2-light-gray-1000" name="search" />}
+          <input
+            ref={searchRef->ReactDOM.Ref.domRef}
+            type_="text"
+            value=searchedConnector
+            onChange=handleSearch
+            placeholder="Search processor"
+            className={`rounded-md px-4 py-2 focus:outline-none w-1/3 border`}
           />
         </UIUtils.RenderIf>
         <div className="bg-white rounded-md flex gap-2 flex-wrap p-4 border">
@@ -175,10 +173,9 @@ module NewProcessorCards = {
     let connectorListFiltered = {
       if searchedConnector->Js.String2.length > 0 {
         connectorsAvailableForIntegration->Js.Array2.filter(item =>
-          LogicUtils.checkStringStartsWithSubstring(
-            ~itemToCheck=item->ConnectorUtils.getConnectorNameString,
-            ~searchText=searchedConnector->Js.String2.toLowerCase,
-          )
+          item
+          ->ConnectorUtils.getConnectorNameString
+          ->Js.String2.includes(searchedConnector->Js.String2.toLowerCase)
         )
       } else {
         connectorsAvailableForIntegration

diff --git a/src/screens/HyperSwitch/Connectors/ConnectorPaymentMethod.res b/src/screens/HyperSwitch/Connectors/ConnectorPaymentMethod.res
@@ -86,7 +86,7 @@ let make = (
     <div className="flex flex-col">
       <div className="flex justify-between border-b p-2 md:px-10 md:py-6">
         <div className="flex gap-2 items-center">
-          <GatewayIcon gateway={connector->Js.String2.toUpperCase} className="w-14 h-14" />
+          <GatewayIcon gateway={connector->Js.String2.toUpperCase} />
           <h2 className="text-xl font-semibold">
             {connector->LogicUtils.capitalizeString->React.string}
           </h2>

diff --git a/src/utils/LogicUtils.res b/src/utils/LogicUtils.res
@@ -609,14 +609,17 @@ let getTitle = name => {
 }
 
 // Regex to check if a string contains a substring
-let regex = (a, searchString) => {
+let regex = (positionToCheckFrom, searchString) => {
   let searchStringNew =
     searchString
     ->Js.String2.replaceByRe(%re("/[<>\[\]';|?*\\]/g"), "")
     ->Js.String2.replaceByRe(%re("/\(/g"), "\\(")
     ->Js.String2.replaceByRe(%re("/\+/g"), "\\+")
     ->Js.String2.replaceByRe(%re("/\)/g"), "\\)")
-  Js.Re.fromStringWithFlags("(.*)(" ++ a ++ "" ++ searchStringNew ++ ")(.*)", ~flags="i")
+  Js.Re.fromStringWithFlags(
+    "(.*)(" ++ positionToCheckFrom ++ "" ++ searchStringNew ++ ")(.*)",
+    ~flags="i",
+  )
 }
 
 let checkStringStartsWithSubstring = (~itemToCheck, ~searchText) => {