refac: add copy link functionality to notes view

This commit is contained in:
Tim Jaeryang Baek 2025-07-12 15:20:21 +04:00
parent d99698f7eb
commit 290f4023b1
2 changed files with 49 additions and 33 deletions

View file

@ -32,7 +32,7 @@
import { WEBUI_NAME, config, prompts as _prompts, user } from '$lib/stores';
import { createNewNote, deleteNoteById, getNotes } from '$lib/apis/notes';
import { capitalizeFirstLetter } from '$lib/utils';
import { capitalizeFirstLetter, copyToClipboard } from '$lib/utils';
import EllipsisHorizontal from '../icons/EllipsisHorizontal.svelte';
import DeleteConfirmDialog from '$lib/components/common/ConfirmDialog.svelte';
@ -324,6 +324,16 @@
downloadHandler(type);
}}
onCopyLink={async () => {
const baseUrl = window.location.origin;
const res = await copyToClipboard(`${baseUrl}/notes/${note.id}`);
if (res) {
toast.success($i18n.t('Copied link to clipboard'));
} else {
toast.error($i18n.t('Failed to copy link'));
}
}}
onDelete={() => {
selectedNote = note;
showDeleteConfirm = true;

View file

@ -23,8 +23,8 @@
export let onDownload = (type) => {};
export let onDelete = () => {};
export let onCopyLink = () => {};
export let onCopyToClipboard = () => {};
export let onCopyLink = null;
export let onCopyToClipboard = null;
export let onChange = () => {};
</script>
@ -89,6 +89,7 @@
</DropdownMenu.SubContent>
</DropdownMenu.Sub>
{#if onCopyLink || onCopyToClipboard}
<DropdownMenu.Sub>
<DropdownMenu.SubTrigger
class="flex gap-2 items-center px-3 py-2 text-sm cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-md"
@ -102,6 +103,7 @@
transition={flyAndScale}
sideOffset={8}
>
{#if onCopyLink}
<DropdownMenu.Item
class="flex gap-2 items-center px-3 py-2 text-sm cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-md"
on:click={() => {
@ -111,7 +113,9 @@
<Link />
<div class="flex items-center">{$i18n.t('Copy link')}</div>
</DropdownMenu.Item>
{/if}
{#if onCopyToClipboard}
<DropdownMenu.Item
class="flex gap-2 items-center px-3 py-2 text-sm cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-md"
on:click={() => {
@ -121,8 +125,10 @@
<DocumentDuplicate strokeWidth="2" />
<div class="flex items-center">{$i18n.t('Copy to clipboard')}</div>
</DropdownMenu.Item>
{/if}
</DropdownMenu.SubContent>
</DropdownMenu.Sub>
{/if}
<DropdownMenu.Item
class="flex gap-2 items-center px-3 py-1.5 text-sm cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-md"