feat(documents): zoom-in tool for the timeline (#385)
Adds a zoom action that narrows the visible timeline range to the current selection so the user can drill from year-level back into month-level density. Zoom state lives in the URL (zoomFrom / zoomTo) so it survives reload and is shareable. - New `clipBucketsToRange(buckets, from, to)` helper applied before the >240-month year-aggregate decision, so a zoomed window flips back to month bars automatically when the clip narrows the range enough. - `TimelineDensityFilter` gains `zoomFrom`, `zoomTo`, and `onzoomchange` props. Zoom button shown only when a selection exists and we aren't already zoomed; reset-zoom shown only when zoomed. Both placed in a shared right-edge action cluster alongside the × clear button. - `+page.ts` reads zoomFrom/zoomTo from the URL and forwards them as props. `+page.svelte` extends FilterSnapshot + buildSearchParams, and triggerSearch accepts an optional zoom override so the onzoomchange callback can write the new pair (or clear them) atomically. - 7 new component tests + 2 new page-integration tests cover the visibility rules and URL writes. - 4 new unit tests for `clipBucketsToRange`. - 3 new i18n keys (zoom in / zoom reset / drag aria-live) across de/en/es. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -56,6 +56,23 @@ export function fillDensityGaps(
|
||||
return sequence.map((month) => ({ month, count: counts.get(month) ?? 0 }));
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns only the month buckets whose YYYY-MM falls inside the provided
|
||||
* `[fromInclusive, toInclusive]` ISO date range. When either bound is null the
|
||||
* input array is returned unchanged. Used by the timeline's zoom-in tool to
|
||||
* narrow the visible bars without refetching data.
|
||||
*/
|
||||
export function clipBucketsToRange(
|
||||
buckets: MonthBucket[],
|
||||
fromInclusive: string | null,
|
||||
toInclusive: string | null
|
||||
): MonthBucket[] {
|
||||
if (!fromInclusive || !toInclusive) return buckets;
|
||||
const fromMonth = fromInclusive.slice(0, 7);
|
||||
const toMonth = toInclusive.slice(0, 7);
|
||||
return buckets.filter((b) => b.month >= fromMonth && b.month <= toMonth);
|
||||
}
|
||||
|
||||
/**
|
||||
* Aggregates month-granular buckets into one entry per year. Month strings are
|
||||
* truncated to "YYYY" and counts are summed. Used when the date span is too
|
||||
|
||||
Reference in New Issue
Block a user