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:
@@ -8,7 +8,8 @@ import {
|
||||
buildDensityUrl,
|
||||
aggregateToYears,
|
||||
selectionBoundaryFrom,
|
||||
selectionBoundaryTo
|
||||
selectionBoundaryTo,
|
||||
clipBucketsToRange
|
||||
} from './timeline';
|
||||
|
||||
describe('monthBoundaryFrom', () => {
|
||||
@@ -141,6 +142,37 @@ describe('aggregateToYears', () => {
|
||||
});
|
||||
});
|
||||
|
||||
describe('clipBucketsToRange', () => {
|
||||
const buckets = [
|
||||
{ month: '1915-08', count: 5 },
|
||||
{ month: '1915-09', count: 2 },
|
||||
{ month: '1915-10', count: 8 },
|
||||
{ month: '1915-11', count: 3 }
|
||||
];
|
||||
|
||||
it('returns the original buckets when range bounds are null', () => {
|
||||
expect(clipBucketsToRange(buckets, null, null)).toBe(buckets);
|
||||
});
|
||||
|
||||
it('keeps only buckets whose month falls within the range', () => {
|
||||
expect(clipBucketsToRange(buckets, '1915-09-01', '1915-10-31')).toEqual([
|
||||
{ month: '1915-09', count: 2 },
|
||||
{ month: '1915-10', count: 8 }
|
||||
]);
|
||||
});
|
||||
|
||||
it('returns an empty array when the range excludes everything', () => {
|
||||
expect(clipBucketsToRange(buckets, '1916-01-01', '1916-12-31')).toEqual([]);
|
||||
});
|
||||
|
||||
it('treats partial dates correctly when bounds cross month boundaries', () => {
|
||||
expect(clipBucketsToRange(buckets, '1915-09-15', '1915-10-15')).toEqual([
|
||||
{ month: '1915-09', count: 2 },
|
||||
{ month: '1915-10', count: 8 }
|
||||
]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('selectionBoundaryFrom / To', () => {
|
||||
it('handles month labels (YYYY-MM)', () => {
|
||||
expect(selectionBoundaryFrom('1915-08')).toBe('1915-08-01');
|
||||
|
||||
Reference in New Issue
Block a user