From ead38fdb13abb406065cef0743d7e411cb27eaf3 Mon Sep 17 00:00:00 2001
From: Tyler Hoang <tyler@tylerhoang.xyz>
Date: Wed, 6 May 2026 18:05:07 -0700
Subject: Add genre tracking and year-in-review improvements

Adds genre field to Film model with TMDB enrichment. Genres populate from
TMDB detail fetch during add/edit and bulk enrichment. Genre metadata displays
on film cards, detail page (Production section), stats page (top genres panel),
and year-in-review (by decade and genre breakdowns).

Auto-detects rewatches when adding films via TMDB autocomplete - if a film with
the same TMDB ID already exists in diary, pre-fills rewatch checkbox and count.
Rewatch count now displays on film cards as "Rewatch #N".

Stats page now shows:
- Top genres (most watched)
- Film decades (sorted chronologically)
- Already shows: directors, companions, star distribution, rewatch rate

Year-in-review shows decades and genres alongside monthly activity and companions.

Bulk enrichment endpoint (/data/enrich-posters) now fetches missing genre
metadata along with posters and TMDB IDs.

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
---
 templates/_film_card.html  |  5 +++--
 templates/detail.html      |  1 +
 templates/form.html        |  5 +++++
 templates/stats.html       | 30 ++++++++++++++++++++++++++++++
 templates/year_review.html | 18 ++++++++++++++++++
 5 files changed, 57 insertions(+), 2 deletions(-)

(limited to 'templates')

diff --git a/templates/_film_card.html b/templates/_film_card.html
index 5e8e6e4..a4e206f 100644
--- a/templates/_film_card.html
+++ b/templates/_film_card.html
@@ -43,11 +43,12 @@
       {% if film.date_watched %}<span>{{ film.date_watched }}</span>{% endif %}
       {% if film.runtime %}<span>{{ film.runtime }} min</span>{% endif %}
       {% if film.language %}<span>{{ film.language }}</span>{% endif %}
-      {% if film.rewatch %}<span>Rewatch</span>{% endif %}
+      {% if film.rewatch %}<span>Rewatch{% if film.rewatch_count %} #{{ film.rewatch_count }}{% endif %}</span>{% endif %}
     </div>
 
-    {% if film.context or film.how_found or film.watched_with %}
+    {% if film.genre or film.context or film.how_found or film.watched_with %}
       <div class="tag-row">
+        {% if film.genre %}<span>{{ film.genre }}</span>{% endif %}
         {% if film.context %}<span>{{ film.context }}</span>{% endif %}
         {% if film.how_found %}<span>{{ film.how_found }}</span>{% endif %}
         {% if film.watched_with %}<span>With {{ film.watched_with }}</span>{% endif %}
diff --git a/templates/detail.html b/templates/detail.html
index 20897b0..156dec2 100644
--- a/templates/detail.html
+++ b/templates/detail.html
@@ -78,6 +78,7 @@
         <article class="detail-panel">
           <p class="eyebrow">Production</p>
           <div class="detail-meta">
+            {% if film.genre %}<span>{{ film.genre }}</span>{% endif %}
             {% if film.country %}<span>{{ film.country }}</span>{% endif %}
             {% if film.language %}<span>{{ film.language }}</span>{% endif %}
             {% if film.year %}<span>{{ film.year }}</span>{% endif %}
diff --git a/templates/form.html b/templates/form.html
index 4009e87..489d9c6 100644
--- a/templates/form.html
+++ b/templates/form.html
@@ -51,6 +51,11 @@
           <input id="country" name="country" value="{{ film.country if film and film.country else '' }}">
         </div>
 
+        <div class="field">
+          <label for="genre">Genre</label>
+          <input id="genre" name="genre" value="{{ film.genre if film and film.genre else '' }}">
+        </div>
+
         <div class="field">
           <label for="language">Language</label>
           <input id="language" name="language" value="{{ film.language if film and film.language else '' }}">
diff --git a/templates/stats.html b/templates/stats.html
index e0a6a91..9b71679 100644
--- a/templates/stats.html
+++ b/templates/stats.html
@@ -78,6 +78,26 @@
       </div>
       <ol id="watched-with" class="stats-list"></ol>
     </section>
+
+    <section class="stats-panel">
+      <div class="stats-panel-header">
+        <div>
+          <p class="eyebrow">Genres</p>
+          <h2>Most watched</h2>
+        </div>
+      </div>
+      <ol id="top-genres" class="stats-list"></ol>
+    </section>
+
+    <section class="stats-panel">
+      <div class="stats-panel-header">
+        <div>
+          <p class="eyebrow">Decades</p>
+          <h2>By era</h2>
+        </div>
+      </div>
+      <ol id="film-decades" class="stats-list"></ol>
+    </section>
   </section>
 {% endblock %}
 
@@ -118,6 +138,16 @@
         <li><span>${item.watched_with}</span><strong>${item.count}</strong></li>
       `).join("");
 
+      const topGenres = document.getElementById("top-genres");
+      topGenres.innerHTML = data.films_per_genre.slice(0, 8).map((item) => `
+        <li><span>${item.genre}</span><strong>${item.count}</strong></li>
+      `).join("");
+
+      const filmDecades = document.getElementById("film-decades");
+      filmDecades.innerHTML = data.films_per_decade.map((item) => `
+        <li><span>${item.decade}</span><strong>${item.count}</strong></li>
+      `).join("");
+
       const starDistribution = document.getElementById("star-distribution");
       const maxStars = Math.max(1, ...data.star_distribution.map((item) => item.count));
       starDistribution.innerHTML = data.star_distribution.map((item) => `
diff --git a/templates/year_review.html b/templates/year_review.html
index 1234e80..3d03cc0 100644
--- a/templates/year_review.html
+++ b/templates/year_review.html
@@ -89,6 +89,24 @@
           {% endfor %}
         </ol>
       </article>
+
+      <article class="review-panel">
+        <p class="eyebrow">Decades</p>
+        <ol class="stats-list">
+          {% for item in films_per_decade %}
+            <li><span>{{ item.decade }}</span><strong>{{ item.count }}</strong></li>
+          {% endfor %}
+        </ol>
+      </article>
+
+      <article class="review-panel">
+        <p class="eyebrow">Genres</p>
+        <ol class="stats-list">
+          {% for item in films_per_genre %}
+            <li><span>{{ item.genre }}</span><strong>{{ item.count }}</strong></li>
+          {% endfor %}
+        </ol>
+      </article>
     </section>
 
     <section class="review-panel">
-- 
cgit v1.3-2-g0d8e