From d562f0c3c8b8946b9e23564c1358c17578d78191 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 16e7aa7cb..9a5d35d81 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 000000000..c2ecbcf3a
--- /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 1e4438a66..881105a23 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 8276e891c..a76c322bf 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",