« get me outta code hell

hsmusic-wiki - HSMusic - static wiki software cataloguing collaborative creation
about summary refs log tree commit diff
path: root/src/content/dependencies/generateArtistGroupContributionsInfo.js
diff options
context:
space:
mode:
Diffstat (limited to 'src/content/dependencies/generateArtistGroupContributionsInfo.js')
-rw-r--r--src/content/dependencies/generateArtistGroupContributionsInfo.js84
1 files changed, 40 insertions, 44 deletions
diff --git a/src/content/dependencies/generateArtistGroupContributionsInfo.js b/src/content/dependencies/generateArtistGroupContributionsInfo.js
index 6940053f..72ce0944 100644
--- a/src/content/dependencies/generateArtistGroupContributionsInfo.js
+++ b/src/content/dependencies/generateArtistGroupContributionsInfo.js
@@ -195,50 +195,46 @@ export default {
               : slots.title))),
 
         html.tag('dd', {class: topLevelClasses},
-          html.tag('ul', {class: 'group-contributions-table'},
-            {role: 'list'},
-
-            (slots.sort === 'count'
-              ? stitchArrays({
-                  group: relations.groupLinksSortedByCount,
-                  count: getCounts(data.groupCountsSortedByCount),
-                  duration:
-                    getDurations(
-                      data.groupDurationsSortedByCount,
-                      data.groupDurationsApproximateSortedByCount),
-                }).map(({group, count, duration}) =>
-                    language.encapsulate(capsule, 'item', capsule =>
-                      html.tag('li',
-                        html.tag('div', {class: 'group-contributions-row'}, [
-                          group,
-                          html.tag('span', {class: 'group-contributions-metrics'},
-                            // When sorting by count, duration details aren't necessarily
-                            // available for all items.
-                            (slots.showBothColumns && duration
-                              ? language.$(capsule, 'countDurationAccent', {count, duration})
-                              : language.$(capsule, 'countAccent', {count}))),
-                        ]))))
-
-              : stitchArrays({
-                  group: relations.groupLinksSortedByDuration,
-                  count: getCounts(data.groupCountsSortedByDuration),
-                  duration:
-                    getDurations(
-                      data.groupDurationsSortedByDuration,
-                      data.groupDurationsApproximateSortedByDuration),
-                }).map(({group, count, duration}) =>
-                    language.encapsulate(capsule, 'item', capsule =>
-                      html.tag('li',
-                        html.tag('div', {class: 'group-contributions-row'}, [
-                          group,
-                          html.tag('span', {class: 'group-contributions-metrics'},
-                            // Count details are always available, since they're just the
-                            // number of contributions directly. And duration details are
-                            // guaranteed for every item when sorting by duration.
-                            (slots.showBothColumns
-                              ? language.$(capsule, 'durationCountAccent', {duration, count})
-                              : language.$(capsule, 'durationAccent', {duration}))),
-                        ]))))))),
+          html.tag('table', {class: 'group-contributions-table'},
+            (stitchArrays(
+              (slots.sort === 'count'
+                ? {
+                    group: relations.groupLinksSortedByCount,
+                    count: getCounts(data.groupCountsSortedByCount),
+                    duration:
+                      getDurations(
+                        data.groupDurationsSortedByCount,
+                        data.groupDurationsApproximateSortedByCount),
+                  }
+                : {
+                    group: relations.groupLinksSortedByDuration,
+                    count: getCounts(data.groupCountsSortedByDuration),
+                    duration:
+                      getDurations(
+                        data.groupDurationsSortedByDuration,
+                        data.groupDurationsApproximateSortedByDuration),
+                  })
+            )).map(({group, count, duration}) =>
+                language.encapsulate(capsule, 'item', capsule =>
+                  html.tag('tr', [
+                    html.tag('td', {class: 'group-contributions-link-cell'},
+                      html.tag('span', group)),
+
+                    html.tag('td', {class: 'group-contributions-metrics-cell'},
+                      (slots.sort === 'count'
+                          // When sorting by count, duration details aren't necessarily
+                          // available for all items.
+                        ? (slots.showBothColumns && duration
+                            ? language.$(capsule, 'countDurationAccent', {count, duration})
+                            : language.$(capsule, 'countAccent', {count}))
+
+                          // Count details are always available, since they're just the
+                          // number of contributions directly. And duration details are
+                          // guaranteed for every item when sorting by duration.
+                        : (slots.showBothColumns
+                            ? language.$(capsule, 'durationCountAccent', {duration, count})
+                            : language.$(capsule, 'durationAccent', {duration})))),
+                  ]))))),
       ]);
     }),
 };