sveltejs · ignatiusmb · Apr 5, 2024 · Apr 4, 2024
diff --git a/src/lib/runtime.svelte.ts b/src/lib/runtime.svelte.ts
@@ -47,6 +47,7 @@ port.onMessage.addListener(({ type, payload }) => {
 		case 'bridge::ext/inspect': {
 			if (typeof payload === 'string') break;
 			app.selected = app.nodes[payload.node.id];
+			app.inspecting = false;
 			break;
 		}
 

diff --git a/src/lib/state.svelte.ts b/src/lib/state.svelte.ts
@@ -37,6 +37,8 @@ export const app = $state({
 
 	selected: undefined as undefined | DebugNode,
 	hovered: undefined as undefined | DebugNode,
+
+	inspecting: false,
 	query: '',
 });
 

diff --git a/src/routes/Inspector.svelte b/src/routes/Inspector.svelte
@@ -2,21 +2,13 @@
 	import Button from '$lib/components/Button.svelte';
 	import { background } from '$lib/runtime.svelte';
 	import { app } from '$lib/state.svelte';
-
-	let active = $state(false);
-
-	$effect(() => {
-		if (active && app.selected) {
-			app.selected.dom?.scrollIntoView({ block: 'center' });
-		}
-	});
 </script>
 
 <Button
-	{active}
+	active={app.inspecting}
 	onclick={() => {
-		active = !active;
-		background.send('bridge::ext/inspect', active ? 'start' : 'stop');
+		app.inspecting = !app.inspecting;
+		background.send('bridge::ext/inspect', app.inspecting ? 'start' : 'stop');
 	}}
 >
 	<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">