feat (client): separate settings for displaying rounded avatars for cat and non-cat accounts

docs/changelog.md

@@ -1,3 +1,7 @@
+# Unreleased
+
+- separate settings for displaying rounded avatars for cat and non-cat accounts
+
 # v20240214
 
 - fix container images

locales/en-US.yml

@@ -906,7 +906,8 @@ customCssWarn: "This setting should only be used if you know what it does. Enter
   improper values may cause the client to stop functioning normally."
 global: "Global"
 recommended: "Recommended"
-squareAvatars: "Display squared avatars"
+squareAvatars: "Display squared avatars for non-cat accounts"
+squareCatAvatars: "Display squared avatars for cat accounts"
 seperateRenoteQuote: "Separate boost and quote buttons"
 sent: "Sent"
 received: "Received"

locales/ja-JP.yml

@@ -820,7 +820,8 @@ customCss: "カスタムCSS"
 customCssWarn: "この設定は必ず知識のある方が行ってください。不適切な設定を行うとクライアントが正常に使用できなくなる恐れがあります。"
 global: "グローバル"
 recommended: "推奨"
-squareAvatars: "アイコンを四角形で表示"
+squareAvatars: "猫でないアカウントのアイコンを四角形で表示"
+squareCatAvatars: "猫のアカウントのアイコンを四角形で表示"
 seperateRenoteQuote: "ブーストと引用のボタンを分ける"
 sent: "送信"
 received: "受信"

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

@@ -24,7 +24,9 @@
 		class="eiwwqkts _noSelect showLightBox"
 		:class="{
 			cat: user.isCat,
-			square: defaultStore.state.squareAvatars,
+			square: user.isCat
+				? defaultStore.state.squareCatAvatars
+				: defaultStore.state.squareAvatars,
 		}"
 		:style="{ color }"
 		:title="acct.toString(user)"
@@ -44,7 +46,9 @@
 		class="eiwwqkts _noSelect"
 		:class="{
 			cat: user.isCat,
-			square: defaultStore.state.squareAvatars,
+			square: user.isCat
+				? defaultStore.state.squareCatAvatars
+				: defaultStore.state.squareAvatars,
 		}"
 		:style="{ color }"
 		:to="userPage(user)"

packages/client/src/pages/settings/general.vue

@@ -236,6 +236,9 @@
 			<FormSwitch v-model="squareAvatars" class="_formBlock">{{
 				i18n.ts.squareAvatars
 			}}</FormSwitch>
+			<FormSwitch v-model="squareCatAvatars" class="_formBlock">{{
+				i18n.ts.squareCatAvatars
+			}}</FormSwitch>
 			<FormSwitch v-model="seperateRenoteQuote" class="_formBlock">{{
 				i18n.ts.seperateRenoteQuote
 			}}</FormSwitch>
@@ -419,6 +422,9 @@ const seperateRenoteQuote = computed(
 	defaultStore.makeGetterSetter("seperateRenoteQuote"),
 );
 const squareAvatars = computed(defaultStore.makeGetterSetter("squareAvatars"));
+const squareCatAvatars = computed(
+	defaultStore.makeGetterSetter("squareCatAvatars"),
+);
 const showUpdates = computed(defaultStore.makeGetterSetter("showUpdates"));
 const swipeOnDesktop = computed(
 	defaultStore.makeGetterSetter("swipeOnDesktop"),

packages/client/src/store.ts

@@ -292,6 +292,10 @@ export const defaultStore = markRaw(
 			where: "device",
 			default: true,
 		},
+		squareCatAvatars: {
+			where: "device",
+			default: false,
+		},
 		postFormWithHashtags: {
 			where: "device",
 			default: false,