From 040f9927dd65150ae39e132c767ee1f7ac2a7869 Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Sat, 11 Feb 2023 12:55:22 +0900
Subject: [PATCH] =?UTF-8?q?enhance(client):=20=E3=83=AD=E3=83=BC=E3=83=AB?=
 =?UTF-8?q?=E3=82=92=E3=82=88=E3=82=8A=E7=B0=A1=E5=8D=98=E3=81=AB=E4=BB=98?=
 =?UTF-8?q?=E4=B8=8E=E3=81=A7=E3=81=8D=E3=82=8B=E3=82=88=E3=81=86=E3=81=AB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 CHANGELOG.md                                       |  1 +
 packages/frontend/src/components/MkUserPreview.vue | 13 +++++++++++++
 packages/frontend/src/scripts/get-user-menu.ts     | 14 ++++++++++++++
 3 files changed, 28 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 590429b719..d6eb0cebb7 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -13,6 +13,7 @@ You should also include the user name that made the change.
 
 ### Improvements
 - コンディショナルロールもバッジとして表示可能に
+- enhance(client): ロールをより簡単に付与できるように
 - enhance(client): 一度見たノートのRenoteは省略して表示するように
 - 一部のMFM構文をopt-outに
 
diff --git a/packages/frontend/src/components/MkUserPreview.vue b/packages/frontend/src/components/MkUserPreview.vue
index f68fdd64d9..eacc66de4f 100644
--- a/packages/frontend/src/components/MkUserPreview.vue
+++ b/packages/frontend/src/components/MkUserPreview.vue
@@ -24,6 +24,7 @@
 					<p>{{ $ts.followers }}</p><span>{{ user.followersCount }}</span>
 				</div>
 			</div>
+			<button class="menu _button" @click="showMenu"><i class="ti ti-dots"></i></button>
 			<MkFollowButton v-if="$i && user.id != $i.id" class="koudoku-button" :user="user" mini/>
 		</div>
 		<div v-else>
@@ -40,6 +41,7 @@ import * as misskey from 'misskey-js';
 import MkFollowButton from '@/components/MkFollowButton.vue';
 import { userPage } from '@/filters/user';
 import * as os from '@/os';
+import { getUserMenu } from '@/scripts/get-user-menu';
 
 const props = defineProps<{
 	showing: boolean;
@@ -58,6 +60,10 @@ let user = $ref<misskey.entities.UserDetailed | null>(null);
 let top = $ref(0);
 let left = $ref(0);
 
+function showMenu(ev: MouseEvent) {
+	os.popupMenu(getUserMenu(user), ev.currentTarget ?? ev.target);
+}
+
 onMounted(() => {
 	if (typeof props.q === 'object') {
 		user = props.q;
@@ -174,6 +180,13 @@ onMounted(() => {
 			}
 		}
 
+		> .menu {
+			position: absolute;
+			top: 8px;
+			right: 42px;
+			padding: 8px;
+		}
+
 		> .koudoku-button {
 			position: absolute;
 			top: 8px;
diff --git a/packages/frontend/src/scripts/get-user-menu.ts b/packages/frontend/src/scripts/get-user-menu.ts
index 74bd61fd78..941d9a0db9 100644
--- a/packages/frontend/src/scripts/get-user-menu.ts
+++ b/packages/frontend/src/scripts/get-user-menu.ts
@@ -203,6 +203,20 @@ export function getUserMenu(user, router: Router = mainRouter) {
 				action: () => {
 					router.push('/user-info/' + user.id + '#moderation');
 				},
+			}, {
+				icon: 'ti ti-badges',
+				text: i18n.ts.roles,
+				action: async () => {
+					const roles = await os.api('admin/roles/list');
+
+					const { canceled, result: roleId } = await os.select({
+						title: i18n.ts._role.chooseRoleToAssign,
+						items: roles.map(r => ({ text: r.name, value: r.id })),
+					});
+					if (canceled) return;
+
+					await os.apiWithDialog('admin/roles/assign', { roleId, userId: user.id });
+				},
 			}]);
 		}
 	}