Remove category filters

web/components/contract-search.tsx

@@ -20,13 +20,6 @@ import { Row } from './layout/row'
 import { useEffect, useMemo, useRef, useState } from 'react'
 import { Spacer } from './layout/spacer'
 import { ENV, IS_PRIVATE_MANIFOLD } from 'common/envs/constants'
-import { useUser } from 'web/hooks/use-user'
-import { useFollows } from 'web/hooks/use-follows'
-import { EditCategoriesButton } from './feed/category-selector'
-import { CATEGORIES, category } from 'common/categories'
-import { Tabs } from './layout/tabs'
-import { EditFollowingButton } from './following-button'
-import { track } from '@amplitude/analytics-browser'
 import { trackCallback } from 'web/lib/service/analytics'
 import ContractSearchFirestore from 'web/pages/contract-search-firestore'
 
@@ -60,7 +53,6 @@ export function ContractSearch(props: {
     tag?: string
     excludeContractIds?: string[]
   }
-  showCategorySelector: boolean
   onContractClick?: (contract: Contract) => void
   showPlaceHolder?: boolean
   hideOrderSelector?: boolean
@@ -70,7 +62,6 @@ export function ContractSearch(props: {
   const {
     querySortOptions,
     additionalFilter,
-    showCategorySelector,
     onContractClick,
     overrideGridClassName,
     hideOrderSelector,
@@ -78,10 +69,6 @@ export function ContractSearch(props: {
     hideQuickBet,
   } = props
 
-  const user = useUser()
-  const followedCategories = user?.followedCategories
-  const follows = useFollows(user?.id)
-
   const { initialSort } = useInitialQueryAndSort(querySortOptions)
 
   const sort = sortIndexes
@@ -94,18 +81,11 @@ export function ContractSearch(props: {
     querySortOptions?.defaultFilter ?? 'open'
   )
 
-  const [mode, setMode] = useState<'categories' | 'following'>('categories')
-
   const { filters, numericFilters } = useMemo(() => {
     let filters = [
       filter === 'open' ? 'isResolved:false' : '',
       filter === 'closed' ? 'isResolved:false' : '',
       filter === 'resolved' ? 'isResolved:true' : '',
-      showCategorySelector
-        ? mode === 'categories'
-          ? followedCategories?.map((cat) => `lowercaseTags:${cat}`) ?? ''
-          : follows?.map((creatorId) => `creatorId:${creatorId}`) ?? ''
-        : '',
       additionalFilter?.creatorId
         ? `creatorId:${additionalFilter.creatorId}`
         : '',
@@ -120,14 +100,7 @@ export function ContractSearch(props: {
     ].filter((f) => f)
 
     return { filters, numericFilters }
-  }, [
+  }, [filter, Object.values(additionalFilter ?? {}).join(',')])
-    filter,
-    showCategorySelector,
-    mode,
-    Object.values(additionalFilter ?? {}).join(','),
-    (followedCategories ?? []).join(','),
-    (follows ?? []).join(','),
-  ])
 
   const indexName = `${indexPrefix}contracts-${sort}`
 
@@ -182,28 +155,13 @@ export function ContractSearch(props: {
 
       <Spacer h={3} />
 
-      {showCategorySelector && (
+      <ContractSearchInner
-        <CategoryFollowSelector
+        querySortOptions={querySortOptions}
-          mode={mode}
+        onContractClick={onContractClick}
-          setMode={setMode}
+        overrideGridClassName={overrideGridClassName}
-          followedCategories={followedCategories ?? []}
+        hideQuickBet={hideQuickBet}
-          follows={follows ?? []}
+        excludeContractIds={additionalFilter?.excludeContractIds}
-        />
+      />
-      )}
-
-      <Spacer h={4} />
-
-      {mode === 'following' && (follows ?? []).length === 0 ? (
-        <>You're not following anyone yet.</>
-      ) : (
-        <ContractSearchInner
-          querySortOptions={querySortOptions}
-          onContractClick={onContractClick}
-          overrideGridClassName={overrideGridClassName}
-          hideQuickBet={hideQuickBet}
-          excludeContractIds={additionalFilter?.excludeContractIds}
-        />
-      )}
     </InstantSearch>
   )
 }
@@ -288,68 +246,3 @@ export function ContractSearchInner(props: {
     />
   )
 }
-
-function CategoryFollowSelector(props: {
-  mode: 'categories' | 'following'
-  setMode: (mode: 'categories' | 'following') => void
-  followedCategories: string[]
-  follows: string[]
-}) {
-  const { mode, setMode, followedCategories, follows } = props
-
-  const user = useUser()
-
-  const categoriesTitle = `${
-    followedCategories?.length ? followedCategories.length : 'All'
-  } Categories`
-  let categoriesDescription = `Showing all categories`
-
-  const followingTitle = `${follows?.length ? follows.length : 'All'} Following`
-
-  if (followedCategories.length) {
-    const categoriesLabel = followedCategories
-      .slice(0, 3)
-      .map((cat) => CATEGORIES[cat as category])
-      .join(', ')
-    const andMoreLabel =
-      followedCategories.length > 3
-        ? `, and ${followedCategories.length - 3} more`
-        : ''
-    categoriesDescription = `Showing ${categoriesLabel}${andMoreLabel}`
-  }
-
-  return (
-    <Tabs
-      defaultIndex={mode === 'categories' ? 0 : 1}
-      tabs={[
-        {
-          title: categoriesTitle,
-          content: user && (
-            <Row className="items-center gap-1 text-gray-500">
-              <div>{categoriesDescription}</div>
-              <EditCategoriesButton className="self-start" user={user} />
-            </Row>
-          ),
-        },
-        ...(user
-          ? [
-              {
-                title: followingTitle,
-                content: (
-                  <Row className="items-center gap-2 text-gray-500">
-                    <div>Showing markets by users you are following.</div>
-                    <EditFollowingButton className="self-start" user={user} />
-                  </Row>
-                ),
-              },
-            ]
-          : []),
-      ]}
-      onClick={(_, index) => {
-        const mode = index === 0 ? 'categories' : 'following'
-        setMode(mode)
-        track(`click ${mode} tab`)
-      }}
-    />
-  )
-}