Cleanup free answer comment stuff (#897)

* Remove unused most-recent-bet-time stuff

* Remove strange reply box hiding behavior

* Tidying markup
This commit is contained in:
Marshall Polaris 2022-09-20 14:03:33 -07:00 committed by GitHub
parent 106dc232b8
commit a2d9e8e3d2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -11,7 +11,6 @@ import clsx from 'clsx'
import {
ContractCommentInput,
FeedComment,
getMostRecentCommentableBet,
} from 'web/components/feed/feed-comments'
import { CopyLinkDateTimeComponent } from 'web/components/feed/copy-link-date-time'
import { useRouter } from 'next/router'
@ -50,27 +49,6 @@ export function FeedAnswerCommentGroup(props: {
const answerElementId = `answer-${answer.id}`
const commentsByCurrentUser = (user && commentsByUserId[user.id]) ?? []
const isFreeResponseContractPage = !!commentsByCurrentUser
const mostRecentCommentableBet = getMostRecentCommentableBet(
betsByCurrentUser,
commentsByCurrentUser,
user,
answer.number.toString()
)
const [usersMostRecentBetTimeAtLoad, setUsersMostRecentBetTimeAtLoad] =
useState<number | undefined>(
!user ? undefined : mostRecentCommentableBet?.createdTime ?? 0
)
useEffect(() => {
if (user && usersMostRecentBetTimeAtLoad === undefined)
setUsersMostRecentBetTimeAtLoad(
mostRecentCommentableBet?.createdTime ?? 0
)
}, [
mostRecentCommentableBet?.createdTime,
user,
usersMostRecentBetTimeAtLoad,
])
const scrollAndOpenReplyInput = useEvent(
(comment?: ContractComment, answer?: Answer) => {
@ -85,19 +63,6 @@ export function FeedAnswerCommentGroup(props: {
}
)
useEffect(() => {
// Only show one comment input for a bet at a time
if (
betsByCurrentUser.length > 1 &&
// inputRef?.textContent?.length === 0 && //TODO: editor.isEmpty
betsByCurrentUser.sort((a, b) => b.createdTime - a.createdTime)[0]
?.outcome !== answer.number.toString()
)
setShowReply(false)
// Even if we pass memoized bets this still runs on every render, which we don't want
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [betsByCurrentUser.length, user, answer.number])
useEffect(() => {
if (router.asPath.endsWith(`#${answerElementId}`)) {
setHighlighted(true)
@ -105,10 +70,7 @@ export function FeedAnswerCommentGroup(props: {
}, [answerElementId, router.asPath])
return (
<Col
className={'relative flex-1 items-stretch gap-3'}
key={answer.id + 'comment'}
>
<Col className="relative flex-1 items-stretch gap-3">
<Row
className={clsx(
'gap-3 space-x-3 pt-4 transition-all duration-1000',
@ -135,9 +97,9 @@ export function FeedAnswerCommentGroup(props: {
</span>
{isFreeResponseContractPage && (
<div className={'sm:hidden'}>
<div className="sm:hidden">
<button
className={'text-xs font-bold text-gray-500 hover:underline'}
className="text-xs font-bold text-gray-500 hover:underline"
onClick={() => scrollAndOpenReplyInput(undefined, answer)}
>
Reply
@ -146,9 +108,9 @@ export function FeedAnswerCommentGroup(props: {
)}
</Col>
{isFreeResponseContractPage && (
<div className={'justify-initial hidden sm:block'}>
<div className="justify-initial hidden sm:block">
<button
className={'text-xs font-bold text-gray-500 hover:underline'}
className="text-xs font-bold text-gray-500 hover:underline"
onClick={() => scrollAndOpenReplyInput(undefined, answer)}
>
Reply
@ -170,7 +132,7 @@ export function FeedAnswerCommentGroup(props: {
))}
</Col>
{showReply && (
<div className={'relative ml-7'}>
<div className="relative ml-7">
<span
className="absolute -left-1 -ml-[1px] mt-[1.25rem] h-2 w-0.5 rotate-90 bg-gray-200"
aria-hidden="true"