Remove category filters

This commit is contained in:
Ian Philips 2022-07-07 14:45:26 -06:00
parent cfbb78af48
commit d6e808e1a3

View File

@ -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,
showCategorySelector,
mode,
Object.values(additionalFilter ?? {}).join(','),
(followedCategories ?? []).join(','),
(follows ?? []).join(','),
])
}, [filter, Object.values(additionalFilter ?? {}).join(',')])
const indexName = `${indexPrefix}contracts-${sort}`
@ -182,28 +155,13 @@ export function ContractSearch(props: {
<Spacer h={3} />
{showCategorySelector && (
<CategoryFollowSelector
mode={mode}
setMode={setMode}
followedCategories={followedCategories ?? []}
follows={follows ?? []}
/>
)}
<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}
/>
)}
<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`)
}}
/>
)
}