fix(frontend): Blurhashのサイズ算出用の値が誤っていた問題を修正 (#17849)

* fix(frontend): Blurhashのサイズ算出用の値が誤っていた問題を修正

* clean up

* Update Changelog

CHANGELOG.md

@@ -4,7 +4,7 @@
 -
 
 ### Client
--
+- Fix: 画像の表示時にBlurhashが描画されない場合があるのを修正
 
 ### Server
 - Fix: 既にミュートしているスレッドに対して再度スレッドミュートを作成しようとするとサーバーエラーになる問題を修正

packages/frontend/src/components/MkBlurhash.vue

@@ -81,7 +81,10 @@ const bitmapTmp = shallowRef<CanvasImageSource | undefined>();
 
 watch([() => props.width, () => props.height, canvas], () => {
 	const ratio = props.width / props.height;
-	if (ratio > 1) {
+	if (!Number.isFinite(ratio) || ratio <= 0) {
+		canvasWidth.value = 64;
+		canvasHeight.value = 64;
+	} else if (ratio > 1) {
 		canvasWidth.value = Math.round(64 * ratio);
 		canvasHeight.value = 64;
 	} else {

packages/frontend/src/components/MkImgWithBlurhash.vue

@@ -18,8 +18,8 @@ SPDX-License-Identifier: AGPL-3.0-only
 			key="canvas"
 			:class="$style.canvas"
 			:blurhash="hash ?? null"
-			:height="imgHeight ?? undefined"
-			:width="imgWidth ?? undefined"
+			:height="props.height"
+			:width="props.width"
 			:onlyAvgColor="props.onlyAvgColor"
 			:show="hide"
 		/>