diff --git a/src/lib/components/workspace/Prompts/PromptEditor.svelte b/src/lib/components/workspace/Prompts/PromptEditor.svelte index 485efa536..fb774e778 100644 --- a/src/lib/components/workspace/Prompts/PromptEditor.svelte +++ b/src/lib/components/workspace/Prompts/PromptEditor.svelte @@ -47,6 +47,9 @@ let history: any[] = []; let historyLoading = false; let selectedHistoryEntry: any = null; + let historyOffset = 0; + let historyHasMore = true; + const HISTORY_PAGE_SIZE = 20; $: if (!edit && !hasManualEdit) { command = name !== '' ? slugify(name) : ''; @@ -76,7 +79,7 @@ showEditModal = false; commitMessage = ''; isProduction = true; - await loadHistory(); + await loadHistory(true); // Reset and reload // Select the newest version after saving if (history.length > 0) { selectedHistoryEntry = history[0]; @@ -95,18 +98,51 @@ return regex.test(inputString); }; - const loadHistory = async () => { - if (!prompt?.command || !edit) return; + const loadHistory = async (reset = false) => { + if (!prompt?.id || !edit) return; + if (historyLoading) return; + if (!reset && !historyHasMore) return; + historyLoading = true; + + if (reset) { + historyOffset = 0; + historyHasMore = true; + } + try { - history = await getPromptHistory(localStorage.token, prompt.id); + const newEntries = await getPromptHistory( + localStorage.token, + prompt.id, + HISTORY_PAGE_SIZE, + historyOffset + ); + + if (reset) { + history = newEntries; + } else { + history = [...history, ...newEntries]; + } + + historyHasMore = newEntries.length === HISTORY_PAGE_SIZE; + historyOffset += newEntries.length; } catch (error) { console.error('Failed to load history:', error); - history = []; + if (reset) { + history = []; + } } historyLoading = false; }; + const handleHistoryScroll = (e: Event) => { + const target = e.target as HTMLElement; + const nearBottom = target.scrollHeight - target.scrollTop <= target.clientHeight + 50; + if (nearBottom && historyHasMore && !historyLoading) { + loadHistory(false); + } + }; + const setAsProduction = async (historyEntry: any) => { if (disabled) { toast.error($i18n.t('You do not have permission to edit this prompt.')); @@ -224,23 +260,25 @@ bind:checked={isProduction} class="w-4 h-4 rounded border-gray-300 dark:border-gray-600" /> - {$i18n.t('Set as Production')} + {$i18n.t('Set as Production')}