feat(calendar): filter imported events by title and date

Client-side filter over the already-loaded events list (T6.3, FR-CAL-2)
— 1700+ events from a real mailbox is unwieldy to browse unfiltered.
This commit is contained in:
iamdoubz committed 2026-07-06 14:19:14 -05:00
1 parent 2ca4151444
commit 8f98332cdd
1 file changed
+34 -1
+34 -1
View File
@@ -173,6 +173,26 @@
// ---- Calendar / .pst import (T6.1/T6.2/T6.3, FR-CAL-1/2) ----
let pstPath = $state("");
let pstPassword = $state("");
let eventTitleFilter = $state("");
let eventDateFilter = $state("");
function eventLocalYmd(unixSecs: number | null): string {
if (!unixSecs) return "";
const d = new Date(unixSecs * 1000);
return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, "0")}-${String(d.getDate()).padStart(2, "0")}`;
}
let filteredEvents = $derived(
calendar.events.filter((ev) => {
if (eventDateFilter && eventLocalYmd(ev.starts_at) !== eventDateFilter) return false;
if (
eventTitleFilter &&
!(ev.subject ?? "").toLowerCase().includes(eventTitleFilter.toLowerCase())
)
return false;
return true;
}),
);
async function pickPstFile() {
const path = await open({ filters: [{ name: "Outlook data file", extensions: ["pst"] }] });
@@ -708,8 +728,21 @@
{#if calendar.events.length === 0}
<p class="muted">No events imported yet.</p>
{:else}
<div class="grid">
<label class="wide"
>Search title
<input type="text" bind:value={eventTitleFilter} placeholder="Meeting name…" />
</label>
<label
>Date
<input type="date" bind:value={eventDateFilter} />
</label>
</div>
<p class="muted">
{filteredEvents.length} of {calendar.events.length} events
</p>
<ul class="events">
{#each calendar.events as ev (ev.id)}
{#each filteredEvents as ev (ev.id)}
<li>
<span class="name">{ev.subject ?? "(untitled)"}</span>
<span class="muted">{formatEventDate(ev.starts_at)}</span>