From 7a003dec73b79cbfed2ca4586f7a77652b55371d Mon Sep 17 00:00:00 2001
From: Hazelnoot <acomputerdog@gmail.com>
Date: Thu, 29 May 2025 12:41:36 -0400
Subject: use SkTransitionGroup for all dynamic TransitionGroup components

---
 packages/frontend/src/components/MkNotifications.vue | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

(limited to 'packages/frontend/src/components/MkNotifications.vue')

diff --git a/packages/frontend/src/components/MkNotifications.vue b/packages/frontend/src/components/MkNotifications.vue
index 54edf771ed..46e98462dc 100644
--- a/packages/frontend/src/components/MkNotifications.vue
+++ b/packages/frontend/src/components/MkNotifications.vue
@@ -14,8 +14,8 @@ SPDX-License-Identifier: AGPL-3.0-only
 		</template>
 
 		<template #default="{ items: notifications }">
-			<component
-				:is="prefer.s.animation ? TransitionGroup : 'div'" :class="[$style.notifications]"
+			<SkTransitionGroup
+				:class="[$style.notifications]"
 				:enterActiveClass="$style.transition_x_enterActive"
 				:leaveActiveClass="$style.transition_x_leaveActive"
 				:enterFromClass="$style.transition_x_enterFrom"
@@ -27,7 +27,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 					<DynamicNote v-if="['reply', 'quote', 'mention'].includes(notification.type)" :class="$style.item" :note="notification.note" :withHardMute="true" :data-scroll-anchor="notification.id"/>
 					<XNotification v-else :class="$style.item" :notification="notification" :withTime="true" :full="true" :data-scroll-anchor="notification.id"/>
 				</div>
-			</component>
+			</SkTransitionGroup>
 		</template>
 	</MkPagination>
 </MkPullToRefresh>
@@ -45,6 +45,7 @@ import { i18n } from '@/i18n.js';
 import { infoImageUrl } from '@/instance.js';
 import MkPullToRefresh from '@/components/MkPullToRefresh.vue';
 import { prefer } from '@/preferences.js';
+import SkTransitionGroup from '@/components/SkTransitionGroup.vue';
 
 const props = defineProps<{
 	excludeTypes?: typeof notificationTypes[number][];
-- 
cgit v1.2.3-freya