Fix browser redirect warning

web/components/contract-search.tsx

@@ -2,7 +2,11 @@
 import algoliasearch from 'algoliasearch/lite'
 
 import { Contract } from 'common/contract'
-import { Sort, useQueryAndSortParams } from '../hooks/use-sort-and-query-params'
+import {
+  QuerySortOptions,
+  Sort,
+  useQueryAndSortParams,
+} from '../hooks/use-sort-and-query-params'
 import {
   ContractHighlightOptions,
   ContractsGrid,
@@ -45,11 +49,7 @@ export const DEFAULT_SORT = 'score'
 type filter = 'personal' | 'open' | 'closed' | 'resolved' | 'all'
 
 export function ContractSearch(props: {
-  querySortOptions?: {
+  querySortOptions?: { defaultFilter?: filter } & QuerySortOptions
-    defaultSort: Sort
-    defaultFilter?: filter
-    shouldLoadFromStorage?: boolean
-  }
   additionalFilter?: {
     creatorId?: string
     tag?: string
@@ -100,11 +100,8 @@ export function ContractSearch(props: {
 
   const follows = useFollows(user?.id)
 
-  const { shouldLoadFromStorage, defaultSort } = querySortOptions ?? {}
+  const { query, setQuery, sort, setSort } =
-  const { query, setQuery, sort, setSort } = useQueryAndSortParams({
+    useQueryAndSortParams(querySortOptions)
-    defaultSort,
-    shouldLoadFromStorage,
-  })
 
   const [filter, setFilter] = useState<filter>(
     querySortOptions?.defaultFilter ?? 'open'

web/components/editor/market-modal.tsx

@@ -76,6 +76,7 @@ export function MarketModal(props: {
             }
             showPlaceHolder
             cardHideOptions={{ hideGroupLink: true, hideQuickBet: true }}
+            querySortOptions={{ disableQueryString: true }}
             highlightOptions={{
               contractIds: contracts.map((c) => c.id),
               highlightClassName:

web/hooks/use-sort-and-query-params.tsx

@@ -25,12 +25,18 @@ export function getSavedSort() {
   }
 }
 
-export function useQueryAndSortParams(options?: {
+export interface QuerySortOptions {
   defaultSort?: Sort
   shouldLoadFromStorage?: boolean
-}) {
+  /** Use normal react state instead of url query string */
-  const { defaultSort = DEFAULT_SORT, shouldLoadFromStorage = true } =
+  disableQueryString?: boolean
-    options ?? {}
+}
+
+export function useQueryAndSortParams({
+  defaultSort = DEFAULT_SORT,
+  shouldLoadFromStorage = true,
+  disableQueryString,
+}: QuerySortOptions = {}) {
   const router = useRouter()
 
   const { s: sort, q: query } = router.query as {
@@ -68,7 +74,9 @@ export function useQueryAndSortParams(options?: {
 
   const setQuery = (query: string | undefined) => {
     setQueryState(query)
-    pushQuery(query)
+    if (!disableQueryString) {
+      pushQuery(query)
+    }
   }
 
   useEffect(() => {
@@ -86,10 +94,13 @@ export function useQueryAndSortParams(options?: {
     }
   })
 
+  // use normal state if querydisableQueryString
+  const [sortState, setSortState] = useState(defaultSort)
+
   return {
-    sort: sort ?? defaultSort,
+    sort: disableQueryString ? sortState : sort ?? defaultSort,
     query: queryState ?? '',
-    setSort,
+    setSort: disableQueryString ? setSortState : setSort,
     setQuery,
   }
 }

web/pages/contract-search-firestore.tsx

@@ -4,6 +4,7 @@ import { sortBy } from 'lodash'
 import { ContractsGrid } from 'web/components/contract/contracts-grid'
 import { useContracts } from 'web/hooks/use-contracts'
 import {
+  QuerySortOptions,
   Sort,
   useQueryAndSortParams,
 } from 'web/hooks/use-sort-and-query-params'
@@ -11,10 +12,7 @@ import {
 const MAX_CONTRACTS_RENDERED = 100
 
 export default function ContractSearchFirestore(props: {
-  querySortOptions?: {
+  querySortOptions?: QuerySortOptions
-    defaultSort: Sort
-    shouldLoadFromStorage?: boolean
-  }
   additionalFilter?: {
     creatorId?: string
     tag?: string