feat: 본문 미리보기의 프로필을 표시하지 않도록 설정할 수 있음

CHANGELOG_CHERRYPICK.md

@@ -23,6 +23,16 @@ Misskey의 전체 변경 사항을 확인하려면, [CHANGELOG.md#2023xx](CHANGE
 # 릴리즈 노트
 이 문서는 CherryPick의 변경 사항만 포함합니다.
 
+## 4.x.x
+출시일: unreleased<br>
+기반 Misskey 버전: 2023.x.x<br>
+Misskey의 전체 변경 사항을 확인하려면, [CHANGELOG.md#2023xx](CHANGELOG.md#2023xx) 문서를 참고하십시오.
+
+### Client
+- Feat: 본문 미리보기의 프로필을 표시하지 않도록 설정할 수 있음
+
+---
+
 ## 4.4.1
 출시일: 2023/10/21<br>
 기반 Misskey 버전: 2023.10.2<br>

locales/en-US.yml

@@ -1,5 +1,6 @@
 ---
 _lang_: "English"
+previewNoteProfile: "Show profile"
 noteEdited: "Note are now edited."
 removeModalBgColorForBlur: "Remove modal background color"
 skipThisVersion: "Skip this release"

locales/index.d.ts

@@ -3,6 +3,7 @@
 // Do not edit this file directly.
 export interface Locale {
     "_lang_": string;
+    "previewNoteProfile": string;
     "noteEdited": string;
     "removeModalBgColorForBlur": string;
     "skipThisVersion": string;

locales/ja-JP.yml

@@ -1,5 +1,6 @@
 _lang_: "日本語"
 
+previewNoteProfile: "プロフィールを表示"
 noteEdited: "ノートを編集しました。"
 removeModalBgColorForBlur: "モーダル背景色を削除"
 skipThisVersion: "このリリースをスキップする"

locales/ko-KR.yml

@@ -1,5 +1,6 @@
 ---
 _lang_: "한국어"
+previewNoteProfile: "프로필 표시"
 noteEdited: "노트를 편집했어요!"
 removeModalBgColorForBlur: "모달 배경색 제거"
 skipThisVersion: "이 릴리즈 건너뛰기"

packages/frontend/src/components/MkNotePreview.vue

@@ -5,9 +5,9 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <template>
 <div :class="$style.root">
-	<MkAvatar v-if="!defaultStore.state.hideAvatarsInNote" :class="$style.avatar" :user="user" link preview/>
+	<MkAvatar v-if="!defaultStore.state.hideAvatarsInNote && showProfile" :class="$style.avatar" :user="user" link preview/>
 	<div :class="$style.main">
-		<div :class="$style.header">
+		<div v-if="showProfile" :class="$style.header">
 			<MkUserName :user="user" :nowrap="true"/>
 		</div>
 		<div>
@@ -31,6 +31,7 @@ import { defaultStore } from '@/store.js';
 const props = defineProps<{
 	text: string;
 	user: Misskey.entities.User;
+  showProfile?: boolean;
 }>();
 
 const urls = props.text ? extractUrlFromMfm(mfm.parse(props.text)) : null;

packages/frontend/src/components/MkPostForm.vue

@@ -75,7 +75,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 	<input v-show="withHashtags" ref="hashtagsInputEl" v-model="hashtags" :class="$style.hashtags" :placeholder="i18n.ts.hashtags" list="hashtags">
 	<XPostFormAttaches v-model="files" @detach="detachFile" @changeSensitive="updateFileSensitive" @changeName="updateFileName" @replaceFile="replaceFile"/>
 	<MkPollEditor v-if="poll" v-model="poll" @destroyed="poll = null"/>
-	<MkNotePreview v-if="showPreview" :class="$style.preview" :text="text" :user="postAccount ?? $i"/>
+	<MkNotePreview v-if="showPreview" :class="$style.preview" :text="text" :user="postAccount ?? $i" :showProfile="showProfilePreview"/>
 	<div v-if="showingOptions" style="padding: 8px 16px;">
 	</div>
 	<footer :class="$style.footer">
@@ -91,7 +91,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			<button v-tooltip="i18n.ts.emoji" :class="['_button', $style.footerButton]" @click="insertEmoji"><i class="ti ti-mood-happy"></i></button>
 		</div>
 		<div :class="$style.footerRight">
-			<button v-tooltip="i18n.ts.previewNoteText" class="_button" :class="[$style.footerButton, { [$style.previewButtonActive]: showPreview }]" @click="showPreview = !showPreview"><i class="ti ti-eye"></i></button>
+			<button v-tooltip="i18n.ts.previewNoteText" class="_button" :class="$style.footerButton" @click="showPreviewMenu"><i class="ti ti-eye"></i></button>
 			<!--<button v-tooltip="i18n.ts.more" class="_button" :class="$style.footerButton" @click="showingOptions = !showingOptions"><i class="ti ti-dots"></i></button>-->
 		</div>
 	</footer>
@@ -185,7 +185,9 @@ let event = $ref<{
 } | null>(null);
 let useCw = $ref(false);
 let showPreview = $ref(defaultStore.state.showPreview);
+let showProfilePreview = $ref(defaultStore.state.showProfilePreview);
 watch($$(showPreview), () => defaultStore.set('showPreview', showPreview));
+watch($$(showProfilePreview), () => defaultStore.set('showProfilePreview', showProfilePreview));
 let cw = $ref<string | null>(null);
 let localOnly = $ref<boolean>(props.initialLocalOnly ?? defaultStore.state.rememberNoteVisibility ? defaultStore.state.localOnly : defaultStore.state.defaultNoteLocalOnly);
 let visibility = $ref(props.initialVisibility ?? (defaultStore.state.rememberNoteVisibility ? defaultStore.state.visibility : defaultStore.state.defaultNoteVisibility) as typeof Misskey.noteVisibilities[number]);
@@ -858,6 +860,7 @@ async function post(ev?: MouseEvent) {
 			text: err.message + '\n' + (err as any).id,
 		});
 	});
+	textareaEl.style.height = '140px';
 	if (props.updateMode) sound.play('noteEdited');
 	vibrate(ColdDeviceStorage.get('vibrateSystem') ? [10, 20, 10, 20, 10, 20, 60] : '');
 }
@@ -912,6 +915,20 @@ function openAccountMenu(ev: MouseEvent) {
 	}, ev);
 }
 
+function showPreviewMenu(ev: MouseEvent) {
+	os.popupMenu([{
+		type: 'switch',
+		text: i18n.ts.previewNoteText,
+		icon: 'ti ti-eye',
+		ref: $$(showPreview),
+	}, {
+		type: 'switch',
+		text: i18n.ts.previewNoteProfile,
+		icon: 'ti ti-user-circle',
+		ref: $$(showProfilePreview),
+	}], ev.currentTarget ?? ev.target);
+}
+
 onMounted(() => {
 	if (props.autofocus) {
 		focus();

packages/frontend/src/components/MkPostFormSimple.vue

@@ -88,7 +88,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 	<input v-show="withHashtags && showForm" ref="hashtagsInputEl" v-model="hashtags" :class="$style.hashtags" :placeholder="i18n.ts.hashtags" list="hashtags">
 	<XPostFormAttaches v-if="showForm" v-model="files" @detach="detachFile" @changeSensitive="updateFileSensitive" @changeName="updateFileName" @replaceFile="replaceFile"/>
 	<MkPollEditor v-if="poll && showForm" v-model="poll" @destroyed="poll = null"/>
-	<MkNotePreview v-if="showPreview && showForm" :class="$style.preview" :text="text"/>
+	<MkNotePreview v-if="showPreview && showForm" :class="$style.preview" :text="text" :user="postAccount ?? $i" :showProfile="showProfilePreview"/>
 	<div v-if="showingOptions && showForm" style="padding: 8px 16px;">
 	</div>
 	<Transition
@@ -110,7 +110,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 				<button v-tooltip="i18n.ts.emoji" :class="['_button', $style.footerButton]" @click="insertEmoji"><i class="ti ti-mood-happy"></i></button>
 			</div>
 			<div :class="$style.footerRight">
-				<button v-tooltip="i18n.ts.previewNoteText" class="_button" :class="[$style.footerButton, { [$style.previewButtonActive]: showPreview }]" @click="showPreview = !showPreview"><i class="ti ti-eye"></i></button>
+				<button v-tooltip="i18n.ts.previewNoteText" class="_button" :class="$style.footerButton" @click="showPreviewMenu"><i class="ti ti-eye"></i></button>
 				<!--<button v-tooltip="i18n.ts.more" class="_button" :class="$style.footerButton" @click="showingOptions = !showingOptions"><i class="ti ti-dots"></i></button>-->
 			</div>
 		</footer>
@@ -208,7 +208,9 @@ let event = $ref<{
 } | null>(null);
 let useCw = $ref(false);
 let showPreview = $ref(defaultStore.state.showPreviewInReplies);
+let showProfilePreview = $ref(defaultStore.state.showProfilePreview);
 watch($$(showPreview), () => defaultStore.set('showPreviewInReplies', showPreview));
+watch($$(showProfilePreview), () => defaultStore.set('showProfilePreview', showProfilePreview));
 let cw = $ref<string | null>(null);
 let localOnly = $ref<boolean>(props.initialLocalOnly ?? defaultStore.state.rememberNoteVisibility ? defaultStore.state.localOnly : defaultStore.state.defaultNoteLocalOnly);
 let visibility = $ref(props.initialVisibility ?? (defaultStore.state.rememberNoteVisibility ? defaultStore.state.visibility : defaultStore.state.defaultNoteVisibility) as typeof Misskey.noteVisibilities[number]);
@@ -879,6 +881,7 @@ async function post(ev?: MouseEvent) {
 			text: err.message + '\n' + (err as any).id,
 		});
 	});
+	textareaEl.style.height = '35px';
 	if (props.updateMode) sound.play('noteEdited');
 	vibrate(ColdDeviceStorage.get('vibrateSystem') ? [10, 20, 10, 20, 10, 20, 60] : '');
 }
@@ -964,6 +967,20 @@ function signin() {
 	}, {}, 'closed');
 }
 
+function showPreviewMenu(ev: MouseEvent) {
+	os.popupMenu([{
+		type: 'switch',
+		text: i18n.ts.previewNoteText,
+		icon: 'ti ti-eye',
+		ref: $$(showPreview),
+	}, {
+		type: 'switch',
+		text: i18n.ts.previewNoteProfile,
+		icon: 'ti ti-user-circle',
+		ref: $$(showProfilePreview),
+	}], ev.currentTarget ?? ev.target);
+}
+
 onMounted(() => {
 	if (props.autofocus) {
 		focus();

packages/frontend/src/store.ts

@@ -154,6 +154,10 @@ export const defaultStore = markRaw(new Storage('base', {
 		where: 'device',
 		default: false,
 	},
+	showProfilePreview: {
+		where: 'device',
+		default: true,
+	},
 	statusbars: {
 		where: 'deviceAccount',
 		default: [] as {