feat: scroll the calendar week and day views sideways #759

The week view showed one week and only the arrows moved it, and there
was no day view at all (a "day" default view opened the agenda). With
free scrolling on (the default) both are now one strip of day columns
that scrolls sideways, as in the webmail (15a5497a):

- the week view shows seven columns and snaps to single days; the new
  day view shows one column and moves a day per swipe; the title
  follows the first day in view and the arrows step from it
- reaching either end adds days and loads only their events; days added
  at the start keep the columns on screen in place
- the day headers and the all-day strip follow the sideways scroll on
  the native thread; all-day bars are cut per week (per day in the day
  view) so each part carries its title
- columns are windowed and lay out their events once per change

The day view is offered as a default view again. With free scrolling
off, or in right-to-left layouts, the week view pages as before and the
day view shows a single day.
This commit is contained in:
Linus Rath
2026-09-24 20:25:40 +02:00
parent caf61ece79
commit de3d697aa9
5 changed files with 1128 additions and 28 deletions
+2 -5
View File
@@ -63,19 +63,16 @@ export function CalendarSettings() {
];
}, [deviceZone, timeZone, t]);
// The mobile app has no dedicated day grid ("day" falls back to the
// agenda), so the option isn't offered; a synced "day" value shows as Agenda.
const effectiveView: CalendarView = viewMode === 'day' ? 'agenda' : viewMode;
return (
<SettingsSection title={t('calendar.settings.title', 'Calendar')}>
<SettingItem label={t('calendar.settings.default_view', 'Default view')}>
<Select
value={effectiveView}
value={viewMode}
onChange={(v) => update('calendarDefaultView', v as CalendarView)}
options={[
{ value: 'month', label: t('calendar.views.month', 'Month') },
{ value: 'week', label: t('calendar.views.week', 'Week') },
{ value: 'day', label: t('calendar.views.day', 'Day') },
{ value: 'agenda', label: t('calendar.views.agenda', 'Agenda') },
]}
/>