diff --git a/src/components/AuthWrapperUtils.res b/src/components/AuthWrapperUtils.res
index 7143a03b4..7367343ab 100644
--- a/src/components/AuthWrapperUtils.res
+++ b/src/components/AuthWrapperUtils.res
@@ -1,8 +1,3 @@
-type parent
-
-@val external window: 'a = "window"
-@val @scope("window") external parent: parent = "parent"
-
 let getValidToken = oStr => {
   if oStr !== Some("__failed") && oStr !== Some("") {
     oStr
diff --git a/src/components/DynamicTableUtils.res b/src/components/DynamicTableUtils.res
index 0ed26a256..2bfaf6e7b 100644
--- a/src/components/DynamicTableUtils.res
+++ b/src/components/DynamicTableUtils.res
@@ -1,7 +1,5 @@
 let tableHeadingClass = "font-bold text-xl text-black text-opacity-75 dark:text-white dark:text-opacity-75"
 type view = Table | Card
-@val @scope(("window", "location"))
-external reload: unit => unit = "reload"
 
 let visibilityColFunc = (
   ~dateFormatConvertor: string => option<Js.Json.t>,
@@ -248,7 +246,10 @@ module TableLoadingErrorIndicator = {
                 {React.string("Oops, Something Went Wrong! Try again Later.")}
               </div>
               <Button
-                text="Refresh" leftIcon={FontAwesome("sync-alt")} onClick={_ => reload()} buttonType
+                text="Refresh"
+                leftIcon={FontAwesome("sync-alt")}
+                onClick={_ => Window.Location.reload()}
+                buttonType
               />
             </>}
       </div>
diff --git a/src/components/RemoteFilter.res b/src/components/RemoteFilter.res
index 5bb81d18b..7bce6fb6e 100644
--- a/src/components/RemoteFilter.res
+++ b/src/components/RemoteFilter.res
@@ -1,10 +1,5 @@
 let makeFieldInfo = FormRenderer.makeFieldInfo
 
-@val @scope(("window", "location"))
-external reload: unit => unit = "reload"
-@val @scope(("window", "location"))
-external replace: string => unit = "replace"
-
 module ClearForm = {
   @react.component
   let make = () => {
@@ -835,7 +830,7 @@ let make = (
     let urlValue = `${path}?${newQueryStr}`
     setClearFilterAfterRefresh(_ => true)
     setInitialValueJson(_ => Dict.make()->Js.Json.object_)
-    replace(urlValue)
+    Window.Location.replace(urlValue)
   }
 
   let refreshFilterUi = {
diff --git a/src/components/SelectBox.res b/src/components/SelectBox.res
index 73bf8e53b..77b6325a9 100644
--- a/src/components/SelectBox.res
+++ b/src/components/SelectBox.res
@@ -4,9 +4,6 @@ external toDict: 'a => Dict.t<'t> = "%identity"
 @send external getClientRects: Dom.element => Dom.domRect = "getClientRects"
 @send external focus: Dom.element => unit = "focus"
 
-@val @scope("window") external windowInnerHeight: int = "innerHeight"
-@val @scope("window") external windowInnerWidth: int = "innerWidth"
-
 external ffInputToSelectInput: ReactFinalForm.fieldRenderPropsInput => ReactFinalForm.fieldRenderPropsCustomInput<
   array<string>,
 > = "%identity"
@@ -1624,9 +1621,9 @@ module BaseDropdown = {
         ->Js.Nullable.toOption
         ->Option.flatMap(elem => elem->getClientRects->toDict->Dict.get("0"))
         ->Option.flatMap(firstEl => {
-          let bottomVacent = windowInnerHeight - firstEl["bottom"]->Belt.Float.toInt > 375
+          let bottomVacent = Window.innerHeight - firstEl["bottom"]->Belt.Float.toInt > 375
           let topVacent = firstEl["top"]->Belt.Float.toInt > 470
-          let rightVacent = windowInnerWidth - firstEl["left"]->Belt.Float.toInt > 270
+          let rightVacent = Window.innerWidth - firstEl["left"]->Belt.Float.toInt > 270
           let leftVacent = firstEl["right"]->Belt.Float.toInt > 270
 
           if bottomVacent {
diff --git a/src/components/SelectBox.resi b/src/components/SelectBox.resi
index 6cd2a5f7f..69661c26e 100644
--- a/src/components/SelectBox.resi
+++ b/src/components/SelectBox.resi
@@ -1,16 +1,54 @@
 type retType = CheckBox(array<string>) | Radiobox(string)
-external toDict: 'a => Dict.t<'t> = "%identity"
+external toDict: 'a => RescriptCore.Dict.t<'t> = "%identity"
 @send external getClientRects: Dom.element => Dom.domRect = "getClientRects"
 @send external focus: Dom.element => unit = "focus"
-@val @scope("window") external windowInnerHeight: int = "innerHeight"
-@val @scope("window") external windowInnerWidth: int = "innerWidth"
 external ffInputToSelectInput: ReactFinalForm.fieldRenderPropsInput => ReactFinalForm.fieldRenderPropsCustomInput<
   array<string>,
 > = "%identity"
 external ffInputToRadioInput: ReactFinalForm.fieldRenderPropsInput => ReactFinalForm.fieldRenderPropsCustomInput<
   string,
 > = "%identity"
-
+let regex: (string, string) => Js.Re.t
+module ListItem: {
+  @react.component
+  let make: (
+    ~isDropDown: bool,
+    ~searchString: string,
+    ~multiSelect: bool,
+    ~optionSize: CheckBoxIcon.size=?,
+    ~isSelectedStateMinus: bool=?,
+    ~isSelected: bool,
+    ~isPrevSelected: bool=?,
+    ~isNextSelected: bool=?,
+    ~onClick: JsxEvent.Mouse.t => unit,
+    ~text: Js.String2.t,
+    ~fill: string=?,
+    ~labelValue: Js.String2.t=?,
+    ~isDisabled: bool=?,
+    ~icon: Button.iconType,
+    ~leftVacennt: bool=?,
+    ~showToggle: bool=?,
+    ~customStyle: string=?,
+    ~serialNumber: option<string>=?,
+    ~isMobileView: bool=?,
+    ~description: option<Js.String2.t>=?,
+    ~customLabelStyle: option<string>=?,
+    ~customMarginStyle: string=?,
+    ~listFlexDirection: string=?,
+    ~customSelectStyle: string=?,
+    ~textOverflowClass: string=?,
+    ~dataId: int,
+    ~showDescriptionAsTool: bool=?,
+    ~optionClass: string=?,
+    ~selectClass: string=?,
+    ~toggleProps: string=?,
+    ~checkboxDimension: string=?,
+    ~iconStroke: string=?,
+    ~showToolTipOptions: bool=?,
+    ~textEllipsisForDropDownOptions: bool=?,
+    ~textColorClass: string=?,
+  ) => React.element
+}
 type dropdownOptionWithoutOptional = {
   label: string,
   value: string,
@@ -31,7 +69,8 @@ type dropdownOption = {
   iconStroke?: string,
   textColor?: string,
 }
-let useTransformed: Js.Array2.t<dropdownOption> => Js.Array2.t<dropdownOptionWithoutOptional>
+let makeNonOptional: dropdownOption => dropdownOptionWithoutOptional
+let useTransformed: array<dropdownOption> => array<dropdownOptionWithoutOptional>
 type allSelectType = Icon | Text
 type opt = {name_: string}
 let makeOptions: array<string> => array<dropdownOption>
@@ -56,12 +95,12 @@ module BaseSelect: {
     ~showSerialNumber: bool=?,
     ~heading: string=?,
     ~showSelectionAsChips: bool=?,
-    ~maxHeight: Js.String2.t=?,
+    ~maxHeight: string=?,
     ~searchable: bool=?,
     ~optionRigthElement: React.element=?,
     ~searchInputPlaceHolder: string=?,
     ~showSearchIcon: bool=?,
-    ~customStyle: Js.String2.t=?,
+    ~customStyle: string=?,
     ~customMargin: string=?,
     ~disableSelect: bool=?,
     ~deselectDisable: bool=?,
@@ -88,10 +127,61 @@ module BaseSelect: {
     ~dropdownClassName: string=?,
     ~onItemSelect: (JsxEvent.Mouse.t, Js_string.t) => unit=?,
     ~wrapBasis: string=?,
-    ~preservedAppliedOptions: Js.Array2.t<Js_string.t>=?,
+    ~preservedAppliedOptions: array<Js_string.t>=?,
   ) => React.element
 }
-
+module BaseSelectButton: {
+  @react.component
+  let make: (
+    ~showDropDown: bool=?,
+    ~isDropDown: bool=?,
+    ~isHorizontal: bool=?,
+    ~options: array<dropdownOption>,
+    ~optionSize: CheckBoxIcon.size=?,
+    ~isSelectedStateMinus: bool=?,
+    ~onSelect: string => unit,
+    ~value: Js.Json.t,
+    ~deselectDisable: bool=?,
+    ~onBlur: ReactEvent.Focus.t => unit=?,
+    ~setShowDropDown: ('a => bool) => unit=?,
+    ~onAssignClick: string => unit=?,
+    ~customSearchStyle: string,
+    ~disableSelect: bool=?,
+    ~isMobileView: bool=?,
+    ~hideAssignBtn: bool=?,
+    ~searchInputPlaceHolder: string=?,
+    ~showSearchIcon: bool=?,
+    ~allowButtonTextMinWidth: bool=?,
+  ) => React.element
+}
+module RenderListItemInBaseRadio: {
+  @react.component
+  let make: (
+    ~newOptions: Js.Array2.t<dropdownOptionWithoutOptional>,
+    ~value: Js.Json.t,
+    ~descriptionOnHover: bool,
+    ~isDropDown: bool,
+    ~textIconPresent: bool,
+    ~searchString: string,
+    ~optionSize: CheckBoxIcon.size,
+    ~isSelectedStateMinus: bool,
+    ~onItemClick: (string, bool, JsxEvent.Mouse.t) => unit,
+    ~fill: string,
+    ~customStyle: string,
+    ~isMobileView: bool,
+    ~listFlexDirection: string,
+    ~customSelectStyle: string,
+    ~textOverflowClass: option<string>,
+    ~showToolTipOptions: bool,
+    ~textEllipsisForDropDownOptions: bool,
+    ~isHorizontal: bool,
+    ~customMarginStyleOfListItem: string=?,
+  ) => React.element
+}
+let getHashMappedOptionValues: array<dropdownOptionWithoutOptional> => RescriptCore.Dict.t<
+  array<dropdownOptionWithoutOptional>,
+>
+let getSortedKeys: RescriptCore.Dict.t<'a> => Js.Array2.t<string>
 module BaseRadio: {
   @react.component
   let make: (
@@ -106,13 +196,13 @@ module BaseRadio: {
     ~deselectDisable: bool=?,
     ~onBlur: ReactEvent.Focus.t => unit=?,
     ~fill: string=?,
-    ~customStyle: Js.String2.t=?,
+    ~customStyle: string=?,
     ~searchable: bool=?,
     ~isMobileView: bool=?,
     ~customSearchStyle: string=?,
     ~descriptionOnHover: bool=?,
     ~addDynamicValue: bool=?,
-    ~dropdownCustomWidth: Js.String2.t=?,
+    ~dropdownCustomWidth: string=?,
     ~dropdownRef: React.ref<Js.Nullable.t<Dom.element>>=?,
     ~showMatchingRecordsText: bool=?,
     ~fullLength: bool=?,
@@ -130,12 +220,11 @@ module BaseRadio: {
     ~textEllipsisForDropDownOptions: bool=?,
   ) => React.element
 }
-
 type direction = BottomLeft | BottomMiddle | BottomRight | TopLeft | TopMiddle | TopRight
 module BaseDropdown: {
   @react.component
   let make: (
-    ~buttonText: Js.String2.t,
+    ~buttonText: string,
     ~buttonSize: Button.buttonSize=?,
     ~allowMultiSelect: bool,
     ~input: ReactFinalForm.fieldRenderPropsInput,
@@ -155,12 +244,12 @@ module BaseDropdown: {
     ~defaultLeftIcon: Button.iconType=?,
     ~autoApply: bool=?,
     ~fullLength: bool=?,
-    ~customButtonStyle: Js.String2.t=?,
+    ~customButtonStyle: string=?,
     ~onAssignClick: string => unit=?,
     ~fixedDropDownDirection: direction=?,
     ~addButton: bool=?,
     ~marginTop: string=?,
-    ~customStyle: Js.String2.t=?,
+    ~customStyle: string=?,
     ~customSearchStyle: string=?,
     ~showSelectionAsChips: bool=?,
     ~showToolTip: bool=?,
@@ -174,16 +263,16 @@ module BaseDropdown: {
     ~addDynamicValue: bool=?,
     ~showMatchingRecordsText: bool=?,
     ~hasApplyButton: bool=?,
-    ~dropdownCustomWidth: Js.String2.t=?,
+    ~dropdownCustomWidth: string=?,
     ~allowButtonTextMinWidth: bool=?,
     ~customMarginStyle: string=?,
     ~customButtonLeftIcon: Button.iconType=?,
     ~customTextPaddingClass: string=?,
     ~customButtonPaddingClass: string=?,
     ~customButtonIconMargin: string=?,
-    ~textStyleClass: Js.String2.t=?,
+    ~textStyleClass: string=?,
     ~buttonStyleOnDropDownOpened: string=?,
-    ~selectedString: Js.String2.t=?,
+    ~selectedString: string=?,
     ~setSelectedString: ('a => Js_string.t) => unit=?,
     ~setExtSearchString: ('b => string) => unit=?,
     ~listFlexDirection: string=?,
@@ -193,7 +282,7 @@ module BaseDropdown: {
     ~showAllSelectedOptions: bool=?,
     ~buttonClickFn: string => unit=?,
     ~showSelectCountButton: bool=?,
-    ~maxHeight: Js.String2.t=?,
+    ~maxHeight: string=?,
     ~customBackColor: string=?,
     ~showToolTipOptions: bool=?,
     ~textEllipsisForDropDownOptions: bool=?,
@@ -231,7 +320,7 @@ module ChipFilterSelectBox: {
 @react.component
 let make: (
   ~input: ReactFinalForm.fieldRenderPropsInput,
-  ~buttonText: Js.String2.t=?,
+  ~buttonText: string=?,
   ~buttonSize: Button.buttonSize=?,
   ~allowMultiSelect: bool=?,
   ~isDropDown: bool=?,
@@ -246,13 +335,13 @@ let make: (
   ~buttonType: Button.buttonType=?,
   ~disableSelect: bool=?,
   ~fullLength: bool=?,
-  ~customButtonStyle: Js.String2.t=?,
+  ~customButtonStyle: string=?,
   ~textStyle: string=?,
   ~marginTop: string=?,
-  ~customStyle: Js.String2.t=?,
+  ~customStyle: string=?,
   ~showSelectionAsChips: bool=?,
   ~showToggle: bool=?,
-  ~maxHeight: Js.String2.t=?,
+  ~maxHeight: string=?,
   ~searchable: bool=?,
   ~fill: string=?,
   ~optionRigthElement: React.element=?,
@@ -273,7 +362,7 @@ let make: (
   ~customButton: React.element=?,
   ~descriptionOnHover: bool=?,
   ~fixedDropDownDirection: direction=?,
-  ~dropdownCustomWidth: Js.String2.t=?,
+  ~dropdownCustomWidth: string=?,
   ~allowButtonTextMinWidth: bool=?,
   ~baseComponent: React.element=?,
   ~baseComponentMethod: bool => React.element=?,
@@ -283,7 +372,7 @@ let make: (
   ~customTextPaddingClass: string=?,
   ~customButtonPaddingClass: string=?,
   ~customButtonIconMargin: string=?,
-  ~textStyleClass: Js.String2.t=?,
+  ~textStyleClass: string=?,
   ~setExtSearchString: ('a => string) => unit=?,
   ~buttonStyleOnDropDownOpened: string=?,
   ~listFlexDirection: string=?,
diff --git a/src/components/form/FormValuesSpy.res b/src/components/form/FormValuesSpy.res
index 444e8f9da..85de63832 100644
--- a/src/components/form/FormValuesSpy.res
+++ b/src/components/form/FormValuesSpy.res
@@ -8,14 +8,12 @@ module JsonBox = {
   }
 }
 
-@val @scope(("window", "location")) external hostname: string = "hostname"
-
 @react.component
 let make = (~wrapperClass="", ~jsonModifier=?, ~restrictToLocal=true, ~displayProps=true) => {
   let subs = ReactFinalForm.useFormSubscription(["values"])
 
   let canRender = if restrictToLocal {
-    hostname === "localhost"
+    Window.Location.hostname === "localhost"
   } else {
     true
   }
diff --git a/src/context/ThemeProvider.res b/src/context/ThemeProvider.res
index b323109a3..b363a8436 100644
--- a/src/context/ThemeProvider.res
+++ b/src/context/ThemeProvider.res
@@ -17,9 +17,6 @@ let useTheme = () => {
   theme
 }
 
-@val external window: Js.Nullable.t<'a> = "window"
-@val @scope("window") external parent: 't = "parent"
-
 @react.component
 let make = (~children) => {
   let eventTheme = ThemeUtils.useThemeFromEvent()
@@ -33,7 +30,7 @@ let make = (~children) => {
   | Some("Dark") => Dark
   | Some(_val) => Light
   | None =>
-    if window !== parent {
+    if window !== Window.parent {
       Light
     } else {
       themeState
diff --git a/src/entities/analytics/EulerAnalyticsLogUtils.res b/src/entities/analytics/EulerAnalyticsLogUtils.res
index 4f461155f..46f06f4e8 100644
--- a/src/entities/analytics/EulerAnalyticsLogUtils.res
+++ b/src/entities/analytics/EulerAnalyticsLogUtils.res
@@ -1,5 +1,3 @@
-@val @scope("window")
-external location: {..} = "location"
 external toJson: exn => Js.Json.t = "%identity"
 external toExn: string => exn = "%identity"
 
diff --git a/src/genericUtils/DOMUtils.res b/src/genericUtils/DOMUtils.res
index 40fe6011a..55785e388 100644
--- a/src/genericUtils/DOMUtils.res
+++ b/src/genericUtils/DOMUtils.res
@@ -6,13 +6,11 @@ type window
 @val external window: window = "window"
 @send external click: (Dom.element, unit) => unit = "click"
 @send external reset: (Dom.element, unit) => unit = "reset"
-@val @scope("window") external parent: window = "parent"
 type event
 @new
 external event: string => event = "Event"
 @send external dispatchEvent: ('a, event) => unit = "dispatchEvent"
 @send external postMessage: (window, Js.Json.t, string) => unit = "postMessage"
-@val @scope(("window", "location")) external windowOrigin: string = "origin"
 @get external keyCode: 'a => int = "keyCode"
 @send external querySelectorAll: (document, string) => array<Dom.element> = "querySelectorAll"
 @send external setAttribute: (Dom.element, string, string) => unit = "setAttribute"
diff --git a/src/hooks/AuthHooks.res b/src/hooks/AuthHooks.res
index 57792db24..222c63966 100644
--- a/src/hooks/AuthHooks.res
+++ b/src/hooks/AuthHooks.res
@@ -35,9 +35,6 @@ let getHeaders = (~uri, ~headers, ()) => {
   Fetch.HeadersInit.make(headerObj->dictToObj)
 }
 
-@val @scope(("window", "location"))
-external hostName: string = "host"
-
 type betaEndpoint = {
   betaApiStr: string,
   originalApiStr: string,
diff --git a/src/libraries/Clipboard.res b/src/libraries/Clipboard.res
index ecb036917..b763cbfee 100644
--- a/src/libraries/Clipboard.res
+++ b/src/libraries/Clipboard.res
@@ -15,12 +15,9 @@ external prepend: 'a => unit = "prepend"
 @val @scope("document")
 external execCommand: string => unit = "execCommand"
 
-@val @scope("window")
-external isSecureContext: bool = "isSecureContext"
-
 let writeText = (str: string) => {
   try {
-    if isSecureContext {
+    if Window.isSecureContext {
       writeTextDoc(str)
     } else {
       let textArea = document->DOMUtils.createElement("textarea")
diff --git a/src/libraries/Window.res b/src/libraries/Window.res
index 08254a5bd..f1cc7d9b2 100644
--- a/src/libraries/Window.res
+++ b/src/libraries/Window.res
@@ -2,6 +2,9 @@ type t
 
 type listener<'ev> = 'ev => unit
 
+@val @scope("window")
+external parent: 't = "parent"
+
 @val @scope("window")
 external addEventListener: (string, listener<'ev>) => unit = "addEventListener"
 
@@ -80,6 +83,9 @@ external getParsedJson: string => Js.Json.t = "getParsedJson"
 @val @scope("window")
 external payPalCreateAccountWindow: unit => unit = "payPalCreateAccountWindow"
 
+@val @scope("window")
+external isSecureContext: bool = "isSecureContext"
+
 module MatchMedia = {
   type matchEvent = {
     matches: bool,
diff --git a/src/screens/HyperSwitch/Analytics/Analytics.res b/src/screens/HyperSwitch/Analytics/Analytics.res
index 140ca923e..d3c37f015 100644
--- a/src/screens/HyperSwitch/Analytics/Analytics.res
+++ b/src/screens/HyperSwitch/Analytics/Analytics.res
@@ -1,7 +1,4 @@
 @get external keyCode: 'a => int = "keyCode"
-type window
-@val external window: window = "window"
-@scope("window") @val external parent: window = "parent"
 
 open LogicUtils
 
diff --git a/src/screens/HyperSwitch/Analytics/HSAnalyticsUtils.res b/src/screens/HyperSwitch/Analytics/HSAnalyticsUtils.res
index 31550c323..633600c47 100644
--- a/src/screens/HyperSwitch/Analytics/HSAnalyticsUtils.res
+++ b/src/screens/HyperSwitch/Analytics/HSAnalyticsUtils.res
@@ -1,5 +1,3 @@
-@val @scope(("window", "location")) external hostname: string = "hostname"
-
 let filterFieldsPortalName = "analytics"
 
 let setPrecision = (num, ~digit=2, ()) => {
diff --git a/src/screens/HyperSwitch/SDKPayment/WebSDK.res b/src/screens/HyperSwitch/SDKPayment/WebSDK.res
index 1a40ef235..c9c4c0c3e 100644
--- a/src/screens/HyperSwitch/SDKPayment/WebSDK.res
+++ b/src/screens/HyperSwitch/SDKPayment/WebSDK.res
@@ -2,9 +2,6 @@ open HyperSwitch
 open HyperSwitchTypes
 open Promise
 
-@val external window: 'a = "window"
-@val @scope("window") external parent: 'a = "parent"
-
 type configElements = {
   appearanceElement: Js.Json.t,
   paymentElement: Js.Json.t,
diff --git a/src/screens/HyperSwitch/Utils/HSSelfServeSidebar.res b/src/screens/HyperSwitch/Utils/HSSelfServeSidebar.res
index d1f2efd82..49c74a73f 100644
--- a/src/screens/HyperSwitch/Utils/HSSelfServeSidebar.res
+++ b/src/screens/HyperSwitch/Utils/HSSelfServeSidebar.res
@@ -1,6 +1,3 @@
-@val @scope(("window", "location"))
-external reload: unit => unit = "reload"
-
 type status = COMPLETED | ONGOING | PENDING
 
 type subOption = {