Improved actor merge dialog feedback.

components/actors/merge.vue

@@ -3,7 +3,33 @@
 		:title="`Merge '${actor.name}'`"
 		@close="emit('close')"
 	>
-		<div class="dialog-body">
+		<div
+			v-if="merged"
+			class="dialog-body"
+		>
+			Merge successful
+
+			<ul class="options">
+				<li class="option">
+					<a
+						:href="`/actor/${actor?.id}/${actor?.slug}`"
+						class="link"
+					>Reload #{{ actor.id }} {{ actor.name }} ({{ actor.entity.name }})</a>
+				</li>
+
+				<li class="option">
+					<a
+						:href="`/actor/${targetActor?.id}/${targetActor?.slug}`"
+						class="link"
+					>Go to #{{ targetActor?.id }} {{ targetActor?.name }}</a>
+				</li>
+			</ul>
+		</div>
+
+		<div
+			v-else
+			class="dialog-body"
+		>
 			<strong class="source">#{{ actor.id }} {{ actor.name }}<span v-if="actor.entity"> ({{ actor.entity.name }})</span></strong>
 
 			<span class="path">merging into</span>
@@ -87,13 +113,14 @@ const props = defineProps({
 	},
 });
 
-const emit = defineEmits(['close']);
+const emit = defineEmits(['close', 'merged']);
 
 const targetActor = ref(null);
 const actorInput = ref(null);
 const actorQuery = ref('');
 const actorResults = ref([]);
 const submitted = ref(false);
+const merged = ref(false);
 
 async function searchActors() {
 	const res = await get('/actors', {
@@ -115,8 +142,11 @@ async function merge() {
 	});
 
 	submitted.value = false;
+	merged.value = true;
 
-	emit('close');
+	emit('merged');
+
+	// emit('close');
 }
 
 function selectActor(actor) {
@@ -201,4 +231,10 @@ onMounted(() => {
 	box-sizing: border-box;
 	padding: 0 1rem;
 }
+
+.options {
+	padding: 0 1.5rem;
+	margin: 0;
+	line-height: 1.75;
+}
 </style>