From 6b2a67c4cd02df87df6324974372b8d76f7df4bd Mon Sep 17 00:00:00 2001
From: ghassan <ghassan@innovator.bh>
Date: Wed, 21 Oct 2026 10:07:44 +0300
Subject: [PATCH] fix(filter-bar): rename 'New to You' to 'Recent', add
 aria-current
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 'New to You' promised personalised recommendations the chip did not
  deliver — it was simply filter=latest, the newest videos regardless
  of viewer. Renamed to 'Recent' so the label matches the behaviour.
- Every active chip now carries aria-current='page' so a screen reader
  knows which filter is live without having to infer from the visual
  'active' class. role='navigation' + aria-label on the bar.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 resources/views/videos/index.blade.php | 30 +++++++++++++++++++-------
 1 file changed, 22 insertions(+), 8 deletions(-)

diff --git a/resources/views/videos/index.blade.php b/resources/views/videos/index.blade.php
index 237c561..fcb4e7e 100644
--- a/resources/views/videos/index.blade.php
+++ b/resources/views/videos/index.blade.php
@@ -59,21 +59,34 @@
 <div class="yt-filter-bar-wrap">
 <button type="button" class="yt-filter-nav left"  aria-label="Scroll left"  onclick="scrollFilterBar(-1)"><i class="bi bi-chevron-left"></i></button>
 <button type="button" class="yt-filter-nav right" aria-label="Scroll right" onclick="scrollFilterBar(1)"><i class="bi bi-chevron-right"></i></button>
-<div class="yt-filter-bar">
+<div class="yt-filter-bar" role="navigation" aria-label="Browse filters">
+    {{-- aria-current="page" on the active chip so assistive tech can read
+         the current filter. "New to You" was renamed to "Recent" — it was
+         just the latest filter, not a personalised recommendation, so the
+         old label overpromised. --}}
+    @php
+        $isAll       = $activeFilter === 'all';
+        $isTrending  = request()->is('trending');
+        $isMusic     = $activeFilter === 'music';
+        $isMatch     = $activeFilter === 'match';
+        $isShorts    = request()->is('shorts');
+        $isPlaylists = $activeFilter === 'playlists';
+        $isRecent    = $activeFilter === 'latest';
+    @endphp
     <a href="{{ route('videos.index') }}"
-       class="yt-chip {{ $activeFilter === 'all' ? 'active' : '' }}">All</a>
+       class="yt-chip {{ $isAll ? 'active' : '' }}" @if($isAll) aria-current="page"@endif>All</a>
     <a href="{{ route('videos.trending') }}"
-       class="yt-chip {{ request()->is('trending') ? 'active' : '' }}">Trending</a>
+       class="yt-chip {{ $isTrending ? 'active' : '' }}" @if($isTrending) aria-current="page"@endif>Trending</a>
     <a href="{{ route('videos.index', ['filter' => 'music']) }}"
-       class="yt-chip {{ $activeFilter === 'music' ? 'active' : '' }}">Music</a>
+       class="yt-chip {{ $isMusic ? 'active' : '' }}" @if($isMusic) aria-current="page"@endif>Music</a>
     <a href="{{ route('videos.index', ['filter' => 'match']) }}"
-       class="yt-chip {{ $activeFilter === 'match' ? 'active' : '' }}">Sports</a>
+       class="yt-chip {{ $isMatch ? 'active' : '' }}" @if($isMatch) aria-current="page"@endif>Sports</a>
     <a href="{{ route('videos.shorts') }}"
-       class="yt-chip {{ request()->is('shorts') ? 'active' : '' }}">Shorts</a>
+       class="yt-chip {{ $isShorts ? 'active' : '' }}" @if($isShorts) aria-current="page"@endif>Shorts</a>
     <a href="{{ route('videos.index', ['filter' => 'playlists']) }}"
-       class="yt-chip {{ $activeFilter === 'playlists' ? 'active' : '' }}">Playlists</a>
+       class="yt-chip {{ $isPlaylists ? 'active' : '' }}" @if($isPlaylists) aria-current="page"@endif>Playlists</a>
     <a href="{{ route('videos.index', ['filter' => 'latest']) }}"
-       class="yt-chip {{ $activeFilter === 'latest' ? 'active' : '' }}">New to You</a>
+       class="yt-chip {{ $isRecent ? 'active' : '' }}" @if($isRecent) aria-current="page"@endif>Recent</a>
 
     @if(!empty($langChips ?? []))
         @php $activeLang = str_starts_with($activeFilter, 'lang:') ? substr($activeFilter, 5) : null; @endphp
@@ -81,6 +94,7 @@
         @foreach($langChips as $chip)
             <a href="{{ route('videos.index', ['filter' => 'lang:' . $chip['code']]) }}"
                class="yt-chip yt-chip-lang {{ $activeLang === $chip['code'] ? 'active' : '' }}"
+               @if($activeLang === $chip['code']) aria-current="page"@endif
                title="{{ $chip['name'] }} ({{ $chip['count'] }})">
                 <span class="fi fi-{{ $chip['flag'] }}"></span>
                 <span>{{ $chip['name'] }}</span>