Style changes suggested by James

web/components/contract-search.tsx

@@ -152,7 +152,8 @@ export function ContractSearch(props: {
       searchParameters.current = params
       performQuery(true)
     }, 100)
-  )
+  ).current
+
   const contracts = pages
     .flat()
     .filter((c) => !additionalFilter?.excludeContractIds?.includes(c.id))
@@ -172,7 +173,7 @@ export function ContractSearch(props: {
         useQuerySortLocalStorage={useQuerySortLocalStorage}
         useQuerySortUrlParams={useQuerySortUrlParams}
         user={user}
-        onSearchParametersChanged={onSearchParametersChanged.current}
+        onSearchParametersChanged={onSearchParametersChanged}
       />
       <ContractsGrid
         contracts={pages.length === 0 ? undefined : contracts}
@@ -212,8 +213,9 @@ function ContractSearchControls(props: {
 
   const savedSort = useQuerySortLocalStorage ? getSavedSort() : null
   const initialSort = savedSort ?? defaultSort ?? 'score'
-  const [sort, setSort] = useSort(initialSort, !!useQuerySortUrlParams)
-  const [query, setQuery] = useQuery('', !!useQuerySortUrlParams)
+  const querySortOpts = { useUrl: !!useQuerySortUrlParams }
+  const [sort, setSort] = useSort(initialSort, querySortOpts)
+  const [query, setQuery] = useQuery('', querySortOpts)
   const [filter, setFilter] = useState<filter>(defaultFilter ?? 'open')
   const [pillFilter, setPillFilter] = useState<string | undefined>(undefined)
 

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

@@ -12,6 +12,7 @@ export type Sort =
   | 'score'
 
 type UpdatedQueryParams = { [k: string]: string }
+type QuerySortOpts = { useUrl: boolean }
 
 function withURLParams(location: Location, params: UpdatedQueryParams) {
   const newParams = new URLSearchParams(location.search)
@@ -39,7 +40,8 @@ function getStringURLParam(router: NextRouter, k: string) {
   return typeof v === 'string' ? v : null
 }
 
-export function useQuery(defaultQuery: string, useUrl: boolean) {
+export function useQuery(defaultQuery: string, opts?: QuerySortOpts) {
+  const useUrl = opts?.useUrl ?? false
   const router = useRouter()
   const initialQuery = useUrl ? getStringURLParam(router, 'q') : null
   const [query, setQuery] = useState(initialQuery ?? defaultQuery)
@@ -50,7 +52,8 @@ export function useQuery(defaultQuery: string, useUrl: boolean) {
   }
 }
 
-export function useSort(defaultSort: Sort, useUrl: boolean) {
+export function useSort(defaultSort: Sort, opts?: QuerySortOpts) {
+  const useUrl = opts?.useUrl ?? false
   const router = useRouter()
   const initialSort = useUrl ? (getStringURLParam(router, 's') as Sort) : null
   const [sort, setSort] = useState(initialSort ?? defaultSort)

web/pages/contract-search-firestore.tsx

@@ -17,9 +17,8 @@ export default function ContractSearchFirestore(props: {
 }) {
   const contracts = useContracts()
   const { additionalFilter } = props
-
-  const [query, setQuery] = useQuery('', true)
-  const [sort, setSort] = useSort('score', true)
+  const [query, setQuery] = useQuery('', { useUrl: true })
+  const [sort, setSort] = useSort('score', { useUrl: true })
 
   let matches = (contracts ?? []).filter((c) =>
     searchInAny(