From cb68498fcbe22bdd27746d2788fb713129aee53f Mon Sep 17 00:00:00 2001
From: amy bones <amy@spookygirl.boo>
Date: Thu, 30 Mar 2023 01:05:11 -0700
Subject: [PATCH] feat: add hidden hashtags management page

This simply adds a basic admin UI to blocklist some hashtags from displaying in
the trending widget. The facility existed already in the backend, but there was
no UI to manipulate the list save for executing raw SQL or API calls.
---
 locales/en-US.yml                            |  2 +
 packages/client/src/pages/admin/hashtags.vue | 54 ++++++++++++++++++++
 packages/client/src/pages/admin/index.vue    |  6 +++
 packages/client/src/router.ts                |  5 ++
 4 files changed, 67 insertions(+)
 create mode 100644 packages/client/src/pages/admin/hashtags.vue

diff --git a/locales/en-US.yml b/locales/en-US.yml
index 16e7aa7cba..9a5d35d81a 100644
--- a/locales/en-US.yml
+++ b/locales/en-US.yml
@@ -201,6 +201,8 @@ clearCachedFiles: "Clear cache"
 clearCachedFilesConfirm: "Are you sure that you want to delete all cached remote files?"
 blockedInstances: "Blocked Instances"
 blockedInstancesDescription: "List the hostnames of the instances that you want to block. Listed instances will no longer be able to communicate with this instance."
+hiddenTags: "Hidden Hashtags"
+hiddenTagsDescription: "List the hashtags (without the #) of the hashtags you wish to hide from trending and explore. Hidden hashtags are still discoverable via other means."
 muteAndBlock: "Mutes and Blocks"
 mutedUsers: "Muted users"
 blockedUsers: "Blocked users"
diff --git a/packages/client/src/pages/admin/hashtags.vue b/packages/client/src/pages/admin/hashtags.vue
new file mode 100644
index 0000000000..c2ecbcf3ab
--- /dev/null
+++ b/packages/client/src/pages/admin/hashtags.vue
@@ -0,0 +1,54 @@
+<template>
+	<MkStickyContainer>
+		<template #header>
+			<MkPageHeader :actions="headerActions" :tabs="headerTabs" />
+		</template>
+		<MkSpacer :content-max="700" :margin-min="16" :margin-max="32">
+			<FormSuspense :p="init">
+				<FormTextarea v-model="hiddenTags" class="_formBlock">
+					<span>{{ i18n.ts.hiddenTags }}</span>
+					<template #caption>{{ i18n.ts.hiddenTagsDescription }}</template>
+				</FormTextarea>
+
+				<FormButton primary class="_formBlock" @click="save"><i
+						class="ph-floppy-disk-back ph-bold ph-lg"></i>
+					{{ i18n.ts.save }}</FormButton>
+			</FormSuspense>
+		</MkSpacer>
+	</MkStickyContainer>
+</template>
+
+<script lang="ts" setup>
+import { } from 'vue';
+import FormButton from '@/components/MkButton.vue';
+import FormTextarea from '@/components/form/textarea.vue';
+import FormSuspense from '@/components/form/suspense.vue';
+import * as os from '@/os';
+import { fetchInstance } from '@/instance';
+import { i18n } from '@/i18n';
+import { definePageMetadata } from '@/scripts/page-metadata';
+
+let hiddenTags: string = $ref('');
+
+async function init() {
+	const meta = await os.api('admin/meta');
+	hiddenTags = meta.hiddenTags.join("\n");
+}
+
+function save() {
+	os.apiWithDialog('admin/update-meta', {
+		hiddenTags: hiddenTags.split("\n").map((h: string) => h.trim()) || [],
+	}).then(() => {
+		fetchInstance();
+	});
+}
+
+const headerActions = $computed(() => []);
+
+const headerTabs = $computed(() => []);
+
+definePageMetadata({
+	title: i18n.ts.hiddenTags,
+	icon: 'ph-hash ph-bold ph-lg',
+});
+</script>
diff --git a/packages/client/src/pages/admin/index.vue b/packages/client/src/pages/admin/index.vue
index 1e4438a66b..881105a234 100644
--- a/packages/client/src/pages/admin/index.vue
+++ b/packages/client/src/pages/admin/index.vue
@@ -181,6 +181,12 @@ const menuDef = $computed(() => [
 				to: "/admin/emojis",
 				active: currentPage?.route.name === "emojis",
 			},
+			{
+				icon: "ph-hash ph-bold ph-lg",
+				text: i18n.ts.hashtags,
+				to: "/admin/hashtags",
+				active: currentPage?.route.name === "hashtags",
+			},
 			{
 				icon: "ph-planet ph-bold ph-lg",
 				text: i18n.ts.federation,
diff --git a/packages/client/src/router.ts b/packages/client/src/router.ts
index 8276e891cc..a76c322bf1 100644
--- a/packages/client/src/router.ts
+++ b/packages/client/src/router.ts
@@ -450,6 +450,11 @@ export const routes = [
 				name: "users",
 				component: page(() => import("./pages/admin/users.vue")),
 			},
+			{
+				path: "/hashtags",
+				name: "hashtags",
+				component: page(() => import("./pages/admin/hashtags.vue")),
+			},
 			{
 				path: "/emojis",
 				name: "emojis",