diff --git a/web/components/contract/contract-tabs.tsx b/web/components/contract/contract-tabs.tsx index 23ea9c13..39d44de9 100644 --- a/web/components/contract/contract-tabs.tsx +++ b/web/components/contract/contract-tabs.tsx @@ -1,13 +1,17 @@ -import { memo } from 'react' +import { memo, useState } from 'react' +import { getOutcomeProbability } from 'common/calculate' +import { Pagination } from 'web/components/pagination' +import { FeedBet } from '../feed/feed-bets' +import { FeedLiquidity } from '../feed/feed-liquidity' +import { FeedAnswerCommentGroup } from '../feed/feed-answer-comment-group' +import { FeedCommentThread, ContractCommentInput } from '../feed/feed-comments' +import { CommentTipMap } from 'web/hooks/use-tip-txns' +import { LiquidityProvision } from 'common/liquidity-provision' +import { groupBy, sortBy } from 'lodash' import { Bet } from 'common/bet' -import { Contract } from 'common/contract' +import { Contract, FreeResponseContract } from 'common/contract' import { ContractComment } from 'common/comment' import { PAST_BETS, User } from 'common/user' -import { - ContractCommentsActivity, - ContractBetsActivity, - FreeResponseContractCommentsActivity, -} from '../feed/contract-activity' import { ContractBetsTable, BetsSummary } from '../bets-list' import { Spacer } from '../layout/spacer' import { Tabs } from '../layout/tabs' @@ -133,3 +137,129 @@ const CommentsTabContent = memo(function CommentsTabContent(props: { ) } }) + +function ContractBetsActivity(props: { + contract: Contract + bets: Bet[] + lps: LiquidityProvision[] +}) { + const { contract, bets, lps } = props + const [page, setPage] = useState(0) + const ITEMS_PER_PAGE = 50 + const start = page * ITEMS_PER_PAGE + const end = start + ITEMS_PER_PAGE + + const items = [ + ...bets.map((bet) => ({ + type: 'bet' as const, + id: bet.id + '-' + bet.isSold, + bet, + })), + ...lps.map((lp) => ({ + type: 'liquidity' as const, + id: lp.id, + lp, + })), + ] + + const pageItems = sortBy(items, (item) => + item.type === 'bet' + ? -item.bet.createdTime + : item.type === 'liquidity' + ? -item.lp.createdTime + : undefined + ).slice(start, end) + + return ( + <> + + {pageItems.map((item) => + item.type === 'bet' ? ( + + ) : ( + + ) + )} + + + + ) +} + +function ContractCommentsActivity(props: { + contract: Contract + comments: ContractComment[] + tips: CommentTipMap +}) { + const { contract, comments, tips } = props + const commentsByParentId = groupBy(comments, (c) => c.replyToCommentId ?? '_') + const topLevelComments = sortBy( + commentsByParentId['_'] ?? [], + (c) => -c.createdTime + ) + + return ( + <> + + {topLevelComments.map((parent) => ( + c.createdTime + )} + tips={tips} + /> + ))} + + ) +} + +function FreeResponseContractCommentsActivity(props: { + contract: FreeResponseContract + comments: ContractComment[] + tips: CommentTipMap +}) { + const { contract, comments, tips } = props + + const sortedAnswers = sortBy( + contract.answers, + (answer) => -getOutcomeProbability(contract, answer.number.toString()) + ) + const commentsByOutcome = groupBy( + comments, + (c) => c.answerOutcome ?? c.betOutcome ?? '_' + ) + + return ( + <> + {sortedAnswers.map((answer) => ( +
+
+ ))} + + ) +} diff --git a/web/components/feed/contract-activity.tsx b/web/components/feed/contract-activity.tsx deleted file mode 100644 index 40b62466..00000000 --- a/web/components/feed/contract-activity.tsx +++ /dev/null @@ -1,140 +0,0 @@ -import { useState } from 'react' -import { Contract, FreeResponseContract } from 'common/contract' -import { ContractComment } from 'common/comment' -import { Bet } from 'common/bet' -import { getOutcomeProbability } from 'common/calculate' -import { Pagination } from 'web/components/pagination' -import { FeedBet } from './feed-bets' -import { FeedLiquidity } from './feed-liquidity' -import { FeedAnswerCommentGroup } from './feed-answer-comment-group' -import { FeedCommentThread, ContractCommentInput } from './feed-comments' -import { CommentTipMap } from 'web/hooks/use-tip-txns' -import { LiquidityProvision } from 'common/liquidity-provision' -import { groupBy, sortBy } from 'lodash' -import { Col } from 'web/components/layout/col' - -export function ContractBetsActivity(props: { - contract: Contract - bets: Bet[] - lps: LiquidityProvision[] -}) { - const { contract, bets, lps } = props - const [page, setPage] = useState(0) - const ITEMS_PER_PAGE = 50 - const start = page * ITEMS_PER_PAGE - const end = start + ITEMS_PER_PAGE - - const items = [ - ...bets.map((bet) => ({ - type: 'bet' as const, - id: bet.id + '-' + bet.isSold, - bet, - })), - ...lps.map((lp) => ({ - type: 'liquidity' as const, - id: lp.id, - lp, - })), - ] - - const pageItems = sortBy(items, (item) => - item.type === 'bet' - ? -item.bet.createdTime - : item.type === 'liquidity' - ? -item.lp.createdTime - : undefined - ).slice(start, end) - - return ( - <> - - {pageItems.map((item) => - item.type === 'bet' ? ( - - ) : ( - - ) - )} - - - - ) -} - -export function ContractCommentsActivity(props: { - contract: Contract - comments: ContractComment[] - tips: CommentTipMap -}) { - const { contract, comments, tips } = props - const commentsByParentId = groupBy(comments, (c) => c.replyToCommentId ?? '_') - const topLevelComments = sortBy( - commentsByParentId['_'] ?? [], - (c) => -c.createdTime - ) - - return ( - <> - - {topLevelComments.map((parent) => ( - c.createdTime - )} - tips={tips} - /> - ))} - - ) -} - -export function FreeResponseContractCommentsActivity(props: { - contract: FreeResponseContract - comments: ContractComment[] - tips: CommentTipMap -}) { - const { contract, comments, tips } = props - - const sortedAnswers = sortBy( - contract.answers, - (answer) => -getOutcomeProbability(contract, answer.number.toString()) - ) - const commentsByOutcome = groupBy( - comments, - (c) => c.answerOutcome ?? c.betOutcome ?? '_' - ) - - return ( - <> - {sortedAnswers.map((answer) => ( -
-
- ))} - - ) -}