fix(frontend): アバターデコレーションのアニメーションが止まらない (#13139)

* fix(frontend): アバターデコレーションのアニメーションが止まらない

* Update Changelog

* i -> index

* key

* revert lint fixes

CHANGELOG.md

@@ -61,6 +61,7 @@
 - Fix: プラグインで`Plugin:register_note_post_interruptor`を使用すると、ノートが投稿できなくなる問題を修正
 - Enhance: ページ遷移時にPlayerを閉じるように
 - Fix: iOSで大きな画像を変換してアップロードできない問題を修正
+- Fix: 「アニメーション画像を再生しない」もしくは「データセーバー（アイコン）」を有効にしていても、アイコンデコレーションのアニメーションが停止されない問題を修正
 
 ### Server
 - Enhance: 連合先のレートリミットに引っかかった際にリトライするようになりました

packages/frontend/src/components/global/MkAvatar.vue

@@ -27,7 +27,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 		<img
 			v-for="decoration in decorations ?? user.avatarDecorations"
 			:class="[$style.decoration]"
-			:src="decoration.url"
+			:src="getDecorationUrl(decoration)"
 			:style="{
 				rotate: getDecorationAngle(decoration),
 				scale: getDecorationScale(decoration),
@@ -92,6 +92,11 @@ function onClick(ev: MouseEvent): void {
 	emit('click', ev);
 }
 
+function getDecorationUrl(decoration: Omit<Misskey.entities.UserDetailed['avatarDecorations'][number], 'id'>) {
+	if (defaultStore.state.disableShowingAnimatedImages || defaultStore.state.dataSaver.avatar) return getStaticImageUrl(decoration.url);
+	return decoration.url;
+}
+
 function getDecorationAngle(decoration: Omit<Misskey.entities.UserDetailed['avatarDecorations'][number], 'id'>) {
 	const angle = decoration.angle ?? 0;
 	return angle === 0 ? undefined : `${angle * 360}deg`;