support art tag info pages; ensure "art tag" terminology everywhere

9 files changed, 158 insertions, 82 deletions

diff --git a/src/content/dependencies/generateArtTagGalleryPage.js b/src/content/dependencies/generateArtTagGalleryPage.js
index dc42b1d3..a0b3a0e5 100644
--- a/src/content/dependencies/generateArtTagGalleryPage.js
+++ b/src/content/dependencies/generateArtTagGalleryPage.js
@@ -3,12 +3,13 @@ import {empty, stitchArrays, unique} from '#sugar';
 
 export default {
   contentDependencies: [
+    'generateArtTagNavLinks',
     'generateCoverGrid',
     'generatePageLayout',
     'generateQuickDescription',
     'image',
     'linkAlbum',
-    'linkArtTag',
+    'linkArtTagGallery',
     'linkTrack',
   ],
 
@@ -20,9 +21,9 @@ export default {
     };
   },
 
-  query(sprawl, tag) {
-    const directThings = tag.directlyTaggedInThings;
-    const indirectThings = tag.indirectlyTaggedInThings;
+  query(sprawl, artTag) {
+    const directThings = artTag.directlyTaggedInThings;
+    const indirectThings = artTag.indirectlyTaggedInThings;
     const allThings = unique([...directThings, ...indirectThings]);
 
     sortAlbumsTracksChronologically(allThings, {
@@ -33,54 +34,54 @@ export default {
     return {directThings, indirectThings, allThings};
   },
 
-  relations(relation, query, sprawl, tag) {
+  relations(relation, query, sprawl, artTag) {
     const relations = {};
 
     relations.layout =
       relation('generatePageLayout');
 
-    relations.artTagMainLink =
-      relation('linkArtTag', tag);
+    relations.navLinks =
+      relation('generateArtTagNavLinks', artTag);
 
     relations.quickDescription =
-      relation('generateQuickDescription', tag);
+      relation('generateQuickDescription', artTag);
 
-    if (!empty(tag.directAncestorTags)) {
+    if (!empty(artTag.directAncestorArtTags)) {
       relations.ancestorLinks =
-        tag.directAncestorTags.map(tag =>
-          relation('linkArtTag', tag));
+        artTag.directAncestorArtTags
+          .map(artTag => relation('linkArtTagGallery', artTag));
     }
 
-    if (!empty(tag.directDescendantTags)) {
+    if (!empty(artTag.directDescendantArtTags)) {
       relations.descendantLinks =
-        tag.directDescendantTags.map(tag =>
-          relation('linkArtTag', tag));
+        artTag.directDescendantArtTags
+          .map(artTag => relation('linkArtTagGallery', artTag));
     }
 
     relations.coverGrid =
       relation('generateCoverGrid');
 
     relations.links =
-      query.allThings.map(thing =>
-        (thing.album
-          ? relation('linkTrack', thing)
-          : relation('linkAlbum', thing)));
+      query.allThings
+        .map(thing =>
+          (thing.album
+            ? relation('linkTrack', thing)
+            : relation('linkAlbum', thing)));
 
     relations.images =
-      query.allThings.map(thing =>
-        relation('image', thing.artTags));
+      query.allThings
+        .map(thing => relation('image', thing.artTags));
 
     return relations;
   },
 
-  data(query, sprawl, tag) {
+  data(query, sprawl, artTag) {
     const data = {};
 
     data.enableListings = sprawl.enableListings;
 
-    data.name = tag.name;
-    data.color = tag.color;
-    data.hasLongerDescription = tag.descriptionShort !== tag.description;
+    data.name = artTag.name;
+    data.color = artTag.color;
 
     data.numArtworks = query.allThings.length;
 
@@ -109,7 +110,7 @@ export default {
   },
 
   generate: (data, relations, {html, language}) =>
-    language.encapsulate('tagPage', pageCapsule =>
+    language.encapsulate('artTagGalleryPage', pageCapsule =>
       relations.layout.slots({
         title:
           language.$(pageCapsule, 'title', {
@@ -175,21 +176,9 @@ export default {
         ],
 
         navLinkStyle: 'hierarchical',
-        navLinks: [
-          {auto: 'home'},
-
-          data.enableListings &&
-            {
-              path: ['localized.listingIndex'],
-              title: language.$('listingIndex.title'),
-            },
-
-          {
-            html:
-              language.$(pageCapsule, 'nav.tag', {
-                tag: relations.artTagMainLink,
-              }),
-          },
-        ],
+        navLinks:
+          html.resolve(
+            relations.navLinks
+              .slot('currentExtra', 'gallery')),
       })),
 };
diff --git a/src/content/dependencies/generateArtTagNavLinks.js b/src/content/dependencies/generateArtTagNavLinks.js
new file mode 100644
index 00000000..df6d7cf0
--- /dev/null
+++ b/src/content/dependencies/generateArtTagNavLinks.js
@@ -0,0 +1,81 @@
+export default {
+  contentDependencies: [
+    'generateInterpageDotSwitcher',
+    'linkArtTag',
+    'linkArtTagGallery',
+  ],
+
+  extraDependencies: ['html', 'language', 'wikiData'],
+
+  sprawl: ({wikiInfo}) =>
+    ({enableListings: wikiInfo.enableListings}),
+
+  relations: (relation, sprawl, tag) => ({
+    switcher:
+      relation('generateInterpageDotSwitcher'),
+
+    mainLink:
+      relation('linkArtTag', tag),
+
+    infoLink:
+      relation('linkArtTag', tag),
+
+    galleryLink:
+      relation('linkArtTagGallery', tag),
+  }),
+
+  data: (sprawl) =>
+    ({enableListings: sprawl.enableListings}),
+
+  slots: {
+    currentExtra: {
+      validate: v => v.is('gallery'),
+    },
+  },
+
+  generate(data, relations, slots, {language}) {
+    if (!data.enableListings) {
+      return [
+        {auto: 'home'},
+        {auto: 'current'},
+      ];
+    }
+
+    const infoLink =
+      relations.infoLink.slots({
+        attributes: {class: slots.currentExtra === null && 'current'},
+        content: language.$('misc.nav.info'),
+      });
+
+    const galleryLink =
+      relations.galleryLink.slots({
+        attributes: {class: slots.currentExtra === 'gallery' && 'current'},
+        content: language.$('misc.nav.gallery'),
+      });
+
+    return [
+      {auto: 'home'},
+
+      data.enableListings &&
+        {
+          path: ['localized.listingIndex'],
+          title: language.$('listingIndex.title'),
+        },
+
+      {
+        html:
+          language.$('artTagPage.nav.tag', {
+            tag: relations.mainLink,
+          }),
+
+        accent:
+          relations.switcher.slots({
+            links: [
+              infoLink,
+              galleryLink,
+            ],
+          }),
+      },
+    ].filter(Boolean);
+  },
+};
diff --git a/src/content/dependencies/generateCoverArtwork.js b/src/content/dependencies/generateCoverArtwork.js
index 50ca89ae..06972d6b 100644
--- a/src/content/dependencies/generateCoverArtwork.js
+++ b/src/content/dependencies/generateCoverArtwork.js
@@ -1,5 +1,5 @@
 export default {
-  contentDependencies: ['image', 'linkArtistGallery'],
+  contentDependencies: ['image'],
   extraDependencies: ['html'],
 
   slots: {
diff --git a/src/content/dependencies/generateCoverArtworkArtTagDetails.js b/src/content/dependencies/generateCoverArtworkArtTagDetails.js
index 81ead8a9..c9475f1f 100644
--- a/src/content/dependencies/generateCoverArtworkArtTagDetails.js
+++ b/src/content/dependencies/generateCoverArtworkArtTagDetails.js
@@ -11,7 +11,7 @@ export default {
   }),
 
   relations: (relation, query, _artTags) => ({
-    tagLinks:
+    artTagLinks:
       query.linkableArtTags
         .map(tag => relation('linkArtTag', tag)),
   }),
@@ -42,9 +42,9 @@ export default {
       {class: 'art-tag-details'},
 
       stitchArrays({
-        tagLink: relations.tagLinks,
+        artTagLink: relations.artTagLinks,
         preferShortName: data.preferShortName,
-      }).map(({tagLink, preferShortName}) =>
+      }).map(({artTagLink, preferShortName}) =>
           html.tag('li',
-            tagLink.slot('preferShortName', preferShortName)))),
+            artTagLink.slot('preferShortName', preferShortName)))),
 };
diff --git a/src/content/dependencies/image.js b/src/content/dependencies/image.js
index 6cbcb7dd..8a446c39 100644
--- a/src/content/dependencies/image.js
+++ b/src/content/dependencies/image.js
@@ -27,8 +27,8 @@ export default {
     if (artTags) {
       data.contentWarnings =
         artTags
-          .filter(tag => tag.isContentWarning)
-          .map(tag => tag.name);
+          .filter(artTag => artTag.isContentWarning)
+          .map(artTag => artTag.name);
     } else {
       data.contentWarnings = null;
     }
diff --git a/src/content/dependencies/linkArtTag.js b/src/content/dependencies/linkArtTag.js
index 7ddb7786..409cb3c0 100644
--- a/src/content/dependencies/linkArtTag.js
+++ b/src/content/dependencies/linkArtTag.js
@@ -2,7 +2,7 @@ export default {
   contentDependencies: ['linkThing'],
 
   relations: (relation, artTag) =>
-    ({link: relation('linkThing', 'localized.tag', artTag)}),
+    ({link: relation('linkThing', 'localized.artTagInfo', artTag)}),
 
   generate: (relations) => relations.link,
 };
diff --git a/src/content/dependencies/linkArtTagGallery.js b/src/content/dependencies/linkArtTagGallery.js
new file mode 100644
index 00000000..a92b69c1
--- /dev/null
+++ b/src/content/dependencies/linkArtTagGallery.js
@@ -0,0 +1,8 @@
+export default {
+  contentDependencies: ['linkThing'],
+
+  relations: (relation, artTag) =>
+    ({link: relation('linkThing', 'localized.artTagGallery', artTag)}),
+
+  generate: (relations) => relations.link,
+};
diff --git a/src/content/dependencies/listTagsByName.js b/src/content/dependencies/listTagsByName.js
index d7022a55..31856478 100644
--- a/src/content/dependencies/listTagsByName.js
+++ b/src/content/dependencies/listTagsByName.js
@@ -1,8 +1,8 @@
 import {sortAlphabetically} from '#sort';
-import {stitchArrays} from '#sugar';
+import {stitchArrays, unique} from '#sugar';
 
 export default {
-  contentDependencies: ['generateListingPage', 'linkArtTag'],
+  contentDependencies: ['generateListingPage', 'linkArtTagGallery'],
   extraDependencies: ['language', 'wikiData'],
 
   sprawl({artTagData}) {
@@ -16,7 +16,7 @@ export default {
       artTags:
         sortAlphabetically(
           artTagData
-            .filter(tag => !tag.isContentWarning)),
+            .filter(artTag => !artTag.isContentWarning)),
     };
   },
 
@@ -26,15 +26,18 @@ export default {
 
       artTagLinks:
         query.artTags
-          .map(tag => relation('linkArtTag', tag)),
+          .map(artTag => relation('linkArtTagGallery', artTag)),
     };
   },
 
   data(query) {
     return {
       counts:
-        query.artTags
-          .map(tag => tag.taggedInThings.length),
+        query.artTags.map(artTag =>
+          unique([
+            ...artTag.indirectlyTaggedInThings,
+            ...artTag.directlyTaggedInThings,
+          ]).length),
     };
   },
 
diff --git a/src/content/dependencies/listTagsByUses.js b/src/content/dependencies/listTagsByUses.js
index 00c700a5..fcd324f7 100644
--- a/src/content/dependencies/listTagsByUses.js
+++ b/src/content/dependencies/listTagsByUses.js
@@ -1,23 +1,25 @@
 import {sortAlphabetically, sortByCount} from '#sort';
-import {filterByCount, stitchArrays} from '#sugar';
+import {filterByCount, stitchArrays, unique} from '#sugar';
 
 export default {
-  contentDependencies: ['generateListingPage', 'linkArtTag'],
+  contentDependencies: ['generateListingPage', 'linkArtTagGallery'],
   extraDependencies: ['language', 'wikiData'],
 
-  sprawl({artTagData}) {
-    return {artTagData};
-  },
+  sprawl: ({artTagData}) =>
+    ({artTagData}),
 
   query({artTagData}, spec) {
     const artTags =
       sortAlphabetically(
         artTagData
-          .filter(tag => !tag.isContentWarning));
+          .filter(artTag => !artTag.isContentWarning));
 
     const counts =
-      artTags
-        .map(tag => tag.taggedInThings.length);
+      artTags.map(artTag =>
+        unique([
+          ...artTag.directlyTaggedInThings,
+          ...artTag.indirectlyTaggedInThings,
+        ]).length);
 
     filterByCount(artTags, counts);
     sortByCount(artTags, counts, {greatestFirst: true});
@@ -25,26 +27,20 @@ export default {
     return {spec, artTags, counts};
   },
 
-  relations(relation, query) {
-    return {
-      page: relation('generateListingPage', query.spec),
+  relations: (relation, query) => ({
+    page:
+      relation('generateListingPage', query.spec),
 
-      artTagLinks:
-        query.artTags
-          .map(tag => relation('linkArtTag', tag)),
-    };
-  },
+    artTagLinks:
+      query.artTags
+        .map(artTag => relation('linkArtTagGallery', artTag)),
+  }),
 
-  data(query) {
-    return {
-      counts:
-        query.artTags
-          .map(tag => tag.taggedInThings.length),
-    };
-  },
+  data: (query) =>
+    ({counts: query.counts}),
 
-  generate(data, relations, {language}) {
-    return relations.page.slots({
+  generate: (data, relations, {language}) =>
+    relations.page.slots({
       type: 'rows',
       rows:
         stitchArrays({
@@ -54,6 +50,5 @@ export default {
             tag: link,
             timesUsed: language.countTimesUsed(count, {unit: true}),
           })),
-    });
-  },
+    }),
 };