Restore the invitations tab, render library tracks on first paint and re-measure the tab indicator

web-player/src/lib/components/music/library/LibraryTracksSection.svelte

@@ -57,6 +57,8 @@
 		(track) => track.id
 	);
 
+	untrack(() => list.reset(tracks));
+
 	let search = $state('');
 	let selectedIds = $state<string[]>([]);
 	let pendingDelete = $state<LibraryTrack[]>([]);

web-player/src/lib/components/ui/primitives/Tabs.svelte

@@ -21,16 +21,29 @@
 
 	const activeHref = $derived(tabs.find((tab) => tab.active)?.href);
 
-	$effect(() => {
+	let nav = $state<HTMLElement>();
+
+	function measure() {
 		const link = activeHref ? links[activeHref] : undefined;
-		if (!link) return;
+		if (!link || link.offsetWidth === 0) return;
 		indicator = { x: link.offsetLeft, width: link.offsetWidth };
 		measured = true;
 		if (!animated) requestAnimationFrame(() => (animated = true));
+	}
+
+	$effect(measure);
+
+	$effect(() => {
+		if (!nav) return;
+		const observer = new ResizeObserver(() => measure());
+		observer.observe(nav);
+		for (const link of Object.values(links)) if (link) observer.observe(link);
+		return () => observer.disconnect();
 	});
 </script>
 
 <nav
+	bind:this={nav}
 	aria-label={label}
 	class="relative inline-flex max-w-full rounded-full bg-surface-2 p-1 {klass}"
 >

web-player/src/routes/(app)/library/+layout.svelte

@@ -14,6 +14,11 @@
 			href: '/library/uploads',
 			label: 'Subidas',
 			description: 'Sube varias canciones a la vez y añádelas a tu biblioteca.'
+		},
+		{
+			href: '/library/invitations',
+			label: 'Invitaciones',
+			description: 'Responde a las invitaciones para figurar como coautor de una canción.'
 		}
 	];
 </script>