Skip to content

Fix featured filters: Alpine conflict + show all months #3656

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
bernardhanna merged 1 commit into from
Sep 14, 2026
Merged

Fix featured filters: Alpine conflict + show all months #3656

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
37 changes: 18 additions & 19 deletions app/Livewire/OnlineCalendar.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,16 +18,15 @@ class OnlineCalendar extends Component

public $selectedMonth;

public $selectedDate;
public $selectedDate = 'all';

public $months = [];

public function mount()
{
$this->selectedYear = Carbon::now()->year;
$this->selectedMonth = Carbon::now()->month;
$this->selectedDate = $this->selectedMonth.'/'.$this->selectedYear;
// Default to all languages so the list is not silently reduced/restored by locale.
$this->selectedDate = 'all';
$this->selectedLanguage = '';

$this->months = $this->baseQuery()
Expand All @@ -48,13 +47,6 @@ public function mount()
})
->values()
->toArray();

if (! empty($this->months)) {
$parts = explode('/', $this->months[0]['id']);
$this->selectedMonth = (int) $parts[0];
$this->selectedYear = (int) ($parts[1] ?? $this->selectedYear);
$this->selectedDate = $this->selectedMonth.'/'.$this->selectedYear;
}
}

public function updatedSelectedDate(): void
Expand All @@ -69,15 +61,18 @@ public function updatedSelectedLanguage(): void

public function render()
{
$parts = explode('/', (string) $this->selectedDate);
$this->selectedMonth = (int) ($parts[0] ?: $this->selectedMonth);
$this->selectedYear = (int) ($parts[1] ?? $this->selectedYear);
$query = $this->baseQuery()->orderBy('start_date');

$events = $this->baseQuery()
->whereMonth('start_date', $this->selectedMonth)
->whereYear('start_date', $this->selectedYear)
->orderBy('start_date')
->get();
if ($this->selectedDate && $this->selectedDate !== 'all') {
$parts = explode('/', (string) $this->selectedDate);
$this->selectedMonth = (int) ($parts[0] ?: $this->selectedMonth);
$this->selectedYear = (int) ($parts[1] ?? $this->selectedYear);

$query->whereMonth('start_date', $this->selectedMonth)
->whereYear('start_date', $this->selectedYear);
}

$events = $query->get();

$events->each(function ($event) {
$event->title = str_limit($event->title, 50);
Expand Down Expand Up @@ -113,13 +108,17 @@ public function render()
->toArray();

$totalUpcoming = $this->baseQuery()->count();
$monthLabel = $this->selectedDate === 'all' || ! $this->selectedDate
? 'all upcoming months'
: Carbon::createFromDate($this->selectedYear, $this->selectedMonth, 1)->format('F Y');

return view('livewire.online-calendar', [
'countryNames' => $this->getCountryNamesFromEvents($events),
'languages' => $languages,
'filteredEvents' => $filteredEvents->paginate(50),
'filteredEvents' => $filteredEvents->paginate(24),
'totalUpcoming' => $totalUpcoming,
'visibleCount' => $filteredEvents->count(),
'monthLabel' => $monthLabel,
]);
}

Expand Down
19 changes: 9 additions & 10 deletions resources/views/livewire/online-calendar.blade.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,11 +13,10 @@
wire:model.live="selectedDate"
class="w-full appearance-none rounded-full border border-slate-200 bg-white py-3 pl-12 pr-10 text-slate-500 font-semibold focus:outline-none focus:ring-2 focus:ring-[#1C4DA1]"
>
@forelse($months as $month)
<option value="all">All months</option>
@foreach($months as $month)
<option value="{{ $month['id'] }}">{{ $month['name'] }}</option>
@empty
<option value="{{ $selectedDate }}">Select month</option>
@endforelse
@endforeach
</select>
</div>
</div>
Expand All @@ -44,20 +43,20 @@ class="w-full appearance-none rounded-full border border-slate-200 bg-white py-3
<div class="absolute top-0 w-full h-64 bg-yellow-50 hidden lg:block xl:hidden" style="clip-path: ellipse(70% 90% at 50% 90%)" ></div>
<div class="absolute top-0 w-full h-64 bg-yellow-50 hidden xl:block" style="clip-path: ellipse(65% 90% at 50% 90%)" ></div>
<div class="bg-yellow-50">
<div class="codeweek-container-lg relative pt-10 pb-16 md:pb-28">
<div class="codeweek-container-lg relative pt-10 pb-16 md:pb-28" wire:key="calendar-{{ $selectedDate }}-{{ $selectedLanguage }}-{{ $filteredEvents->currentPage() }}">
<p class="text-center text-slate-500 text-lg mb-8">
Showing {{ $visibleCount }} of {{ $totalUpcoming }} upcoming open online activities
@if($selectedDate)
for {{ \Carbon\Carbon::createFromDate($selectedYear, $selectedMonth, 1)->format('F Y') }}
@endif
for {{ $monthLabel }}
</p>
@if(count($filteredEvents) > 0)
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 xl:gap-10">
@foreach($filteredEvents as $event)
@include('online-calendar._oc-event-simple')
<div wire:key="event-{{ $event->id }}">
@include('online-calendar._oc-event-simple')
</div>
@endforeach
</div>
<div>
<div class="mt-10">
{{ $filteredEvents->links('vendor.pagination') }}
</div>
@else
Expand Down
3 changes: 2 additions & 1 deletion resources/views/online-calendar/oc-index.blade.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,8 @@
@include('components.tailwind')
@include('components.livewire')

@include('components.alpine')
{{-- Do not include Alpine v2 here. Livewire 3 already ships Alpine v3;
loading Alpine v2 breaks Livewire DOM updates (filters appear to do nothing). --}}

@section('content')
<section id="codeweek-digital-girls" class="font-['Blinker'] overflow-hidden">
Expand Down
Loading