Forum Panel: Fix chatlist animation on close (#6956)

This commit is contained in:
zubiden 2026-06-01 01:15:21 +02:00 committed by Alexander Zinchuk
parent 9dced4cee4
commit d1597b43a5

View File

@ -195,9 +195,15 @@ export default function useChatListEntry({
let isCancelled = false; let isCancelled = false;
// Clear stale transitions before setting the compensating transform
element.classList.remove('animate-opacity', 'animate-transform');
element.style.opacity = '';
element.style.transform = '';
const notifyAnimationEnd = () => { const notifyAnimationEnd = () => {
if (isCancelled) return; if (isCancelled) return;
requestMutation(() => { requestMutation(() => {
if (isCancelled) return;
element.classList.remove('animate-opacity', 'animate-transform'); element.classList.remove('animate-opacity', 'animate-transform');
element.style.opacity = ''; element.style.opacity = '';
element.style.transform = ''; element.style.transform = '';
@ -210,6 +216,7 @@ export default function useChatListEntry({
element.style.opacity = '0'; element.style.opacity = '0';
requestMutation(() => { requestMutation(() => {
if (isCancelled) return;
element.classList.add('animate-opacity'); element.classList.add('animate-opacity');
element.style.opacity = '1'; element.style.opacity = '1';
@ -221,6 +228,7 @@ export default function useChatListEntry({
element.style.transform = `translate3d(0, ${-orderDiff * CHAT_HEIGHT_PX - shiftDiff}px, 0)`; element.style.transform = `translate3d(0, ${-orderDiff * CHAT_HEIGHT_PX - shiftDiff}px, 0)`;
requestMutation(() => { requestMutation(() => {
if (isCancelled) return;
element.classList.add('animate-transform'); element.classList.add('animate-transform');
element.style.transform = ''; element.style.transform = '';
@ -232,6 +240,7 @@ export default function useChatListEntry({
element.style.transform = `translate3d(0, ${-shiftDiff}px, 0)`; element.style.transform = `translate3d(0, ${-shiftDiff}px, 0)`;
requestMutation(() => { requestMutation(() => {
if (isCancelled) return;
element.classList.add('animate-transform'); element.classList.add('animate-transform');
element.style.transform = ''; element.style.transform = '';