feat (client): ability to specify search engine in search bar MFM

docs/changelog.md

@@ -1,3 +1,7 @@
+# Unreleased
+
+- add ability to specify the search engine used in the search bar MFM
+
 # v20240216
 
 - style changes in the web client (a770ef4314e21f17fdce1f19feb3758953b04486 ab39ff5954a392cc6688a02f1723e1702df5e35c 4eefd534d8150e2cd5cf31dddd327edceb5b84dc)

locales/en-US.yml

@@ -1167,6 +1167,8 @@ hideFollowButtons: "Hide follow buttons in a misclickable position"
 forMobile: "Mobile"
 replaceChatButtonWithAccountButton: "Replace chat button with account switch button"
 replaceWidgetsButtonWithReloadButton: "Replace widgets button with reload button"
+searchEngine: "Search engine used in search bar MFM"
+postSearch: "Post search on this server"
 
 _sensitiveMediaDetection:
   description: "Reduces the effort of server moderation through automatically recognizing

locales/ja-JP.yml

@@ -2016,3 +2016,5 @@ hideFollowButtons: "誤タップしやすい位置にあるフォローボタン
 forMobile: "携帯端末向け"
 replaceChatButtonWithAccountButton: "チャットのボタンをアカウント切り替えボタンに変更する"
 replaceWidgetsButtonWithReloadButton: "ウィジェットのボタンを再読み込みボタンに変更する"
+searchEngine: "検索のMFMで使用する検索エンジン"
+postSearch: "このサーバーの投稿検索"

packages/client/src/components/MkGoogle.vue

@@ -13,6 +13,7 @@ import { ref } from "vue";
 import { i18n } from "@/i18n";
 import { useRouter } from "@/router";
 import icon from "@/scripts/icon";
+import { defaultStore } from "@/store";
 
 const router = useRouter();
 
@@ -23,7 +24,9 @@ const props = defineProps<{
 const query = ref(props.q);
 
 const search = () => {
-	router.push(`/search?q=${query.value}`);
+	if (defaultStore.state.searchURL === "")
+		router.push(`/search?q=${query.value}`);
+	else window.open(`${defaultStore.state.searchURL}${query.value}`, "_blank");
 };
 </script>
 

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

@@ -138,6 +138,25 @@
 					{{ i18n.ts._serverDisconnectedBehavior.nothing }}
 				</option>
 			</FormSelect>
+
+			<FormSelect v-model="searchURL" class="_formBlock">
+				<template #label>{{ i18n.ts.searchEngine }}</template>
+				<option value="https://duckduckgo.com/?q=">
+					DuckDuckGo (duckduckgo.com)
+				</option>
+				<option value="https://searxng.site/?q=">
+					SearXNG (searxng.site)
+				</option>
+				<option value="https://araa.extravi.dev/search?q=">
+					Araa (araa.extravi.dev)
+				</option>
+				<option value="https://google.com/search?q=">
+					Google Search (google.com)
+				</option>
+				<option value="">
+					{{ i18n.ts.postSearch }}
+				</option>
+			</FormSelect>
 		</FormSection>
 
 		<FormSection>
@@ -470,6 +489,7 @@ const openServerInfo = computed(
 );
 const iconSet = computed(defaultStore.makeGetterSetter("iconSet"));
 const useEmojiCdn = computed(defaultStore.makeGetterSetter("useEmojiCdn"));
+const searchURL = computed(defaultStore.makeGetterSetter("searchURL"));
 
 // This feature (along with injectPromo) is currently disabled
 // function onChangeInjectFeaturedNote(v) {

packages/client/src/store.ts

@@ -397,6 +397,10 @@ export const defaultStore = markRaw(
 			where: "device",
 			default: false,
 		},
+		searchURL: {
+			where: "device",
+			default: "https://duckduckgo.com/?q=",
+		},
 	}),
 );