From 68fa43d97c28799bab494a3f3cd78332d42d937c Mon Sep 17 00:00:00 2001
From: naskya <m@naskya.net>
Date: Wed, 6 Mar 2024 14:34:29 +0900
Subject: [PATCH] feat (client): add a toggleable setting to show no alt
 warning

---
 docs/changelog.md                              |  1 +
 locales/en-US.yml                              |  2 ++
 locales/ja-JP.yml                              |  4 +++-
 locales/zh-TW.yml                              |  2 +-
 packages/client/src/components/MkDialog.vue    |  9 ++++-----
 packages/client/src/components/MkPostForm.vue  | 18 +++++++++++++++++-
 packages/client/src/pages/settings/general.vue |  6 ++++++
 .../src/pages/settings/preferences-backups.vue |  1 +
 packages/client/src/store.ts                   |  4 ++++
 9 files changed, 39 insertions(+), 8 deletions(-)

diff --git a/docs/changelog.md b/docs/changelog.md
index 111d554eb2..6d8abed428 100644
--- a/docs/changelog.md
+++ b/docs/changelog.md
@@ -9,6 +9,7 @@ Critical security updates are indicated by the :warning: icon.
 - Show unlisted posts from following users in antennas (similar to [Fedibird](https://github.com/fedibird/mastodon/tree/fedibird) and [kmyblue](https://github.com/kmycode/mastodon), unlisted posts from people you don't follow won't be shown)
 - Add ability to publish the Local and Global timelines on `/timeline` page
 - Add langage annotation to post contents (!10687)
+- Add a toggleable setting to show a warning when you attempt to post files without alt text
 - Fix bugs
 - Update documents
 
diff --git a/locales/en-US.yml b/locales/en-US.yml
index 1154802575..507dfce883 100644
--- a/locales/en-US.yml
+++ b/locales/en-US.yml
@@ -1215,6 +1215,8 @@ searchCwAndAlt: "Include content warnings and file descriptions"
 publishTimelines: "Publish timelines for visitors"
 publishTimelinesDescription: "If enabled, the Local and Global timeline will be shown
   on {url} even when signed out."
+noAltTextWarning: "Some attached file(s) have no description. Did you forget to write?"
+showNoAltTextWarning: "Show a warning if you attempt to post files without a description"
 
 _emojiModPerm:
   unauthorized: "None"
diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index 285d3f2d7e..af159bbf22 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -76,7 +76,7 @@ lists: "リスト"
 noLists: "リストはありません"
 note: "投稿"
 notes: "投稿"
-toPost: "投稿"
+toPost: "投稿する"
 following: "フォロー"
 followers: "フォロワー"
 followsYou: "フォローされています"
@@ -1021,6 +1021,8 @@ searchPostsWithFiles: "添付ファイルのある投稿のみ"
 searchCwAndAlt: "閲覧注意の注釈と添付ファイルの代替テキストも検索する"
 publishTimelines: "非ログインユーザーにもタイムラインを公開する"
 publishTimelinesDescription: "有効にすると、{url} でローカルタイムラインとグローバルタイムラインが公開されます。"
+noAltTextWarning: "説明が書かれていない添付ファイルがあります。書き忘れてはいませんか？"
+showNoAltTextWarning: "説明が書かれていない添付ファイルを投稿しようとした場合に警告する"
 
 _sensitiveMediaDetection:
   description: "機械学習を使って自動でセンシティブなメディアを検出し、モデレーションに役立てられます。サーバーの負荷が少し増えます。"
diff --git a/locales/zh-TW.yml b/locales/zh-TW.yml
index 79ece76e5c..0c1ce84abd 100644
--- a/locales/zh-TW.yml
+++ b/locales/zh-TW.yml
@@ -73,7 +73,7 @@ lists: "清單"
 noLists: "你沒有任何清單"
 note: "貼文"
 notes: "貼文"
-toPost: "貼文"
+toPost: "發貼文"
 following: "追隨中"
 followers: "追隨者"
 followsYou: "追隨你的人"
diff --git a/packages/client/src/components/MkDialog.vue b/packages/client/src/components/MkDialog.vue
index 3c9e0e3a8c..2dca900235 100644
--- a/packages/client/src/components/MkDialog.vue
+++ b/packages/client/src/components/MkDialog.vue
@@ -144,16 +144,17 @@
 						:disabled="okButtonDisabled"
 						@click="ok"
 						>{{
-							showCancelButton || input || select
+							okText ??
+							(showCancelButton || input || select
 								? i18n.ts.ok
-								: i18n.ts.gotIt
+								: i18n.ts.gotIt)
 						}}</MkButton
 					>
 					<MkButton
 						v-if="showCancelButton || input || select"
 						inline
 						@click="cancel"
-						>{{ i18n.ts.cancel }}</MkButton
+						>{{ cancelText ?? i18n.ts.cancel }}</MkButton
 					>
 				</div>
 				<div v-else>
@@ -194,13 +195,11 @@
 
 <script lang="ts" setup>
 import { computed, onBeforeUnmount, onMounted, ref, shallowRef } from "vue";
-import { acct } from "firefish-js";
 import MkModal from "@/components/MkModal.vue";
 import MkButton from "@/components/MkButton.vue";
 import MkInput from "@/components/form/input.vue";
 import MkTextarea from "@/components/form/textarea.vue";
 import MkSelect from "@/components/form/select.vue";
-import * as os from "@/os";
 import { i18n } from "@/i18n";
 import iconClass from "@/scripts/icon";
 
diff --git a/packages/client/src/components/MkPostForm.vue b/packages/client/src/components/MkPostForm.vue
index 82d3ccf2aa..2ecc25d665 100644
--- a/packages/client/src/components/MkPostForm.vue
+++ b/packages/client/src/components/MkPostForm.vue
@@ -380,7 +380,7 @@ const showBigPostButton = defaultStore.state.showBigPostButton;
 
 const posting = ref(false);
 const text = ref(props.initialText ?? "");
-const files = ref(props.initialFiles ?? []);
+const files = ref(props.initialFiles ?? ([] as entities.DriveFile[]));
 const poll = ref<{
 	choices: string[];
 	multiple: boolean;
@@ -1020,6 +1020,22 @@ function deleteDraft() {
 }
 
 async function post() {
+	if (
+		defaultStore.state.showNoAltTextWarning &&
+		files.value.some((f) => f.comment == null || f.comment.length === 0)
+	) {
+		// "canceled" means "post anyway"
+		const { canceled } = await os.confirm({
+			type: "warning",
+			text: i18n.ts.noAltTextWarning,
+			okText: i18n.ts.goBack,
+			cancelText: i18n.ts.toPost,
+			isPlaintext: true,
+		});
+
+		if (!canceled) return;
+	}
+
 	const processedText = preprocess(text.value);
 
 	let postData = {
diff --git a/packages/client/src/pages/settings/general.vue b/packages/client/src/pages/settings/general.vue
index 13ae6218f9..558386708a 100644
--- a/packages/client/src/pages/settings/general.vue
+++ b/packages/client/src/pages/settings/general.vue
@@ -121,6 +121,9 @@
 			<FormSwitch v-model="openServerInfo" class="_formBlock">{{
 				i18n.ts.openServerInfo
 			}}</FormSwitch>
+			<FormSwitch v-model="showNoAltTextWarning" class="_formBlock">{{
+				i18n.ts.showNoAltTextWarning
+			}}</FormSwitch>
 
 			<FormSelect v-model="serverDisconnectedBehavior" class="_formBlock">
 				<template #label>{{ i18n.ts.whenServerDisconnected }}</template>
@@ -524,6 +527,9 @@ const enablePullToRefresh = computed(
 const pullToRefreshThreshold = computed(
 	defaultStore.makeGetterSetter("pullToRefreshThreshold"),
 );
+const showNoAltTextWarning = computed(
+	defaultStore.makeGetterSetter("showNoAltTextWarning"),
+);
 
 // This feature (along with injectPromo) is currently disabled
 // function onChangeInjectFeaturedNote(v) {
diff --git a/packages/client/src/pages/settings/preferences-backups.vue b/packages/client/src/pages/settings/preferences-backups.vue
index 9e8efa478c..c1d4314d48 100644
--- a/packages/client/src/pages/settings/preferences-backups.vue
+++ b/packages/client/src/pages/settings/preferences-backups.vue
@@ -124,6 +124,7 @@ const defaultStoreSaveKeys: (keyof (typeof defaultStore)["state"])[] = [
 	"enableTimelineStreaming",
 	"enablePullToRefresh",
 	"pullToRefreshThreshold",
+	"showNoAltTextWarning",
 ];
 const coldDeviceStorageSaveKeys: (keyof typeof ColdDeviceStorage.default)[] = [
 	"lightTheme",
diff --git a/packages/client/src/store.ts b/packages/client/src/store.ts
index 0adaa9401b..33f3fc6e2c 100644
--- a/packages/client/src/store.ts
+++ b/packages/client/src/store.ts
@@ -428,6 +428,10 @@ export const defaultStore = markRaw(
 			where: "device",
 			default: 150,
 		},
+		showNoAltTextWarning: {
+			where: "account",
+			default: true,
+		},
 	}),
 );