From e9d4cbfdbaaf57f870908a1a250a9a5b9fe13599 Mon Sep 17 00:00:00 2001
From: Till JS <tills95@gmail.com>
Date: Fri, 3 Apr 2026 00:26:22 +0200
Subject: [PATCH] =?UTF-8?q?fix(manacore/web):=20fix=20tag=20drag-and-drop?=
 =?UTF-8?q?=20=E2=80=94=20use=20reactive=20.value=20instead=20of=20.subscr?=
 =?UTF-8?q?ibe()?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

useAllTags() returns a Svelte 5 runes object with .value, not an
Observable with .subscribe(). Also fix getTagsByIds() calls to pass
the allTags array as first argument.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../apps/web/src/lib/modules/calendar/ListView.svelte |  7 +++++--
 .../apps/web/src/lib/modules/contacts/ListView.svelte |  7 +++++--
 .../apps/web/src/lib/modules/todo/ListView.svelte     |  7 +++++--
 apps/manacore/apps/web/src/routes/(app)/+page.svelte  | 11 ++---------
 4 files changed, 17 insertions(+), 15 deletions(-)

diff --git a/apps/manacore/apps/web/src/lib/modules/calendar/ListView.svelte b/apps/manacore/apps/web/src/lib/modules/calendar/ListView.svelte
index e2ac83c2d..4e78e6edb 100644
--- a/apps/manacore/apps/web/src/lib/modules/calendar/ListView.svelte
+++ b/apps/manacore/apps/web/src/lib/modules/calendar/ListView.svelte
@@ -12,10 +12,13 @@
 	import type { ViewProps } from '$lib/components/workbench/nav-stack';
 	import { dropTarget } from '@manacore/shared-ui/dnd';
 	import type { TagDragData } from '@manacore/shared-ui/dnd';
-	import { getTagsByIds } from '$lib/stores/tags.svelte';
+	import { useAllTags, getTagsByIds } from '$lib/stores/tags.svelte';
 
 	let { navigate, goBack, params }: ViewProps = $props();
 
+	const tagsQuery = useAllTags();
+	let allTags = $derived(tagsQuery.value ?? []);
+
 	function handleTagDrop(eventId: string, tagData: TagDragData) {
 		const event = events.find((e) => e.id === eventId);
 		if (!event) return;
@@ -133,7 +136,7 @@
 		</form>
 
 		{#each todayEvents as event (event.id)}
-			{@const eventTags = getTagsByIds(event.tagIds ?? [])}
+			{@const eventTags = getTagsByIds(allTags, event.tagIds ?? [])}
 			<button
 				class="event-card"
 				onclick={() =>
diff --git a/apps/manacore/apps/web/src/lib/modules/contacts/ListView.svelte b/apps/manacore/apps/web/src/lib/modules/contacts/ListView.svelte
index 3c0196f1a..f6b1a9dbb 100644
--- a/apps/manacore/apps/web/src/lib/modules/contacts/ListView.svelte
+++ b/apps/manacore/apps/web/src/lib/modules/contacts/ListView.svelte
@@ -12,10 +12,13 @@
 	import type { ViewProps } from '$lib/components/workbench/nav-stack';
 	import { dropTarget } from '@manacore/shared-ui/dnd';
 	import type { TagDragData } from '@manacore/shared-ui/dnd';
-	import { getTagsByIds } from '$lib/stores/tags.svelte';
+	import { useAllTags, getTagsByIds } from '$lib/stores/tags.svelte';
 
 	let { navigate, goBack, params }: ViewProps = $props();
 
+	const tagsQuery = useAllTags();
+	let allTags = $derived(tagsQuery.value ?? []);
+
 	function handleTagDrop(contactId: string, tagData: TagDragData) {
 		const contact = contacts.find((c) => c.id === contactId);
 		if (!contact) return;
@@ -98,7 +101,7 @@
 
 	<div class="contact-list">
 		{#each filtered() as contact (contact.id)}
-			{@const contactTags = getTagsByIds(contact.tagIds ?? [])}
+			{@const contactTags = getTagsByIds(allTags, contact.tagIds ?? [])}
 			<button
 				class="contact-item"
 				onclick={() =>
diff --git a/apps/manacore/apps/web/src/lib/modules/todo/ListView.svelte b/apps/manacore/apps/web/src/lib/modules/todo/ListView.svelte
index 23f129da4..6049b018b 100644
--- a/apps/manacore/apps/web/src/lib/modules/todo/ListView.svelte
+++ b/apps/manacore/apps/web/src/lib/modules/todo/ListView.svelte
@@ -17,10 +17,13 @@
 	import type { ViewProps } from '$lib/components/workbench/nav-stack';
 	import { dropTarget } from '@manacore/shared-ui/dnd';
 	import type { TagDragData } from '@manacore/shared-ui/dnd';
-	import { getTagsByIds } from '$lib/stores/tags.svelte';
+	import { useAllTags, getTagsByIds } from '$lib/stores/tags.svelte';
 
 	let { navigate, goBack, params }: ViewProps = $props();
 
+	const tagsQuery = useAllTags();
+	let allTags = $derived(tagsQuery.value ?? []);
+
 	function getTaskTagIds(task: import('./types').Task): string[] {
 		return ((task.metadata as Record<string, unknown>)?.labelIds as string[]) ?? [];
 	}
@@ -109,7 +112,7 @@
 	<div class="task-list">
 		{#each filtered() as task (task.id)}
 			{@const taskTagIds = getTaskTagIds(task)}
-			{@const taskTags = getTagsByIds(taskTagIds)}
+			{@const taskTags = getTagsByIds(allTags, taskTagIds)}
 			<button
 				onclick={() =>
 					navigate('detail', {
diff --git a/apps/manacore/apps/web/src/routes/(app)/+page.svelte b/apps/manacore/apps/web/src/routes/(app)/+page.svelte
index 87c85d1d9..d2a9f556e 100644
--- a/apps/manacore/apps/web/src/routes/(app)/+page.svelte
+++ b/apps/manacore/apps/web/src/routes/(app)/+page.svelte
@@ -6,17 +6,10 @@
 	import { createAppSettingsStore } from '@manacore/shared-stores';
 	import { DragPreview, dragSource } from '@manacore/shared-ui/dnd';
 	import { useAllTags } from '$lib/stores/tags.svelte';
-	import type { Tag } from '@manacore/shared-tags';
 
 	// ── Tags for drag & drop ───────────────────────────────
-	const allTags$ = useAllTags();
-	let allTags = $state<Tag[]>([]);
-	$effect(() => {
-		const sub = allTags$.subscribe((val) => {
-			allTags = val ?? [];
-		});
-		return () => sub.unsubscribe();
-	});
+	const tagsQuery = useAllTags();
+	let allTags = $derived(tagsQuery.value ?? []);
 
 	// ── Persisted workbench state ───────────────────────────
 	const DEFAULT_WIDTH = 480;