2 files changed, 50 insertions, 11 deletions

diff --git a/src/content/dependencies/generateArtTagGalleryPage.js b/src/content/dependencies/generateArtTagGalleryPage.js
index a1e1d658..d823f72c 100644
--- a/src/content/dependencies/generateArtTagGalleryPage.js
+++ b/src/content/dependencies/generateArtTagGalleryPage.js
@@ -1,5 +1,5 @@
 import {sortAlbumsTracksChronologically} from '#sort';
-import {stitchArrays} from '#sugar';
+import {empty, stitchArrays, unique} from '#sugar';
 
 export default {
   contentDependencies: [
@@ -21,14 +21,16 @@ export default {
   },
 
   query(sprawl, tag) {
-    const things = tag.taggedInThings.slice();
+    const directThings = tag.directlyTaggedInThings;
+    const indirectThings = tag.indirectlyTaggedInThings;
+    const allThings = unique([...directThings, ...indirectThings]);
 
-    sortAlbumsTracksChronologically(things, {
+    sortAlbumsTracksChronologically(allThings, {
       getDate: thing => thing.coverArtDate ?? thing.date,
       latestFirst: true,
     });
 
-    return {things};
+    return {directThings, indirectThings, allThings};
   },
 
   relations(relation, query, sprawl, tag) {
@@ -43,17 +45,29 @@ export default {
     relations.quickDescription =
       relation('generateQuickDescription', tag);
 
+    if (!empty(tag.directAncestorTags)) {
+      relations.ancestorLinks =
+        tag.directAncestorTags.map(tag =>
+          relation('linkArtTag', tag));
+    }
+
+    if (!empty(tag.directDescendantTags)) {
+      relations.descendantLinks =
+        tag.directDescendantTags.map(tag =>
+          relation('linkArtTag', tag));
+    }
+
     relations.coverGrid =
       relation('generateCoverGrid');
 
     relations.links =
-      query.things.map(thing =>
+      query.allThings.map(thing =>
         (thing.album
           ? relation('linkTrack', thing)
           : relation('linkAlbum', thing)));
 
     relations.images =
-      query.things.map(thing =>
+      query.allThings.map(thing =>
         relation('image', thing.artTags));
 
     return relations;
@@ -66,26 +80,31 @@ export default {
 
     data.name = tag.name;
     data.color = tag.color;
+    data.hasLongerDescription = tag.descriptionShort !== tag.description;
 
-    data.numArtworks = query.things.length;
+    data.numArtworks = query.allThings.length;
 
     data.names =
-      query.things.map(thing => thing.name);
+      query.allThings.map(thing => thing.name);
 
     data.paths =
-      query.things.map(thing =>
+      query.allThings.map(thing =>
         (thing.album
           ? ['media.trackCover', thing.album.directory, thing.directory, thing.coverArtFileExtension]
           : ['media.albumCover', thing.directory, thing.coverArtFileExtension]));
 
     data.dimensions =
-      query.things.map(thing => thing.coverArtDimensions);
+      query.allThings.map(thing => thing.coverArtDimensions);
 
     data.coverArtists =
-      query.things.map(thing =>
+      query.allThings.map(thing =>
         thing.coverArtistContribs
           .map(({artist}) => artist.name));
 
+    data.onlyFeaturedIndirectly =
+      query.allThings.map(thing =>
+        !query.directThings.includes(thing));
+
     return data;
   },
 
@@ -112,10 +131,27 @@ export default {
               }),
             })),
 
+          relations.ancestorLinks &&
+            html.tag('p', {class: 'quick-info'},
+              language.$(pageCapsule, 'descendsFrom', {
+                tags: language.formatConjunctionList(relations.ancestorLinks),
+              })),
+
+          relations.descendantLinks &&
+            html.tag('p', {class: 'quick-info'},
+              language.$(pageCapsule, 'descendants', {
+                tags: language.formatUnitList(relations.descendantLinks),
+              })),
+
           relations.coverGrid
             .slots({
               links: relations.links,
               names: data.names,
+
+              classes:
+                data.onlyFeaturedIndirectly.map(onlyFeaturedIndirectly =>
+                  (onlyFeaturedIndirectly ? 'featured-indirectly' : '')),
+
               images:
                 stitchArrays({
                   image: relations.images,
diff --git a/src/strings-default.yaml b/src/strings-default.yaml
index a3f997ee..cfea25ad 100644
--- a/src/strings-default.yaml
+++ b/src/strings-default.yaml
@@ -2117,6 +2117,9 @@ tagPage:
   infoLine: >-
     Appears in {COVER_ARTS}.
 
+  descendsFrom: "Descends from {TAGS.}"
+  descendants: "Direct descendants: {TAGS}."
+
 #
 # trackPage:
 #