2022-03-14 20:29:32 +00:00
|
|
|
import _ from 'lodash'
|
|
|
|
|
2022-05-09 13:04:36 +00:00
|
|
|
import { Contract } from 'web/lib/firebase/contracts'
|
|
|
|
import { Comment } from 'web/lib/firebase/comments'
|
2022-03-14 20:29:32 +00:00
|
|
|
import { Col } from '../layout/col'
|
2022-05-09 13:04:36 +00:00
|
|
|
import { Bet } from 'common/bet'
|
|
|
|
import { useUser } from 'web/hooks/use-user'
|
2022-03-14 20:29:32 +00:00
|
|
|
import { ContractActivity } from './contract-activity'
|
|
|
|
|
|
|
|
export function ActivityFeed(props: {
|
2022-05-01 16:36:54 +00:00
|
|
|
feed: {
|
|
|
|
contract: Contract
|
|
|
|
recentBets: Bet[]
|
|
|
|
recentComments: Comment[]
|
|
|
|
}[]
|
2022-03-14 20:29:32 +00:00
|
|
|
mode: 'only-recent' | 'abbreviated' | 'all'
|
2022-04-11 21:13:26 +00:00
|
|
|
getContractPath?: (contract: Contract) => string
|
2022-03-14 20:29:32 +00:00
|
|
|
}) {
|
2022-05-01 16:36:54 +00:00
|
|
|
const { feed, mode, getContractPath } = props
|
2022-03-14 20:29:32 +00:00
|
|
|
|
|
|
|
const user = useUser()
|
|
|
|
|
|
|
|
return (
|
|
|
|
<FeedContainer
|
2022-05-01 16:36:54 +00:00
|
|
|
feed={feed}
|
|
|
|
renderItem={({ contract, recentBets, recentComments }) => (
|
2022-03-14 20:29:32 +00:00
|
|
|
<ContractActivity
|
|
|
|
user={user}
|
|
|
|
contract={contract}
|
2022-05-01 16:36:54 +00:00
|
|
|
bets={recentBets}
|
|
|
|
comments={recentComments}
|
2022-03-14 20:29:32 +00:00
|
|
|
mode={mode}
|
2022-04-11 21:13:26 +00:00
|
|
|
contractPath={getContractPath ? getContractPath(contract) : undefined}
|
2022-03-14 20:29:32 +00:00
|
|
|
/>
|
|
|
|
)}
|
|
|
|
/>
|
|
|
|
)
|
|
|
|
}
|
|
|
|
|
|
|
|
function FeedContainer(props: {
|
2022-05-01 16:36:54 +00:00
|
|
|
feed: {
|
|
|
|
contract: Contract
|
|
|
|
recentBets: Bet[]
|
|
|
|
recentComments: Comment[]
|
|
|
|
}[]
|
|
|
|
renderItem: (item: {
|
|
|
|
contract: Contract
|
|
|
|
recentBets: Bet[]
|
|
|
|
recentComments: Comment[]
|
|
|
|
}) => any
|
2022-03-14 20:29:32 +00:00
|
|
|
}) {
|
2022-05-01 16:36:54 +00:00
|
|
|
const { feed, renderItem } = props
|
2022-03-14 20:29:32 +00:00
|
|
|
|
|
|
|
return (
|
|
|
|
<Col className="items-center">
|
|
|
|
<Col className="w-full max-w-3xl">
|
|
|
|
<Col className="w-full divide-y divide-gray-300 self-center bg-white">
|
2022-05-01 16:36:54 +00:00
|
|
|
{feed.map((item) => (
|
|
|
|
<div key={item.contract.id} className="py-6 px-2 sm:px-4">
|
|
|
|
{renderItem(item)}
|
2022-03-14 20:29:32 +00:00
|
|
|
</div>
|
|
|
|
))}
|
|
|
|
</Col>
|
|
|
|
</Col>
|
|
|
|
</Col>
|
|
|
|
)
|
|
|
|
}
|