diff --git a/packages/client/src/components/MkMenu.vue b/packages/client/src/components/MkMenu.vue
index a5262bddc1..9c733f4861 100644
--- a/packages/client/src/components/MkMenu.vue
+++ b/packages/client/src/components/MkMenu.vue
@@ -95,6 +95,9 @@
 					<MkAvatar :user="item.user" class="avatar" /><MkUserName
 						:user="item.user"
 					/>
+					// #v-ifdef VITE_CAPACITOR
+					[{{ item.user.host }}]
+					// #v-endif
 					<span v-if="item.indicate" class="indicator"
 						><i class="ph-circle ph-fill"></i
 					></span>
@@ -174,57 +177,17 @@
 			<span v-if="items2.length === 0" class="none item">
 				<span>{{ i18n.ts.none }}</span>
 			</span>
-			<span v-else-if="item.type === 'pending'" :tabindex="i" class="pending item">
-				<span><MkEllipsis/></span>
-			</span>
-			<MkA v-else-if="item.type === 'link'" :to="item.to" :tabindex="i" class="_button item" @click.passive="close(true)" @mouseenter.passive="onItemMouseEnter(item)" @mouseleave.passive="onItemMouseLeave(item)">
-				<i v-if="item.icon" class="ph-fw ph-lg" :class="item.icon"></i>
-				<span v-else-if="item.icons">
-					<i v-for="icon in item.icons" class="ph-fw ph-lg" :class="icon"></i>
-				</span>
-				<MkAvatar v-if="item.avatar" :user="item.avatar" class="avatar"/>
-				<span :style="item.textStyle || ''">{{ item.text }}</span>
-				<span v-if="item.indicate" class="indicator"><i class="ph-circle ph-fill"></i></span>
-			</MkA>
-			<a v-else-if="item.type === 'a'" :href="item.href" :target="item.target" :download="item.download" :tabindex="i" class="_button item" @click="close(true)" @mouseenter.passive="onItemMouseEnter(item)" @mouseleave.passive="onItemMouseLeave(item)">
-				<i v-if="item.icon" class="ph-fw ph-lg" :class="item.icon"></i>
-				<span v-else-if="item.icons">
-					<i v-for="icon in item.icons" class="ph-fw ph-lg" :class="icon"></i>
-				</span>
-				<span :style="item.textStyle || ''">{{ item.text }}</span>
-				<span v-if="item.indicate" class="indicator"><i class="ph-circle ph-fill"></i></span>
-			</a>
-			<button v-else-if="item.type === 'user' && !items.hidden" :tabindex="i" class="_button item" :class="{ active: item.active }" :disabled="item.active" @click="clicked(item.action, $event)" @mouseenter.passive="onItemMouseEnter(item)" @mouseleave.passive="onItemMouseLeave(item)">
-				<MkAvatar :user="item.user" class="avatar"/><MkUserName :user="item.user"/>
-				// #v-ifdef VITE_CAPACITOR
-				[{{ item.user.host }}]
-				// #v-endif
-				<span v-if="item.indicate" class="indicator"><i class="ph-circle ph-fill"></i></span>
-			</button>
-			<span v-else-if="item.type === 'switch'" :tabindex="i" class="item" @mouseenter.passive="onItemMouseEnter(item)" @mouseleave.passive="onItemMouseLeave(item)">
-				<FormSwitch v-model="item.ref" :disabled="item.disabled" class="form-switch" :style="item.textStyle || ''">{{ item.text }}</FormSwitch>
-			</span>
-			<button v-else-if="item.type === 'parent'" :tabindex="i" class="_button item parent" :class="{ childShowing: childShowingItem === item }" @mouseenter="showChildren(item, $event)">
-				<i v-if="item.icon" class="ph-fw ph-lg" :class="item.icon"></i>
-				<span v-else-if="item.icons">
-					<i v-for="icon in item.icons" class="ph-fw ph-lg" :class="icon"></i>
-				</span>
-				<span :style="item.textStyle || ''">{{ item.text }}</span>
-				<span class="caret"><i class="ph-caret-right ph-bold ph-lg ph-fw ph-lg"></i></span>
-			</button>
-			<button v-else-if="!item.hidden" :tabindex="i" class="_button item" :class="{ danger: item.danger, active: item.active }" :disabled="item.active" @click="clicked(item.action, $event)" @mouseenter.passive="onItemMouseEnter(item)" @mouseleave.passive="onItemMouseLeave(item)">
-				<i v-if="item.icon" class="ph-fw ph-lg" :class="item.icon"></i>
-				<span v-else-if="item.icons">
-					<i v-for="icon in item.icons" class="ph-fw ph-lg" :class="icon"></i>
-				</span>
-				<MkAvatar v-if="item.avatar" :user="item.avatar" class="avatar"/>
-				<span :style="item.textStyle || ''">{{ item.text }}</span>
-				<span v-if="item.indicate" class="indicator"><i class="ph-circle ph-fill"></i></span>
-			</button>
-		</template>
-		<span v-if="items2.length === 0" class="none item">
-			<span>{{ i18n.ts.none }}</span>
-		</span>
+		</div>
+		<div v-if="childMenu" class="child">
+			<XChild
+				ref="child"
+				:items="childMenu"
+				:target-element="childTarget"
+				:root-element="itemsEl"
+				showing
+				@actioned="childActioned"
+			/>
+		</div>
 	</div>
 </template>