fix: upvote widget not rendered when comment is collapsed (#1583)

* fix: upvote widget not rendered when comment is collapsed

* fix: restored missing conditional on handleShortPress

* chore: icon horizontal space maintained even if the comment is collapsed

* chore: 'rendered' argument renamed to 'visible'

* chore: collapsed condition merged with the 'disabled' variable

* reduce unecessary code

---------

Co-authored-by: Keyan <34140557+huumn@users.noreply.github.com>
Co-authored-by: k00b <k00b@stacker.news>
This commit is contained in:
Lorenzo 2024-11-17 00:04:49 +01:00 committed by GitHub
parent 73df5e0308
commit 8a2bd84f69
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 5 additions and 7 deletions

View File

@ -149,7 +149,7 @@ export default function Comment ({
? <Boost item={item} className={styles.upvote} />
: item.meDontLikeSats > item.meSats
? <DownZap width={24} height={24} className={styles.dontLike} item={item} />
: pin ? <Pin width={22} height={22} className={styles.pin} /> : <UpVote item={item} className={styles.upvote} />}
: pin ? <Pin width={22} height={22} className={styles.pin} /> : <UpVote item={item} className={styles.upvote} collapsed={collapse === 'yep'} />}
<div className={`${itemStyles.hunk} ${styles.hunk}`}>
<div className='d-flex align-items-center'>
{item.user?.meMute && !includeParent && collapse === 'yep'

View File

@ -103,7 +103,7 @@ export const nextTip = (meSats, { tipDefault, turboTipping, tipRandom, tipRandom
return defaultTipIncludingRandom({ tipDefault, tipRandom, tipRandomMin, tipRandomMax })
}
export default function UpVote ({ item, className }) {
export default function UpVote ({ item, className, collapsed }) {
const showModal = useShowModal()
const [voteShow, _setVoteShow] = useState(false)
const [tipShow, _setTipShow] = useState(false)
@ -150,8 +150,8 @@ export default function UpVote ({ item, className }) {
const zap = useZap()
const disabled = useMemo(() => item?.mine || item?.meForward || item?.deletedAt,
[item?.mine, item?.meForward, item?.deletedAt])
const disabled = useMemo(() => collapsed || item?.mine || item?.meForward || item?.deletedAt,
[collapsed, item?.mine, item?.meForward, item?.deletedAt])
const [meSats, overlayText, color, nextColor] = useMemo(() => {
const meSats = (me ? item?.meSats : item?.meAnonSats) || 0
@ -244,9 +244,7 @@ export default function UpVote ({ item, className }) {
onShortPress={handleShortPress}
>
<ActionTooltip notForm disable={disabled} overlayText={overlayText}>
<div
className={classNames(disabled && styles.noSelfTips, styles.upvoteWrapper)}
>
<div className={classNames(disabled && styles.noSelfTips, styles.upvoteWrapper)}>
<UpBolt
onPointerEnter={() => setHover(true)}
onMouseLeave={() => setHover(false)}