Clarify rendering logic

This commit is contained in:
Ian Philips 2022-05-03 16:36:18 -04:00
parent d57eecb0c0
commit 72a996a230

View File

@ -313,25 +313,44 @@ export function CommentInput(props: {
</div>
)}
</div>
{!user && (
<button
className={'btn btn-outline btn-sm text-transform: mt-1 capitalize'}
className={
'btn btn-outline btn-sm text-transform: mt-1 capitalize'
}
onClick={() => submitComment(id)}
>
Sign in to Comment
</button>
)}
{user && answerOutcome === undefined && (
<button
className={
'btn btn-outline btn-sm text-transform: mt-1 capitalize'
}
onClick={() => submitComment(id)}
>
Comment
</button>
)}
{user && answerOutcome !== undefined && (
<button
className={
focused
? 'btn btn-outline btn-sm text-transform: mt-1 capitalize'
: 'btn btn-ghost btn-sm text-transform: mt-1 capitalize'
}
onClick={() => {
if (answerOutcome === undefined) {
submitComment(id)
} else if (!focused) {
setFocused(true)
} else {
if (!focused) setFocused(true)
else {
submitComment(id)
setFocused(false)
}
}}
>
{user
? !focused && answerOutcome !== undefined
? 'Add Comment'
: 'Comment'
: 'Sign in to comment'}
{!focused ? 'Add Comment' : 'Comment'}
</button>
)}
</div>
</Row>
</>