feat: Multi filters support

src/components/DynamicChart.res

@@ -373,7 +373,7 @@ let make = (
   }
 
   let currentTheme = ThemeProvider.useTheme()
-  let {filterValue} = React.useContext(AnalyticsUrlUpdaterContext.urlUpdaterContext)
+  let {filterValue} = React.useContext(FilterContext.filterContext)
   let (_switchToMobileView, setSwitchToMobileView) = React.useState(_ => false)
   let (selectedTabState, setSelectedTabState) = React.useState(_ => selectedTab)
 

src/components/DynamicFilter.res

@@ -170,9 +170,7 @@ let make = (
   let defaultFilters = ""->Js.Json.string
   let (showModal, setShowModal) = React.useState(_ => false)
 
-  let {updateExistingKeys, filterValue, removeKeys} = React.useContext(
-    AnalyticsUrlUpdaterContext.urlUpdaterContext,
-  )
+  let {updateExistingKeys, filterValue, removeKeys} = React.useContext(FilterContext.filterContext)
 
   let currentCustomFilterValue =
     filterValue->Js.Dict.get(customFilterKey)->Belt.Option.getWithDefault("")

src/components/DynamicSingleStat.res

@@ -126,8 +126,9 @@ let make = (
   ~statThreshold=?,
   ~wrapperClass=?,
 ) => {
+  let {filterValueJson} = React.useContext(FilterContext.filterContext)
   let fetchApi = AuthHooks.useApiFetcher()
-  let getAllFilter = UrlUtils.useGetFilterDictFromUrl("")
+  let getAllFilter = filterValueJson
   let isMobileView = MatchMedia.useMobileChecker()
   let (showStats, setShowStats) = React.useState(_ => false)
 

src/components/DynamicTabs.res

@@ -257,7 +257,8 @@ let make = (
   | None => _ => ()
   }
   let {addConfig, getConfig} = React.useContext(UserPrefContext.userPrefContext)
-  let getTabNames = UrlUtils.useGetFilterDictFromUrl(tabId)
+  let {filterValueJson} = React.useContext(FilterContext.filterContext)
+  let getTabNames = filterValueJson
   let getTitle = key => {
     (
       tabs

src/components/FilterUtils.res

@@ -1,22 +1,25 @@
-let generateDefaultUrl = dict => {
-  dict
-  ->Js.Dict.entries
-  ->Belt.Array.keepMap(entry => {
-    let (key, val) = entry
-
-    let strValue = RemoteFiltersUtils.getStrFromJson(key, val)
-    if strValue !== "" {
-      Some(`${key}=${strValue}`)
-    } else {
-      None
-    }
+let parseFilterString = queryString => {
+  queryString
+  ->Js.Global.decodeURI
+  ->Js.String2.split("&")
+  ->Belt.Array.keepMap(str => {
+    let arr = str->Js.String2.split("=")
+    let key = arr->Belt.Array.get(0)->Belt.Option.getWithDefault("-")
+    let val = arr->Belt.Array.sliceToEnd(1)->Js.Array2.joinWith("=")
+    key === "" || val === "" ? None : Some((key, val))
   })
-  ->Js.Array2.joinWith("&")
+  ->Js.Dict.fromArray
 }
 
-let updateURLWithDefaultFilter = (~path, ~filterParam, ~filterString) => {
-  if path->Js.String2.length > 0 && filterParam->Js.String2.length == 0 {
-    let finalUrl = `${path}?${filterString}`
-    RescriptReactRouter.replace(finalUrl)
-  }
+let parseFilterDict = dict => {
+  let searchParam =
+    dict
+    ->Js.Dict.entries
+    ->Js.Array2.map(item => {
+      let (key, value) = item
+      `${key}=${value}`
+    })
+    ->Js.Array2.joinWith("&")
+
+  searchParam
 }

src/components/RemoteFilter.res

@@ -117,7 +117,7 @@ module ClearFilters = {
     ~isCountRequired=true,
     ~outsidefilter=false,
   ) => {
-    let url = RescriptReactRouter.useUrl()
+    let {updateExistingKeys} = React.useContext(FilterContext.filterContext)
     let isMobileView = MatchMedia.useMobileChecker()
     let outerClass = if isMobileView {
       "flex items-center justify-end"
@@ -160,8 +160,7 @@ module ClearFilters = {
           })
           ->Js.Array2.joinWith("&")
 
-        let path = url.path->Belt.List.toArray->Js.Array2.joinWith("/")
-        RescriptReactRouter.replace(`/${path}?${searchStr}`)
+        searchStr->FilterUtils.parseFilterString->updateExistingKeys
       }
     }
 
@@ -197,7 +196,7 @@ module ClearFilters = {
 module AnalyticsClearFilters = {
   @react.component
   let make = (~defaultFilterKeys=[], ~clearFilters=?, ~outsidefilter=false) => {
-    let url = RescriptReactRouter.useUrl()
+    let {updateExistingKeys} = React.useContext(FilterContext.filterContext)
     let formState: ReactFinalForm.formState = ReactFinalForm.useFormState(
       ReactFinalForm.useFormSubscription(["values", "initialValues"])->Js.Nullable.return,
     )
@@ -231,8 +230,7 @@ module AnalyticsClearFilters = {
           })
           ->Js.Array2.joinWith("&")
 
-        let path = url.path->Belt.List.toArray->Js.Array2.joinWith("/")
-        RescriptReactRouter.replace(`/${path}?${searchStr}`)
+        searchStr->FilterUtils.parseFilterString->updateExistingKeys
       }
     }
 
@@ -554,6 +552,7 @@ let make = (
   ~disableURIdecode=false,
   ~revampedFilter=false,
 ) => {
+  let {query} = React.useContext(FilterContext.filterContext)
   let hyperswitchMixPanel = HSMixPanel.useSendEvent()
   let alreadySelectedFiltersUserpref = `remote_filters_selected_keys_${tableName->Belt.Option.getWithDefault(
       "",
@@ -588,17 +587,14 @@ let make = (
   }, [updatedSelectedList->Js.Json.stringify])
 
   let getNewQuery = DateRefreshHooks.useConstructQueryOnBasisOfOpt()
-  let url = RescriptReactRouter.useUrl()
   let (isButtonDisabled, setIsButtonDisabled) = React.useState(_ => false)
-  let queryStr = url.search
 
   let totalFilters = selectedFiltersList->Js.Array2.length + localOptions->Js.Array2.length
   let (checkedFilters, setCheckedFilters) = React.useState(_ => [])
   let (clearFilterAfterRefresh, setClearFilterAfterRefresh) = React.useState(_ => false)
   let (count, setCount) = React.useState(_ => initalCount)
 
-  let url = RescriptReactRouter.useUrl()
-  let searchParams = disableURIdecode ? url.search : url.search->Js.Global.decodeURI
+  let searchParams = disableURIdecode ? query : query->Js.Global.decodeURI
 
   let isMobileView = MatchMedia.useMobileChecker()
 
@@ -840,7 +836,7 @@ let make = (
 
   let handleRefresh = _ => {
     let newQueryStr = getNewQuery(
-      ~queryString=queryStr,
+      ~queryString=query,
       ~disableFutureDates=true,
       ~disablePastDates=false,
       ~startKey="startTime",