feat(manacore/web): add share via uLoad to todo, cards, and chat

Adds ShareNetwork button and ShareModal to:
- Todo: task detail expanded view
- Cards: deck header actions
- Chat: conversation header (between pin and delete)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Till JS 2026-04-01 22:58:06 +02:00
parent 2105cc6cc4
commit eeb38275bd
3 changed files with 75 additions and 1 deletions

View file

@ -6,11 +6,16 @@
import { cardStore } from '$lib/modules/cards/stores/cards.svelte';
import { useDeck, useCardsByDeck } from '$lib/modules/cards/queries';
import type { Deck, Card } from '$lib/modules/cards/types';
import { ArrowLeft, Trash, Plus } from '@manacore/shared-icons';
import { ArrowLeft, Trash, Plus, ShareNetwork } from '@manacore/shared-icons';
import { ShareModal } from '@manacore/shared-uload';
let deckId = $derived($page.params.id);
let showDeleteConfirm = $state(false);
let deleting = $state(false);
let showShare = $state(false);
let shareUrl = $derived(
`${typeof window !== 'undefined' ? window.location.origin : ''}/cards/decks/${deckId}`
);
// New card form
let showNewCardForm = $state(false);
@ -87,6 +92,13 @@
Offentlich
</span>
{/if}
<button
onclick={() => (showShare = true)}
class="rounded-lg border border-border p-2 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground"
title="Kurzlink teilen"
>
<ShareNetwork size={16} />
</button>
<button
class="rounded-lg border border-destructive/30 p-2 text-destructive transition-colors hover:bg-destructive/10"
onclick={() => (showDeleteConfirm = true)}
@ -276,3 +288,13 @@
</button>
</div>
{/if}
<!-- Share Modal (uLoad integration) -->
<ShareModal
visible={showShare}
onClose={() => (showShare = false)}
url={shareUrl}
title={deck?.title ?? ''}
source="cards"
description={deck?.description ?? ''}
/>

View file

@ -14,7 +14,9 @@
PencilSimple,
Check,
X,
ShareNetwork,
} from '@manacore/shared-icons';
import { ShareModal } from '@manacore/shared-uload';
const conversationsCtx: { readonly value: Conversation[] } = getContext('conversations');
@ -29,6 +31,10 @@
let isSending = $state(false);
let isEditingTitle = $state(false);
let editTitle = $state('');
let showShare = $state(false);
let shareUrl = $derived(
`${typeof window !== 'undefined' ? window.location.origin : ''}/chat/${conversationId}`
);
async function handleSend() {
const text = inputText.trim();
@ -153,6 +159,13 @@
>
<PushPin size={18} weight={conversation?.isPinned ? 'fill' : 'regular'} />
</button>
<button
onclick={() => (showShare = true)}
class="rounded-lg p-1.5 text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--foreground))]"
title="Kurzlink teilen"
>
<ShareNetwork size={18} />
</button>
<button
onclick={handleDelete}
class="rounded-lg p-1.5 text-[hsl(var(--muted-foreground))] hover:text-red-500"
@ -214,3 +227,12 @@
</div>
</div>
</div>
<!-- Share Modal (uLoad integration) -->
<ShareModal
visible={showShare}
onClose={() => (showShare = false)}
url={shareUrl}
title={conversation?.title ?? 'Chat'}
source="chat"
/>

View file

@ -39,7 +39,9 @@
CaretRight,
Folder,
CheckCircle,
ShareNetwork,
} from '@manacore/shared-icons';
import { ShareModal } from '@manacore/shared-uload';
// Get data from layout context
const allTasks$: Observable<Task[]> = getContext('tasks');
@ -105,6 +107,14 @@
return sortTasks(tasks, viewStore.sortBy, viewStore.sortOrder);
});
// Share modal state
let shareTask = $state<Task | null>(null);
let shareUrl = $derived(
shareTask
? `${typeof window !== 'undefined' ? window.location.origin : ''}/todo?task=${shareTask.id}`
: ''
);
// Quick add task
let newTaskTitle = $state('');
let isAdding = $state(false);
@ -455,6 +465,16 @@
})}
class="rounded-md border border-border bg-background px-2 py-1 text-xs focus:border-primary focus:outline-none"
/>
<button
onclick={(e) => {
e.stopPropagation();
shareTask = task;
}}
class="rounded-md px-2 py-1 text-xs text-muted-foreground transition-colors hover:bg-muted"
title="Kurzlink teilen"
>
<ShareNetwork size={14} />
</button>
<button
onclick={(e) => handleDeleteTask(e, task)}
class="ml-auto rounded-md px-2 py-1 text-xs text-red-500 transition-colors hover:bg-red-500/10"
@ -533,6 +553,16 @@
{/if}
</div>
<!-- Share Modal (uLoad integration) -->
<ShareModal
visible={shareTask !== null}
onClose={() => (shareTask = null)}
url={shareUrl}
title={shareTask?.title ?? ''}
source="todo"
description={shareTask?.description ?? ''}
/>
<style>
/* DnD: tag hovering over task item */
:global(.mana-drop-target-hover) {