Update FR comment prob and input after bet (#467)

* Update FR comment prob and input after bet

* Remove comment

* eslint

* Use proper deps and useEvent hook
This commit is contained in:
Ian Philips 2022-06-08 17:09:49 -06:00 committed by GitHub
parent 52dd68303a
commit 01adf50ae1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -1,7 +1,6 @@
import { Answer } from 'common/answer'
import { Bet } from 'common/bet'
import { Comment } from 'common/comment'
import { getDpmOutcomeProbability } from 'common/calculate-dpm'
import { formatPercent } from 'common/util/format'
import React, { useEffect, useState } from 'react'
import { Col } from 'web/components/layout/col'
@ -23,6 +22,7 @@ import { CopyLinkDateTimeComponent } from 'web/components/feed/copy-link-date-ti
import { useRouter } from 'next/router'
import { groupBy } from 'lodash'
import { User } from 'common/user'
import { useEvent } from 'web/hooks/use-event'
export function FeedAnswerCommentGroup(props: {
contract: any
@ -54,23 +54,45 @@ export function FeedAnswerCommentGroup(props: {
answerComments.map((c) => c.id).includes(comment.replyToCommentId)
)
const commentsList = answerComments.concat(commentReplies)
const prob = getDpmOutcomeProbability(contract.totalShares, answer.id)
const probPercent = formatPercent(prob)
const thisAnswerProb = bets
.filter((bet) => bet.outcome === answer.number.toString())
.sort((a, b) => b.createdTime - a.createdTime)[0].probAfter
const probPercent = formatPercent(thisAnswerProb)
const betsByCurrentUser = (user && betsByUserId[user.id]) ?? []
const commentsByCurrentUser = (user && commentsByUserId[user.id]) ?? []
const isFreeResponseContractPage = !!commentsByCurrentUser
useEffect(() => {
const mostRecentCommentableBet = getMostRecentCommentableBet(
betsByCurrentUser,
commentsByCurrentUser,
user,
answer.number.toString()
)
if (mostRecentCommentableBet && !showReply)
const [mostRecentBetTimeAtLoad] = useState(
mostRecentCommentableBet?.createdTime ?? 0
)
const scrollAndOpenReplyInput = useEvent(
(comment?: Comment, answer?: Answer) => {
setReplyToUsername(comment?.userUsername ?? answer?.username ?? '')
setShowReply(true)
inputRef?.focus()
}
)
useEffect(() => {
if (
mostRecentCommentableBet &&
mostRecentCommentableBet.createdTime > mostRecentBetTimeAtLoad &&
!showReply
)
scrollAndOpenReplyInput(undefined, answer)
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [betsByCurrentUser])
}, [
answer,
mostRecentBetTimeAtLoad,
mostRecentCommentableBet,
scrollAndOpenReplyInput,
showReply,
])
useEffect(() => {
// Only show one comment input for a bet at a time
@ -85,12 +107,6 @@ export function FeedAnswerCommentGroup(props: {
}
}, [answer.number, bets, user])
function scrollAndOpenReplyInput(comment?: Comment, answer?: Answer) {
setReplyToUsername(comment?.userUsername ?? answer?.username ?? '')
setShowReply(true)
inputRef?.focus()
}
useEffect(() => {
if (showReply && inputRef) inputRef.focus()
}, [inputRef, showReply])