1 files changed, 40 insertions, 36 deletions

diff --git a/src/content/dependencies/generateAlbumCommentaryPage.js b/src/content/dependencies/generateAlbumCommentaryPage.js
index 91ffeb04..3529c4dc 100644
--- a/src/content/dependencies/generateAlbumCommentaryPage.js
+++ b/src/content/dependencies/generateAlbumCommentaryPage.js
@@ -1,15 +1,14 @@
-import {stitchArrays} from '#sugar';
+import {empty, stitchArrays} from '#sugar';
 
 export default {
   contentDependencies: [
     'generateAlbumCommentarySidebar',
-    'generateAlbumCoverArtwork',
     'generateAlbumNavAccent',
     'generateAlbumSecondaryNav',
-    'generateAlbumStyleRules',
+    'generateAlbumStyleTags',
     'generateCommentaryEntry',
     'generateContentHeading',
-    'generateTrackCoverArtwork',
+    'generateCoverArtwork',
     'generatePageLayout',
     'linkAlbum',
     'linkExternal',
@@ -18,7 +17,22 @@ export default {
 
   extraDependencies: ['html', 'language'],
 
-  relations(relation, album) {
+  query(album) {
+    const query = {};
+
+    query.tracksWithCommentary =
+      album.tracks
+        .filter(({commentary}) => !empty(commentary));
+
+    query.thingsWithCommentary =
+      (empty(album.commentary)
+        ? query.tracksWithCommentary
+        : [album, ...query.tracksWithCommentary]);
+
+    return query;
+  },
+
+  relations(relation, query, album) {
     const relations = {};
 
     relations.layout =
@@ -30,8 +44,8 @@ export default {
     relations.sidebar =
       relation('generateAlbumCommentarySidebar', album);
 
-    relations.albumStyleRules =
-      relation('generateAlbumStyleRules', album, null);
+    relations.albumStyleTags =
+      relation('generateAlbumStyleTags', album, null);
 
     relations.albumLink =
       relation('linkAlbum', album);
@@ -39,7 +53,7 @@ export default {
     relations.albumNavAccent =
       relation('generateAlbumNavAccent', album, null);
 
-    if (album.commentary) {
+    if (!empty(album.commentary)) {
       relations.albumCommentaryHeading =
         relation('generateContentHeading');
 
@@ -51,7 +65,7 @@ export default {
 
       if (album.hasCoverArt) {
         relations.albumCommentaryCover =
-          relation('generateAlbumCoverArtwork', album);
+          relation('generateCoverArtwork', album.coverArtworks[0]);
       }
 
       relations.albumCommentaryEntries =
@@ -59,32 +73,28 @@ export default {
           .map(entry => relation('generateCommentaryEntry', entry));
     }
 
-    const tracksWithCommentary =
-      album.tracks
-        .filter(({commentary}) => commentary);
-
     relations.trackCommentaryHeadings =
-      tracksWithCommentary
+      query.tracksWithCommentary
         .map(() => relation('generateContentHeading'));
 
     relations.trackCommentaryLinks =
-      tracksWithCommentary
+      query.tracksWithCommentary
         .map(track => relation('linkTrack', track));
 
     relations.trackCommentaryListeningLinks =
-      tracksWithCommentary
+      query.tracksWithCommentary
         .map(track =>
           track.urls.map(url => relation('linkExternal', url)));
 
     relations.trackCommentaryCovers =
-      tracksWithCommentary
+      query.tracksWithCommentary
         .map(track =>
           (track.hasUniqueCoverArt
-            ? relation('generateTrackCoverArtwork', track)
+            ? relation('generateCoverArtwork', track.trackArtworks[0])
             : null));
 
     relations.trackCommentaryEntries =
-      tracksWithCommentary
+      query.tracksWithCommentary
         .map(track =>
           track.commentary
             .map(entry => relation('generateCommentaryEntry', entry)));
@@ -92,29 +102,20 @@ export default {
     return relations;
   },
 
-  data(album) {
+  data(query, album) {
     const data = {};
 
     data.name = album.name;
     data.color = album.color;
     data.date = album.date;
 
-    const tracksWithCommentary =
-      album.tracks
-        .filter(({commentary}) => commentary);
-
-    const thingsWithCommentary =
-      (album.commentary
-        ? [album, ...tracksWithCommentary]
-        : tracksWithCommentary);
-
     data.entryCount =
-      thingsWithCommentary
+      query.thingsWithCommentary
         .flatMap(({commentary}) => commentary)
         .length;
 
     data.wordCount =
-      thingsWithCommentary
+      query.thingsWithCommentary
         .flatMap(({commentary}) => commentary)
         .map(({body}) => body)
         .join(' ')
@@ -122,15 +123,15 @@ export default {
         .length;
 
     data.trackCommentaryTrackDates =
-      tracksWithCommentary
+      query.tracksWithCommentary
         .map(track => track.dateFirstReleased);
 
     data.trackCommentaryDirectories =
-      tracksWithCommentary
+      query.tracksWithCommentary
         .map(track => track.directory);
 
     data.trackCommentaryColors =
-      tracksWithCommentary
+      query.tracksWithCommentary
         .map(track =>
           (track.color === album.color
             ? null
@@ -150,7 +151,7 @@ export default {
         headingMode: 'sticky',
 
         color: data.color,
-        styleRules: [relations.albumStyleRules],
+        styleTags: relations.albumStyleTags,
 
         mainClasses: ['long-content'],
         mainContent: [
@@ -265,7 +266,10 @@ export default {
                       }),
                   })),
 
-              cover?.slots({mode: 'commentary'}),
+              cover?.slots({
+                mode: 'commentary',
+                color: true,
+              }),
 
               trackDate &&
               trackDate !== data.date &&