Add *captcha settings guide

2 files changed, 40 insertions, 0 deletions

diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index de44d89a05..12b28019d9 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -107,6 +107,7 @@ customEmojis: "カスタム絵文字"
 emojiName: "絵文字名"
 emojiUrl: "絵文字画像URL"
 addEmoji: "絵文字を追加"
+settingGuide: "おすすめ設定"
 cacheRemoteFiles: "リモートのファイルをキャッシュする"
 cacheRemoteFilesDescription: "この設定を無効にすると、リモートファイルをキャッシュせず直リンクするようになります。サーバーのストレージを節約できますが、サムネイルが生成されないので通信量が増加します。"
 flagAsBot: "Botとして設定"
@@ -307,6 +308,7 @@ recaptcha: "reCAPTCHA"
 enableRecaptcha: "reCAPTCHAを有効にする"
 recaptchaSiteKey: "サイトキー"
 recaptchaSecretKey: "シークレットキー"
+avoidMultiCaptchaConfirm: "単一のCaptchaのみの使用が推奨されます。他のCaptchaを無効にしますか？キャンセルして複数のCaptchaを有効化したままにすることも可能です。"
 antennas: "アンテナ"
 manageAntennas: "アンテナの管理"
 name: "名前"
diff --git a/src/client/pages/instance/settings.vue b/src/client/pages/instance/settings.vue
index 1292316b22..008d6ef1ab 100644
--- a/src/client/pages/instance/settings.vue
+++ b/src/client/pages/instance/settings.vue
@@ -239,6 +239,7 @@ export default Vue.extend({
 
 	data() {
 		return {
+			loaded: false,
 			url,
 			proxyAccount: null,
 			proxyAccountId: null,
@@ -298,6 +299,41 @@ export default Vue.extend({
 		},
 	},
 
+	watch: {
+		enableHcaptcha(enabled) {
+			if (enabled && this.loaded && this.enableRecaptcha) {
+				this.$root.dialog({
+					type: 'question', // warning だと間違って cancel するかもしれない
+					showCancelButton: true,
+					title: this.$t('settingGuide'),
+					text: this.$t('avoidMultiCaptchaConfirm'),
+				}).then(({ canceled }) => {
+					if (canceled) {
+						return;
+					}
+
+					this.enableRecaptcha = false;
+				});
+			}
+		},
+		enableRecaptcha(enabled) {
+			if (enabled && this.loaded && this.enableHcaptcha) {
+				this.$root.dialog({
+					type: 'question', // warning だと間違って cancel するかもしれない
+					showCancelButton: true,
+					title: this.$t('settingGuide'),
+					text: this.$t('avoidMultiCaptchaConfirm'),
+				}).then(({ canceled }) => {
+					if (canceled) {
+						return;
+					}
+
+					this.enableHcaptcha = false;
+				});
+			}
+		}
+	},
+
 	created() {
 		this.name = this.meta.name;
 		this.description = this.meta.description;
@@ -352,6 +388,8 @@ export default Vue.extend({
 				this.proxyAccount = proxyAccount;
 			});
 		}
+
+		this.loaded = true;
 	},
 
 	mounted() {