From dac796449ad99a39d3ba79c51349b690d8b23c4e Mon Sep 17 00:00:00 2001
From: Martin Trapp <94928215+martrapp@users.noreply.github.com>
Date: Thu, 19 Sep 2024 19:11:57 +0200
Subject: [PATCH] Fixes a bug with sorting names

---
 .changeset/gold-planets-provide.md | 5 +++++
 src/animations.ts                  | 2 +-
 src/panel/names.ts                 | 6 +++---
 3 files changed, 9 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/gold-planets-provide.md

diff --git a/.changeset/gold-planets-provide.md b/.changeset/gold-planets-provide.md
new file mode 100644
index 0000000..6e77ded
--- /dev/null
+++ b/.changeset/gold-planets-provide.md
@@ -0,0 +1,5 @@
+---
+'@vtbag/inspection-chamber': patch
+---
+
+Fixes a bug with name sorting
diff --git a/src/animations.ts b/src/animations.ts
index f41cbc1..6eb4891 100644
--- a/src/animations.ts
+++ b/src/animations.ts
@@ -99,7 +99,7 @@ export async function retrieveViewTransitionAnimations() {
 
 	initTwin(frameDoc, frameDoc, names, oldNames, newNames);
 
-	updateNames(names, oldNames, newNames);
+	updateNames(oldNames, newNames, names);
 }
 
 export function unleashAllAnimations() {
diff --git a/src/panel/names.ts b/src/panel/names.ts
index baaae7f..51ea839 100644
--- a/src/panel/names.ts
+++ b/src/panel/names.ts
@@ -11,9 +11,9 @@ import { mayViewTransition, vtActive } from './transition';
 export const THROTTLING_DELAY = 500;
 
 export function updateNames(
-	names: Set<string>,
 	leftTransitionNames: Set<string>,
-	rightTransitionNames?: Set<string>
+	rightTransitionNames?: Set<string>,
+	names?: Set<string>
 ) {
 	//navigator.clipboard.writeText("");
 	mayViewTransition(() => {
@@ -26,7 +26,7 @@ export function updateNames(
 		top!.document.querySelector<HTMLElement>('#vtbag-ui-names div')!.style.display =
 			rightTransitionNames ? 'flex' : 'none';
 		const list = top!.document.querySelector('#vtbag-ui-names > ol')!;
-		(rightTransitionNames ? names : [...names].sort()).forEach((name, idx) => {
+		(rightTransitionNames ? names! : [...leftTransitionNames].sort()).forEach((name, idx) => {
 			const li = top!.document.createElement('li');
 			li.innerText = name;
 			if (rightTransitionNames && leftTransitionNames.has(name)) {