From 343ae413aeaec4d6d169874cd63faf7866d7df7b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=81=BE=E3=81=A3=E3=81=A1=E3=82=83=E3=81=A8=E3=83=BC?=
 =?UTF-8?q?=E3=81=AB=E3=82=85?=
 <17376330+u1-liquid@users.noreply.github.com>
Date: Mon, 30 Oct 2023 08:50:21 +0900
Subject: [PATCH] =?UTF-8?q?=E7=B5=B5=E6=96=87=E5=AD=97=E3=83=94=E3=83=83?=
 =?UTF-8?q?=E3=82=AB=E3=83=BC=E3=81=AE=E3=82=AB=E3=83=86=E3=82=B4=E3=83=AA?=
 =?UTF-8?q?=E3=81=AE=E9=9A=8E=E5=B1=A4=E3=82=92=E8=A1=A8=E7=A4=BA=E3=81=99?=
 =?UTF-8?q?=E3=82=8B=E3=82=88=E3=81=86=E3=81=AB=E3=83=BB=E3=82=B5=E3=83=96?=
 =?UTF-8?q?=E3=82=AB=E3=83=86=E3=82=B4=E3=83=AA=E3=82=92=E7=B5=B5=E6=96=87?=
 =?UTF-8?q?=E5=AD=97=E3=82=88=E3=82=8A=E4=B8=8A=E3=81=AB=20(MisskeyIO#202)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/MkEmojiPicker.section.vue  | 26 +++++++++----------
 .../frontend/src/components/MkEmojiPicker.vue | 12 ++++++---
 2 files changed, 22 insertions(+), 16 deletions(-)

diff --git a/packages/frontend/src/components/MkEmojiPicker.section.vue b/packages/frontend/src/components/MkEmojiPicker.section.vue
index fda847bef..6f99fa920 100644
--- a/packages/frontend/src/components/MkEmojiPicker.section.vue
+++ b/packages/frontend/src/components/MkEmojiPicker.section.vue
@@ -29,6 +29,19 @@ SPDX-License-Identifier: AGPL-3.0-only
   <header class="_acrylic" @click="shown = !shown">
     <i class="toggle ti-fw" :class="shown ? 'ti ti-chevron-down' : 'ti ti-chevron-up'"></i> <slot></slot> (<i class="ti ti-folder"></i>:{{ customEmojiTree.length }} <i class="ti ti-icons"></i>:{{ emojis.length }})
   </header>
+  <div v-if="shown" style="padding-left: 9px;">
+    <MkEmojiPickerSection
+        v-for="child in customEmojiTree"
+        :key="`custom:${child.value}`"
+        :initialShown="initialShown"
+        :emojis="computed(() => customEmojis.filter(e => e.category === child.category).map(e => `:${e.name}:`))"
+        :hasChildSection="child.children.length !== 0"
+        :customEmojiTree="child.children"
+        @chosen="nestedChosen"
+    >
+      {{ child.value || i18n.ts.other }}
+    </MkEmojiPickerSection>
+  </div>
   <div v-if="shown" class="body">
     <button
         v-for="emoji in emojis"
@@ -42,19 +55,6 @@ SPDX-License-Identifier: AGPL-3.0-only
       <MkEmoji v-else class="emoji" :emoji="emoji" :normal="true"/>
     </button>
   </div>
-  <div v-if="shown" style="padding-left: 9px;">
-    <MkEmojiPickerSection
-        v-for="child in customEmojiTree"
-        :key="`custom:${child.value}`"
-        :initialShown="initialShown"
-        :emojis="computed(() => customEmojis.filter(e => e.category === child.category).map(e => `:${e.name}:`))"
-        :hasChildSection="child.children.length !== 0"
-        :customEmojiTree="child.children"
-        @chosen="nestedChosen"
-    >
-			{{ child.value || i18n.ts.other }}
-    </MkEmojiPickerSection>
-  </div>
 </section>
 </template>
 
diff --git a/packages/frontend/src/components/MkEmojiPicker.vue b/packages/frontend/src/components/MkEmojiPicker.vue
index 9d96ed3de..9ebd35217 100644
--- a/packages/frontend/src/components/MkEmojiPicker.vue
+++ b/packages/frontend/src/components/MkEmojiPicker.vue
@@ -156,13 +156,19 @@ const tab = ref<'index' | 'custom' | 'unicode' | 'tags'>('index');
 const customEmojiFolderRoot: CustomEmojiFolderTree = { value: "", category: "", children: [] };
 
 function parseAndMergeCategories(input: string, root: CustomEmojiFolderTree): CustomEmojiFolderTree {
-	const parts = input.split('/').map(p => p.trim());
+	const parts = (input && input !== 'null' ? input : '').split('/');
 	let currentNode: CustomEmojiFolderTree = root;
 
 	for (const part of parts) {
-		let existingNode = currentNode.children.find((node) => node.value === part);
+		const path = currentNode.value ? `${currentNode.value}/${part.trim()}` : part.trim();
+
+		let existingNode = currentNode.children.find((node) => node.value === path);
 		if (!existingNode) {
-			const newNode: CustomEmojiFolderTree = { value: part, category: input, children: [] };
+			const newNode: CustomEmojiFolderTree = {
+				value: path,
+				category: currentNode.category ? `${currentNode.category}/${part}` : part,
+				children: [],
+			};
 			currentNode.children.push(newNode);
 			existingNode = newNode;
 		}