From ae73f70ad0dc5df3879c1280591c4fddf7ed7567 Mon Sep 17 00:00:00 2001
From: Till JS <tills95@gmail.com>
Date: Wed, 1 Apr 2026 22:59:29 +0200
Subject: [PATCH] feat(manacore/web): add share via uLoad to mukke playlists
 and presi decks

Adds ShareNetwork button and ShareModal to:
- Mukke: playlist detail header (between play all and delete)
- Presi: deck header actions (next to add slide)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../(app)/mukke/playlists/[id]/+page.svelte   | 23 +++++++++++++++++++
 .../routes/(app)/presi/deck/[id]/+page.svelte | 20 ++++++++++++++++
 2 files changed, 43 insertions(+)

diff --git a/apps/manacore/apps/web/src/routes/(app)/mukke/playlists/[id]/+page.svelte b/apps/manacore/apps/web/src/routes/(app)/mukke/playlists/[id]/+page.svelte
index 5d5e164d3..543fc4ef7 100644
--- a/apps/manacore/apps/web/src/routes/(app)/mukke/playlists/[id]/+page.svelte
+++ b/apps/manacore/apps/web/src/routes/(app)/mukke/playlists/[id]/+page.svelte
@@ -15,7 +15,9 @@
 		PencilSimple,
 		Check,
 		X,
+		ShareNetwork,
 	} from '@manacore/shared-icons';
+	import { ShareModal } from '@manacore/shared-uload';
 
 	const songsCtx: { readonly value: Song[] } = getContext('songs');
 	const playlistsCtx: { readonly value: Playlist[] } = getContext('playlists');
@@ -27,6 +29,10 @@
 
 	let isEditingName = $state(false);
 	let editName = $state('');
+	let showShare = $state(false);
+	let shareUrl = $derived(
+		`${typeof window !== 'undefined' ? window.location.origin : ''}/mukke/playlists/${playlistId}`
+	);
 
 	function startEdit() {
 		editName = playlist?.name ?? '';
@@ -123,6 +129,13 @@
 					Alle abspielen
 				</button>
 			{/if}
+			<button
+				onclick={() => (showShare = true)}
+				class="rounded-lg p-2 text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--foreground))]"
+				title="Kurzlink teilen"
+			>
+				<ShareNetwork size={20} />
+			</button>
 			<button
 				onclick={handleDeletePlaylist}
 				class="rounded-lg p-2 text-[hsl(var(--muted-foreground))] hover:text-red-500"
@@ -202,3 +215,13 @@
 		</div>
 	{/if}
 </div>
+
+<!-- Share Modal (uLoad integration) -->
+<ShareModal
+	visible={showShare}
+	onClose={() => (showShare = false)}
+	url={shareUrl}
+	title={playlist?.name ?? 'Playlist'}
+	source="mukke"
+	description="{songs.length} {songs.length === 1 ? 'Song' : 'Songs'}"
+/>
diff --git a/apps/manacore/apps/web/src/routes/(app)/presi/deck/[id]/+page.svelte b/apps/manacore/apps/web/src/routes/(app)/presi/deck/[id]/+page.svelte
index 38ef6b2c3..667e53456 100644
--- a/apps/manacore/apps/web/src/routes/(app)/presi/deck/[id]/+page.svelte
+++ b/apps/manacore/apps/web/src/routes/(app)/presi/deck/[id]/+page.svelte
@@ -17,7 +17,9 @@
 		PencilSimple,
 		X,
 		FloppyDisk,
+		ShareNetwork,
 	} from '@manacore/shared-icons';
+	import { ShareModal } from '@manacore/shared-uload';
 
 	let showSlideModal = $state(false);
 	let editingSlide = $state<Slide | null>(null);
@@ -29,6 +31,7 @@
 	let slideBulletPoints = $state<string[]>(['']);
 	let slideImageUrl = $state('');
 	let isSaving = $state(false);
+	let showShare = $state(false);
 
 	const deckId = $page.params.id as string;
 	const deckQuery = useDeck(deckId);
@@ -149,6 +152,13 @@
 				>
 					<Plus class="w-5 h-5" /> Add Slide
 				</button>
+				<button
+					onclick={() => (showShare = true)}
+					class="rounded-lg p-2 text-slate-500 dark:text-slate-400 hover:text-slate-700 dark:hover:text-slate-200 transition-colors"
+					title="Kurzlink teilen"
+				>
+					<ShareNetwork size={20} />
+				</button>
 				{#if currentSlides.length > 0}
 					<a
 						href="/presi/present/{deckId}"
@@ -386,3 +396,13 @@
 		</div>
 	</div>
 {/if}
+
+<!-- Share Modal (uLoad integration) -->
+<ShareModal
+	visible={showShare}
+	onClose={() => (showShare = false)}
+	url={typeof window !== 'undefined' ? `${window.location.origin}/presi/deck/${deckId}` : ''}
+	title={currentDeck?.name ?? 'Presentation'}
+	source="presi"
+	description={currentDeck?.description ?? ''}
+/>