feat: ability to hide own name/icon

README.md

@@ -34,6 +34,9 @@
 
 - 身バレ防止の設定を追加
   - 「おかえりなさい、◯◯さん」が出ないようにできるように
+  - 自分のアイコンを非表示にできるように
+  - 自分の名前とIDを非表示にできるように
+    - 名前とIDの部分が空白になるので慣れるまで時間が掛かります
 - ユーザーページのデフォルトのタブを「投稿と返信」に変更
 - タイムラインにリプライを表示する設定をデフォルトで有効に
 - 未読通知のタブをリアクションの通知を表示するタブに変更

locales/en-US.yml

@@ -2146,3 +2146,5 @@ _emojiModPerm:
   full: "Allow All"
 privacyForNerds: "Privacy protection in public places"
 disableToast: "Don't show the \"Welcome back\" banner"
+hideMyIcon: "Hide my icon"
+hideMyName: "Hide my name and ID"

locales/ja-JP.yml

@@ -2001,3 +2001,5 @@ emojiPackCreator: 絵文字パックの作者
 exportZip: ZIPをエクスポート
 privacyForNerds: "身バレ防止"
 disableToast: "「おかえりなさい、◯◯さん」を表示しない"
+hideMyIcon: "自分のアイコンを表示しない"
+hideMyName: "自分の名前とIDを表示しない"

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

@@ -1,5 +1,5 @@
 <template>
-	<span class="mk-acct">
+	<span class="mk-acct" v-if="show">
 		<span class="name">@{{ user.username }}</span>
 		<span
 			v-if="user.host || detail || $store.state.showFullAcct"
@@ -13,13 +13,16 @@
 import type * as misskey from "firefish-js";
 import { toUnicode } from "punycode/";
 import { host as hostRaw } from "@/config";
+import { defaultStore } from "@/store";
+import { $i } from "@/account";
 
-defineProps<{
+const props = defineProps<{
 	user: misskey.entities.UserDetailed;
 	detail?: boolean;
 }>();
 
 const host = toUnicode(hostRaw);
+const show = !defaultStore.state.hideMyName || $i.id !== props.user.id;
 </script>
 
 <style lang="scss" scoped>

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

@@ -4,14 +4,14 @@
 		v-user-preview="disablePreview ? undefined : user.id"
 		class="eiwwqkts _noSelect"
 		:class="{
-			cat: user.isCat,
+			cat: show && user.isCat,
 			square: user.isCat ? false : $store.state.squareAvatars,
 		}"
 		:style="{ color }"
 		:title="acct(user)"
 		@click="onClick"
 	>
-		<img class="inner" :src="url" decoding="async" />
+		<img v-if="show" class="inner" :src="url" decoding="async" />
 		<MkUserOnlineIndicator
 			v-if="showIndicator && user.instance == null"
 			class="indicator"
@@ -23,7 +23,7 @@
 		v-user-preview="disablePreview ? undefined : user.id"
 		class="eiwwqkts _noSelect"
 		:class="{
-			cat: user.isCat,
+			cat: show && user.isCat,
 			square: user.isCat ? false : $store.state.squareAvatars,
 		}"
 		:style="{ color }"
@@ -32,7 +32,7 @@
 		:target="target"
 		@click.stop
 	>
-		<img class="inner" :src="url" decoding="async" />
+		<img v-if="show" class="inner" :src="url" decoding="async" />
 		<MkUserOnlineIndicator
 			v-if="showIndicator && user.instance == null"
 			class="indicator"
@@ -49,6 +49,7 @@ import { extractAvgColorFromBlurhash } from "@/scripts/extract-avg-color-from-bl
 import { acct, userPage } from "@/filters/user";
 import MkUserOnlineIndicator from "@/components/MkUserOnlineIndicator.vue";
 import { defaultStore } from "@/store";
+import { $i } from "@/account";
 
 const props = withDefaults(
 	defineProps<{
@@ -76,6 +77,8 @@ const url = computed(() =>
 		: props.user.avatarUrl,
 );
 
+const show = !defaultStore.state.hideMyIcon || $i.id !== props.user.id;
+
 function onClick(ev: MouseEvent) {
 	emit("click", ev);
 }

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

@@ -1,5 +1,6 @@
 <template>
 	<Mfm
+		v-if="show"
 		:class="$style.root"
 		:text="user.name || user.username"
 		:plain="true"
@@ -10,6 +11,8 @@
 
 <script lang="ts" setup>
 import type * as misskey from "firefish-js";
+import { defaultStore } from "@/store";
+import { $i } from "@/account";
 
 const props = withDefaults(
 	defineProps<{
@@ -20,6 +23,8 @@ const props = withDefaults(
 		nowrap: true,
 	},
 );
+
+const show = !defaultStore.state.hideMyName || $i.id !== props.user.id;
 </script>
 
 <style lang="scss" module>

packages/client/src/pages/note.vue

@@ -78,6 +78,8 @@ import MkButton from "@/components/MkButton.vue";
 import * as os from "@/os";
 import { definePageMetadata } from "@/scripts/page-metadata";
 import { i18n } from "@/i18n";
+import { defaultStore } from "@/store";
+import { $i } from "@/account";
 
 const props = defineProps<{
 	noteId: string;
@@ -172,11 +174,15 @@ definePageMetadata(
 	computed(() =>
 		appearNote.value
 			? {
-					title: i18n.t("noteOf", {
-						user:
-							appearNote.value.user.name ||
-							appearNote.value.user.username,
-					}),
+					title:
+						defaultStore.state.hideMyName &&
+						appearNote.value.userId === $i.id
+							? ""
+							: i18n.t("noteOf", {
+									user:
+										appearNote.value.user.name ||
+										appearNote.value.user.username,
+							  }),
 					subtitle: new Date(
 						appearNote.value.createdAt,
 					).toLocaleString(),

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

@@ -270,6 +270,18 @@
 					i18n.ts.originalFeature
 				}}</span></FormSwitch
 			>
+			<FormSwitch v-model="hideMyIcon" class="_formBlock"
+				>{{ i18n.ts.hideMyIcon
+				}}<span class="_beta">{{
+					i18n.ts.originalFeature
+				}}</span></FormSwitch
+			>
+			<FormSwitch v-model="hideMyName" class="_formBlock"
+				>{{ i18n.ts.hideMyName
+				}}<span class="_beta">{{
+					i18n.ts.originalFeature
+				}}</span></FormSwitch
+			>
 		</FormSection>
 
 		<FormSection>
@@ -450,6 +462,8 @@ const emphasizeFollowed = computed(
 	defaultStore.makeGetterSetter("emphasizeFollowed"),
 );
 const disableToast = computed(defaultStore.makeGetterSetter("disableToast"));
+const hideMyIcon = computed(defaultStore.makeGetterSetter("hideMyIcon"));
+const hideMyName = computed(defaultStore.makeGetterSetter("hideMyName"));
 
 watch(swipeOnDesktop, () => {
 	defaultStore.set("swipeOnMobile", true);

packages/client/src/store.ts

@@ -377,6 +377,14 @@ export const defaultStore = markRaw(
 			where: "device",
 			default: false,
 		},
+		hideMyIcon: {
+			where: "device",
+			default: false,
+		},
+		hideMyName: {
+			where: "device",
+			default: false,
+		},
 	}),
 );