From 6ca83c541d6286d2cdf4a725444a6d70ea786aa0 Mon Sep 17 00:00:00 2001
From: kakkokari-gtyih <67428053+kakkokari-gtyih@users.noreply.github.com>
Date: Sat, 24 Jan 2026 01:17:52 +0900
Subject: [PATCH 1/4] =?UTF-8?q?refactor(frontend):=20=E3=83=AD=E3=83=BC?=
 =?UTF-8?q?=E3=83=AB=E3=83=9D=E3=83=AA=E3=82=B7=E3=83=BC=E3=82=A8=E3=83=87?=
 =?UTF-8?q?=E3=82=A3=E3=82=BF=E3=82=92=E7=B5=B1=E5=90=88?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../frontend/src/pages/admin/roles.editor.vue | 847 ++----------------
 .../admin/roles.policy-editor.folder.vue      |  87 ++
 .../src/pages/admin/roles.policy-editor.vue   | 464 ++++++++++
 packages/frontend/src/pages/admin/roles.vue   | 331 +------
 4 files changed, 611 insertions(+), 1118 deletions(-)
 create mode 100644 packages/frontend/src/pages/admin/roles.policy-editor.folder.vue
 create mode 100644 packages/frontend/src/pages/admin/roles.policy-editor.vue

diff --git a/packages/frontend/src/pages/admin/roles.editor.vue b/packages/frontend/src/pages/admin/roles.editor.vue
index 7de973a394..272deaa67a 100644
--- a/packages/frontend/src/pages/admin/roles.editor.vue
+++ b/packages/frontend/src/pages/admin/roles.editor.vue
@@ -79,770 +79,13 @@ SPDX-License-Identifier: AGPL-3.0-only
 				<template #prefix><i class="ti ti-search"></i></template>
 			</MkInput>
 
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.rateLimitFactor, 'rateLimitFactor'])">
-				<template #label>{{ i18n.ts._role._options.rateLimitFactor }}</template>
-				<template #suffix>
-					<span v-if="role.policies.rateLimitFactor.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ `${Math.floor(role.policies.rateLimitFactor.value * 100)}%` }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.rateLimitFactor)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.rateLimitFactor.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkRange :modelValue="role.policies.rateLimitFactor.value * 100" :min="0" :max="400" :step="10" :textConverter="(v) => `${v}%`" @update:modelValue="v => role.policies.rateLimitFactor.value = (v / 100)">
-						<template #label>{{ i18n.ts._role._options.rateLimitFactor }}</template>
-						<template #caption>{{ i18n.ts._role._options.descriptionOfRateLimitFactor }}</template>
-					</MkRange>
-					<MkRange v-model="role.policies.rateLimitFactor.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.gtlAvailable, 'gtlAvailable'])">
-				<template #label>{{ i18n.ts._role._options.gtlAvailable }}</template>
-				<template #suffix>
-					<span v-if="role.policies.gtlAvailable.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.gtlAvailable.value ? i18n.ts.yes : i18n.ts.no }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.gtlAvailable)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.gtlAvailable.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkSwitch v-model="role.policies.gtlAvailable.value" :disabled="role.policies.gtlAvailable.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts.enable }}</template>
-					</MkSwitch>
-					<MkRange v-model="role.policies.gtlAvailable.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.ltlAvailable, 'ltlAvailable'])">
-				<template #label>{{ i18n.ts._role._options.ltlAvailable }}</template>
-				<template #suffix>
-					<span v-if="role.policies.ltlAvailable.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.ltlAvailable.value ? i18n.ts.yes : i18n.ts.no }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.ltlAvailable)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.ltlAvailable.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkSwitch v-model="role.policies.ltlAvailable.value" :disabled="role.policies.ltlAvailable.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts.enable }}</template>
-					</MkSwitch>
-					<MkRange v-model="role.policies.ltlAvailable.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.canPublicNote, 'canPublicNote'])">
-				<template #label>{{ i18n.ts._role._options.canPublicNote }}</template>
-				<template #suffix>
-					<span v-if="role.policies.canPublicNote.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.canPublicNote.value ? i18n.ts.yes : i18n.ts.no }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.canPublicNote)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.canPublicNote.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkSwitch v-model="role.policies.canPublicNote.value" :disabled="role.policies.canPublicNote.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts.enable }}</template>
-					</MkSwitch>
-					<MkRange v-model="role.policies.canPublicNote.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.chatAvailability, 'chatAvailability'])">
-				<template #label>{{ i18n.ts._role._options.chatAvailability }}</template>
-				<template #suffix>
-					<span v-if="role.policies.chatAvailability.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.chatAvailability.value === 'available' ? i18n.ts.yes : role.policies.chatAvailability.value === 'readonly' ? i18n.ts.readonly : i18n.ts.no }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.chatAvailability)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.chatAvailability.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkSelect
-						v-model="role.policies.chatAvailability.value"
-						:items="[
-							{ label: i18n.ts.enabled, value: 'available' },
-							{ label: i18n.ts.readonly, value: 'readonly' },
-							{ label: i18n.ts.disabled, value: 'unavailable' },
-						]"
-						:disabled="role.policies.chatAvailability.useDefault"
-						:readonly="readonly"
-					>
-						<template #label>{{ i18n.ts.enable }}</template>
-					</MkSelect>
-					<MkRange v-model="role.policies.chatAvailability.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.mentionMax, 'mentionLimit'])">
-				<template #label>{{ i18n.ts._role._options.mentionMax }}</template>
-				<template #suffix>
-					<span v-if="role.policies.mentionLimit.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.mentionLimit.value }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.mentionLimit)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.mentionLimit.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkInput v-model="role.policies.mentionLimit.value" :disabled="role.policies.mentionLimit.useDefault" type="number" :readonly="readonly">
-					</MkInput>
-					<MkRange v-model="role.policies.mentionLimit.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.canInvite, 'canInvite'])">
-				<template #label>{{ i18n.ts._role._options.canInvite }}</template>
-				<template #suffix>
-					<span v-if="role.policies.canInvite.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.canInvite.value ? i18n.ts.yes : i18n.ts.no }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.canInvite)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.canInvite.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkSwitch v-model="role.policies.canInvite.value" :disabled="role.policies.canInvite.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts.enable }}</template>
-					</MkSwitch>
-					<MkRange v-model="role.policies.canInvite.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.inviteLimit, 'inviteLimit'])">
-				<template #label>{{ i18n.ts._role._options.inviteLimit }}</template>
-				<template #suffix>
-					<span v-if="role.policies.inviteLimit.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.inviteLimit.value }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.inviteLimit)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.inviteLimit.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkInput v-model="role.policies.inviteLimit.value" :disabled="role.policies.inviteLimit.useDefault" type="number" :readonly="readonly">
-					</MkInput>
-					<MkRange v-model="role.policies.inviteLimit.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.inviteLimitCycle, 'inviteLimitCycle'])">
-				<template #label>{{ i18n.ts._role._options.inviteLimitCycle }}</template>
-				<template #suffix>
-					<span v-if="role.policies.inviteLimitCycle.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.inviteLimitCycle.value + i18n.ts._time.minute }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.inviteLimitCycle)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.inviteLimitCycle.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkInput v-model="role.policies.inviteLimitCycle.value" :disabled="role.policies.inviteLimitCycle.useDefault" type="number" :readonly="readonly">
-						<template #suffix>{{ i18n.ts._time.minute }}</template>
-					</MkInput>
-					<MkRange v-model="role.policies.inviteLimitCycle.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.inviteExpirationTime, 'inviteExpirationTime'])">
-				<template #label>{{ i18n.ts._role._options.inviteExpirationTime }}</template>
-				<template #suffix>
-					<span v-if="role.policies.inviteExpirationTime.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.inviteExpirationTime.value + i18n.ts._time.minute }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.inviteExpirationTime)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.inviteExpirationTime.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkInput v-model="role.policies.inviteExpirationTime.value" :disabled="role.policies.inviteExpirationTime.useDefault" type="number" :readonly="readonly">
-						<template #suffix>{{ i18n.ts._time.minute }}</template>
-					</MkInput>
-					<MkRange v-model="role.policies.inviteExpirationTime.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.canManageCustomEmojis, 'canManageCustomEmojis'])">
-				<template #label>{{ i18n.ts._role._options.canManageCustomEmojis }}</template>
-				<template #suffix>
-					<span v-if="role.policies.canManageCustomEmojis.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.canManageCustomEmojis.value ? i18n.ts.yes : i18n.ts.no }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.canManageCustomEmojis)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.canManageCustomEmojis.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkSwitch v-model="role.policies.canManageCustomEmojis.value" :disabled="role.policies.canManageCustomEmojis.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts.enable }}</template>
-					</MkSwitch>
-					<MkRange v-model="role.policies.canManageCustomEmojis.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.canManageAvatarDecorations, 'canManageAvatarDecorations'])">
-				<template #label>{{ i18n.ts._role._options.canManageAvatarDecorations }}</template>
-				<template #suffix>
-					<span v-if="role.policies.canManageAvatarDecorations.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.canManageAvatarDecorations.value ? i18n.ts.yes : i18n.ts.no }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.canManageAvatarDecorations)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.canManageAvatarDecorations.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkSwitch v-model="role.policies.canManageAvatarDecorations.value" :disabled="role.policies.canManageAvatarDecorations.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts.enable }}</template>
-					</MkSwitch>
-					<MkRange v-model="role.policies.canManageAvatarDecorations.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.canSearchNotes, 'canSearchNotes'])">
-				<template #label>{{ i18n.ts._role._options.canSearchNotes }}</template>
-				<template #suffix>
-					<span v-if="role.policies.canSearchNotes.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.canSearchNotes.value ? i18n.ts.yes : i18n.ts.no }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.canSearchNotes)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.canSearchNotes.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkSwitch v-model="role.policies.canSearchNotes.value" :disabled="role.policies.canSearchNotes.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts.enable }}</template>
-					</MkSwitch>
-					<MkRange v-model="role.policies.canSearchNotes.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.canSearchUsers, 'canSearchUsers'])">
-				<template #label>{{ i18n.ts._role._options.canSearchUsers }}</template>
-				<template #suffix>
-					<span v-if="role.policies.canSearchUsers.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.canSearchUsers.value ? i18n.ts.yes : i18n.ts.no }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.canSearchUsers)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.canSearchUsers.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkSwitch v-model="role.policies.canSearchUsers.value" :disabled="role.policies.canSearchUsers.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts.enable }}</template>
-					</MkSwitch>
-					<MkRange v-model="role.policies.canSearchUsers.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.canUseTranslator, 'canUseTranslator'])">
-				<template #label>{{ i18n.ts._role._options.canUseTranslator }}</template>
-				<template #suffix>
-					<span v-if="role.policies.canUseTranslator.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.canUseTranslator.value ? i18n.ts.yes : i18n.ts.no }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.canUseTranslator)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.canUseTranslator.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkSwitch v-model="role.policies.canUseTranslator.value" :disabled="role.policies.canUseTranslator.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts.enable }}</template>
-					</MkSwitch>
-					<MkRange v-model="role.policies.canUseTranslator.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.driveCapacity, 'driveCapacityMb'])">
-				<template #label>{{ i18n.ts._role._options.driveCapacity }}</template>
-				<template #suffix>
-					<span v-if="role.policies.driveCapacityMb.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.driveCapacityMb.value + 'MB' }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.driveCapacityMb)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.driveCapacityMb.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkInput v-model="role.policies.driveCapacityMb.value" :disabled="role.policies.driveCapacityMb.useDefault" type="number" :readonly="readonly">
-						<template #suffix>MB</template>
-					</MkInput>
-					<MkRange v-model="role.policies.driveCapacityMb.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.maxFileSize, 'maxFileSizeMb'])">
-				<template #label>{{ i18n.ts._role._options.maxFileSize }}</template>
-				<template #suffix>
-					<span v-if="role.policies.maxFileSizeMb.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.maxFileSizeMb.value + 'MB' }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.maxFileSizeMb)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.maxFileSizeMb.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkInput v-model="role.policies.maxFileSizeMb.value" :disabled="role.policies.maxFileSizeMb.useDefault" type="number" :readonly="readonly">
-						<template #suffix>MB</template>
-						<template #caption>
-							<div><i class="ti ti-alert-triangle" style="color: var(--MI_THEME-warn);"></i> {{ i18n.ts._role._options.maxFileSize_caption }}</div>
-						</template>
-					</MkInput>
-					<MkRange v-model="role.policies.maxFileSizeMb.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.uploadableFileTypes, 'uploadableFileTypes'])">
-				<template #label>{{ i18n.ts._role._options.uploadableFileTypes }}</template>
-				<template #suffix>
-					<span v-if="role.policies.uploadableFileTypes.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>...</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.uploadableFileTypes)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.uploadableFileTypes.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkTextarea :modelValue="role.policies.uploadableFileTypes.value.join('\n')" :disabled="role.policies.uploadableFileTypes.useDefault" :readonly="readonly" @update:modelValue="role.policies.uploadableFileTypes.value = $event.split('\n')">
-						<template #caption>
-							<div>{{ i18n.ts._role._options.uploadableFileTypes_caption }}</div>
-							<div><i class="ti ti-alert-triangle" style="color: var(--MI_THEME-warn);"></i> {{ i18n.tsx._role._options.uploadableFileTypes_caption2({ x: 'application/octet-stream' }) }}</div>
-						</template>
-					</MkTextarea>
-					<MkRange v-model="role.policies.uploadableFileTypes.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.alwaysMarkNsfw, 'alwaysMarkNsfw'])">
-				<template #label>{{ i18n.ts._role._options.alwaysMarkNsfw }}</template>
-				<template #suffix>
-					<span v-if="role.policies.alwaysMarkNsfw.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.alwaysMarkNsfw.value ? i18n.ts.yes : i18n.ts.no }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.alwaysMarkNsfw)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.alwaysMarkNsfw.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkSwitch v-model="role.policies.alwaysMarkNsfw.value" :disabled="role.policies.alwaysMarkNsfw.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts.enable }}</template>
-					</MkSwitch>
-					<MkRange v-model="role.policies.alwaysMarkNsfw.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.canUpdateBioMedia, 'canUpdateBioMedia'])">
-				<template #label>{{ i18n.ts._role._options.canUpdateBioMedia }}</template>
-				<template #suffix>
-					<span v-if="role.policies.canUpdateBioMedia.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.canUpdateBioMedia.value ? i18n.ts.yes : i18n.ts.no }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.canUpdateBioMedia)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.canUpdateBioMedia.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkSwitch v-model="role.policies.canUpdateBioMedia.value" :disabled="role.policies.canUpdateBioMedia.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts.enable }}</template>
-					</MkSwitch>
-					<MkRange v-model="role.policies.canUpdateBioMedia.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.pinMax, 'pinLimit'])">
-				<template #label>{{ i18n.ts._role._options.pinMax }}</template>
-				<template #suffix>
-					<span v-if="role.policies.pinLimit.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.pinLimit.value }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.pinLimit)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.pinLimit.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkInput v-model="role.policies.pinLimit.value" :disabled="role.policies.pinLimit.useDefault" type="number" :readonly="readonly">
-					</MkInput>
-					<MkRange v-model="role.policies.pinLimit.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.antennaMax, 'antennaLimit'])">
-				<template #label>{{ i18n.ts._role._options.antennaMax }}</template>
-				<template #suffix>
-					<span v-if="role.policies.antennaLimit.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.antennaLimit.value }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.antennaLimit)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.antennaLimit.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkInput v-model="role.policies.antennaLimit.value" :disabled="role.policies.antennaLimit.useDefault" type="number" :readonly="readonly">
-					</MkInput>
-					<MkRange v-model="role.policies.antennaLimit.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.wordMuteMax, 'wordMuteLimit'])">
-				<template #label>{{ i18n.ts._role._options.wordMuteMax }}</template>
-				<template #suffix>
-					<span v-if="role.policies.wordMuteLimit.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.wordMuteLimit.value }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.wordMuteLimit)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.wordMuteLimit.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkInput v-model="role.policies.wordMuteLimit.value" :disabled="role.policies.wordMuteLimit.useDefault" type="number" :readonly="readonly">
-						<template #suffix>chars</template>
-					</MkInput>
-					<MkRange v-model="role.policies.wordMuteLimit.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.webhookMax, 'webhookLimit'])">
-				<template #label>{{ i18n.ts._role._options.webhookMax }}</template>
-				<template #suffix>
-					<span v-if="role.policies.webhookLimit.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.webhookLimit.value }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.webhookLimit)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.webhookLimit.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkInput v-model="role.policies.webhookLimit.value" :disabled="role.policies.webhookLimit.useDefault" type="number" :readonly="readonly">
-					</MkInput>
-					<MkRange v-model="role.policies.webhookLimit.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.clipMax, 'clipLimit'])">
-				<template #label>{{ i18n.ts._role._options.clipMax }}</template>
-				<template #suffix>
-					<span v-if="role.policies.clipLimit.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.clipLimit.value }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.clipLimit)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.clipLimit.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkInput v-model="role.policies.clipLimit.value" :disabled="role.policies.clipLimit.useDefault" type="number" :readonly="readonly">
-					</MkInput>
-					<MkRange v-model="role.policies.clipLimit.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.noteEachClipsMax, 'noteEachClipsLimit'])">
-				<template #label>{{ i18n.ts._role._options.noteEachClipsMax }}</template>
-				<template #suffix>
-					<span v-if="role.policies.noteEachClipsLimit.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.noteEachClipsLimit.value }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.noteEachClipsLimit)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.noteEachClipsLimit.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkInput v-model="role.policies.noteEachClipsLimit.value" :disabled="role.policies.noteEachClipsLimit.useDefault" type="number" :readonly="readonly">
-					</MkInput>
-					<MkRange v-model="role.policies.noteEachClipsLimit.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.userListMax, 'userListLimit'])">
-				<template #label>{{ i18n.ts._role._options.userListMax }}</template>
-				<template #suffix>
-					<span v-if="role.policies.userListLimit.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.userListLimit.value }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.userListLimit)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.userListLimit.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkInput v-model="role.policies.userListLimit.value" :disabled="role.policies.userListLimit.useDefault" type="number" :readonly="readonly">
-					</MkInput>
-					<MkRange v-model="role.policies.userListLimit.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.userEachUserListsMax, 'userEachUserListsLimit'])">
-				<template #label>{{ i18n.ts._role._options.userEachUserListsMax }}</template>
-				<template #suffix>
-					<span v-if="role.policies.userEachUserListsLimit.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.userEachUserListsLimit.value }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.userEachUserListsLimit)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.userEachUserListsLimit.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkInput v-model="role.policies.userEachUserListsLimit.value" :disabled="role.policies.userEachUserListsLimit.useDefault" type="number" :readonly="readonly">
-					</MkInput>
-					<MkRange v-model="role.policies.userEachUserListsLimit.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.canHideAds, 'canHideAds'])">
-				<template #label>{{ i18n.ts._role._options.canHideAds }}</template>
-				<template #suffix>
-					<span v-if="role.policies.canHideAds.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.canHideAds.value ? i18n.ts.yes : i18n.ts.no }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.canHideAds)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.canHideAds.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkSwitch v-model="role.policies.canHideAds.value" :disabled="role.policies.canHideAds.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts.enable }}</template>
-					</MkSwitch>
-					<MkRange v-model="role.policies.canHideAds.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.avatarDecorationLimit, 'avatarDecorationLimit'])">
-				<template #label>{{ i18n.ts._role._options.avatarDecorationLimit }}</template>
-				<template #suffix>
-					<span v-if="role.policies.avatarDecorationLimit.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.avatarDecorationLimit.value }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.avatarDecorationLimit)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.avatarDecorationLimit.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkInput v-model="role.policies.avatarDecorationLimit.value" type="number" :min="0" :max="16" @update:modelValue="updateAvatarDecorationLimit">
-						<template #label>{{ i18n.ts._role._options.avatarDecorationLimit }}</template>
-					</MkInput>
-					<MkRange v-model="role.policies.avatarDecorationLimit.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.canImportAntennas, 'canImportAntennas'])">
-				<template #label>{{ i18n.ts._role._options.canImportAntennas }}</template>
-				<template #suffix>
-					<span v-if="role.policies.canImportAntennas.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.canImportAntennas.value ? i18n.ts.yes : i18n.ts.no }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.canImportAntennas)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.canImportAntennas.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkSwitch v-model="role.policies.canImportAntennas.value" :disabled="role.policies.canImportAntennas.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts.enable }}</template>
-					</MkSwitch>
-					<MkRange v-model="role.policies.canImportAntennas.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.canImportBlocking, 'canImportBlocking'])">
-				<template #label>{{ i18n.ts._role._options.canImportBlocking }}</template>
-				<template #suffix>
-					<span v-if="role.policies.canImportBlocking.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.canImportBlocking.value ? i18n.ts.yes : i18n.ts.no }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.canImportBlocking)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.canImportBlocking.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkSwitch v-model="role.policies.canImportBlocking.value" :disabled="role.policies.canImportBlocking.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts.enable }}</template>
-					</MkSwitch>
-					<MkRange v-model="role.policies.canImportBlocking.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.canImportFollowing, 'canImportFollowing'])">
-				<template #label>{{ i18n.ts._role._options.canImportFollowing }}</template>
-				<template #suffix>
-					<span v-if="role.policies.canImportFollowing.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.canImportFollowing.value ? i18n.ts.yes : i18n.ts.no }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.canImportFollowing)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.canImportFollowing.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkSwitch v-model="role.policies.canImportFollowing.value" :disabled="role.policies.canImportFollowing.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts.enable }}</template>
-					</MkSwitch>
-					<MkRange v-model="role.policies.canImportFollowing.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.canImportMuting, 'canImportMuting'])">
-				<template #label>{{ i18n.ts._role._options.canImportMuting }}</template>
-				<template #suffix>
-					<span v-if="role.policies.canImportMuting.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.canImportMuting.value ? i18n.ts.yes : i18n.ts.no }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.canImportMuting)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.canImportMuting.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkSwitch v-model="role.policies.canImportMuting.value" :disabled="role.policies.canImportMuting.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts.enable }}</template>
-					</MkSwitch>
-					<MkRange v-model="role.policies.canImportMuting.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.canImportUserLists, 'canImportUserLists'])">
-				<template #label>{{ i18n.ts._role._options.canImportUserLists }}</template>
-				<template #suffix>
-					<span v-if="role.policies.canImportUserLists.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.canImportUserLists.value ? i18n.ts.yes : i18n.ts.no }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.canImportUserLists)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.canImportUserLists.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkSwitch v-model="role.policies.canImportUserLists.value" :disabled="role.policies.canImportUserLists.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts.enable }}</template>
-					</MkSwitch>
-					<MkRange v-model="role.policies.canImportUserLists.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.noteDraftLimit, 'noteDraftLimit'])">
-				<template #label>{{ i18n.ts._role._options.noteDraftLimit }}</template>
-				<template #suffix>
-					<span v-if="role.policies.noteDraftLimit.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.noteDraftLimit.value }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.noteDraftLimit)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.noteDraftLimit.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkInput v-model="role.policies.noteDraftLimit.value" :disabled="role.policies.noteDraftLimit.useDefault" type="number" :readonly="readonly">
-					</MkInput>
-					<MkRange v-model="role.policies.noteDraftLimit.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.scheduledNoteLimit, 'scheduledNoteLimit'])">
-				<template #label>{{ i18n.ts._role._options.scheduledNoteLimit }}</template>
-				<template #suffix>
-					<span v-if="role.policies.scheduledNoteLimit.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.scheduledNoteLimit.value }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.scheduledNoteLimit)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.scheduledNoteLimit.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkInput v-model="role.policies.scheduledNoteLimit.value" :disabled="role.policies.scheduledNoteLimit.useDefault" type="number" :readonly="readonly">
-					</MkInput>
-					<MkRange v-model="role.policies.scheduledNoteLimit.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
-
-			<MkFolder v-if="matchQuery([i18n.ts._role._options.watermarkAvailable, 'watermarkAvailable'])">
-				<template #label>{{ i18n.ts._role._options.watermarkAvailable }}</template>
-				<template #suffix>
-					<span v-if="role.policies.watermarkAvailable.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
-					<span v-else>{{ role.policies.watermarkAvailable.value ? i18n.ts.yes : i18n.ts.no }}</span>
-					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.watermarkAvailable)"></i></span>
-				</template>
-				<div class="_gaps">
-					<MkSwitch v-model="role.policies.watermarkAvailable.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
-					</MkSwitch>
-					<MkSwitch v-model="role.policies.watermarkAvailable.value" :disabled="role.policies.watermarkAvailable.useDefault" :readonly="readonly">
-						<template #label>{{ i18n.ts.enable }}</template>
-					</MkSwitch>
-					<MkRange v-model="role.policies.watermarkAvailable.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
-						<template #label>{{ i18n.ts._role.priority }}</template>
-					</MkRange>
-				</div>
-			</MkFolder>
+			<XPolicyEditor
+				:isBaseRole="false"
+				:roleQuery="q"
+				:readonly="readonly"
+				v-model:rolePolicies="rolePolicyValues"
+				v-model:policiesMeta="rolePolicyMeta"
+			/>
 		</div>
 	</FormSlot>
 </div>
@@ -860,11 +103,12 @@ import MkSelect from '@/components/MkSelect.vue';
 import MkTextarea from '@/components/MkTextarea.vue';
 import MkFolder from '@/components/MkFolder.vue';
 import MkSwitch from '@/components/MkSwitch.vue';
-import MkRange from '@/components/MkRange.vue';
 import FormSlot from '@/components/form/slot.vue';
+import XPolicyEditor from './roles.policy-editor.vue';
 import { i18n } from '@/i18n.js';
 import { instance } from '@/instance.js';
 import { deepClone } from '@/utility/clone.js';
+import type { PolicyMeta } from './roles.policy-editor.vue';
 
 type RoleLike = Pick<Misskey.entities.Role, 'name' | 'description' | 'isAdministrator' | 'isModerator' | 'color' | 'iconUrl' | 'target' | 'isPublic' | 'isExplorable' | 'asBadge' | 'canEditMembersByModerator' | 'displayOrder' | 'preserveAssignmentOnMoveAccount'> & {
 	id?: Misskey.entities.Role['id'] | null;
@@ -881,24 +125,52 @@ const props = defineProps<{
 	readonly?: boolean;
 }>();
 
-const role = ref(deepClone(props.modelValue));
-
-// fill missing policy
-for (const ROLE_POLICY of Misskey.rolePolicies) {
-	if (role.value.policies[ROLE_POLICY] == null) {
-		role.value.policies[ROLE_POLICY] = {
-			useDefault: true,
-			priority: 0,
-			value: instance.policies[ROLE_POLICY],
-		};
+const role = ref((() => {
+	const base = deepClone(props.modelValue);
+	// fill missing policy
+	for (const ROLE_POLICY of Misskey.rolePolicies) {
+		if (base.policies[ROLE_POLICY] == null) {
+			base.policies[ROLE_POLICY] = {
+				useDefault: true,
+				priority: 0,
+				value: instance.policies[ROLE_POLICY],
+			};
+		}
 	}
-}
-
-function updateAvatarDecorationLimit(value: string | number) {
-	const numValue = Number(value);
-	const limited = Math.min(16, Math.max(0, numValue));
-	role.value.policies.avatarDecorationLimit.value = limited;
-}
+	return base;
+})());
+const rolePolicyValues = computed<any>({
+	get: () => {
+		return Object.fromEntries(
+			Object.entries(role.value.policies).map(([k, v]) => [k, (v as { value: unknown }).value]),
+		);
+	},
+	set: (v) => {
+		for (const [k, val] of Object.entries(v)) {
+			if (role.value.policies[k] != null) {
+				role.value.policies[k].value = val;
+			}
+		}
+	},
+});
+const rolePolicyMeta = computed<any>({
+	get: () => {
+		return Object.fromEntries(
+			Object.entries(role.value.policies).map(([k, v]) => [k, {
+				useDefault: (v as PolicyMeta).useDefault,
+				priority: (v as PolicyMeta).priority,
+			}]),
+		);
+	},
+	set: (v: Record<string, PolicyMeta>) => {
+		for (const [k, val] of Object.entries(v)) {
+			if (role.value.policies[k] != null) {
+				role.value.policies[k].useDefault = val.useDefault;
+				role.value.policies[k].priority = val.priority;
+			}
+		}
+	},
+});
 
 const rolePermissionDef = [
 	{ label: i18n.ts.normalUser, value: 'normal' },
@@ -916,17 +188,6 @@ const rolePermission = computed<GetMkSelectValueTypesFromDef<typeof rolePermissi
 
 const q = ref('');
 
-function getPriorityIcon(option: { priority: number }): string {
-	if (option.priority === 2) return 'ti ti-arrows-up';
-	if (option.priority === 1) return 'ti ti-arrow-narrow-up';
-	return 'ti ti-point';
-}
-
-function matchQuery(keywords: string[]): boolean {
-	if (q.value.trim().length === 0) return true;
-	return keywords.some(keyword => keyword.toLowerCase().includes(q.value.toLowerCase()));
-}
-
 const save = throttle(100, () => {
 	const data = {
 		name: role.value.name,
diff --git a/packages/frontend/src/pages/admin/roles.policy-editor.folder.vue b/packages/frontend/src/pages/admin/roles.policy-editor.folder.vue
new file mode 100644
index 0000000000..8c940a53cd
--- /dev/null
+++ b/packages/frontend/src/pages/admin/roles.policy-editor.folder.vue
@@ -0,0 +1,87 @@
+<!--
+SPDX-FileCopyrightText: syuilo and misskey-project
+SPDX-License-Identifier: AGPL-3.0-only
+-->
+
+<template>
+	<MkFolder>
+		<template #label><slot name="label"></slot></template>
+		<template #suffix>
+			<template v-if="isBaseRole">
+				<span><slot name="valueText"></slot></span>
+			</template>
+			<template v-else-if="rolePolicyMetaModel != null">
+				<span v-if="rolePolicyMetaModel.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
+				<span v-else><slot name="valueText"></slot></span>
+				<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(rolePolicyMetaModel.priority)"></i></span>
+			</template>
+		</template>
+		<div class="_gaps">
+			<MkSwitch v-if="!isBaseRole && rolePolicyMetaModel != null" v-model="rolePolicyMetaModel.useDefault" :disabled="readonly">
+				<template #label>{{ i18n.ts._role.useBaseValue }}</template>
+			</MkSwitch>
+			<div>
+				<slot :disabled="readonly || (!isBaseRole && rolePolicyMetaModel?.useDefault)"></slot>
+			</div>
+			<MkRange v-if="!isBaseRole && rolePolicyMetaModel != null" v-model="rolePolicyMetaModel.priority" :min="0" :max="2" :step="1" easing :textConverter="priroityRangeTextConverter" :disabled="readonly">
+				<template #label>{{ i18n.ts._role.priority }}</template>
+			</MkRange>
+		</div>
+	</MkFolder>
+</template>
+
+<script setup lang="ts">
+import { ref, watch } from 'vue';
+import MkFolder from '@/components/MkFolder.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
+import MkRange from '@/components/MkRange.vue';
+import { i18n } from '@/i18n.js';
+import type { PolicyMeta } from './roles.policy-editor.vue';
+
+const props = defineProps<{
+	isBaseRole: boolean;
+	policyMeta?: PolicyMeta | null;
+	readonly?: boolean;
+}>();
+
+const emit = defineEmits<{
+	(ev: 'update:policyMeta', v: PolicyMeta): void;
+}>();
+
+const rolePolicyMetaModel = ref<PolicyMeta | null>(null);
+watch(() => props.policyMeta, (v) => {
+	if (v != null) {
+		rolePolicyMetaModel.value = v;
+	} else {
+		rolePolicyMetaModel.value = null;
+	}
+}, { immediate: true, deep: true });
+watch(rolePolicyMetaModel, (v) => {
+	if (v != null) {
+		emit('update:policyMeta', v);
+	}
+}, { deep: true });
+
+function getPriorityIcon(priority: number): string {
+	if (priority === 2) return 'ti ti-arrows-up';
+	if (priority === 1) return 'ti ti-arrow-narrow-up';
+	return 'ti ti-point';
+}
+
+function priroityRangeTextConverter(v: number): string {
+	if (v === 0) return i18n.ts._role._priority.low;
+	if (v === 1) return i18n.ts._role._priority.middle;
+	if (v === 2) return i18n.ts._role._priority.high;
+	return '';
+}
+</script>
+
+<style lang="scss" module>
+.useDefaultLabel {
+	opacity: 0.7;
+}
+
+.priorityIndicator {
+	margin-left: 8px;
+}
+</style>
diff --git a/packages/frontend/src/pages/admin/roles.policy-editor.vue b/packages/frontend/src/pages/admin/roles.policy-editor.vue
new file mode 100644
index 0000000000..0f9cf1ed9e
--- /dev/null
+++ b/packages/frontend/src/pages/admin/roles.policy-editor.vue
@@ -0,0 +1,464 @@
+<!--
+SPDX-FileCopyrightText: syuilo and misskey-project
+SPDX-License-Identifier: AGPL-3.0-only
+-->
+
+<template>
+	<div class="_gaps_s">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.rateLimitFactor, 'rateLimitFactor'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.rateLimitFactor">
+			<template #label>{{ i18n.ts._role._options.rateLimitFactor }}</template>
+			<template #valueText>{{ Math.floor(valuesModel.rateLimitFactor * 100) }}%</template>
+			<template #default="{ disabled }">
+				<MkRange :modelValue="valuesModel.rateLimitFactor * 100" :disabled="disabled" :min="30" :max="300" :step="10" :textConverter="(v) => `${v}%`" @update:modelValue="v => valuesModel.rateLimitFactor = (v / 100)">
+					<template #caption>{{ i18n.ts._role._options.descriptionOfRateLimitFactor }}</template>
+				</MkRange>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.gtlAvailable, 'gtlAvailable'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.gtlAvailable">
+			<template #label>{{ i18n.ts._role._options.gtlAvailable }}</template>
+			<template #valueText>{{ valuesModel.gtlAvailable ? i18n.ts.yes : i18n.ts.no }}</template>
+			<template #default="{ disabled }">
+				<MkSwitch v-model="valuesModel.gtlAvailable" :disabled="disabled">
+					<template #label>{{ i18n.ts.enable }}</template>
+				</MkSwitch>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.ltlAvailable, 'ltlAvailable'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.ltlAvailable">
+			<template #label>{{ i18n.ts._role._options.ltlAvailable }}</template>
+			<template #valueText>{{ valuesModel.ltlAvailable ? i18n.ts.yes : i18n.ts.no }}</template>
+			<template #default="{ disabled }">
+				<MkSwitch v-model="valuesModel.ltlAvailable" :disabled="disabled">
+					<template #label>{{ i18n.ts.enable }}</template>
+				</MkSwitch>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canPublicNote, 'canPublicNote'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canPublicNote">
+			<template #label>{{ i18n.ts._role._options.canPublicNote }}</template>
+			<template #valueText>{{ valuesModel.canPublicNote ? i18n.ts.yes : i18n.ts.no }}</template>
+			<template #default="{ disabled }">
+				<MkSwitch v-model="valuesModel.canPublicNote" :disabled="disabled">
+					<template #label>{{ i18n.ts.enable }}</template>
+				</MkSwitch>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.chatAvailability, 'chatAvailability'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.chatAvailability">
+			<template #label>{{ i18n.ts._role._options.chatAvailability }}</template>
+			<template #valueText>{{ valuesModel.chatAvailability === 'available' ? i18n.ts.yes : valuesModel.chatAvailability === 'readonly' ? i18n.ts.readonly : i18n.ts.no }}</template>
+			<template #default="{ disabled }">
+				<MkSelect
+					v-model="valuesModel.chatAvailability"
+					:disabled="disabled"
+					:items="[
+						{ label: i18n.ts.enabled, value: 'available' },
+						{ label: i18n.ts.readonly, value: 'readonly' },
+						{ label: i18n.ts.disabled, value: 'unavailable' },
+					]"
+				>
+					<template #label>{{ i18n.ts.enable }}</template>
+				</MkSelect>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.mentionMax, 'mentionLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.mentionLimit">
+			<template #label>{{ i18n.ts._role._options.mentionMax }}</template>
+			<template #valueText>{{ valuesModel.mentionLimit }}</template>
+			<template #default="{ disabled }">
+				<MkInput v-model="valuesModel.mentionLimit" type="number" :disabled="disabled">
+				</MkInput>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canInvite, 'canInvite'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canInvite">
+			<template #label>{{ i18n.ts._role._options.canInvite }}</template>
+			<template #valueText>{{ valuesModel.canInvite ? i18n.ts.yes : i18n.ts.no }}</template>
+			<template #default="{ disabled }">
+				<MkSwitch v-model="valuesModel.canInvite" :disabled="disabled">
+					<template #label>{{ i18n.ts.enable }}</template>
+				</MkSwitch>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.inviteLimit, 'inviteLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.inviteLimit">
+			<template #label>{{ i18n.ts._role._options.inviteLimit }}</template>
+			<template #valueText>{{ valuesModel.inviteLimit }}</template>
+			<template #default="{ disabled }">
+				<MkInput v-model="valuesModel.inviteLimit" type="number" :disabled="disabled">
+				</MkInput>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.inviteLimitCycle, 'inviteLimitCycle'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.inviteLimitCycle">
+			<template #label>{{ i18n.ts._role._options.inviteLimitCycle }}</template>
+			<template #valueText>{{ valuesModel.inviteLimitCycle + i18n.ts._time.minute }}</template>
+			<template #default="{ disabled }">
+				<MkInput v-model="valuesModel.inviteLimitCycle" type="number" :disabled="disabled">
+					<template #suffix>{{ i18n.ts._time.minute }}</template>
+				</MkInput>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.inviteExpirationTime, 'inviteExpirationTime'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.inviteExpirationTime">
+			<template #label>{{ i18n.ts._role._options.inviteExpirationTime }}</template>
+			<template #valueText>{{ valuesModel.inviteExpirationTime + i18n.ts._time.minute }}</template>
+			<template #default="{ disabled }">
+				<MkInput v-model="valuesModel.inviteExpirationTime" type="number" :disabled="disabled">
+					<template #suffix>{{ i18n.ts._time.minute }}</template>
+				</MkInput>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canManageAvatarDecorations, 'canManageAvatarDecorations'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canManageAvatarDecorations">
+			<template #label>{{ i18n.ts._role._options.canManageAvatarDecorations }}</template>
+			<template #valueText>{{ valuesModel.canManageAvatarDecorations ? i18n.ts.yes : i18n.ts.no }}</template>
+			<template #default="{ disabled }">
+				<MkSwitch v-model="valuesModel.canManageAvatarDecorations" :disabled="disabled">
+					<template #label>{{ i18n.ts.enable }}</template>
+				</MkSwitch>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canManageCustomEmojis, 'canManageCustomEmojis'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canManageCustomEmojis">
+			<template #label>{{ i18n.ts._role._options.canManageCustomEmojis }}</template>
+			<template #valueText>{{ valuesModel.canManageCustomEmojis ? i18n.ts.yes : i18n.ts.no }}</template>
+			<template #default="{ disabled }">
+				<MkSwitch v-model="valuesModel.canManageCustomEmojis" :disabled="disabled">
+					<template #label>{{ i18n.ts.enable }}</template>
+				</MkSwitch>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canSearchNotes, 'canSearchNotes'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canSearchNotes">
+			<template #label>{{ i18n.ts._role._options.canSearchNotes }}</template>
+			<template #valueText>{{ valuesModel.canSearchNotes ? i18n.ts.yes : i18n.ts.no }}</template>
+			<template #default="{ disabled }">
+				<MkSwitch v-model="valuesModel.canSearchNotes" :disabled="disabled">
+					<template #label>{{ i18n.ts.enable }}</template>
+				</MkSwitch>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canSearchUsers, 'canSearchUsers'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canSearchUsers">
+			<template #label>{{ i18n.ts._role._options.canSearchUsers }}</template>
+			<template #valueText>{{ valuesModel.canSearchUsers ? i18n.ts.yes : i18n.ts.no }}</template>
+			<template #default="{ disabled }">
+				<MkSwitch v-model="valuesModel.canSearchUsers" :disabled="disabled">
+					<template #label>{{ i18n.ts.enable }}</template>
+				</MkSwitch>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canUseTranslator, 'canUseTranslator'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canUseTranslator">
+			<template #label>{{ i18n.ts._role._options.canUseTranslator }}</template>
+			<template #valueText>{{ valuesModel.canUseTranslator ? i18n.ts.yes : i18n.ts.no }}</template>
+			<template #default="{ disabled }">
+				<MkSwitch v-model="valuesModel.canUseTranslator" :disabled="disabled">
+					<template #label>{{ i18n.ts.enable }}</template>
+				</MkSwitch>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.driveCapacity, 'driveCapacityMb'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.driveCapacityMb">
+			<template #label>{{ i18n.ts._role._options.driveCapacity }}</template>
+			<template #valueText>{{ valuesModel.driveCapacityMb }}MB</template>
+			<template #default="{ disabled }">
+				<MkInput v-model="valuesModel.driveCapacityMb" type="number" :disabled="disabled">
+					<template #suffix>MB</template>
+				</MkInput>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.maxFileSize, 'maxFileSizeMb'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.maxFileSizeMb">
+			<template #label>{{ i18n.ts._role._options.maxFileSize }}</template>
+			<template #valueText>{{ valuesModel.maxFileSizeMb }}MB</template>
+			<template #default="{ disabled }">
+				<MkInput v-model="valuesModel.maxFileSizeMb" type="number" :disabled="disabled">
+					<template #suffix>MB</template>
+					<template #caption>
+						<div><i class="ti ti-alert-triangle" style="color: var(--MI_THEME-warn);"></i> {{ i18n.ts._role._options.maxFileSize_caption }}</div>
+					</template>
+				</MkInput>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.uploadableFileTypes, 'uploadableFileTypes'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.uploadableFileTypes">
+			<template #label>{{ i18n.ts._role._options.uploadableFileTypes }}</template>
+			<template #valueText>...</template>
+			<template #default="{ disabled }">
+				<MkTextarea :modelValue="valuesModel.uploadableFileTypes.join('\n')" :disabled="disabled" @update:modelValue="v => valuesModel.uploadableFileTypes = v.split('\n')">
+					<template #caption>
+						<div>{{ i18n.ts._role._options.uploadableFileTypes_caption }}</div>
+						<div><i class="ti ti-alert-triangle" style="color: var(--MI_THEME-warn);"></i> {{ i18n.tsx._role._options.uploadableFileTypes_caption2({ x: 'application/octet-stream' }) }}</div>
+					</template>
+				</MkTextarea>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.alwaysMarkNsfw, 'alwaysMarkNsfw'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.alwaysMarkNsfw">
+			<template #label>{{ i18n.ts._role._options.alwaysMarkNsfw }}</template>
+			<template #valueText>{{ valuesModel.alwaysMarkNsfw ? i18n.ts.yes : i18n.ts.no }}</template>
+			<template #default="{ disabled }">
+				<MkSwitch v-model="valuesModel.alwaysMarkNsfw" :disabled="disabled">
+					<template #label>{{ i18n.ts.enable }}</template>
+				</MkSwitch>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canUpdateBioMedia, 'canUpdateBioMedia'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canUpdateBioMedia">
+			<template #label>{{ i18n.ts._role._options.canUpdateBioMedia }}</template>
+			<template #valueText>{{ valuesModel.canUpdateBioMedia ? i18n.ts.yes : i18n.ts.no }}</template>
+			<template #default="{ disabled }">
+				<MkSwitch v-model="valuesModel.canUpdateBioMedia" :disabled="disabled">
+					<template #label>{{ i18n.ts.enable }}</template>
+				</MkSwitch>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.pinMax, 'pinLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.pinLimit">
+			<template #label>{{ i18n.ts._role._options.pinMax }}</template>
+			<template #valueText>{{ valuesModel.pinLimit }}</template>
+			<template #default="{ disabled }">
+				<MkInput v-model="valuesModel.pinLimit" type="number" :disabled="disabled">
+				</MkInput>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.antennaMax, 'antennaLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.antennaLimit">
+			<template #label>{{ i18n.ts._role._options.antennaMax }}</template>
+			<template #valueText>{{ valuesModel.antennaLimit }}</template>
+			<template #default="{ disabled }">
+				<MkInput v-model="valuesModel.antennaLimit" type="number" :disabled="disabled">
+				</MkInput>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.wordMuteMax, 'wordMuteLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.wordMuteLimit">
+			<template #label>{{ i18n.ts._role._options.wordMuteMax }}</template>
+			<template #valueText>{{ valuesModel.wordMuteLimit }}</template>
+			<template #default="{ disabled }">
+				<MkInput v-model="valuesModel.wordMuteLimit" type="number" :disabled="disabled">
+					<template #suffix>chars</template>
+				</MkInput>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.webhookMax, 'webhookLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.webhookLimit">
+			<template #label>{{ i18n.ts._role._options.webhookMax }}</template>
+			<template #valueText>{{ valuesModel.webhookLimit }}</template>
+			<template #default="{ disabled }">
+				<MkInput v-model="valuesModel.webhookLimit" type="number" :disabled="disabled">
+				</MkInput>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.clipMax, 'clipLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.clipLimit">
+			<template #label>{{ i18n.ts._role._options.clipMax }}</template>
+			<template #valueText>{{ valuesModel.clipLimit }}</template>
+			<template #default="{ disabled }">
+				<MkInput v-model="valuesModel.clipLimit" type="number" :disabled="disabled">
+				</MkInput>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.noteEachClipsMax, 'noteEachClipsLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.noteEachClipsLimit">
+			<template #label>{{ i18n.ts._role._options.noteEachClipsMax }}</template>
+			<template #valueText>{{ valuesModel.noteEachClipsLimit }}</template>
+			<template #default="{ disabled }">
+				<MkInput v-model="valuesModel.noteEachClipsLimit" type="number" :disabled="disabled">
+				</MkInput>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.userListMax, 'userListLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.userListLimit">
+			<template #label>{{ i18n.ts._role._options.userListMax }}</template>
+			<template #valueText>{{ valuesModel.userListLimit }}</template>
+			<template #default="{ disabled }">
+				<MkInput v-model="valuesModel.userListLimit" type="number" :disabled="disabled">
+				</MkInput>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.userEachUserListsMax, 'userEachUserListsLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.userEachUserListsLimit">
+			<template #label>{{ i18n.ts._role._options.userEachUserListsMax }}</template>
+			<template #valueText>{{ valuesModel.userEachUserListsLimit }}</template>
+			<template #default="{ disabled }">
+				<MkInput v-model="valuesModel.userEachUserListsLimit" type="number" :disabled="disabled">
+				</MkInput>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canHideAds, 'canHideAds'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canHideAds">
+			<template #label>{{ i18n.ts._role._options.canHideAds }}</template>
+			<template #valueText>{{ valuesModel.canHideAds ? i18n.ts.yes : i18n.ts.no }}</template>
+			<template #default="{ disabled }">
+				<MkSwitch v-model="valuesModel.canHideAds" :disabled="disabled">
+					<template #label>{{ i18n.ts.enable }}</template>
+				</MkSwitch>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.avatarDecorationLimit, 'avatarDecorationLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.avatarDecorationLimit">
+			<template #label>{{ i18n.ts._role._options.avatarDecorationLimit }}</template>
+			<template #valueText>{{ valuesModel.avatarDecorationLimit }}</template>
+			<template #default="{ disabled }">
+				<MkInput v-model="avatarDecorationLimit" type="number" :disabled="disabled" :min="0" :max="16" @update:modelValue="updateAvatarDecorationLimit">
+				</MkInput>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canImportAntennas, 'canImportAntennas'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canImportAntennas">
+			<template #label>{{ i18n.ts._role._options.canImportAntennas }}</template>
+			<template #valueText>{{ valuesModel.canImportAntennas ? i18n.ts.yes : i18n.ts.no }}</template>
+			<template #default="{ disabled }">
+				<MkSwitch v-model="valuesModel.canImportAntennas" :disabled="disabled">
+					<template #label>{{ i18n.ts.enable }}</template>
+				</MkSwitch>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canImportBlocking, 'canImportBlocking'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canImportBlocking">
+			<template #label>{{ i18n.ts._role._options.canImportBlocking }}</template>
+			<template #valueText>{{ valuesModel.canImportBlocking ? i18n.ts.yes : i18n.ts.no }}</template>
+			<template #default="{ disabled }">
+				<MkSwitch v-model="valuesModel.canImportBlocking" :disabled="disabled">
+					<template #label>{{ i18n.ts.enable }}</template>
+				</MkSwitch>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canImportFollowing, 'canImportFollowing'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canImportFollowing">
+			<template #label>{{ i18n.ts._role._options.canImportFollowing }}</template>
+			<template #valueText>{{ valuesModel.canImportFollowing ? i18n.ts.yes : i18n.ts.no }}</template>
+			<template #default="{ disabled }">
+				<MkSwitch v-model="valuesModel.canImportFollowing" :disabled="disabled">
+					<template #label>{{ i18n.ts.enable }}</template>
+				</MkSwitch>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canImportMuting, 'canImportMuting'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canImportMuting">
+			<template #label>{{ i18n.ts._role._options.canImportMuting }}</template>
+			<template #valueText>{{ valuesModel.canImportMuting ? i18n.ts.yes : i18n.ts.no }}</template>
+			<template #default="{ disabled }">
+				<MkSwitch v-model="valuesModel.canImportMuting" :disabled="disabled">
+					<template #label>{{ i18n.ts.enable }}</template>
+				</MkSwitch>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canImportUserLists, 'canImportUserList'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canImportUserLists">
+			<template #label>{{ i18n.ts._role._options.canImportUserLists }}</template>
+			<template #valueText>{{ valuesModel.canImportUserLists ? i18n.ts.yes : i18n.ts.no }}</template>
+			<template #default="{ disabled }">
+				<MkSwitch v-model="valuesModel.canImportUserLists" :disabled="disabled">
+					<template #label>{{ i18n.ts.enable }}</template>
+				</MkSwitch>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.noteDraftLimit, 'noteDraftLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.noteDraftLimit">
+			<template #label>{{ i18n.ts._role._options.noteDraftLimit }}</template>
+			<template #valueText>{{ valuesModel.noteDraftLimit }}</template>
+			<template #default="{ disabled }">
+				<MkInput v-model="valuesModel.noteDraftLimit" type="number" :disabled="disabled" :min="0">
+				</MkInput>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.scheduledNoteLimit, 'scheduledNoteLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.scheduledNoteLimit">
+			<template #label>{{ i18n.ts._role._options.scheduledNoteLimit }}</template>
+			<template #valueText>{{ valuesModel.scheduledNoteLimit }}</template>
+			<template #default="{ disabled }">
+				<MkInput v-model="valuesModel.scheduledNoteLimit" type="number" :disabled="disabled" :min="0">
+				</MkInput>
+			</template>
+		</XFolder>
+
+		<XFolder v-if="matchQuery([i18n.ts._role._options.watermarkAvailable, 'watermarkAvailable'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.watermarkAvailable">
+			<template #label>{{ i18n.ts._role._options.watermarkAvailable }}</template>
+			<template #valueText>{{ valuesModel.watermarkAvailable ? i18n.ts.yes : i18n.ts.no }}</template>
+			<template #default="{ disabled }">
+				<MkSwitch v-model="valuesModel.watermarkAvailable" :disabled="disabled">
+					<template #label>{{ i18n.ts.enable }}</template>
+				</MkSwitch>
+			</template>
+		</XFolder>
+	</div>
+</template>
+
+<script lang="ts">
+import * as Misskey from 'misskey-js';
+
+export type PolicyMeta = {
+	useDefault: boolean;
+	priority: number;
+};
+
+type PolicyMetaRecord = {
+	[K in keyof Misskey.entities.RolePolicies]: PolicyMeta;
+};
+</script>
+
+<script setup lang="ts">
+import { computed, ref, watch } from 'vue';
+import { i18n } from '@/i18n.js';
+import XFolder from './roles.policy-editor.folder.vue';
+
+import MkInput from '@/components/MkInput.vue';
+import MkTextarea from '@/components/MkTextarea.vue';
+import MkRange from '@/components/MkRange.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
+import MkSelect from '@/components/MkSelect.vue';
+
+const props = defineProps<{
+	isBaseRole: boolean;
+	rolePolicies: Misskey.entities.RolePolicies;
+	policiesMeta?: PolicyMetaRecord;
+	roleQuery?: string;
+	readonly?: boolean;
+}>();
+
+const emit = defineEmits<{
+	(event: 'update:rolePolicies', value: Misskey.entities.RolePolicies): void;
+	(event: 'update:policiesMeta', value: PolicyMetaRecord): void;
+}>();
+
+const valuesModel = ref<Misskey.entities.RolePolicies>(props.rolePolicies);
+watch(() => props.rolePolicies, (newVal) => {
+	valuesModel.value = newVal;
+}, { deep: true });
+watch(valuesModel, (newVal) => {
+	emit('update:rolePolicies', newVal);
+}, { deep: true });
+
+function createDefaultPolicyMeta() {
+	return Object.fromEntries(Object.keys(Misskey.rolePolicies).map(key => [key, { useDefault: true, priority: 0 }])) as PolicyMetaRecord;
+}
+const policyMetaModel = ref<PolicyMetaRecord>(props.policiesMeta ?? createDefaultPolicyMeta());
+watch(() => props.policiesMeta, (newVal) => {
+	policyMetaModel.value = newVal ?? createDefaultPolicyMeta();
+}, { deep: true });
+watch(policyMetaModel, (newVal) => {
+	if (newVal == null) return;
+	emit('update:policiesMeta', newVal);
+}, { deep: true });
+
+function matchQuery(keywords: string[]): boolean {
+	if (props.roleQuery == null || props.roleQuery.trim().length === 0) return true;
+	return keywords.some(keyword => keyword.toLowerCase().includes(props.roleQuery!.toLowerCase()));
+}
+
+const avatarDecorationLimit = computed({
+	get: () => Math.min(16, Math.max(0, valuesModel.value.avatarDecorationLimit)),
+	set: (value) => {
+		valuesModel.value.avatarDecorationLimit = Math.min(Number(value), 16);
+	},
+});
+
+function updateAvatarDecorationLimit(value: string | number) {
+	avatarDecorationLimit.value = Number(value);
+}
+</script>
diff --git a/packages/frontend/src/pages/admin/roles.vue b/packages/frontend/src/pages/admin/roles.vue
index e65a3c5ba8..8bec0ed9b8 100644
--- a/packages/frontend/src/pages/admin/roles.vue
+++ b/packages/frontend/src/pages/admin/roles.vue
@@ -17,310 +17,11 @@ SPDX-License-Identifier: AGPL-3.0-only
 						<template #prefix><i class="ti ti-search"></i></template>
 					</MkInput>
 
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.rateLimitFactor, 'rateLimitFactor'])">
-						<template #label>{{ i18n.ts._role._options.rateLimitFactor }}</template>
-						<template #suffix>{{ Math.floor(policies.rateLimitFactor * 100) }}%</template>
-						<MkRange :modelValue="policies.rateLimitFactor * 100" :min="30" :max="300" :step="10" :textConverter="(v) => `${v}%`" @update:modelValue="v => policies.rateLimitFactor = (v / 100)">
-							<template #caption>{{ i18n.ts._role._options.descriptionOfRateLimitFactor }}</template>
-						</MkRange>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.gtlAvailable, 'gtlAvailable'])">
-						<template #label>{{ i18n.ts._role._options.gtlAvailable }}</template>
-						<template #suffix>{{ policies.gtlAvailable ? i18n.ts.yes : i18n.ts.no }}</template>
-						<MkSwitch v-model="policies.gtlAvailable">
-							<template #label>{{ i18n.ts.enable }}</template>
-						</MkSwitch>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.ltlAvailable, 'ltlAvailable'])">
-						<template #label>{{ i18n.ts._role._options.ltlAvailable }}</template>
-						<template #suffix>{{ policies.ltlAvailable ? i18n.ts.yes : i18n.ts.no }}</template>
-						<MkSwitch v-model="policies.ltlAvailable">
-							<template #label>{{ i18n.ts.enable }}</template>
-						</MkSwitch>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.canPublicNote, 'canPublicNote'])">
-						<template #label>{{ i18n.ts._role._options.canPublicNote }}</template>
-						<template #suffix>{{ policies.canPublicNote ? i18n.ts.yes : i18n.ts.no }}</template>
-						<MkSwitch v-model="policies.canPublicNote">
-							<template #label>{{ i18n.ts.enable }}</template>
-						</MkSwitch>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.chatAvailability, 'chatAvailability'])">
-						<template #label>{{ i18n.ts._role._options.chatAvailability }}</template>
-						<template #suffix>{{ policies.chatAvailability === 'available' ? i18n.ts.yes : policies.chatAvailability === 'readonly' ? i18n.ts.readonly : i18n.ts.no }}</template>
-						<MkSelect
-							v-model="policies.chatAvailability"
-							:items="[
-								{ label: i18n.ts.enabled, value: 'available' },
-								{ label: i18n.ts.readonly, value: 'readonly' },
-								{ label: i18n.ts.disabled, value: 'unavailable' },
-							]"
-						>
-							<template #label>{{ i18n.ts.enable }}</template>
-						</MkSelect>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.mentionMax, 'mentionLimit'])">
-						<template #label>{{ i18n.ts._role._options.mentionMax }}</template>
-						<template #suffix>{{ policies.mentionLimit }}</template>
-						<MkInput v-model="policies.mentionLimit" type="number">
-						</MkInput>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.canInvite, 'canInvite'])">
-						<template #label>{{ i18n.ts._role._options.canInvite }}</template>
-						<template #suffix>{{ policies.canInvite ? i18n.ts.yes : i18n.ts.no }}</template>
-						<MkSwitch v-model="policies.canInvite">
-							<template #label>{{ i18n.ts.enable }}</template>
-						</MkSwitch>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.inviteLimit, 'inviteLimit'])">
-						<template #label>{{ i18n.ts._role._options.inviteLimit }}</template>
-						<template #suffix>{{ policies.inviteLimit }}</template>
-						<MkInput v-model="policies.inviteLimit" type="number">
-						</MkInput>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.inviteLimitCycle, 'inviteLimitCycle'])">
-						<template #label>{{ i18n.ts._role._options.inviteLimitCycle }}</template>
-						<template #suffix>{{ policies.inviteLimitCycle + i18n.ts._time.minute }}</template>
-						<MkInput v-model="policies.inviteLimitCycle" type="number">
-							<template #suffix>{{ i18n.ts._time.minute }}</template>
-						</MkInput>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.inviteExpirationTime, 'inviteExpirationTime'])">
-						<template #label>{{ i18n.ts._role._options.inviteExpirationTime }}</template>
-						<template #suffix>{{ policies.inviteExpirationTime + i18n.ts._time.minute }}</template>
-						<MkInput v-model="policies.inviteExpirationTime" type="number">
-							<template #suffix>{{ i18n.ts._time.minute }}</template>
-						</MkInput>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.canManageAvatarDecorations, 'canManageAvatarDecorations'])">
-						<template #label>{{ i18n.ts._role._options.canManageAvatarDecorations }}</template>
-						<template #suffix>{{ policies.canManageAvatarDecorations ? i18n.ts.yes : i18n.ts.no }}</template>
-						<MkSwitch v-model="policies.canManageAvatarDecorations">
-							<template #label>{{ i18n.ts.enable }}</template>
-						</MkSwitch>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.canManageCustomEmojis, 'canManageCustomEmojis'])">
-						<template #label>{{ i18n.ts._role._options.canManageCustomEmojis }}</template>
-						<template #suffix>{{ policies.canManageCustomEmojis ? i18n.ts.yes : i18n.ts.no }}</template>
-						<MkSwitch v-model="policies.canManageCustomEmojis">
-							<template #label>{{ i18n.ts.enable }}</template>
-						</MkSwitch>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.canSearchNotes, 'canSearchNotes'])">
-						<template #label>{{ i18n.ts._role._options.canSearchNotes }}</template>
-						<template #suffix>{{ policies.canSearchNotes ? i18n.ts.yes : i18n.ts.no }}</template>
-						<MkSwitch v-model="policies.canSearchNotes">
-							<template #label>{{ i18n.ts.enable }}</template>
-						</MkSwitch>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.canSearchUsers, 'canSearchUsers'])">
-						<template #label>{{ i18n.ts._role._options.canSearchUsers }}</template>
-						<template #suffix>{{ policies.canSearchUsers ? i18n.ts.yes : i18n.ts.no }}</template>
-						<MkSwitch v-model="policies.canSearchUsers">
-							<template #label>{{ i18n.ts.enable }}</template>
-						</MkSwitch>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.canUseTranslator, 'canUseTranslator'])">
-						<template #label>{{ i18n.ts._role._options.canUseTranslator }}</template>
-						<template #suffix>{{ policies.canUseTranslator ? i18n.ts.yes : i18n.ts.no }}</template>
-						<MkSwitch v-model="policies.canUseTranslator">
-							<template #label>{{ i18n.ts.enable }}</template>
-						</MkSwitch>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.driveCapacity, 'driveCapacityMb'])">
-						<template #label>{{ i18n.ts._role._options.driveCapacity }}</template>
-						<template #suffix>{{ policies.driveCapacityMb }}MB</template>
-						<MkInput v-model="policies.driveCapacityMb" type="number">
-							<template #suffix>MB</template>
-						</MkInput>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.maxFileSize, 'maxFileSizeMb'])">
-						<template #label>{{ i18n.ts._role._options.maxFileSize }}</template>
-						<template #suffix>{{ policies.maxFileSizeMb }}MB</template>
-						<MkInput v-model="policies.maxFileSizeMb" type="number">
-							<template #suffix>MB</template>
-							<template #caption>
-								<div><i class="ti ti-alert-triangle" style="color: var(--MI_THEME-warn);"></i> {{ i18n.ts._role._options.maxFileSize_caption }}</div>
-							</template>
-						</MkInput>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.uploadableFileTypes, 'uploadableFileTypes'])">
-						<template #label>{{ i18n.ts._role._options.uploadableFileTypes }}</template>
-						<template #suffix>...</template>
-						<MkTextarea :modelValue="policies.uploadableFileTypes.join('\n')" @update:modelValue="v => policies.uploadableFileTypes = v.split('\n')">
-							<template #caption>
-								<div>{{ i18n.ts._role._options.uploadableFileTypes_caption }}</div>
-								<div><i class="ti ti-alert-triangle" style="color: var(--MI_THEME-warn);"></i> {{ i18n.tsx._role._options.uploadableFileTypes_caption2({ x: 'application/octet-stream' }) }}</div>
-							</template>
-						</MkTextarea>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.alwaysMarkNsfw, 'alwaysMarkNsfw'])">
-						<template #label>{{ i18n.ts._role._options.alwaysMarkNsfw }}</template>
-						<template #suffix>{{ policies.alwaysMarkNsfw ? i18n.ts.yes : i18n.ts.no }}</template>
-						<MkSwitch v-model="policies.alwaysMarkNsfw">
-							<template #label>{{ i18n.ts.enable }}</template>
-						</MkSwitch>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.canUpdateBioMedia, 'canUpdateBioMedia'])">
-						<template #label>{{ i18n.ts._role._options.canUpdateBioMedia }}</template>
-						<template #suffix>{{ policies.canUpdateBioMedia ? i18n.ts.yes : i18n.ts.no }}</template>
-						<MkSwitch v-model="policies.canUpdateBioMedia">
-							<template #label>{{ i18n.ts.enable }}</template>
-						</MkSwitch>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.pinMax, 'pinLimit'])">
-						<template #label>{{ i18n.ts._role._options.pinMax }}</template>
-						<template #suffix>{{ policies.pinLimit }}</template>
-						<MkInput v-model="policies.pinLimit" type="number">
-						</MkInput>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.antennaMax, 'antennaLimit'])">
-						<template #label>{{ i18n.ts._role._options.antennaMax }}</template>
-						<template #suffix>{{ policies.antennaLimit }}</template>
-						<MkInput v-model="policies.antennaLimit" type="number">
-						</MkInput>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.wordMuteMax, 'wordMuteLimit'])">
-						<template #label>{{ i18n.ts._role._options.wordMuteMax }}</template>
-						<template #suffix>{{ policies.wordMuteLimit }}</template>
-						<MkInput v-model="policies.wordMuteLimit" type="number">
-							<template #suffix>chars</template>
-						</MkInput>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.webhookMax, 'webhookLimit'])">
-						<template #label>{{ i18n.ts._role._options.webhookMax }}</template>
-						<template #suffix>{{ policies.webhookLimit }}</template>
-						<MkInput v-model="policies.webhookLimit" type="number">
-						</MkInput>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.clipMax, 'clipLimit'])">
-						<template #label>{{ i18n.ts._role._options.clipMax }}</template>
-						<template #suffix>{{ policies.clipLimit }}</template>
-						<MkInput v-model="policies.clipLimit" type="number">
-						</MkInput>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.noteEachClipsMax, 'noteEachClipsLimit'])">
-						<template #label>{{ i18n.ts._role._options.noteEachClipsMax }}</template>
-						<template #suffix>{{ policies.noteEachClipsLimit }}</template>
-						<MkInput v-model="policies.noteEachClipsLimit" type="number">
-						</MkInput>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.userListMax, 'userListLimit'])">
-						<template #label>{{ i18n.ts._role._options.userListMax }}</template>
-						<template #suffix>{{ policies.userListLimit }}</template>
-						<MkInput v-model="policies.userListLimit" type="number">
-						</MkInput>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.userEachUserListsMax, 'userEachUserListsLimit'])">
-						<template #label>{{ i18n.ts._role._options.userEachUserListsMax }}</template>
-						<template #suffix>{{ policies.userEachUserListsLimit }}</template>
-						<MkInput v-model="policies.userEachUserListsLimit" type="number">
-						</MkInput>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.canHideAds, 'canHideAds'])">
-						<template #label>{{ i18n.ts._role._options.canHideAds }}</template>
-						<template #suffix>{{ policies.canHideAds ? i18n.ts.yes : i18n.ts.no }}</template>
-						<MkSwitch v-model="policies.canHideAds">
-							<template #label>{{ i18n.ts.enable }}</template>
-						</MkSwitch>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.avatarDecorationLimit, 'avatarDecorationLimit'])">
-						<template #label>{{ i18n.ts._role._options.avatarDecorationLimit }}</template>
-						<template #suffix>{{ policies.avatarDecorationLimit }}</template>
-						<MkInput v-model="avatarDecorationLimit" type="number" :min="0" :max="16" @update:modelValue="updateAvatarDecorationLimit">
-						</MkInput>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.canImportAntennas, 'canImportAntennas'])">
-						<template #label>{{ i18n.ts._role._options.canImportAntennas }}</template>
-						<template #suffix>{{ policies.canImportAntennas ? i18n.ts.yes : i18n.ts.no }}</template>
-						<MkSwitch v-model="policies.canImportAntennas">
-							<template #label>{{ i18n.ts.enable }}</template>
-						</MkSwitch>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.canImportBlocking, 'canImportBlocking'])">
-						<template #label>{{ i18n.ts._role._options.canImportBlocking }}</template>
-						<template #suffix>{{ policies.canImportBlocking ? i18n.ts.yes : i18n.ts.no }}</template>
-						<MkSwitch v-model="policies.canImportBlocking">
-							<template #label>{{ i18n.ts.enable }}</template>
-						</MkSwitch>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.canImportFollowing, 'canImportFollowing'])">
-						<template #label>{{ i18n.ts._role._options.canImportFollowing }}</template>
-						<template #suffix>{{ policies.canImportFollowing ? i18n.ts.yes : i18n.ts.no }}</template>
-						<MkSwitch v-model="policies.canImportFollowing">
-							<template #label>{{ i18n.ts.enable }}</template>
-						</MkSwitch>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.canImportMuting, 'canImportMuting'])">
-						<template #label>{{ i18n.ts._role._options.canImportMuting }}</template>
-						<template #suffix>{{ policies.canImportMuting ? i18n.ts.yes : i18n.ts.no }}</template>
-						<MkSwitch v-model="policies.canImportMuting">
-							<template #label>{{ i18n.ts.enable }}</template>
-						</MkSwitch>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.canImportUserLists, 'canImportUserList'])">
-						<template #label>{{ i18n.ts._role._options.canImportUserLists }}</template>
-						<template #suffix>{{ policies.canImportUserLists ? i18n.ts.yes : i18n.ts.no }}</template>
-						<MkSwitch v-model="policies.canImportUserLists">
-							<template #label>{{ i18n.ts.enable }}</template>
-						</MkSwitch>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.noteDraftLimit, 'noteDraftLimit'])">
-						<template #label>{{ i18n.ts._role._options.noteDraftLimit }}</template>
-						<template #suffix>{{ policies.noteDraftLimit }}</template>
-						<MkInput v-model="policies.noteDraftLimit" type="number" :min="0">
-						</MkInput>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.scheduledNoteLimit, 'scheduledNoteLimit'])">
-						<template #label>{{ i18n.ts._role._options.scheduledNoteLimit }}</template>
-						<template #suffix>{{ policies.scheduledNoteLimit }}</template>
-						<MkInput v-model="policies.scheduledNoteLimit" type="number" :min="0">
-						</MkInput>
-					</MkFolder>
-
-					<MkFolder v-if="matchQuery([i18n.ts._role._options.watermarkAvailable, 'watermarkAvailable'])">
-						<template #label>{{ i18n.ts._role._options.watermarkAvailable }}</template>
-						<template #suffix>{{ policies.watermarkAvailable ? i18n.ts.yes : i18n.ts.no }}</template>
-						<MkSwitch v-model="policies.watermarkAvailable">
-							<template #label>{{ i18n.ts.enable }}</template>
-						</MkSwitch>
-					</MkFolder>
+					<XPolicyEditor
+						:isBaseRole="true"
+						:roleQuery="baseRoleQ"
+						v-model:rolePolicies="policies"
+					/>
 				</div>
 			</MkFolder>
 			<MkButton primary rounded @click="create"><i class="ti ti-plus"></i> {{ i18n.ts._role.new }}</MkButton>
@@ -345,14 +46,11 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <script lang="ts" setup>
 import { computed, reactive, ref } from 'vue';
-import * as Misskey from 'misskey-js';
 import MkInput from '@/components/MkInput.vue';
 import MkFolder from '@/components/MkFolder.vue';
-import MkSwitch from '@/components/MkSwitch.vue';
 import MkButton from '@/components/MkButton.vue';
-import MkSelect from '@/components/MkSelect.vue';
-import MkRange from '@/components/MkRange.vue';
 import MkRolePreview from '@/components/MkRolePreview.vue';
+import XPolicyEditor from './roles.policy-editor.vue';
 import * as os from '@/os.js';
 import { misskeyApi } from '@/utility/misskey-api.js';
 import { i18n } from '@/i18n.js';
@@ -361,7 +59,6 @@ import { instance, fetchInstance } from '@/instance.js';
 import MkFoldableSection from '@/components/MkFoldableSection.vue';
 import { useRouter } from '@/router.js';
 import { deepClone } from '@/utility/clone.js';
-import MkTextarea from '@/components/MkTextarea.vue';
 
 const router = useRouter();
 const baseRoleQ = ref('');
@@ -370,22 +67,6 @@ const roles = await misskeyApi('admin/roles/list');
 
 const policies = reactive(deepClone(instance.policies));
 
-const avatarDecorationLimit = computed({
-	get: () => Math.min(16, Math.max(0, policies.avatarDecorationLimit)),
-	set: (value) => {
-		policies.avatarDecorationLimit = Math.min(Number(value), 16);
-	},
-});
-
-function updateAvatarDecorationLimit(value: string | number) {
-	avatarDecorationLimit.value = Number(value);
-}
-
-function matchQuery(keywords: string[]): boolean {
-	if (baseRoleQ.value.trim().length === 0) return true;
-	return keywords.some(keyword => keyword.toLowerCase().includes(baseRoleQ.value.toLowerCase()));
-}
-
 async function updateBaseRole() {
 	await os.apiWithDialog('admin/roles/update-default-policies', {
 		//@ts-expect-error misskey-js側の型定義が不十分

From a18f4cda84bffb21e192d8aaa8ddbcd3f06e3b8e Mon Sep 17 00:00:00 2001
From: kakkokari-gtyih <67428053+kakkokari-gtyih@users.noreply.github.com>
Date: Sat, 24 Jan 2026 01:51:04 +0900
Subject: [PATCH 2/4] fix

---
 .../admin/roles.policy-editor.folder.vue      | 40 +++++++++-------
 .../src/pages/admin/roles.policy-editor.vue   | 47 ++++++++++++-------
 2 files changed, 53 insertions(+), 34 deletions(-)

diff --git a/packages/frontend/src/pages/admin/roles.policy-editor.folder.vue b/packages/frontend/src/pages/admin/roles.policy-editor.folder.vue
index 8c940a53cd..e087992482 100644
--- a/packages/frontend/src/pages/admin/roles.policy-editor.folder.vue
+++ b/packages/frontend/src/pages/admin/roles.policy-editor.folder.vue
@@ -17,13 +17,13 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</template>
 		<div class="_gaps">
-			<MkSwitch v-if="!isBaseRole && rolePolicyMetaModel != null" v-model="rolePolicyMetaModel.useDefault" :disabled="readonly">
+			<MkSwitch v-if="!isBaseRole && rolePolicyMetaModel != null" v-model="useDefaultModel" :disabled="readonly">
 				<template #label>{{ i18n.ts._role.useBaseValue }}</template>
 			</MkSwitch>
 			<div>
 				<slot :disabled="readonly || (!isBaseRole && rolePolicyMetaModel?.useDefault)"></slot>
 			</div>
-			<MkRange v-if="!isBaseRole && rolePolicyMetaModel != null" v-model="rolePolicyMetaModel.priority" :min="0" :max="2" :step="1" easing :textConverter="priroityRangeTextConverter" :disabled="readonly">
+			<MkRange v-if="!isBaseRole && rolePolicyMetaModel != null" v-model="priorityModel" :min="0" :max="2" :step="1" easing :textConverter="priroityRangeTextConverter" :disabled="readonly">
 				<template #label>{{ i18n.ts._role.priority }}</template>
 			</MkRange>
 		</div>
@@ -31,7 +31,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 </template>
 
 <script setup lang="ts">
-import { ref, watch } from 'vue';
+import { computed } from 'vue';
 import MkFolder from '@/components/MkFolder.vue';
 import MkSwitch from '@/components/MkSwitch.vue';
 import MkRange from '@/components/MkRange.vue';
@@ -48,19 +48,27 @@ const emit = defineEmits<{
 	(ev: 'update:policyMeta', v: PolicyMeta): void;
 }>();
 
-const rolePolicyMetaModel = ref<PolicyMeta | null>(null);
-watch(() => props.policyMeta, (v) => {
-	if (v != null) {
-		rolePolicyMetaModel.value = v;
-	} else {
-		rolePolicyMetaModel.value = null;
-	}
-}, { immediate: true, deep: true });
-watch(rolePolicyMetaModel, (v) => {
-	if (v != null) {
-		emit('update:policyMeta', v);
-	}
-}, { deep: true });
+const rolePolicyMetaModel = computed<PolicyMeta | null>(() => props.policyMeta ?? null);
+
+const useDefaultModel = computed<boolean>({
+	get: () => props.policyMeta?.useDefault ?? false,
+	set: (value) => {
+		const current = props.policyMeta;
+		if (current == null) return;
+		if (current.useDefault === value) return;
+		emit('update:policyMeta', { ...current, useDefault: value });
+	},
+});
+
+const priorityModel = computed<number>({
+	get: () => props.policyMeta?.priority ?? 0,
+	set: (value) => {
+		const current = props.policyMeta;
+		if (current == null) return;
+		if (current.priority === value) return;
+		emit('update:policyMeta', { ...current, priority: value });
+	},
+});
 
 function getPriorityIcon(priority: number): string {
 	if (priority === 2) return 'ti ti-arrows-up';
diff --git a/packages/frontend/src/pages/admin/roles.policy-editor.vue b/packages/frontend/src/pages/admin/roles.policy-editor.vue
index 0f9cf1ed9e..fd91aa840e 100644
--- a/packages/frontend/src/pages/admin/roles.policy-editor.vue
+++ b/packages/frontend/src/pages/admin/roles.policy-editor.vue
@@ -403,7 +403,7 @@ type PolicyMetaRecord = {
 </script>
 
 <script setup lang="ts">
-import { computed, ref, watch } from 'vue';
+import { computed } from 'vue';
 import { i18n } from '@/i18n.js';
 import XFolder from './roles.policy-editor.folder.vue';
 
@@ -426,25 +426,36 @@ const emit = defineEmits<{
 	(event: 'update:policiesMeta', value: PolicyMetaRecord): void;
 }>();
 
-const valuesModel = ref<Misskey.entities.RolePolicies>(props.rolePolicies);
-watch(() => props.rolePolicies, (newVal) => {
-	valuesModel.value = newVal;
-}, { deep: true });
-watch(valuesModel, (newVal) => {
-	emit('update:rolePolicies', newVal);
-}, { deep: true });
+const valuesModel = new Proxy({} as Misskey.entities.RolePolicies, {
+	get(_target, prop) {
+		if (typeof prop !== 'string') return undefined;
+		return props.rolePolicies[prop as keyof Misskey.entities.RolePolicies];
+	},
+	set(_target, prop, value) {
+		if (typeof prop !== 'string') return false;
+		emit('update:rolePolicies', { ...props.rolePolicies, [prop]: value });
+		return true;
+	},
+});
 
 function createDefaultPolicyMeta() {
 	return Object.fromEntries(Object.keys(Misskey.rolePolicies).map(key => [key, { useDefault: true, priority: 0 }])) as PolicyMetaRecord;
 }
-const policyMetaModel = ref<PolicyMetaRecord>(props.policiesMeta ?? createDefaultPolicyMeta());
-watch(() => props.policiesMeta, (newVal) => {
-	policyMetaModel.value = newVal ?? createDefaultPolicyMeta();
-}, { deep: true });
-watch(policyMetaModel, (newVal) => {
-	if (newVal == null) return;
-	emit('update:policiesMeta', newVal);
-}, { deep: true });
+
+const policiesMetaFallback = createDefaultPolicyMeta();
+const policyMetaModel = new Proxy({} as PolicyMetaRecord, {
+	get(_target, prop) {
+		if (typeof prop !== 'string') return undefined;
+		const base = props.policiesMeta ?? policiesMetaFallback;
+		return base[prop as keyof PolicyMetaRecord];
+	},
+	set(_target, prop, value) {
+		if (typeof prop !== 'string') return false;
+		const base = props.policiesMeta ?? policiesMetaFallback;
+		emit('update:policiesMeta', { ...base, [prop]: value });
+		return true;
+	},
+});
 
 function matchQuery(keywords: string[]): boolean {
 	if (props.roleQuery == null || props.roleQuery.trim().length === 0) return true;
@@ -452,9 +463,9 @@ function matchQuery(keywords: string[]): boolean {
 }
 
 const avatarDecorationLimit = computed({
-	get: () => Math.min(16, Math.max(0, valuesModel.value.avatarDecorationLimit)),
+	get: () => Math.min(16, Math.max(0, Number(valuesModel.avatarDecorationLimit ?? 0))),
 	set: (value) => {
-		valuesModel.value.avatarDecorationLimit = Math.min(Number(value), 16);
+		valuesModel.avatarDecorationLimit = Math.min(Number(value), 16);
 	},
 });
 

From 1e164d7110117620b8ecf50c40567a5b1bf45627 Mon Sep 17 00:00:00 2001
From: kakkokari-gtyih <67428053+kakkokari-gtyih@users.noreply.github.com>
Date: Sat, 24 Jan 2026 01:55:32 +0900
Subject: [PATCH 3/4] fix lint

---
 .../frontend/src/pages/admin/roles.editor.vue |  4 +-
 .../src/pages/admin/roles.policy-editor.vue   | 76 +++++++++----------
 packages/frontend/src/pages/admin/roles.vue   |  2 +-
 3 files changed, 41 insertions(+), 41 deletions(-)

diff --git a/packages/frontend/src/pages/admin/roles.editor.vue b/packages/frontend/src/pages/admin/roles.editor.vue
index 272deaa67a..52cbebbb5b 100644
--- a/packages/frontend/src/pages/admin/roles.editor.vue
+++ b/packages/frontend/src/pages/admin/roles.editor.vue
@@ -80,11 +80,11 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</MkInput>
 
 			<XPolicyEditor
+				v-model:rolePolicies="rolePolicyValues"
+				v-model:policiesMeta="rolePolicyMeta"
 				:isBaseRole="false"
 				:roleQuery="q"
 				:readonly="readonly"
-				v-model:rolePolicies="rolePolicyValues"
-				v-model:policiesMeta="rolePolicyMeta"
 			/>
 		</div>
 	</FormSlot>
diff --git a/packages/frontend/src/pages/admin/roles.policy-editor.vue b/packages/frontend/src/pages/admin/roles.policy-editor.vue
index fd91aa840e..24eb6e4313 100644
--- a/packages/frontend/src/pages/admin/roles.policy-editor.vue
+++ b/packages/frontend/src/pages/admin/roles.policy-editor.vue
@@ -5,7 +5,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <template>
 	<div class="_gaps_s">
-		<XFolder v-if="matchQuery([i18n.ts._role._options.rateLimitFactor, 'rateLimitFactor'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.rateLimitFactor">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.rateLimitFactor, 'rateLimitFactor'])" v-model:policyMeta="policyMetaModel.rateLimitFactor" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.rateLimitFactor }}</template>
 			<template #valueText>{{ Math.floor(valuesModel.rateLimitFactor * 100) }}%</template>
 			<template #default="{ disabled }">
@@ -15,7 +15,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.gtlAvailable, 'gtlAvailable'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.gtlAvailable">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.gtlAvailable, 'gtlAvailable'])" v-model:policyMeta="policyMetaModel.gtlAvailable" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.gtlAvailable }}</template>
 			<template #valueText>{{ valuesModel.gtlAvailable ? i18n.ts.yes : i18n.ts.no }}</template>
 			<template #default="{ disabled }">
@@ -25,7 +25,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.ltlAvailable, 'ltlAvailable'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.ltlAvailable">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.ltlAvailable, 'ltlAvailable'])" v-model:policyMeta="policyMetaModel.ltlAvailable" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.ltlAvailable }}</template>
 			<template #valueText>{{ valuesModel.ltlAvailable ? i18n.ts.yes : i18n.ts.no }}</template>
 			<template #default="{ disabled }">
@@ -35,7 +35,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.canPublicNote, 'canPublicNote'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canPublicNote">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canPublicNote, 'canPublicNote'])" v-model:policyMeta="policyMetaModel.canPublicNote" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.canPublicNote }}</template>
 			<template #valueText>{{ valuesModel.canPublicNote ? i18n.ts.yes : i18n.ts.no }}</template>
 			<template #default="{ disabled }">
@@ -45,7 +45,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.chatAvailability, 'chatAvailability'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.chatAvailability">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.chatAvailability, 'chatAvailability'])" v-model:policyMeta="policyMetaModel.chatAvailability" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.chatAvailability }}</template>
 			<template #valueText>{{ valuesModel.chatAvailability === 'available' ? i18n.ts.yes : valuesModel.chatAvailability === 'readonly' ? i18n.ts.readonly : i18n.ts.no }}</template>
 			<template #default="{ disabled }">
@@ -63,7 +63,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.mentionMax, 'mentionLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.mentionLimit">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.mentionMax, 'mentionLimit'])" v-model:policyMeta="policyMetaModel.mentionLimit" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.mentionMax }}</template>
 			<template #valueText>{{ valuesModel.mentionLimit }}</template>
 			<template #default="{ disabled }">
@@ -72,7 +72,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.canInvite, 'canInvite'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canInvite">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canInvite, 'canInvite'])" v-model:policyMeta="policyMetaModel.canInvite" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.canInvite }}</template>
 			<template #valueText>{{ valuesModel.canInvite ? i18n.ts.yes : i18n.ts.no }}</template>
 			<template #default="{ disabled }">
@@ -82,7 +82,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.inviteLimit, 'inviteLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.inviteLimit">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.inviteLimit, 'inviteLimit'])" v-model:policyMeta="policyMetaModel.inviteLimit" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.inviteLimit }}</template>
 			<template #valueText>{{ valuesModel.inviteLimit }}</template>
 			<template #default="{ disabled }">
@@ -91,7 +91,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.inviteLimitCycle, 'inviteLimitCycle'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.inviteLimitCycle">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.inviteLimitCycle, 'inviteLimitCycle'])" v-model:policyMeta="policyMetaModel.inviteLimitCycle" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.inviteLimitCycle }}</template>
 			<template #valueText>{{ valuesModel.inviteLimitCycle + i18n.ts._time.minute }}</template>
 			<template #default="{ disabled }">
@@ -101,7 +101,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.inviteExpirationTime, 'inviteExpirationTime'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.inviteExpirationTime">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.inviteExpirationTime, 'inviteExpirationTime'])" v-model:policyMeta="policyMetaModel.inviteExpirationTime" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.inviteExpirationTime }}</template>
 			<template #valueText>{{ valuesModel.inviteExpirationTime + i18n.ts._time.minute }}</template>
 			<template #default="{ disabled }">
@@ -111,7 +111,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.canManageAvatarDecorations, 'canManageAvatarDecorations'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canManageAvatarDecorations">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canManageAvatarDecorations, 'canManageAvatarDecorations'])" v-model:policyMeta="policyMetaModel.canManageAvatarDecorations" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.canManageAvatarDecorations }}</template>
 			<template #valueText>{{ valuesModel.canManageAvatarDecorations ? i18n.ts.yes : i18n.ts.no }}</template>
 			<template #default="{ disabled }">
@@ -121,7 +121,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.canManageCustomEmojis, 'canManageCustomEmojis'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canManageCustomEmojis">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canManageCustomEmojis, 'canManageCustomEmojis'])" v-model:policyMeta="policyMetaModel.canManageCustomEmojis" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.canManageCustomEmojis }}</template>
 			<template #valueText>{{ valuesModel.canManageCustomEmojis ? i18n.ts.yes : i18n.ts.no }}</template>
 			<template #default="{ disabled }">
@@ -131,7 +131,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.canSearchNotes, 'canSearchNotes'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canSearchNotes">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canSearchNotes, 'canSearchNotes'])" v-model:policyMeta="policyMetaModel.canSearchNotes" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.canSearchNotes }}</template>
 			<template #valueText>{{ valuesModel.canSearchNotes ? i18n.ts.yes : i18n.ts.no }}</template>
 			<template #default="{ disabled }">
@@ -141,7 +141,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.canSearchUsers, 'canSearchUsers'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canSearchUsers">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canSearchUsers, 'canSearchUsers'])" v-model:policyMeta="policyMetaModel.canSearchUsers" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.canSearchUsers }}</template>
 			<template #valueText>{{ valuesModel.canSearchUsers ? i18n.ts.yes : i18n.ts.no }}</template>
 			<template #default="{ disabled }">
@@ -151,7 +151,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.canUseTranslator, 'canUseTranslator'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canUseTranslator">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canUseTranslator, 'canUseTranslator'])" v-model:policyMeta="policyMetaModel.canUseTranslator" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.canUseTranslator }}</template>
 			<template #valueText>{{ valuesModel.canUseTranslator ? i18n.ts.yes : i18n.ts.no }}</template>
 			<template #default="{ disabled }">
@@ -161,7 +161,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.driveCapacity, 'driveCapacityMb'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.driveCapacityMb">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.driveCapacity, 'driveCapacityMb'])" v-model:policyMeta="policyMetaModel.driveCapacityMb" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.driveCapacity }}</template>
 			<template #valueText>{{ valuesModel.driveCapacityMb }}MB</template>
 			<template #default="{ disabled }">
@@ -171,7 +171,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.maxFileSize, 'maxFileSizeMb'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.maxFileSizeMb">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.maxFileSize, 'maxFileSizeMb'])" v-model:policyMeta="policyMetaModel.maxFileSizeMb" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.maxFileSize }}</template>
 			<template #valueText>{{ valuesModel.maxFileSizeMb }}MB</template>
 			<template #default="{ disabled }">
@@ -184,7 +184,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.uploadableFileTypes, 'uploadableFileTypes'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.uploadableFileTypes">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.uploadableFileTypes, 'uploadableFileTypes'])" v-model:policyMeta="policyMetaModel.uploadableFileTypes" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.uploadableFileTypes }}</template>
 			<template #valueText>...</template>
 			<template #default="{ disabled }">
@@ -197,7 +197,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.alwaysMarkNsfw, 'alwaysMarkNsfw'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.alwaysMarkNsfw">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.alwaysMarkNsfw, 'alwaysMarkNsfw'])" v-model:policyMeta="policyMetaModel.alwaysMarkNsfw" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.alwaysMarkNsfw }}</template>
 			<template #valueText>{{ valuesModel.alwaysMarkNsfw ? i18n.ts.yes : i18n.ts.no }}</template>
 			<template #default="{ disabled }">
@@ -207,7 +207,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.canUpdateBioMedia, 'canUpdateBioMedia'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canUpdateBioMedia">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canUpdateBioMedia, 'canUpdateBioMedia'])" v-model:policyMeta="policyMetaModel.canUpdateBioMedia" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.canUpdateBioMedia }}</template>
 			<template #valueText>{{ valuesModel.canUpdateBioMedia ? i18n.ts.yes : i18n.ts.no }}</template>
 			<template #default="{ disabled }">
@@ -217,7 +217,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.pinMax, 'pinLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.pinLimit">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.pinMax, 'pinLimit'])" v-model:policyMeta="policyMetaModel.pinLimit" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.pinMax }}</template>
 			<template #valueText>{{ valuesModel.pinLimit }}</template>
 			<template #default="{ disabled }">
@@ -226,7 +226,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.antennaMax, 'antennaLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.antennaLimit">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.antennaMax, 'antennaLimit'])" v-model:policyMeta="policyMetaModel.antennaLimit" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.antennaMax }}</template>
 			<template #valueText>{{ valuesModel.antennaLimit }}</template>
 			<template #default="{ disabled }">
@@ -235,7 +235,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.wordMuteMax, 'wordMuteLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.wordMuteLimit">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.wordMuteMax, 'wordMuteLimit'])" v-model:policyMeta="policyMetaModel.wordMuteLimit" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.wordMuteMax }}</template>
 			<template #valueText>{{ valuesModel.wordMuteLimit }}</template>
 			<template #default="{ disabled }">
@@ -245,7 +245,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.webhookMax, 'webhookLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.webhookLimit">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.webhookMax, 'webhookLimit'])" v-model:policyMeta="policyMetaModel.webhookLimit" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.webhookMax }}</template>
 			<template #valueText>{{ valuesModel.webhookLimit }}</template>
 			<template #default="{ disabled }">
@@ -254,7 +254,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.clipMax, 'clipLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.clipLimit">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.clipMax, 'clipLimit'])" v-model:policyMeta="policyMetaModel.clipLimit" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.clipMax }}</template>
 			<template #valueText>{{ valuesModel.clipLimit }}</template>
 			<template #default="{ disabled }">
@@ -263,7 +263,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.noteEachClipsMax, 'noteEachClipsLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.noteEachClipsLimit">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.noteEachClipsMax, 'noteEachClipsLimit'])" v-model:policyMeta="policyMetaModel.noteEachClipsLimit" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.noteEachClipsMax }}</template>
 			<template #valueText>{{ valuesModel.noteEachClipsLimit }}</template>
 			<template #default="{ disabled }">
@@ -272,7 +272,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.userListMax, 'userListLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.userListLimit">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.userListMax, 'userListLimit'])" v-model:policyMeta="policyMetaModel.userListLimit" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.userListMax }}</template>
 			<template #valueText>{{ valuesModel.userListLimit }}</template>
 			<template #default="{ disabled }">
@@ -281,7 +281,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.userEachUserListsMax, 'userEachUserListsLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.userEachUserListsLimit">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.userEachUserListsMax, 'userEachUserListsLimit'])" v-model:policyMeta="policyMetaModel.userEachUserListsLimit" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.userEachUserListsMax }}</template>
 			<template #valueText>{{ valuesModel.userEachUserListsLimit }}</template>
 			<template #default="{ disabled }">
@@ -290,7 +290,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.canHideAds, 'canHideAds'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canHideAds">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canHideAds, 'canHideAds'])" v-model:policyMeta="policyMetaModel.canHideAds" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.canHideAds }}</template>
 			<template #valueText>{{ valuesModel.canHideAds ? i18n.ts.yes : i18n.ts.no }}</template>
 			<template #default="{ disabled }">
@@ -300,7 +300,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.avatarDecorationLimit, 'avatarDecorationLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.avatarDecorationLimit">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.avatarDecorationLimit, 'avatarDecorationLimit'])" v-model:policyMeta="policyMetaModel.avatarDecorationLimit" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.avatarDecorationLimit }}</template>
 			<template #valueText>{{ valuesModel.avatarDecorationLimit }}</template>
 			<template #default="{ disabled }">
@@ -309,7 +309,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.canImportAntennas, 'canImportAntennas'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canImportAntennas">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canImportAntennas, 'canImportAntennas'])" v-model:policyMeta="policyMetaModel.canImportAntennas" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.canImportAntennas }}</template>
 			<template #valueText>{{ valuesModel.canImportAntennas ? i18n.ts.yes : i18n.ts.no }}</template>
 			<template #default="{ disabled }">
@@ -319,7 +319,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.canImportBlocking, 'canImportBlocking'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canImportBlocking">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canImportBlocking, 'canImportBlocking'])" v-model:policyMeta="policyMetaModel.canImportBlocking" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.canImportBlocking }}</template>
 			<template #valueText>{{ valuesModel.canImportBlocking ? i18n.ts.yes : i18n.ts.no }}</template>
 			<template #default="{ disabled }">
@@ -329,7 +329,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.canImportFollowing, 'canImportFollowing'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canImportFollowing">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canImportFollowing, 'canImportFollowing'])" v-model:policyMeta="policyMetaModel.canImportFollowing" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.canImportFollowing }}</template>
 			<template #valueText>{{ valuesModel.canImportFollowing ? i18n.ts.yes : i18n.ts.no }}</template>
 			<template #default="{ disabled }">
@@ -339,7 +339,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.canImportMuting, 'canImportMuting'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canImportMuting">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canImportMuting, 'canImportMuting'])" v-model:policyMeta="policyMetaModel.canImportMuting" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.canImportMuting }}</template>
 			<template #valueText>{{ valuesModel.canImportMuting ? i18n.ts.yes : i18n.ts.no }}</template>
 			<template #default="{ disabled }">
@@ -349,7 +349,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.canImportUserLists, 'canImportUserList'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.canImportUserLists">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.canImportUserLists, 'canImportUserList'])" v-model:policyMeta="policyMetaModel.canImportUserLists" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.canImportUserLists }}</template>
 			<template #valueText>{{ valuesModel.canImportUserLists ? i18n.ts.yes : i18n.ts.no }}</template>
 			<template #default="{ disabled }">
@@ -359,7 +359,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.noteDraftLimit, 'noteDraftLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.noteDraftLimit">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.noteDraftLimit, 'noteDraftLimit'])" v-model:policyMeta="policyMetaModel.noteDraftLimit" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.noteDraftLimit }}</template>
 			<template #valueText>{{ valuesModel.noteDraftLimit }}</template>
 			<template #default="{ disabled }">
@@ -368,7 +368,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.scheduledNoteLimit, 'scheduledNoteLimit'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.scheduledNoteLimit">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.scheduledNoteLimit, 'scheduledNoteLimit'])" v-model:policyMeta="policyMetaModel.scheduledNoteLimit" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.scheduledNoteLimit }}</template>
 			<template #valueText>{{ valuesModel.scheduledNoteLimit }}</template>
 			<template #default="{ disabled }">
@@ -377,7 +377,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</template>
 		</XFolder>
 
-		<XFolder v-if="matchQuery([i18n.ts._role._options.watermarkAvailable, 'watermarkAvailable'])" :isBaseRole="isBaseRole" :readonly="readonly" v-model:policyMeta="policyMetaModel.watermarkAvailable">
+		<XFolder v-if="matchQuery([i18n.ts._role._options.watermarkAvailable, 'watermarkAvailable'])" v-model:policyMeta="policyMetaModel.watermarkAvailable" :isBaseRole="isBaseRole" :readonly="readonly">
 			<template #label>{{ i18n.ts._role._options.watermarkAvailable }}</template>
 			<template #valueText>{{ valuesModel.watermarkAvailable ? i18n.ts.yes : i18n.ts.no }}</template>
 			<template #default="{ disabled }">
diff --git a/packages/frontend/src/pages/admin/roles.vue b/packages/frontend/src/pages/admin/roles.vue
index 8bec0ed9b8..94fc75657a 100644
--- a/packages/frontend/src/pages/admin/roles.vue
+++ b/packages/frontend/src/pages/admin/roles.vue
@@ -18,9 +18,9 @@ SPDX-License-Identifier: AGPL-3.0-only
 					</MkInput>
 
 					<XPolicyEditor
+						v-model:rolePolicies="policies"
 						:isBaseRole="true"
 						:roleQuery="baseRoleQ"
-						v-model:rolePolicies="policies"
 					/>
 				</div>
 			</MkFolder>

From 178e1f8099ed75e7f84cdc14aac4550662ec1d22 Mon Sep 17 00:00:00 2001
From: kakkokari-gtyih <67428053+kakkokari-gtyih@users.noreply.github.com>
Date: Sat, 24 Jan 2026 02:05:24 +0900
Subject: [PATCH 4/4] clean up

---
 packages/frontend/src/pages/admin/roles.editor.vue | 10 ----------
 1 file changed, 10 deletions(-)

diff --git a/packages/frontend/src/pages/admin/roles.editor.vue b/packages/frontend/src/pages/admin/roles.editor.vue
index 52cbebbb5b..2a11160ef1 100644
--- a/packages/frontend/src/pages/admin/roles.editor.vue
+++ b/packages/frontend/src/pages/admin/roles.editor.vue
@@ -212,13 +212,3 @@ const save = throttle(100, () => {
 
 watch(role, save, { deep: true });
 </script>
-
-<style lang="scss" module>
-.useDefaultLabel {
-	opacity: 0.7;
-}
-
-.priorityIndicator {
-	margin-left: 8px;
-}
-</style>