From 30c91e46e5d237bee3c8805bd54749408cc2727a Mon Sep 17 00:00:00 2001 From: Timothy Jaeryang Baek Date: Fri, 17 Jul 2026 00:00:24 -0400 Subject: [PATCH] refac --- src/lib/apis/notes/index.ts | 7 +- src/lib/components/notes/Notes.svelte | 189 ++++++++++++++++++-------- 2 files changed, 138 insertions(+), 58 deletions(-) diff --git a/src/lib/apis/notes/index.ts b/src/lib/apis/notes/index.ts index ee33948521..e03d935f9c 100644 --- a/src/lib/apis/notes/index.ts +++ b/src/lib/apis/notes/index.ts @@ -97,7 +97,8 @@ export const searchNotes = async ( viewOption: string | null = null, permission: string | null = null, sortKey: string | null = null, - page: number | null = null + page: number | null = null, + direction: string | null = null ) => { let error = null; const searchParams = new URLSearchParams(); @@ -118,6 +119,10 @@ export const searchNotes = async ( searchParams.append('order_by', sortKey); } + if (direction !== null) { + searchParams.append('direction', direction); + } + if (page !== null) { searchParams.append('page', `${page}`); } diff --git a/src/lib/components/notes/Notes.svelte b/src/lib/components/notes/Notes.svelte index 3bd6a86eb4..1b184b7f5a 100644 --- a/src/lib/components/notes/Notes.svelte +++ b/src/lib/components/notes/Notes.svelte @@ -55,6 +55,8 @@ import Loader from '../common/Loader.svelte'; import SidebarIcon from '../icons/Sidebar.svelte'; import SplitCreateButton from '../common/SplitCreateButton.svelte'; + import ChevronDown from '../icons/ChevronDown.svelte'; + import ChevronUp from '../icons/ChevronUp.svelte'; let loaded = false; @@ -62,6 +64,7 @@ let importDocumentFiles: FileList | null = null; let notesImportInputElement: HTMLInputElement; let selectedNote = null; + let openNoteMenuId: string | null = null; let showDeleteConfirm = false; let notes = {}; @@ -72,7 +75,8 @@ let query = ''; let searchDebounceTimer: ReturnType; - let sortKey = null; + let sortKey = 'updated_at'; + let sortDirection = 'desc'; let displayOption = null; let viewOption = null; let permission = null; @@ -190,7 +194,13 @@ }, 300); }; - $: if (loaded && sortKey !== undefined && permission !== undefined && viewOption !== undefined) { + $: if ( + loaded && + sortKey !== undefined && + sortDirection !== undefined && + permission !== undefined && + viewOption !== undefined + ) { init(); } @@ -207,13 +217,13 @@ viewOption, permission, sortKey, - page + page, + sortKey ? sortDirection : null ).catch(() => { return []; }); if (res) { - console.log(res); total = res.total; const pageItems = res.items; @@ -261,6 +271,15 @@ return orderedKeys.map((key) => [key, grouped[key]] as [string, any[]]); }; + const setSortKey = (key: string) => { + if (sortKey === key) { + sortDirection = sortDirection === 'asc' ? 'desc' : 'asc'; + } else { + sortKey = key; + sortDirection = key === 'updated_at' ? 'desc' : 'asc'; + } + }; + let dragged = false; const onDragOver = (e) => { @@ -509,9 +528,47 @@ {@const groupedNotes = groupNotes(items)}
-
+
+ {#if displayOption === null} +
+ + + + + +
+ {/if} + {#each groupedNotes as [timeRange, notesList], idx} -
+
{$i18n.t(timeRange)}
@@ -520,86 +577,104 @@ class="{groupedNotes.length - 1 !== idx ? 'mb-3' : ''} gap-y-0.5 flex flex-col" > {#each notesList as note, idx (note.id)} -
{ + goto(`/notes/${note.id}`); + }} > - +
{note.title}
- { - selectedNote = note; +
+ { + selectedNote = note; - downloadHandler(type); - }} - onCopyLink={async () => { - const baseUrl = window.location.origin; - const res = await copyToClipboard(`${baseUrl}/notes/${note.id}`); + 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; - }} - isPinned={note.is_pinned ?? false} - onPin={async () => { - await toggleNotePinnedStatusById(localStorage.token, note.id); - pinnedNotes.set( - await getPinnedNoteList(localStorage.token).catch(() => []) - ); - init(); - }} - > - - -
+ + +
+ {/each}
{:else if displayOption === 'grid'} @@ -653,11 +728,11 @@ }} >