Enhance: アカウント移行機能を使用したユーザーに対してのモデレーションの強化 (#719)

* fix

* fix

* fix

* Feat: アカウント移行機能のモデレーションを行いやすくした

* コミット忘れ

* 文章を組み立てるのやめた

* Fix test

* Fix test

* updateModerationNote から mergeModerationNote に

* updateAccountMoveLogs から insertAccountMoveLog に

---------

Co-authored-by: nenohi <nenohi@nenohi.net>
Co-authored-by: nenohi <kimutipartylove@gmail.com>

packages/frontend/src/components/MkAccountMoved.vue

@@ -6,7 +6,8 @@ SPDX-License-Identifier: AGPL-3.0-only
 <template>
 <div v-if="user" :class="$style.root">
 	<i class="ti ti-plane-departure" style="margin-right: 8px;"></i>
-	{{ i18n.ts.accountMoved }}
+	<span v-if="movedTo">{{ i18n.ts.accountMoved }}</span>
+	<span v-if="movedFrom">{{ i18n.ts.accountMovedFrom }}</span>
 	<MkMention :class="$style.link" :username="user.username" :host="user.host ?? localHost"/>
 </div>
 </template>
@@ -22,10 +23,11 @@ import { misskeyApi } from '@/scripts/misskey-api.js';
 const user = ref<Misskey.entities.UserLite>();
 
 const props = defineProps<{
-	movedTo: string; // user id
+	movedTo?: string; // user id
+	movedFrom?: string; // user id
 }>();
 
-misskeyApi('users/show', { userId: props.movedTo }).then(u => user.value = u);
+misskeyApi('users/show', { userId: props.movedTo ?? props.movedFrom }).then(u => user.value = u);
 </script>
 
 <style lang="scss" module>

packages/frontend/src/pages/admin/index.vue

@@ -156,6 +156,11 @@ const menuDef = computed(() => [{
 		text: i18n.ts.moderationLogs,
 		to: '/admin/modlog',
 		active: currentPage.value?.route.name === 'modlog',
+	}, {
+		icon: 'ti ti-list-search',
+		text: i18n.ts.userAccountMoveLogs,
+		to: '/admin/useraccountmovelog',
+		active: currentPage.value?.route.name === 'useraccountmovelog',
 	}],
 }, {
 	title: i18n.ts.settings,

packages/frontend/src/pages/admin/useraccountmovelog.vue

@@ -0,0 +1,98 @@
+<template>
+<MkStickyContainer>
+	<template #header><XHeader :actions="headerActions" :tabs="headerTabs"/></template>
+	<MkSpacer :contentMax="900">
+		<div style="display: flex; gap: var(--margin); flex-wrap: wrap;">
+			<MkInput v-model="movedFromId" style="margin: 0; flex: 1;">
+				<template #label> {{ i18n.ts.moveFromId }}</template>
+			</MkInput>
+			<MkInput v-model="movedToId" style="margin: 0; flex: 1;">
+				<template #label> {{ i18n.ts.movedToId }}</template>
+			</MkInput>
+		</div>
+
+		<MkPagination v-slot="{items}" ref="logs" :pagination="pagination" style="margin-top: var(--margin);">
+			<div class="_gaps_s">
+				<MkFolder v-for="item in items" :key="item.id">
+					<template #label>
+						{{ i18n.tsx.userAccountMoveLogsTitle({
+							from: '@' + item.movedFrom.username + (item.movedFrom.host ? `@${item.movedFrom.host}` : ''),
+							to: '@' + item.movedTo.username + (item.movedTo.host ? `@${item.movedTo.host}` : '')
+						})
+						}}
+					</template>
+					<div :class="$style.card">
+						<MkA :to="userPage(item.movedFrom)" :class="$style.cardContent">
+							<MkAvatar :user="item.movedFrom" :class="$style.avatar" link/>
+							<MkAcct :user="item.movedFrom"/>
+						</MkA>
+						→
+						<MkA :to="userPage(item.movedTo)" :class="$style.cardContent">
+							<MkAvatar :user="item.movedTo" :class="$style.avatar"/>
+							<MkAcct :user="item.movedTo"/>
+						</MkA>
+					</div>
+				</MkFolder>
+			</div>
+		</MkPagination>
+	</MkSpacer>
+</MkStickyContainer>
+</template>
+
+<script lang="ts" setup>
+import { computed, shallowRef, ref } from 'vue';
+import XHeader from './_header_.vue';
+import MkInput from '@/components/MkInput.vue';
+import MkPagination from '@/components/MkPagination.vue';
+import { i18n } from '@/i18n.js';
+import { definePageMetadata } from '@/scripts/page-metadata.js';
+import { userPage } from '@/filters/user.js';
+import MkFolder from '@/components/MkFolder.vue';
+
+const logs = shallowRef<InstanceType<typeof MkPagination>>();
+
+const movedToId = ref('');
+const movedFromId = ref('');
+
+const pagination = {
+	endpoint: 'admin/show-user-account-move-logs' as const,
+	limit: 30,
+	params: computed(() => ({
+		movedFromId: movedFromId.value === '' ? null : movedFromId.value,
+		movedToId: movedToId.value === '' ? null : movedToId.value,
+	})),
+};
+
+const headerActions = computed(() => []);
+
+const headerTabs = computed(() => []);
+
+definePageMetadata(() => ({
+	title: i18n.ts.userAccountMoveLogs,
+	icon: 'ti ti-list-search',
+}));
+</script>
+
+<style lang="scss" module>
+.card {
+	display: flex;
+	gap: var(--margin);
+	border-radius: var(--radius);
+	padding: var(--margin);
+	align-items: center;
+	justify-content: center;
+	flex-wrap: wrap;
+}
+.avatar {
+	width: 48px;
+	height: 48px;
+}
+
+.cardContent{
+	display: flex;
+	gap: var(--margin);
+	align-items: center;
+	flex-direction: column;
+}
+
+</style>

packages/frontend/src/pages/user/home.vue

@@ -13,6 +13,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 			<div class="profile _gaps">
 				<MkAccountMoved v-if="user.movedTo" :movedTo="user.movedTo"/>
+				<MkAccountMoved v-if="movedFromLog" :movedFrom="movedFromLog[0]?.movedFromId"/>
 				<MkRemoteCaution v-if="user.host != null" :href="user.url ?? user.uri!" class="warn"/>
 
 				<div :key="user.id" class="main _panel">
@@ -280,6 +281,7 @@ const memoDraft = ref(props.user.memo);
 const isEditingMemo = ref(false);
 const moderationNote = ref(props.user.moderationNote);
 const editModerationNote = ref(false);
+const movedFromLog = ref<null | {movedFromId:string;}[]>(null);
 
 watch(moderationNote, async () => {
 	await misskeyApi('admin/update-user-note', { userId: props.user.id, text: moderationNote.value });
@@ -301,6 +303,15 @@ function menu(ev: MouseEvent) {
 	os.popupMenu(menu, ev.currentTarget ?? ev.target).finally(cleanup);
 }
 
+async function fetchMovedFromLog() {
+	if (!props.user.id) {
+		movedFromLog.value = null;
+		return;
+	}
+
+	movedFromLog.value = await misskeyApi('admin/show-user-account-move-logs', { movedToId: props.user.id });
+}
+
 function parallaxLoop() {
 	parallaxAnimationId.value = window.requestAnimationFrame(parallaxLoop);
 	parallax();
@@ -377,6 +388,9 @@ function buildSkebStatus(): string {
 watch([props.user], () => {
 	memoDraft.value = props.user.memo;
 	fetchSkebStatus();
+	if ($i?.isModerator) {
+		fetchMovedFromLog();
+	}
 });
 
 onMounted(() => {
@@ -395,6 +409,9 @@ onMounted(() => {
 		}
 	}
 	fetchSkebStatus();
+	if ($i?.isModerator) {
+		fetchMovedFromLog();
+	}
 	nextTick(() => {
 		adjustMemoTextarea();
 	});

packages/frontend/src/router/definition.ts

@@ -426,6 +426,10 @@ const routes: RouteDef[] = [{
 		path: '/modlog',
 		name: 'modlog',
 		component: page(() => import('@/pages/admin/modlog.vue')),
+	}, {
+		path: '/useraccountmovelog',
+		name: 'useraccountmovelog',
+		component: page(() => import('@/pages/admin/useraccountmovelog.vue')),
 	}, {
 		path: '/settings',
 		name: 'settings',