aiolabs/webapp
8
0
Fork 0
Code Issues 65 Pull requests Projects Releases Packages Wiki Activity Actions

feat(events): drop the week-day strip, move calendar next to filters

Browse source 
The feed had two redundant day controls — the DatePickerStrip week strip
and the temporal preset pills — on top of the calendar page. Remove the
week strip (the calendar already covers picking a specific date) and move
the calendar shortcut to the end of the temporal-filter row, next to the
pills. Frees a row and keeps coarse windows (Today/This Week/…) inline
with one-tap access to the full calendar.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Padreug 2026-06-16 01:03:54 +02:00
commit 7ddd3f5937
1 changed files with 12 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

37
src/modules/events/views/EventsPage.vue
View file

@ -26,7 +26,6 @@ import { useEventsStore } from '../stores/events'
import EventSearchOverlay from '../components/EventSearchOverlay.vue'
import TemporalFilterBar from '../components/TemporalFilterBar.vue'
import CategoryFilterBar from '../components/CategoryFilterBar.vue'
import DatePickerStrip from '../components/DatePickerStrip.vue'
import EventList from '../components/EventList.vue'
import type { Event } from '../types/event'
@ -41,10 +40,8 @@ const {
temporal,
selectedCategories,
hasActiveFilters,
selectedDate,
showPast,
onlyHosting,
selectDate,
setTemporal,
toggleCategory,
clearCategories,
@ -118,28 +115,6 @@ function openCalendar() {
/>
</div>
<!-- Date picker strip + calendar shortcut. The calendar icon used
to be a bottom-nav tab; it now lives on the right of the week
strip so the tabs row stays focused on the primary views.
Hidden in the Hosting view — operators don't need calendar
navigation when they're managing their own roster. -->
<div v-if="!onlyHosting" class="mb-3 flex items-center gap-2">
<DatePickerStrip
class="flex-1 min-w-0"
:selected-date="selectedDate"
@select="selectDate"
/>
<Button
variant="ghost"
size="icon"
class="h-8 w-8 shrink-0"
:aria-label="t('events.nav.calendar')"
@click="openCalendar"
>
<CalendarDays class="h-4 w-4" />
</Button>
</div>
<!-- Filters trigger + Clear-all stay stationary in a left-aligned
column; only the temporal pills scroll horizontally. The
Filters icon (with a count badge when categories are active)
@ -186,6 +161,18 @@ function openCalendar() {
@toggle-past="togglePast"
/>
</div>
<!-- Calendar shortcut — sits at the end of the filter row next to
the temporal pills (the week-day strip was removed in favour
of the calendar for picking specific dates). -->
<Button
variant="ghost"
size="icon"
class="h-8 w-8 shrink-0"
:aria-label="t('events.nav.calendar')"
@click="openCalendar"
>
<CalendarDays class="h-4 w-4" />
</Button>
</div>
<CollapsibleContent class="mt-3">
<CategoryFilterBar