feat(timeline): add the "Ereignis hinzufügen" CTA to the Zeitstrahl header
Wrap the heading in a flex-wrap header so the gated add-event link drops below the title at narrow widths instead of overflowing; the CTA targets #781's /zeitstrahl/events/new and only shows for a WRITE_ALL viewer. Also thread canWrite into TimelineView so a curator sees the edit pencils on the real page. New i18n key timeline_add_event in de/en/es. Refs #842 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -213,3 +213,55 @@ describe('/zeitstrahl layer filter (#780)', () => {
|
||||
await expect.element(meta).toHaveTextContent(m.timeline_events_count({ count: 2 }));
|
||||
});
|
||||
});
|
||||
|
||||
describe('/zeitstrahl curator affordances (#842)', () => {
|
||||
const curated = (eventId: string) =>
|
||||
makeEntry({
|
||||
kind: 'EVENT',
|
||||
type: 'PERSONAL',
|
||||
derived: false,
|
||||
eventId,
|
||||
title: 'Auswanderung',
|
||||
senderName: '',
|
||||
receiverName: '',
|
||||
documentId: undefined
|
||||
});
|
||||
|
||||
const withWrite = (timeline: ReturnType<typeof makeTimelineDTO>) => ({
|
||||
...pageData(timeline),
|
||||
canWrite: true
|
||||
});
|
||||
|
||||
it('renders the add-event CTA in a wrapping header when the viewer can write (REQ-001)', () => {
|
||||
render(Page, { data: withWrite(makeTimelineDTO({ years: [makeYear(1909, [makeEntry()])] })) });
|
||||
const add = document.querySelector(
|
||||
'[data-testid="timeline-add-event"]'
|
||||
) as HTMLAnchorElement | null;
|
||||
expect(add).not.toBeNull();
|
||||
expect(add?.getAttribute('href')).toBe('/zeitstrahl/events/new');
|
||||
// The header wraps so the CTA drops below the heading at narrow widths (≤360px)
|
||||
// rather than overflowing — REQ-001.
|
||||
expect(add?.closest('header')?.classList.contains('flex-wrap')).toBe(true);
|
||||
});
|
||||
|
||||
it('renders no add-event CTA when the viewer cannot write (REQ-002)', () => {
|
||||
render(Page, {
|
||||
data: pageData(makeTimelineDTO({ years: [makeYear(1909, [makeEntry()])] }))
|
||||
});
|
||||
expect(document.querySelector('[data-testid="timeline-add-event"]')).toBeNull();
|
||||
});
|
||||
|
||||
it('threads canWrite to the timeline so a curator sees an event edit link (REQ-001/009)', () => {
|
||||
render(Page, {
|
||||
data: withWrite(makeTimelineDTO({ years: [makeYear(1924, [curated('p9')])] }))
|
||||
});
|
||||
expect(document.querySelector('a[href="/zeitstrahl/events/p9/edit"]')).not.toBeNull();
|
||||
});
|
||||
|
||||
it('shows no event edit link to a reader (REQ-007)', () => {
|
||||
render(Page, {
|
||||
data: pageData(makeTimelineDTO({ years: [makeYear(1924, [curated('p9')])] }))
|
||||
});
|
||||
expect(document.querySelector('[data-testid="event-edit"]')).toBeNull();
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user