scroll properly when switching tabs
This commit is contained in:
parent
87c66253cb
commit
070763f164
1 changed files with 13 additions and 4 deletions
|
@ -156,10 +156,15 @@ export default function LivestreamComments(props: Props) {
|
||||||
'button-toggle--active': viewMode === VIEW_MODE_CHAT,
|
'button-toggle--active': viewMode === VIEW_MODE_CHAT,
|
||||||
})}
|
})}
|
||||||
label={__('Chat')}
|
label={__('Chat')}
|
||||||
onClick={() => setViewMode(VIEW_MODE_CHAT)}
|
onClick={function() {
|
||||||
|
setViewMode(VIEW_MODE_CHAT);
|
||||||
|
const livestreamCommentsDiv = document.getElementsByClassName('livestream__comments')[0]
|
||||||
|
const divHeight = livestreamCommentsDiv.scrollHeight;
|
||||||
|
livestreamCommentsDiv.scrollTop = divHeight;
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{/* the list by tip amount value button */}
|
{/* the button to show superchats listed by most to least support amount */}
|
||||||
<Button
|
<Button
|
||||||
className={classnames('button-toggle', {
|
className={classnames('button-toggle', {
|
||||||
'button-toggle--active': viewMode === VIEW_MODE_SUPER_CHAT,
|
'button-toggle--active': viewMode === VIEW_MODE_SUPER_CHAT,
|
||||||
|
@ -170,7 +175,12 @@ export default function LivestreamComments(props: Props) {
|
||||||
<CreditAmount amount={superChatsTotalAmount} size={8} isFiat={true} /> {' '}{__('Tipped')}
|
<CreditAmount amount={superChatsTotalAmount} size={8} isFiat={true} /> {' '}{__('Tipped')}
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
onClick={() => setViewMode(VIEW_MODE_SUPER_CHAT)}
|
onClick={function() {
|
||||||
|
setViewMode(VIEW_MODE_SUPER_CHAT);
|
||||||
|
const livestreamCommentsDiv = document.getElementsByClassName('livestream__comments')[0]
|
||||||
|
const divHeight = livestreamCommentsDiv.scrollHeight;
|
||||||
|
livestreamCommentsDiv.scrollTop = divHeight * -1;
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
@ -236,7 +246,6 @@ export default function LivestreamComments(props: Props) {
|
||||||
commentIsMine={comment.channel_id && isMyComment(comment.channel_id)}
|
commentIsMine={comment.channel_id && isMyComment(comment.channel_id)}
|
||||||
/>
|
/>
|
||||||
))}
|
))}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<div className="main--empty" style={{ flex: 1 }} />
|
<div className="main--empty" style={{ flex: 1 }} />
|
||||||
|
|
Loading…
Reference in a new issue