feat(frontend): Renoteするときに確認ポップアップを表示するかどうかを選択できる

CHANGELOG_CHERRYPICK.md

@@ -61,6 +61,8 @@
 - 헤더의 블러 설정 추가
 - 「이미 팔로우한 경우 알림 필드에 팔로우 버튼을 표시하지 않음」설정 사용 시, 팔로우 했다는 문구를 표시하도록
 - 흐림 효과를 비활성화 하면 알림을 불투명하게 표시하도록
+- 설정 - 일반에 있는 일부 기능의 위치를 CherryPick 으로 이동
+- 리노트할 때 확인 팝업 표시 유무를 선택할 수 있음
 - Fix: 그룹 초대 알림 아이콘이 잘못 표시되는 문제
 - Fix: 노트 디자인이 올바르지 않게 표시되는 문제
 - Fix: 프로필 아이콘이 투명일 때 노트 답글선이 비치는 문제

locales/en-US.yml

@@ -1,10 +1,11 @@
 ---
 _lang_: "English"
+showRenoteConfirmPopup: "Show confirmation popup when renote"
 showSubNoteFooterButton: "Show action buttons in subnotes"
 showSubNoteFooterButtonDescription: "Enabling this setting will show an action button on the parent note of the replied-to note."
 alreadyFollowed: "You've been followed!"
 enableMarkByDate: "Show note times as dates"
-renoteConfirm: "Do you want to Renote?"
+renoteConfirm: "Do you want to renote?"
 inviteRevoke: "Revoke All Invitation Codes"
 inviteRevokeConfirm: "Are you sure that you want to revoke all invitation codes?"
 enableAbsoluteTime: "Enable Absolute Time"

locales/index.d.ts

@@ -3,6 +3,7 @@
 // Do not edit this file directly.
 export interface Locale {
     "_lang_": string;
+    "showRenoteConfirmPopup": string;
     "showSubNoteFooterButton": string;
     "showSubNoteFooterButtonDescription": string;
     "alreadyFollowed": string;

locales/ja-JP.yml

@@ -1,5 +1,6 @@
 _lang_: "日本語"
 
+showRenoteConfirmPopup: "Renoteするときに確認ポップアップを表示"
 showSubNoteFooterButton: "サブノートにアクションボタンを表示"
 showSubNoteFooterButtonDescription: "この設定を有効にすると、返信があるノートの親ノートにアクションボタンを表示します。"
 alreadyFollowed: "フォローしました！"

locales/ko-KR.yml

@@ -1,5 +1,6 @@
 ---
 _lang_: "한국어"
+showRenoteConfirmPopup: "리노트할 때 확인 팝업 표시"
 showSubNoteFooterButton: "서브 노트에 액션 버튼 표시"
 showSubNoteFooterButtonDescription: "이 설정을 활성화하면 답글이 달린 노트의 상위 노트에 액션 버튼을 표시해요."
 alreadyFollowed: "팔로우 했어요!"
@@ -25,7 +26,7 @@ disableRightClick: "우클릭 방지"
 useEnterToSend: "Enter 키를 눌러 보내기"
 useEnterToSendDescription: "옵션을 활성화하면 줄 바꿈은 Shift + Enter 키로 할 수 있어요."
 postFormVisibilityHotkey: "단축키로 공개 범위 전환하기"
-postFormVisibilityHotkeyDescription: "노트를 작성할 때, Ctrl(control) + Shift 키를 누르면 공개 범위를 전환할 수 있어요. 로컬에만 보이게 하는 단축키는 Ctrl(command 또는 control) + Alt(option) 키예요."
+postFormVisibilityHotkeyDescription: "노트를 작성할 때, Ctrl(control) + Shift 키를 누르면 공개 범위를 전환할 수 있어요. 로컬에만 보이게 하는 단축키는 Ctrl(command 또는 control) + Alt(option) 키에요."
 cherrypickUpdatedCacheClearTitle: "캐시를 지울까요?"
 cherrypickUpdatedCacheClear: "테마 및 색상, 로케일 등의 변경 사항이 제대로 반영되지 않을 수 있기 때문에, 클라이언트가 업데이트되면 <b>캐시를 지울 것을 권장</b>해요.\n계정 로그인 상태는 그대로 유지돼요!"
 cherrypickUpdatedCacheClearLater: "나중에 캐시를 지우려면 <b>설정</b> - <b>캐시 지우기</b>에서 할 수 있어요!"

packages/frontend/src/components/MkNote.vue

@@ -305,11 +305,13 @@ async function renote() {
 	pleaseLogin();
 	showMovedDialog();
 
-	const { canceled } = await os.confirm({
-		type: 'info',
-		text: i18n.ts.renoteConfirm,
-	});
-	if (canceled) return;
+	if (defaultStore.state.showRenoteConfirmPopup) {
+		const { canceled } = await os.confirm({
+			type: 'info',
+			text: i18n.ts.renoteConfirm,
+		});
+		if (canceled) return;
+	}
 
 	if (appearNote.channel) {
 		const el = renoteButton.value as HTMLElement | null | undefined;

packages/frontend/src/components/MkNoteDetailed.vue

@@ -287,11 +287,13 @@ async function renote() {
 	pleaseLogin();
 	showMovedDialog();
 
-	const { canceled } = await os.confirm({
-		type: 'info',
-		text: i18n.ts.renoteConfirm,
-	});
-	if (canceled) return;
+	if (defaultStore.state.showRenoteConfirmPopup) {
+		const { canceled } = await os.confirm({
+			type: 'info',
+			text: i18n.ts.renoteConfirm,
+		});
+		if (canceled) return;
+	}
 
 	if (appearNote.channel) {
 		const el = renoteButton.value as HTMLElement | null | undefined;

packages/frontend/src/components/MkSubNoteContent.vue

@@ -190,11 +190,13 @@ async function renote() {
 	pleaseLogin();
 	showMovedDialog();
 
-	const { canceled } = await os.confirm({
-		type: 'info',
-		text: i18n.ts.renoteConfirm,
-	});
-	if (canceled) return;
+	if (defaultStore.state.showRenoteConfirmPopup) {
+		const { canceled } = await os.confirm({
+			type: 'info',
+			text: i18n.ts.renoteConfirm,
+		});
+		if (canceled) return;
+	}
 
 	if (props.note.channel) {
 		const el = renoteButton.value as HTMLElement | null | undefined;

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

@@ -9,6 +9,20 @@
 				{{ i18n.ts._cherrypick.nickname }}
 				<template #caption>{{ i18n.ts._cherrypick.nicknameDescription }}</template>
 			</MkSwitch>
+
+			<div class="_gaps_s">
+				<MkSwitch v-model="useEnterToSend">
+					<template #label>{{ i18n.ts.useEnterToSend }}</template>
+					<template #caption>{{ i18n.ts.useEnterToSendDescription }}</template>
+				</MkSwitch>
+				<MkSwitch v-model="postFormVisibilityHotkey">
+					<template #label>{{ i18n.ts.postFormVisibilityHotkey }}</template>
+					<template #caption>{{ i18n.ts.postFormVisibilityHotkeyDescription }}</template>
+				</MkSwitch>
+				<MkSwitch v-model="showRenoteConfirmPopup">
+					<template #label>{{ i18n.ts.showRenoteConfirmPopup }}</template>
+				</MkSwitch>
+			</div>
 		</div>
 	</FormSection>
 	<FormSection>
@@ -26,36 +40,17 @@
 			<MkSwitch v-model="mobileTimelineHeaderChange">{{ i18n.ts._cherrypick.mobileTimelineHeaderChange }}</MkSwitch>
 		</div>
 	</FormSection>
-	<!--
-	<FormSection>
-		<template #label><i class="ti ti-flask"/> CherryPick Labs</template>
-		<div class="_gaps_m">
-			<div>まだ開発中の機能を試してみませんか。一部の機能はちゃんと動かないかもしれません。</div>
-
-			<MkSwitch v-model="usePostFormWindow">
-				投稿フォームをウィンドウとして表示
-			</MkSwitch>
-			<MkSwitch v-model="cherrypickNoteViewEnabled">
-				新しいノートUIを試す
-			</MkSwitch>
-			<MkNote :note="noteMock"/>
-		</div>
-	</FormSection>
-	-->
 </div>
 </template>
 
 <script lang="ts" setup>
 import { computed, watch } from 'vue';
-// import { Note, User } from 'cherrypick-js/src/entities';
 import MkSwitch from '@/components/MkSwitch.vue';
-// import MkNote from '@/components/MkNote.vue';
 import FormSection from '@/components/form/section.vue';
 import { defaultStore } from '@/store';
 import * as os from '@/os';
 import { unisonReload } from '@/scripts/unison-reload';
 import { i18n } from '@/i18n';
-// import { $i } from '@/account';
 import { definePageMetadata } from '@/scripts/page-metadata';
 
 async function reloadAsk() {
@@ -69,40 +64,16 @@ async function reloadAsk() {
 }
 
 const nicknameEnabled = computed(defaultStore.makeGetterSetter('nicknameEnabled'));
-const numberQuoteEnabled = computed(defaultStore.makeGetterSetter('numberQuoteEnabled'));
-const stealEnabled = computed(defaultStore.makeGetterSetter('stealEnabled'));
+const useEnterToSend = computed(defaultStore.makeGetterSetter('useEnterToSend'));
+const postFormVisibilityHotkey = computed(defaultStore.makeGetterSetter('postFormVisibilityHotkey'));
+const showRenoteConfirmPopup = computed(defaultStore.makeGetterSetter('showRenoteConfirmPopup'));
 const infoButtonForNoteActionsEnabled = computed(defaultStore.makeGetterSetter('infoButtonForNoteActionsEnabled'));
 const reactableRemoteReactionEnabled = computed(defaultStore.makeGetterSetter('reactableRemoteReactionEnabled'));
 const rememberPostFormToggleStateEnabled = computed(defaultStore.makeGetterSetter('rememberPostFormToggleStateEnabled'));
-// const usePostFormWindow = computed(defaultStore.makeGetterSetter('usePostFormWindow'));
-// const cherrypickNoteViewEnabled = computed(defaultStore.makeGetterSetter('cherrypickNoteViewEnabledLab'));
 const showFollowingMessageInsteadOfButtonEnabled = computed(defaultStore.makeGetterSetter('showFollowingMessageInsteadOfButtonEnabled'));
 const mobileTimelineHeaderChange = computed(defaultStore.makeGetterSetter('mobileTimelineHeaderChange'));
 
-/*
-const noteMock: Note = {
-	id: 'abc',
-	createdAt: new Date().toISOString(),
-	text: '> **エビ**（海老・蝦・魵）は、節足動物門・甲殻亜門・軟甲綱・十脚目（エビ目）のうち、カニ下目（短尾類）とヤドカリ下目（異尾類）以外の全ての種の総称である。すなわち、かつての**長尾類**（長尾亜目 Macrura）にあたる。現在、長尾亜目という分類群は廃止されており、学術的な分類ではなく便宜上の区分である。\n\n出典：https://ja.wikipedia.org/wiki/%E3%82%A8%E3%83%93',
-	cw: null,
-	user: $i as User,
-	userId: $i.id,
-	replyId: '',
-	renoteId: '',
-	files: [],
-	fileIds: [],
-	visibility: 'home',
-	reactions: {},
-	renoteCount: 20,
-	repliesCount: 10,
-	emojis: [],
-	localOnly: true,
-};
- */
-
 watch([
-	numberQuoteEnabled,
-	stealEnabled,
 	infoButtonForNoteActionsEnabled,
 	reactableRemoteReactionEnabled,
 ], async () => {

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

@@ -52,14 +52,6 @@
 				<MkSwitch v-model="showGapBetweenNotesInTimeline">{{ i18n.ts.showGapBetweenNotesInTimeline }}</MkSwitch>
 				<MkSwitch v-model="loadRawImages">{{ i18n.ts.loadRawImages }}</MkSwitch>
 				<MkSwitch v-model="useReactionPickerForContextMenu">{{ i18n.ts.useReactionPickerForContextMenu }}</MkSwitch>
-				<MkSwitch v-model="useEnterToSend">
-					<template #label>{{ i18n.ts.useEnterToSend }} <span class="_beta">CherryPick</span></template>
-					<template #caption>{{ i18n.ts.useEnterToSendDescription }}</template>
-				</MkSwitch>
-				<MkSwitch v-model="postFormVisibilityHotkey">
-					<template #label>{{ i18n.ts.postFormVisibilityHotkey }} <span class="_beta">CherryPick</span></template>
-					<template #caption>{{ i18n.ts.postFormVisibilityHotkeyDescription }}</template>
-				</MkSwitch>
 				<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>
@@ -327,8 +319,6 @@ const mediaListWithOneImageAppearance = computed(defaultStore.makeGetterSetter('
 const notificationPosition = computed(defaultStore.makeGetterSetter('notificationPosition'));
 const notificationStackAxis = computed(defaultStore.makeGetterSetter('notificationStackAxis'));
 const showTimelineReplies = computed(defaultStore.makeGetterSetter('showTimelineReplies'));
-const useEnterToSend = computed(defaultStore.makeGetterSetter('useEnterToSend'));
-const postFormVisibilityHotkey = computed(defaultStore.makeGetterSetter('postFormVisibilityHotkey'));
 const newNoteReceivedNotificationBehavior = computed(defaultStore.makeGetterSetter('newNoteReceivedNotificationBehavior'));
 const fontSize = computed(defaultStore.makeGetterSetter('fontSize'));
 const collapseDefault = computed(defaultStore.makeGetterSetter('collapseDefault'));

packages/frontend/src/store.ts

@@ -351,6 +351,10 @@ export const defaultStore = markRaw(new Storage('base', {
 		where: 'device',
 		default: true,
 	},
+	showRenoteConfirmPopup: {
+		where: 'device',
+		default: true,
+	},
 	newNoteReceivedNotificationBehavior: {
 		where: 'device',
 		default: 'count' as 'default' | 'count' | 'none',