feat: 返信に投稿フォームを表示する機能を追加

CHANGELOG_CHERRYPICK.md

@@ -54,6 +54,7 @@
 - Feat: 알림에서 답글이 달린 노트의 상위 노트를 표시하지 않도록 하는 설정 추가
 - Feat: 리노트와 인용 버튼을 표시하는 방법을 선택할 수 있음
 - Feat: 알림 위젯에 필터, 모두 읽은 상태로 표시 버튼 추가
+- Feat: 답글에 글 작성란을 표시하는 기능 추가
 - Spec: 사용자 정의 이모티콘 라이센스를 여러 항목으로 추가할 수 있도록 (MisskeyIO/misskey#130)
 - Enhance: 새로운 신고가 있는 경우, 네비게이션 바의 제어판 아이콘과 제어판 페이지의 신고 섹션에 점을 표시
 - Enhance: 스크롤 시 요소 표시 기능을 Friendly 이외의 UI에도 대응

locales/en-US.yml

@@ -1,5 +1,7 @@
 ---
 _lang_: "English"
+showFixedPostFormInReplies: "Show posting form in replies"
+showFixedPostFormInRepliesDescription: "Only visible in desktop and tablet environments."
 disabledServerMachineStats: "The 'Publish server hardware stats' setting is turned off.\nTo view server metrics, please enable the 'Publish server hardware stats' setting in 'Control Panel - Other'."
 replayUserSetupDialog: "Replay initial setting"
 replayTutorial: "Replay tutorial"

locales/index.d.ts

@@ -3,6 +3,8 @@
 // Do not edit this file directly.
 export interface Locale {
     "_lang_": string;
+    "showFixedPostFormInReplies": string;
+    "showFixedPostFormInRepliesDescription": string;
     "disabledServerMachineStats": string;
     "replayUserSetupDialog": string;
     "replayTutorial": string;

locales/ja-JP.yml

@@ -1,5 +1,7 @@
 _lang_: "日本語"
 
+showFixedPostFormInReplies: "返信に投稿フォームを表示する"
+showFixedPostFormInRepliesDescription: "デスクトップとタブレット環境でのみ表示されます。"
 disabledServerMachineStats: "「サーバーのマシン情報を公開する」設定がオフになっています。\nサーバーメトリクスを表示するには、「コントロールパネル - その他」で「サーバーのマシン情報を公開する」設定を有効にしてください。"
 replayUserSetupDialog: "初期設定のリプレイ"
 replayTutorial: "チュートリアルのリプレイ"

locales/ko-KR.yml

@@ -1,5 +1,7 @@
 ---
 _lang_: "한국어"
+showFixedPostFormInReplies: "답글에 글 작성란 표시"
+showFixedPostFormInRepliesDescription: "데스크톱과 태블릿 환경에서만 표시돼요."
 disabledServerMachineStats: "'서버의 머신 사양을 공개하기' 설정이 꺼져 있습니다.\n서버 통계를 보려면 '제어판 - 기타'에서 '서버의 머신 사양을 공개하기' 설정을 활성화하세요."
 replayUserSetupDialog: "초기 설정 다시 보기"
 replayTutorial: "튜토리얼 다시 보기"

packages/frontend/src/components/MkNoteDetailed.vue

@@ -173,6 +173,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 	</div>
 	<div>
 		<div v-if="tab === 'replies'" :class="$style.tab_replies">
+			<MkPostForm v-if="!isMobile && defaultStore.state.showFixedPostFormInReplies" class="post-form _panel" fixed :reply="appearNote"></MkPostForm>
 			<div v-if="replies.length > 3 && !repliesLoaded" style="padding: 16px">
 				<MkButton style="margin: 0 auto;" primary rounded @click="loadReplies">{{ i18n.ts.loadReplies }}</MkButton>
 			</div>
@@ -253,6 +254,11 @@ import MkReactionIcon from '@/components/MkReactionIcon.vue';
 import MkButton from '@/components/MkButton.vue';
 import { miLocalStorage } from '@/local-storage.js';
 import { instance } from '@/instance.js';
+import MkPostForm from '@/components/MkPostFormSimple.vue';
+import { deviceKind } from '@/scripts/device-kind.js';
+
+const MOBILE_THRESHOLD = 500;
+const isMobile = ref(deviceKind === 'smartphone' || window.innerWidth <= MOBILE_THRESHOLD);
 
 const props = defineProps<{
 	note: Misskey.entities.Note;

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

@@ -71,6 +71,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 				<MkSwitch v-model="enableAbsoluteTime">{{ i18n.ts.enableAbsoluteTime }} <span class="_beta">CherryPick</span></MkSwitch>
 				<MkSwitch v-model="enableMarkByDate" :disabled="defaultStore.state.enableAbsoluteTime">{{ i18n.ts.enableMarkByDate }} <span class="_beta">CherryPick</span></MkSwitch>
 				<MkSwitch v-model="showSubNoteFooterButton">{{ i18n.ts.showSubNoteFooterButton }}<template #caption>{{ i18n.ts.showSubNoteFooterButtonDescription }}</template> <span class="_beta">CherryPick</span></MkSwitch>
+				<MkSwitch v-model="showFixedPostFormInReplies">{{ i18n.ts.showFixedPostFormInReplies }}<template #caption>{{ i18n.ts.showFixedPostFormInRepliesDescription }}</template> <span class="_beta">CherryPick</span></MkSwitch>
 			</div>
 
 			<MkSelect v-model="instanceTicker">
@@ -352,6 +353,7 @@ const showTranslateButtonInNote = computed(defaultStore.makeGetterSetter('showTr
 const enableAbsoluteTime = computed(defaultStore.makeGetterSetter('enableAbsoluteTime'));
 const enableMarkByDate = computed(defaultStore.makeGetterSetter('enableMarkByDate'));
 const showSubNoteFooterButton = computed(defaultStore.makeGetterSetter('showSubNoteFooterButton'));
+const showFixedPostFormInReplies = computed(defaultStore.makeGetterSetter('showFixedPostFormInReplies'));
 
 watch(lang, () => {
 	miLocalStorage.setItem('lang', lang.value as string);
@@ -404,6 +406,7 @@ watch([
 	enableAbsoluteTime,
 	enableMarkByDate,
 	showSubNoteFooterButton,
+	showFixedPostFormInReplies,
 ], async () => {
 	await reloadAsk();
 });

packages/frontend/src/store.ts

@@ -166,6 +166,10 @@ export const defaultStore = markRaw(new Storage('base', {
 		where: 'device',
 		default: false,
 	},
+	showPreviewInReplies: {
+		where: 'device',
+		default: false,
+	},
 	statusbars: {
 		where: 'deviceAccount',
 		default: [] as {
@@ -433,6 +437,10 @@ export const defaultStore = markRaw(new Storage('base', {
 		where: 'device',
 		default: true,
 	},
+	showFixedPostFormInReplies: {
+		where: 'device',
+		default: true,
+	},
 
 	// - Settings/Timeline
 	enableHomeTimeline: {