From b665e3de0733ba7388e30d23b78cc5f1ebef3baf Mon Sep 17 00:00:00 2001
From: Padreug <padreug@aiolabs.dev>
Date: Tue, 16 Jun 2026 12:14:16 +0200
Subject: [PATCH] feat(events): re-add specific-day filter (calendar popup
 picks it)

Bring back selectedDate filtering, now driven by the calendar popup
instead of the removed week-strip: when a day is picked it takes
priority over the temporal pills and bypasses the past/upcoming split.
Add a dedicated clearSelectedDate() so the date selection can be cleared
independently of categories (a preset pill also clears it).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 .../events/composables/useEventFilters.ts     | 56 ++++++++++++++-----
 1 file changed, 43 insertions(+), 13 deletions(-)

diff --git a/src/modules/events/composables/useEventFilters.ts b/src/modules/events/composables/useEventFilters.ts
index 8742cd1..38eb9ce 100644
--- a/src/modules/events/composables/useEventFilters.ts
+++ b/src/modules/events/composables/useEventFilters.ts
@@ -15,6 +15,10 @@ import { DEFAULT_FILTERS } from '../types/filters'
 // tapping Hosting toggled a private ref the page never saw.
 const temporal = ref<TemporalFilter>(DEFAULT_FILTERS.temporal)
 const selectedCategories = ref<EventCategory[]>([])
+// A specific day picked from the calendar popup. When set it takes
+// priority over the temporal pills + past/upcoming split (browse any
+// single day). Cleared independently of categories.
+const selectedDate = ref<Date | undefined>(undefined)
 const onlyOwnedTickets = ref(false)
 const onlyHosting = ref(false)
 const showPast = ref(false)
@@ -35,20 +39,31 @@ export function useEventFilters() {
   function applyFilters(events: Event[]): Event[] {
     let result = events
 
-    // Temporal filter (preset pills). Specific-date browsing now lives on
-    // the calendar page, so the feed only narrows by these windows.
-    result = applyTemporalFilter(result, temporal.value)
+    if (selectedDate.value) {
+      // Specific day picked from the calendar popup — takes priority over
+      // the temporal pills and bypasses the past/upcoming split so any
+      // day (past or future) can be browsed.
+      const dayStart = startOfDay(selectedDate.value)
+      const dayEnd = endOfDay(selectedDate.value)
+      result = result.filter(a => {
+        const eventEnd = a.endDate ?? a.startDate
+        return a.startDate <= dayEnd && eventEnd >= dayStart
+      })
+    } else {
+      // Temporal filter (preset pills).
+      result = applyTemporalFilter(result, temporal.value)
 
-    // Past/upcoming split — the chip narrows to one side of "now",
-    // mirroring the "My tickets" / "Hosting" mental model. Default
-    // (showPast=false) is upcoming-only; toggling on flips to past-only.
-    // Composes with temporal pills: "This Week" + showPast=true shows
-    // only the days already passed this week.
-    const now = new Date()
-    result = result.filter(a => {
-      const eventEnd = a.endDate ?? a.startDate
-      return showPast.value ? eventEnd < now : eventEnd >= now
-    })
+      // Past/upcoming split — the chip narrows to one side of "now",
+      // mirroring the "My tickets" / "Hosting" mental model. Default
+      // (showPast=false) is upcoming-only; toggling on flips to
+      // past-only. Composes with temporal pills: "This Week" +
+      // showPast=true shows only the days already passed this week.
+      const now = new Date()
+      result = result.filter(a => {
+        const eventEnd = a.endDate ?? a.startDate
+        return showPast.value ? eventEnd < now : eventEnd >= now
+      })
+    }
 
     // Category filter
     if (selectedCategories.value.length > 0) {
@@ -69,6 +84,16 @@ export function useEventFilters() {
 
   function setTemporal(value: TemporalFilter) {
     temporal.value = value
+    selectedDate.value = undefined // a preset pill clears the day pick
+  }
+
+  function selectDate(date: Date) {
+    selectedDate.value = date
+    temporal.value = 'all' // a specific day overrides the temporal pill
+  }
+
+  function clearSelectedDate() {
+    selectedDate.value = undefined
   }
 
   function toggleCategory(category: EventCategory) {
@@ -87,6 +112,7 @@ export function useEventFilters() {
   function resetFilters() {
     temporal.value = DEFAULT_FILTERS.temporal
     selectedCategories.value = []
+    selectedDate.value = undefined
     onlyOwnedTickets.value = false
     onlyHosting.value = false
     showPast.value = false
@@ -107,6 +133,7 @@ export function useEventFilters() {
   const hasActiveFilters = computed(() =>
     temporal.value !== 'all' ||
     selectedCategories.value.length > 0 ||
+    selectedDate.value !== undefined ||
     onlyOwnedTickets.value ||
     onlyHosting.value ||
     showPast.value
@@ -116,6 +143,7 @@ export function useEventFilters() {
     // State
     temporal,
     selectedCategories,
+    selectedDate,
     onlyOwnedTickets,
     onlyHosting,
     showPast,
@@ -125,6 +153,8 @@ export function useEventFilters() {
     // Actions
     applyFilters,
     setTemporal,
+    selectDate,
+    clearSelectedDate,
     toggleCategory,
     clearCategories,
     toggleOwnedTickets,