@if (videos.length > 0) {
<section class="hide-scrollbar">
  <!--  New videos this week -->
  @if (recentVideos().length > 0) {
  <div class="category">
    <p>New videos added this week</p>
    <app-video-list
      [videos]="recentVideos()"
      [currentVideo]="currentVideo"
      [watchedVideos]="watchedVideos"
      (currentVideoId)="openCurrentVideo($event)"
    ></app-video-list>
  </div>
  }

  <!-- Favorites -->
  @if (favoriteVideos.length > 0) {
  <div class="category">
    <p>Favorites</p>
    <app-video-list
      [videos]="getFavoriteVideos()"
      [currentVideo]="currentVideo"
      [watchedVideos]="watchedVideos"
      (currentVideoId)="openCurrentVideo($event)"
    ></app-video-list>
  </div>
  }

  <!-- Genre columns -->
  @for (filmGenre of filmGenres; track filmGenre) {
  <!-- Videos by genre -->
  @if (getAllVideos(filmGenre.code).length > 0) {
  <div class="category">
    <app-video-list
      [videos]="getAllVideos(filmGenre.code)"
      [currentVideo]="currentVideo"
      [watchedVideos]="watchedVideos"
      (currentVideoId)="openCurrentVideo($event)"
    ></app-video-list>
  </div>
  } }
</section>
}