content: avoid boilerplate around listings, make spec relevant again

2 files changed, 28 insertions, 19 deletions

diff --git a/src/content/dependencies/generateListingPage.js b/src/content/dependencies/generateListingPage.js
index ae186d28..6e9db689 100644
--- a/src/content/dependencies/generateListingPage.js
+++ b/src/content/dependencies/generateListingPage.js
@@ -9,28 +9,33 @@ export default {
     };
   },
 
-  slots: {
-    title: {type: 'string'},
+  data(query, sprawl, listing) {
+    return {
+      stringsKey: listing.stringsKey,
+    };
+  },
 
+  slots: {
     type: {
       validate: v => v.is('rows'),
     },
 
     rows: {
-      validate: v => v.arrayOf(v.isHTML),
+      validate: v => v.arrayOf(v.isObject),
     },
   },
 
-  generate(relations, slots, {html}) {
+  generate(data, relations, slots, {html}) {
     return relations.layout.slots({
-      title: slots.title,
+      title: language.$(`listingPage.${data.stringsKey}.title`),
       headingMode: 'sticky',
 
       mainContent: [
         slots.type === 'rows' &&
           html.tag('ul',
-            slots.rows
-              .map(row => html.tag('li', row))),
+            slots.rows.map(row =>
+              html.tag('li',
+                language.$(`listingPage.${data.stringsKey}.item`, row)))),
       ],
 
       navLinkStyle: 'hierarchical',
diff --git a/src/content/dependencies/listAlbumsByName.js b/src/content/dependencies/listAlbumsByName.js
index 2182efa5..c302a9cb 100644
--- a/src/content/dependencies/listAlbumsByName.js
+++ b/src/content/dependencies/listAlbumsByName.js
@@ -9,38 +9,42 @@ export default {
     return {albumData};
   },
 
-  query({albumData}) {
+  query({albumData}, spec) {
     return {
+      spec,
       albums: sortAlphabetically(albumData.slice()),
     };
   },
 
   relations(relation, query) {
     return {
-      page: relation('generateListingPage'),
-      links: query.albums.map(album => relation('linkAlbum', album)),
+      page: relation('generateListingPage', query.spec),
+
+      albumLinks:
+        query.albums
+          .map(album => relation('linkAlbum', album)),
     };
   },
 
   data(query) {
     return {
-      numTracks: query.albums.map(album => album.tracks.length),
+      counts:
+        query.albums
+          .map(album => album.tracks.length),
     };
   },
 
   generate(data, relations, {language}) {
     return relations.page.slots({
-      title: language.$('listingPage.listAlbums.byName.title'),
       type: 'rows',
       rows:
         stitchArrays({
-          link: relations.links,
-          numTracks: data.numTracks,
-        }).map(({link, numTracks}) =>
-            language.$('listingPage.listAlbums.byName.item', {
-              album: link,
-              tracks: language.countTracks(numTracks, {unit: true}),
-            })),
+          link: relations.albumLinks,
+          count: data.counts,
+        }).map(({link, count}) => ({
+            album: link,
+            tracks: language.countTracks(count, {unit: true}),
+          })),
     });
   },
 };