use html.fragment instead of ternary most places

6 files changed, 325 insertions, 309 deletions

diff --git a/src/page/album-commentary.js b/src/page/album-commentary.js
index beddf5a..e3a63ba 100644
--- a/src/page/album-commentary.js
+++ b/src/page/album-commentary.js
@@ -43,10 +43,10 @@ export function write(album) {
             words: html.tag('b', language.formatWordCount(words, {unit: true})),
             entries: html.tag('b', language.countCommentaryEntries(entries.length, {unit: true})),
           })),
-          ...album.commentary ? [
+          ...html.fragment(album.commentary && [
             html.tag('h3', language.$('albumCommentaryPage.entry.title.albumCommentary')),
             html.tag('blockquote', transformMultiline(album.commentary)),
-          ] : [],
+          ]),
           ...album.tracks.filter(t => t.commentary).flatMap(track => [
             html.tag('h3',
               {id: 'track.directory'},
diff --git a/src/page/album.js b/src/page/album.js
index a92d9a0..1313bb3 100644
--- a/src/page/album.js
+++ b/src/page/album.js
@@ -290,10 +290,11 @@ export function write(album, {wikiData}) {
                     link.albumAdditionalFile({album, file}),
                 })),
 
-            ...album.commentary ? [
-              html.tag('p', language.$('releaseInfo.artistCommentary')),
-              html.tag('blockquote', transformMultiline(album.commentary)),
-            ] : [],
+            ...html.fragment(
+              album.commentary && [
+                html.tag('p', language.$('releaseInfo.artistCommentary')),
+                html.tag('blockquote', transformMultiline(album.commentary)),
+              ]),
           ],
         },
 
@@ -440,21 +441,22 @@ export function generateAlbumSidebar(album, currentTrack, {
           ),
         })),
 
-      ...isAlbumPage ? [
-        next &&
-          html.tag('p',
-            {class: 'group-chronology-link'},
-            language.$('albumSidebar.groupBox.next', {
-              album: link.album(next),
-            })),
+      ...html.fragment(
+        isAlbumPage && [
+          next &&
+            html.tag('p',
+              {class: 'group-chronology-link'},
+              language.$('albumSidebar.groupBox.next', {
+                album: link.album(next),
+              })),
 
-        previous &&
-          html.tag('p',
-            {class: 'group-chronology-link'},
-            language.$('albumSidebar.groupBox.previous', {
-              album: link.album(previous),
-            })),
-      ] : [],
+          previous &&
+            html.tag('p',
+              {class: 'group-chronology-link'},
+              language.$('albumSidebar.groupBox.previous', {
+                album: link.album(previous),
+              })),
+        ]),
     ]);
 
   if (groupParts.length) {
diff --git a/src/page/artist.js b/src/page/artist.js
index 28d73eb..8606a7a 100644
--- a/src/page/artist.js
+++ b/src/page/artist.js
@@ -367,15 +367,16 @@ export function write(artist, {wikiData}) {
                 artist: name,
               })),
 
-            ...contextNotes ? [
-              html.tag('p',
-                language.$('releaseInfo.note')),
+            ...html.fragment(
+              contextNotes && [
+                html.tag('p',
+                  language.$('releaseInfo.note')),
 
-              html.tag('blockquote',
-                transformMultiline(contextNotes)),
+                html.tag('blockquote',
+                  transformMultiline(contextNotes)),
 
-              html.tag('hr'),
-            ] : [],
+                html.tag('hr'),
+              ]),
 
             urls?.length &&
               html.tag('p',
@@ -420,29 +421,63 @@ export function write(artist, {wikiData}) {
                     ].filter(Boolean)),
                 })),
 
-            ...allTracks.length ? [
-              html.tag('h2',
-                {id: 'tracks'},
-                language.$('artistPage.trackList.title')),
+            ...html.fragment(
+              allTracks.length && [
+                html.tag('h2',
+                  {id: 'tracks'},
+                  language.$('artistPage.trackList.title')),
+
+                totalDuration &&
+                  html.tag('p',
+                    language.$('artistPage.contributedDurationLine', {
+                      artist: artist.name,
+                      duration: language.formatDuration(
+                        totalDuration,
+                        {
+                          approximate: true,
+                          unit: true,
+                        }
+                      ),
+                    })),
 
-              totalDuration &&
-                html.tag('p',
-                  language.$('artistPage.contributedDurationLine', {
-                    artist: artist.name,
-                    duration: language.formatDuration(
-                      totalDuration,
-                      {
-                        approximate: true,
-                        unit: true,
-                      }
-                    ),
-                  })),
+                musicGroups.length &&
+                  html.tag('p',
+                    language.$('artistPage.musicGroupsLine', {
+                      groups: language.formatUnitList(
+                        musicGroups.map(({group, contributions}) =>
+                          language.$('artistPage.groupsLine.item', {
+                            group: link.groupInfo(group),
+                            contributions:
+                              language.countContributions(
+                                contributions
+                              ),
+                          })
+                        )
+                      ),
+                    })),
 
-              musicGroups.length &&
-                html.tag('p',
-                  language.$('artistPage.musicGroupsLine', {
+                generateTrackList(trackListChunks),
+              ]),
+
+            ...html.fragment(
+              artThingsAll.length && [
+                html.tag('h2',
+                  {id: 'art'},
+                  language.$('artistPage.artList.title')),
+
+                hasGallery &&
+                  html.tag('p',
+                    language.$('artistPage.viewArtGallery.orBrowseList', {
+                      link: link.artistGallery(artist, {
+                        text: language.$('artistPage.viewArtGallery.link'),
+                      })
+                    })),
+
+                artGroups.length &&
+                  html.tag('p',
+                    language.$('artistPage.artGroupsLine', {
                     groups: language.formatUnitList(
-                      musicGroups.map(({group, contributions}) =>
+                      artGroups.map(({group, contributions}) =>
                         language.$('artistPage.groupsLine.item', {
                           group: link.groupInfo(group),
                           contributions:
@@ -454,142 +489,110 @@ export function write(artist, {wikiData}) {
                     ),
                   })),
 
-              generateTrackList(trackListChunks),
-            ] : [],
-
-            ...artThingsAll.length ? [
-              html.tag('h2',
-                {id: 'art'},
-                language.$('artistPage.artList.title')),
-
-              hasGallery &&
-                html.tag('p',
-                  language.$('artistPage.viewArtGallery.orBrowseList', {
-                    link: link.artistGallery(artist, {
-                      text: language.$('artistPage.viewArtGallery.link'),
-                    })
-                  })),
-
-              artGroups.length &&
-                html.tag('p',
-                  language.$('artistPage.artGroupsLine', {
-                  groups: language.formatUnitList(
-                    artGroups.map(({group, contributions}) =>
-                      language.$('artistPage.groupsLine.item', {
-                        group: link.groupInfo(group),
-                        contributions:
-                          language.countContributions(
-                            contributions
-                          ),
-                      })
-                    )
-                  ),
-                })),
-
-              html.tag('dl',
-                artListChunks.flatMap(({date, album, chunk}) => [
-                  html.tag('dt', language.$('artistPage.creditList.album.withDate', {
-                    album: link.album(album),
-                    date: language.formatDate(date),
-                  })),
-
-                  html.tag('dd',
-                    html.tag('ul',
-                      chunk
-                        .map(({track, key, ...props}) => ({
-                          ...props,
-                          entry:
-                            track
-                              ? language.$('artistPage.creditList.entry.track', {
-                                  track: link.track(track),
-                                })
-                              : html.tag('i',
-                                  language.$('artistPage.creditList.entry.album.' + {
-                                    wallpaperArtistContribs:
-                                      'wallpaperArt',
-                                    bannerArtistContribs:
-                                      'bannerArt',
-                                    coverArtistContribs:
-                                      'coverArt',
-                                  }[key])),
-                        }))
-                        .map((opts) => generateEntryAccents({
-                          getArtistString,
-                          language,
-                          ...opts,
-                        }))
-                        .map(row => html.tag('li', row)))),
-                ])),
-            ] : [],
-
-            ...(
-              wikiInfo.enableFlashesAndGames &&
-              flashes.length
-            ) ? [
-              html.tag('h2',
-                {id: 'flashes'},
-                language.$('artistPage.flashList.title')),
-
-              html.tag('dl',
-                flashListChunks.flatMap(({
-                  act,
-                  chunk,
-                  dateFirst,
-                  dateLast,
-                }) => [
-                  html.tag('dt',
-                    language.$('artistPage.creditList.flashAct.withDateRange', {
-                      act: link.flash(chunk[0].flash, {
-                        text: act.name,
-                      }),
-                      dateRange: language.formatDateRange(
-                        dateFirst,
-                        dateLast
-                      ),
-                    })),
-
-                  html.tag('dd',
-                    html.tag('ul',
-                      chunk
-                        .map(({flash, ...props}) => ({
-                          ...props,
-                          entry: language.$('artistPage.creditList.entry.flash', {
-                            flash: link.flash(flash),
-                          }),
-                        }))
-                        .map(opts => generateEntryAccents({
-                          getArtistString,
-                          language,
-                          ...opts,
-                        }))
-                        .map(row => html.tag('li', row)))),
-                ])),
-            ] : [],
-
-            ...commentaryThings.length ? [
-              html.tag('h2',
-                {id: 'commentary'},
-                language.$('artistPage.commentaryList.title')),
-
-              html.tag('dl',
-                commentaryListChunks.flatMap(({album, chunk}) => [
-                  html.tag('dt',
-                    language.$('artistPage.creditList.album', {
+                html.tag('dl',
+                  artListChunks.flatMap(({date, album, chunk}) => [
+                    html.tag('dt', language.$('artistPage.creditList.album.withDate', {
                       album: link.album(album),
+                      date: language.formatDate(date),
                     })),
 
-                  html.tag('dd',
-                    html.tag('ul',
-                      chunk
-                        .map(({track}) => track
-                          ? language.$('artistPage.creditList.entry.track', {
-                              track: link.track(track),
-                            })
-                          : html.tag('i',
-                              language.$('artistPage.creditList.entry.album.commentary')))
-                        .map(row => html.tag('li', row)))),
-                ])),
-            ] : [],
+                    html.tag('dd',
+                      html.tag('ul',
+                        chunk
+                          .map(({track, key, ...props}) => ({
+                            ...props,
+                            entry:
+                              track
+                                ? language.$('artistPage.creditList.entry.track', {
+                                    track: link.track(track),
+                                  })
+                                : html.tag('i',
+                                    language.$('artistPage.creditList.entry.album.' + {
+                                      wallpaperArtistContribs:
+                                        'wallpaperArt',
+                                      bannerArtistContribs:
+                                        'bannerArt',
+                                      coverArtistContribs:
+                                        'coverArt',
+                                    }[key])),
+                          }))
+                          .map((opts) => generateEntryAccents({
+                            getArtistString,
+                            language,
+                            ...opts,
+                          }))
+                          .map(row => html.tag('li', row)))),
+                  ])),
+              ]),
+
+            ...html.fragment(
+              wikiInfo.enableFlashesAndGames &&
+              flashes.length && [
+                html.tag('h2',
+                  {id: 'flashes'},
+                  language.$('artistPage.flashList.title')),
+
+                html.tag('dl',
+                  flashListChunks.flatMap(({
+                    act,
+                    chunk,
+                    dateFirst,
+                    dateLast,
+                  }) => [
+                    html.tag('dt',
+                      language.$('artistPage.creditList.flashAct.withDateRange', {
+                        act: link.flash(chunk[0].flash, {
+                          text: act.name,
+                        }),
+                        dateRange: language.formatDateRange(
+                          dateFirst,
+                          dateLast
+                        ),
+                      })),
+
+                    html.tag('dd',
+                      html.tag('ul',
+                        chunk
+                          .map(({flash, ...props}) => ({
+                            ...props,
+                            entry: language.$('artistPage.creditList.entry.flash', {
+                              flash: link.flash(flash),
+                            }),
+                          }))
+                          .map(opts => generateEntryAccents({
+                            getArtistString,
+                            language,
+                            ...opts,
+                          }))
+                          .map(row => html.tag('li', row)))),
+                  ])),
+              ]),
+
+            ...html.fragment(
+              commentaryThings.length && [
+                html.tag('h2',
+                  {id: 'commentary'},
+                  language.$('artistPage.commentaryList.title')),
+
+                html.tag('dl',
+                  commentaryListChunks.flatMap(({album, chunk}) => [
+                    html.tag('dt',
+                      language.$('artistPage.creditList.album', {
+                        album: link.album(album),
+                      })),
+
+                    html.tag('dd',
+                      html.tag('ul',
+                        chunk
+                          .map(({track}) => track
+                            ? language.$('artistPage.creditList.entry.track', {
+                                track: link.track(track),
+                              })
+                            : html.tag('i',
+                                language.$('artistPage.creditList.entry.album.commentary')))
+                          .map(row => html.tag('li', row)))),
+                  ])),
+              ]),
           ],
         },
 
diff --git a/src/page/flash.js b/src/page/flash.js
index 6def305..ad61997 100644
--- a/src/page/flash.js
+++ b/src/page/flash.js
@@ -61,36 +61,38 @@ export function write(flash, {wikiData}) {
                 ),
               })),
 
-          ...flash.featuredTracks?.length ? [
-            html.tag('p',
-              `Tracks featured in <i>${
-                flash.name.replace(/\.$/, '')
-              }</i>:`),
-
-            html.tag('ul',
-              flash.featuredTracks.map(track =>
-                html.tag('li',
-                  language.$('trackList.item.withArtists', {
-                    track: link.track(track),
-                    by: html.tag('span', {class: 'by'},
-                      language.$('trackList.item.withArtists.by', {
-                        artists: getArtistString(track.artistContribs),
-                      })),
-                  })))),
-          ] : [],
-
-          ...flash.contributorContribs.length ? [
-            html.tag('p',
-              language.$('releaseInfo.contributors')),
-
-            html.tag('ul',
-              flash.contributorContribs.map(contrib =>
-                html.tag('li',
-                  getArtistString([contrib], {
-                    showContrib: true,
-                    showIcons: true,
-                  })))),
-          ] : [],
+          ...html.fragment(
+            flash.featuredTracks?.length && [
+              html.tag('p',
+                `Tracks featured in <i>${
+                  flash.name.replace(/\.$/, '')
+                }</i>:`),
+
+              html.tag('ul',
+                flash.featuredTracks.map(track =>
+                  html.tag('li',
+                    language.$('trackList.item.withArtists', {
+                      track: link.track(track),
+                      by: html.tag('span', {class: 'by'},
+                        language.$('trackList.item.withArtists.by', {
+                          artists: getArtistString(track.artistContribs),
+                        })),
+                    })))),
+            ]),
+
+          ...html.fragment(
+            flash.contributorContribs.length && [
+              html.tag('p',
+                language.$('releaseInfo.contributors')),
+
+              html.tag('ul',
+                flash.contributorContribs.map(contrib =>
+                  html.tag('li',
+                    getArtistString([contrib], {
+                      showContrib: true,
+                      showIcons: true,
+                    })))),
+            ]),
         ],
       },
 
diff --git a/src/page/group.js b/src/page/group.js
index ef3813f..0ff04ae 100644
--- a/src/page/group.js
+++ b/src/page/group.js
@@ -55,42 +55,43 @@ export function write(group, {wikiData}) {
             html.tag('blockquote',
               transformMultiline(group.description)),
 
-          ...group.albums ? [
-            html.tag('h2',
-              language.$('groupInfoPage.albumList.title')),
-
-            html.tag('p',
-              language.$('groupInfoPage.viewAlbumGallery', {
-                link: link.groupGallery(group, {
-                  text: language.$('groupInfoPage.viewAlbumGallery.link'),
-                }),
-              })),
+          ...html.fragment(
+            group.albums && [
+              html.tag('h2',
+                language.$('groupInfoPage.albumList.title')),
+
+              html.tag('p',
+                language.$('groupInfoPage.viewAlbumGallery', {
+                  link: link.groupGallery(group, {
+                    text: language.$('groupInfoPage.viewAlbumGallery.link'),
+                  }),
+                })),
 
-            html.tag('ul',
-              albumLines.map(({album, otherGroup}) => {
-                const item = album.date
-                  ? language.$('groupInfoPage.albumList.item', {
-                      year: album.date.getFullYear(),
-                      album: link.album(album),
-                    })
-                  : language.$('groupInfoPage.albumList.item.withoutYear', {
-                      album: link.album(album),
-                    });
-                return html.tag('li',
-                  otherGroup
-                    ? language.$('groupInfoPage.albumList.item.withAccent', {
-                        item,
-                        accent: html.tag('span',
-                          {class: 'other-group-accent'},
-                          language.$('groupInfoPage.albumList.item.otherGroupAccent', {
-                            group: link.groupInfo(otherGroup, {
-                              color: false,
-                            }),
-                          })),
+              html.tag('ul',
+                albumLines.map(({album, otherGroup}) => {
+                  const item = album.date
+                    ? language.$('groupInfoPage.albumList.item', {
+                        year: album.date.getFullYear(),
+                        album: link.album(album),
                       })
-                    : item);
-              })),
-          ] : [],
+                    : language.$('groupInfoPage.albumList.item.withoutYear', {
+                        album: link.album(album),
+                      });
+                  return html.tag('li',
+                    otherGroup
+                      ? language.$('groupInfoPage.albumList.item.withAccent', {
+                          item,
+                          accent: html.tag('span',
+                            {class: 'other-group-accent'},
+                            language.$('groupInfoPage.albumList.item.otherGroupAccent', {
+                              group: link.groupInfo(otherGroup, {
+                                color: false,
+                              }),
+                            })),
+                        })
+                      : item);
+                })),
+            ]),
         ],
       },
 
diff --git a/src/page/track.js b/src/page/track.js
index 514f2cb..bdbe60c 100644
--- a/src/page/track.js
+++ b/src/page/track.js
@@ -268,71 +268,79 @@ export function write(track, {wikiData}) {
                   })
                 : language.$('releaseInfo.listenOn.noLinks'))),
 
-            ...otherReleases.length ? [
-              html.tag('p', language.$('releaseInfo.alsoReleasedAs')),
-              html.tag('ul', otherReleases.map(track =>
-                html.tag('li', language.$('releaseInfo.alsoReleasedAs.item', {
-                  track: link.track(track),
-                  album: link.album(track.album),
-                })))),
-            ] : [],
-
-            ...track.contributorContribs.length ? [
-              html.tag('p', language.$('releaseInfo.contributors')),
-              html.tag('ul', track.contributorContribs.map(contrib =>
-                html.tag('li', getArtistString([contrib], {
-                  showContrib: true,
-                  showIcons: true,
-                })))),
-            ] : [],
-
-            ...referencedTracks.length ? [
-              html.tag('p', language.$('releaseInfo.tracksReferenced', {
-                track: html.tag('i', track.name),
-              })),
-              html.tag('ul', referencedTracks.map(getTrackItem)),
-            ] : [],
-
-            ...referencedByTracks.length ? [
-              html.tag('p', language.$('releaseInfo.tracksThatReference', {
-                track: html.tag('i', track.name),
-              })),
-              generateTrackListDividedByGroups(referencedByTracks, {
-                getTrackItem,
-                wikiData,
-              }),
-            ] : [],
-
-            ...(wikiInfo.enableFlashesAndGames && flashesThatFeature.length) ? [
-              html.tag('p', language.$('releaseInfo.flashesThatFeature', {
-                track: `<i>${track.name}</i>`,
-              })),
-              html.tag('ul', flashesThatFeature.map(({flash, as}) =>
-                html.tag('li',
-                  {class: as !== track && 'rerelease'},
-                  (as === track
-                    ? language.$('releaseInfo.flashesThatFeature.item', {
-                      flash: link.flash(flash),
-                    })
-                    : language.$('releaseInfo.flashesThatFeature.item.asDifferentRelease', {
-                      flash: link.flash(flash),
-                      track: link.track(as),
-                    }))))),
-            ] : [],
-
-            ...track.lyrics ? [
-              html.tag('p', language.$('releaseInfo.lyrics')),
-              html.tag('blockquote', transformLyrics(track.lyrics)),
-            ] : [],
-
-            ...hasCommentary ? [
-              html.tag('p', language.$('releaseInfo.artistCommentary')),
-              html.tag('blockquote', generateCommentary({
-                link,
-                language,
-                transformMultiline,
-              })),
-            ] : [],
+            ...html.fragment(
+              otherReleases.length && [
+                html.tag('p', language.$('releaseInfo.alsoReleasedAs')),
+                html.tag('ul', otherReleases.map(track =>
+                  html.tag('li', language.$('releaseInfo.alsoReleasedAs.item', {
+                    track: link.track(track),
+                    album: link.album(track.album),
+                  })))),
+              ]),
+
+            ...html.fragment(
+              track.contributorContribs.length && [
+                html.tag('p', language.$('releaseInfo.contributors')),
+                html.tag('ul', track.contributorContribs.map(contrib =>
+                  html.tag('li', getArtistString([contrib], {
+                    showContrib: true,
+                    showIcons: true,
+                  })))),
+              ]),
+
+            ...html.fragment(
+              referencedTracks.length && [
+                html.tag('p', language.$('releaseInfo.tracksReferenced', {
+                  track: html.tag('i', track.name),
+                })),
+                html.tag('ul', referencedTracks.map(getTrackItem)),
+              ]),
+
+            ...html.fragment(
+              referencedByTracks.length && [
+                html.tag('p', language.$('releaseInfo.tracksThatReference', {
+                  track: html.tag('i', track.name),
+                })),
+                generateTrackListDividedByGroups(referencedByTracks, {
+                  getTrackItem,
+                  wikiData,
+                }),
+              ]),
+
+            ...html.fragment(
+              wikiInfo.enableFlashesAndGames &&
+              flashesThatFeature.length && [
+                html.tag('p', language.$('releaseInfo.flashesThatFeature', {
+                  track: `<i>${track.name}</i>`,
+                })),
+                html.tag('ul', flashesThatFeature.map(({flash, as}) =>
+                  html.tag('li',
+                    {class: as !== track && 'rerelease'},
+                    (as === track
+                      ? language.$('releaseInfo.flashesThatFeature.item', {
+                        flash: link.flash(flash),
+                      })
+                      : language.$('releaseInfo.flashesThatFeature.item.asDifferentRelease', {
+                        flash: link.flash(flash),
+                        track: link.track(as),
+                      }))))),
+              ]),
+
+            ...html.fragment(
+              track.lyrics && [
+                html.tag('p', language.$('releaseInfo.lyrics')),
+                html.tag('blockquote', transformLyrics(track.lyrics)),
+              ]),
+
+            ...html.fragment(
+              hasCommentary && [
+                html.tag('p', language.$('releaseInfo.artistCommentary')),
+                html.tag('blockquote', generateCommentary({
+                  link,
+                  language,
+                  transformMultiline,
+                })),
+              ]),
           ],
         },