Merge pull request #3654 from codeeu/fix/featured-activities-filters

Fix featured activities filters

Author: bernardhanna

app/Livewire/OnlineCalendar.php

@@ -4,43 +4,31 @@
 
 use App\Country;
 use App\Event;
-use App\Queries\CountriesQuery;
 use Carbon\Carbon;
-use Illuminate\Support\Facades\App;
 use Livewire\Component;
 use Livewire\WithPagination;
 
 class OnlineCalendar extends Component
 {
     use WithPagination;
 
-    public $events;
-
-    private $filteredEvents;
-
-    public $selectedLanguage;
+    public $selectedLanguage = '';
 
     public $selectedYear;
 
     public $selectedMonth;
 
     public $selectedDate;
 
-    public $months;
-
-    public $listeners = ['eventsUpdated' => 'render'];
-
-    private $whereClause = [
-        'activity_type' => 'open-online',
-        'status' => 'APPROVED',
-    ];
+    public $months = [];
 
     public function mount()
     {
-        $this->selectedLanguage = strtolower(App::getLocale());
         $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->selectedLanguage = '';
 
         $this->months = $this->baseQuery()
             ->orderBy('start_date')
@@ -69,47 +57,51 @@ public function mount()
         }
     }
 
+    public function updatedSelectedDate(): void
+    {
+        $this->resetPage();
+    }
+
+    public function updatedSelectedLanguage(): void
+    {
+        $this->resetPage();
+    }
+
     public function render()
     {
         $parts = explode('/', (string) $this->selectedDate);
         $this->selectedMonth = (int) ($parts[0] ?: $this->selectedMonth);
         $this->selectedYear = (int) ($parts[1] ?? $this->selectedYear);
 
-        $this->events = $this->baseQuery()
+        $events = $this->baseQuery()
             ->whereMonth('start_date', $this->selectedMonth)
             ->whereYear('start_date', $this->selectedYear)
             ->orderBy('start_date')
             ->get();
 
-        $this->events->map(function ($event) {
+        $events->each(function ($event) {
             $event->title = str_limit($event->title, 50);
             $event->start_date = Carbon::parse($event->start_date);
         });
 
-        if ($this->selectedLanguage !== '') {
-            $this->filteredEvents = $this->events->filter(function ($event) {
-                return $this->eventMatchesLanguage($event, $this->selectedLanguage);
-            });
-
-            if ($this->filteredEvents->isEmpty()) {
-                $this->filteredEvents = $this->events;
-            }
+        if ($this->selectedLanguage !== '' && $this->selectedLanguage !== null) {
+            $filteredEvents = $events->filter(function ($event) {
+                return $this->eventMatchesLanguage($event, (string) $this->selectedLanguage);
+            })->values();
         } else {
-            $this->filteredEvents = $this->events;
+            $filteredEvents = $events;
         }
 
-        $countries = CountriesQuery::withOnlineEvents('NONE');
-
-        $countryNames = $this->getCountryNamesFromEvents($this->events);
-
-        $languages = $this->events
+        $languages = $this->baseQuery()
+            ->get(['language'])
             ->flatMap(function ($event) {
                 return $event->languages ?? [];
             })
             ->filter(function ($language) {
                 return ! empty($language);
             })
             ->unique()
+            ->sort()
             ->values()
             ->map(function ($language) {
                 return [
@@ -124,16 +116,18 @@ public function render()
             ->toArray();
 
         return view('livewire.online-calendar', [
-            'countries' => $countries,
-            'countryNames' => $countryNames,
+            'countryNames' => $this->getCountryNamesFromEvents($events),
             'languages' => $languages,
-            'filteredEvents' => $this->filteredEvents->paginate(50),
+            'filteredEvents' => $filteredEvents->paginate(50),
         ]);
     }
 
     private function baseQuery()
     {
-        return Event::where($this->whereClause)
+        return Event::where([
+            'activity_type' => 'open-online',
+            'status' => 'APPROVED',
+        ])
             ->where('start_date', '>=', Carbon::now()->firstOfMonth())
             ->where('end_date', '>=', Carbon::now());
     }
@@ -143,16 +137,16 @@ private function eventMatchesLanguage($event, string $selectedLanguage): bool
         $languages = $event->languages ?? [];
 
         if (! is_array($languages)) {
-            return $languages == $selectedLanguage;
+            return strtolower((string) $languages) === strtolower($selectedLanguage);
         }
 
-        return in_array($selectedLanguage, $languages, true)
-            || in_array(strtolower($selectedLanguage), array_map('strtolower', $languages), true);
+        $normalized = array_map(static function ($language) {
+            return strtolower((string) $language);
+        }, $languages);
+
+        return in_array(strtolower($selectedLanguage), $normalized, true);
     }
 
-    /**
-     * @return mixed
-     */
     private function getCountryNamesFromEvents($events)
     {
         $country_codes = $events
@@ -161,10 +155,9 @@ private function getCountryNamesFromEvents($events)
             ->all();
 
         $countriesObjects = Country::whereIn('iso', $country_codes)->get();
-        $countryNames = $countriesObjects->mapWithKeys(function ($item) {
+
+        return $countriesObjects->mapWithKeys(function ($item) {
             return [$item['iso'] => __('countries.'.$item['name'])];
         });
-
-        return $countryNames;
     }
 }

resources/views/livewire/online-calendar.blade.php

@@ -7,25 +7,33 @@
                     Month
                 </label>
                 <div class="dropdown-datepicker relative">
-                    <img src="/images/educational-resources/fi_calendar.svg" class="absolute top-1/2 left-4 -translate-y-1/2 z-[999]" />
-                    <select-field
+                    <img src="/images/educational-resources/fi_calendar.svg" class="absolute top-1/2 left-4 -translate-y-1/2 z-10 pointer-events-none" />
+                    <select
+                        id="selectedDate"
                         wire:model.live="selectedDate"
-                        v-model="selectedDate"
-                        placeholder="Select month"
-                        :options="{{ json_encode($months) }}"
-                    ></select-field>
+                        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="{{ $month['id'] }}">{{ $month['name'] }}</option>
+                        @empty
+                            <option value="{{ $selectedDate }}">Select month</option>
+                        @endforelse
+                    </select>
                 </div>
             </div>
             <div class="w-full md:w-[260px]">
-                <label class="block text-default text-slate-500 mb-2" for="language">
+                <label class="block text-default text-slate-500 mb-2" for="selectedLanguage">
                     Language
                 </label>
-                <select-field
+                <select
+                    id="selectedLanguage"
                     wire:model.live="selectedLanguage"
-                    v-model="selectedLanguage"
-                    placeholder="Select language"
-                    :options="{{ json_encode($languages) }}"
-                ></select-field>
+                    class="w-full appearance-none rounded-full border border-slate-200 bg-white py-3 px-4 text-slate-500 font-semibold focus:outline-none focus:ring-2 focus:ring-[#1C4DA1]"
+                >
+                    @foreach($languages as $language)
+                        <option value="{{ $language['id'] }}">{{ $language['name'] }}</option>
+                    @endforeach
+                </select>
             </div>
         </div>
     </div>

tests/Feature/OnlineEventsWorkflowTest.php

@@ -256,6 +256,45 @@ public function featured_activities_page_shows_all_upcoming_open_online_events()
             ->assertDontSee($pendingEvent->title);
     }
 
+    #[Test]
+    public function featured_activities_month_filter_only_shows_events_for_selected_month(): void
+    {
+        $this->seed('RolesAndPermissionsSeeder');
+
+        $october = Carbon::now()->addYear()->month(10)->startOfMonth();
+        $november = Carbon::now()->addYear()->month(11)->startOfMonth();
+
+        $octoberEvent = \App\Event::factory()->create([
+            'start_date' => $october->copy()->addDays(5),
+            'end_date' => $october->copy()->addDays(6),
+            'status' => 'APPROVED',
+            'activity_type' => 'open-online',
+            'language' => ['de'],
+            'title' => 'October Open Online Unique',
+        ]);
+
+        $novemberEvent = \App\Event::factory()->create([
+            'start_date' => $november->copy()->addDays(5),
+            'end_date' => $november->copy()->addDays(6),
+            'status' => 'APPROVED',
+            'activity_type' => 'open-online',
+            'language' => ['fr'],
+            'title' => 'November Open Online Unique',
+        ]);
+
+        \Livewire\Livewire::test(\App\Livewire\OnlineCalendar::class)
+            ->set('selectedDate', '10/'.$october->year)
+            ->assertSee($octoberEvent->title)
+            ->assertDontSee($novemberEvent->title)
+            ->set('selectedDate', '11/'.$november->year)
+            ->assertSee($novemberEvent->title)
+            ->assertDontSee($octoberEvent->title)
+            ->set('selectedLanguage', 'fr')
+            ->assertSee($novemberEvent->title)
+            ->set('selectedLanguage', 'de')
+            ->assertDontSee($novemberEvent->title);
+    }
+
     #[Test]
     public function promoted_event_creates_notification_for_administrators(): void
     {