From 329995f4a3e1787ad19838c20d23d6b66d70fc0c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=B4=87=E5=B3=B0=20=E6=9C=94=E8=8F=AF?=
 <160555157+sakuhanight@users.noreply.github.com>
Date: Wed, 20 Nov 2024 20:08:26 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=E7=B5=B5=E6=96=87=E5=AD=97=E3=81=AE?=
 =?UTF-8?q?=E3=83=9D=E3=83=83=E3=83=97=E3=82=A2=E3=83=83=E3=83=97=E3=83=A1?=
 =?UTF-8?q?=E3=83=8B=E3=83=A5=E3=83=BC=E3=81=AB=E7=B7=A8=E9=9B=86=E3=82=92?=
 =?UTF-8?q?=E8=BF=BD=E5=8A=A0=20(#15004)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Mod: 絵文字のポップアップメニューに編集を追加

* fix: code styleの修正

* fix: code styleの修正

* fix

Signed-off-by: eternal-flame-AD <yume@yumechi.jp>
---
 .../src/components/global/MkCustomEmoji.vue   | 29 +++++++++++++++++--
 packages/frontend/src/pages/emojis.emoji.vue  | 28 ++++++++++++++++--
 2 files changed, 52 insertions(+), 5 deletions(-)

diff --git a/packages/frontend/src/components/global/MkCustomEmoji.vue b/packages/frontend/src/components/global/MkCustomEmoji.vue
index 66f82a7898..ec1d859080 100644
--- a/packages/frontend/src/components/global/MkCustomEmoji.vue
+++ b/packages/frontend/src/components/global/MkCustomEmoji.vue
@@ -25,17 +25,18 @@ SPDX-License-Identifier: AGPL-3.0-only
 </template>
 
 <script lang="ts" setup>
-import { computed, inject, ref } from 'vue';
+import { computed, defineAsyncComponent, inject, ref } from 'vue';
+import type { MenuItem } from '@/types/menu.js';
 import { getProxiedImageUrl, getStaticImageUrl } from '@/scripts/media-proxy.js';
 import { defaultStore } from '@/store.js';
 import { customEmojisMap } from '@/custom-emojis.js';
 import * as os from '@/os.js';
-import { misskeyApiGet } from '@/scripts/misskey-api.js';
+import { misskeyApi, misskeyApiGet } from '@/scripts/misskey-api.js';
 import { copyToClipboard } from '@/scripts/copy-to-clipboard.js';
 import * as sound from '@/scripts/sound.js';
 import { i18n } from '@/i18n.js';
 import MkCustomEmojiDetailedDialog from '@/components/MkCustomEmojiDetailedDialog.vue';
-import type { MenuItem } from '@/types/menu.js';
+import { $i } from '@/account.js';
 
 const props = defineProps<{
 	name: string;
@@ -125,9 +126,31 @@ function onClick(ev: MouseEvent) {
 			},
 		});
 
+		if ($i?.isModerator ?? $i?.isAdmin) {
+			menuItems.push({
+				text: i18n.ts.edit,
+				icon: 'ti ti-pencil',
+				action: async () => {
+					await edit(props.name);
+				},
+			});
+		}
+
 		os.popupMenu(menuItems, ev.currentTarget ?? ev.target);
 	}
 }
+
+async function edit(name: string) {
+	const emoji = await misskeyApi('emoji', {
+		name: name,
+	});
+	const { dispose } = os.popup(defineAsyncComponent(() => import('@/pages/emoji-edit-dialog.vue')), {
+		emoji: emoji,
+	}, {
+		closed: () => dispose(),
+	});
+}
+
 </script>
 
 <style lang="scss" module>
diff --git a/packages/frontend/src/pages/emojis.emoji.vue b/packages/frontend/src/pages/emojis.emoji.vue
index fcd22155b7..979d50966e 100644
--- a/packages/frontend/src/pages/emojis.emoji.vue
+++ b/packages/frontend/src/pages/emojis.emoji.vue
@@ -15,18 +15,22 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <script lang="ts" setup>
 import * as Misskey from 'misskey-js';
+import { defineAsyncComponent } from 'vue';
+import type { MenuItem } from '@/types/menu.js';
 import * as os from '@/os.js';
 import { misskeyApiGet } from '@/scripts/misskey-api.js';
 import { copyToClipboard } from '@/scripts/copy-to-clipboard.js';
 import { i18n } from '@/i18n.js';
 import MkCustomEmojiDetailedDialog from '@/components/MkCustomEmojiDetailedDialog.vue';
+import { $i } from '@/account.js';
 
 const props = defineProps<{
   emoji: Misskey.entities.EmojiSimple;
 }>();
 
 function menu(ev) {
-	os.popupMenu([{
+	const menuItems: MenuItem[] = [];
+	menuItems.push({
 		type: 'label',
 		text: ':' + props.emoji.name + ':',
 	}, {
@@ -48,8 +52,28 @@ function menu(ev) {
 				closed: () => dispose(),
 			});
 		},
-	}], ev.currentTarget ?? ev.target);
+	});
+
+	if ($i?.isModerator ?? $i?.isAdmin) {
+		menuItems.push({
+			text: i18n.ts.edit,
+			icon: 'ti ti-pencil',
+			action: () => {
+				edit(props.emoji);
+			},
+		});
+	}
+
+	os.popupMenu(menuItems, ev.currentTarget ?? ev.target);
 }
+
+const edit = async (emoji) => {
+	const { dispose } = os.popup(defineAsyncComponent(() => import('@/pages/emoji-edit-dialog.vue')), {
+		emoji: emoji,
+	}, {
+		closed: () => dispose(),
+	});
+};
 </script>
 
 <style lang="scss" module>