nouveau-theatre-de-besancon/site/templates/program.php

<?php snippet('header') ?>
<pre>
  <?= var_dump($currentSeasonSessions) ?>
</pre>
<div 
  class="program-wrapper"
  x-data="{
    setInitialTab() {
      const queryString = window.location.search;
      if (queryString.length === 0) return 'Programme';
      const urlParams = new URLSearchParams(queryString);
      const tab = urlParams.get('tab');
      return tab;
    }
  }"
>
  <section class="filters">
    <button>Calendrier</button>
    <button>Spectacles</button>
    <button>Autres événéments</button>
    <button>Ici & Là</button>
    <button>Saisons précédentes</button>
  </section>

  <div class="program-content" 
    x-data="{
      tab: setInitialTab()
    }"
  >
    <section class="page-title">
      <h1 x-text="tab"></h1>
    </section>
    <section class="yellow">
      <h2>À venir — <?= $page->children()->first()->title() ?></h2>
    </section>
    <?php snippet('events-grid', ['events' => $nextEvents, 'columns' => 3])  ?>
    <section class="yellow">
      <h2>Événements passés</h2>
    </section>
    <?php snippet('events-grid', ['events' => $previousEvents, 'columns' => 3])  ?>
  </div>
</div>
<?php snippet('footer') ?>