content: many onlyIfContent, onlyIfSiblings, onlyIfOptions uses

14 files changed, 199 insertions, 180 deletions

diff --git a/src/content/dependencies/generateAlbumCommentaryPage.js b/src/content/dependencies/generateAlbumCommentaryPage.js
index 7879269f..70f90d27 100644
--- a/src/content/dependencies/generateAlbumCommentaryPage.js
+++ b/src/content/dependencies/generateAlbumCommentaryPage.js
@@ -1,4 +1,4 @@
-import {empty, stitchArrays} from '#sugar';
+import {stitchArrays} from '#sugar';
 
 export default {
   contentDependencies: [
@@ -167,16 +167,16 @@ export default {
                 }),
 
               accent:
-                !empty(relations.albumCommentaryListeningLinks) &&
-                  language.$('albumCommentaryPage.entry.title.albumCommentary.accent', {
-                    listeningLinks:
-                      language.formatUnitList(
-                        relations.albumCommentaryListeningLinks
-                          .map(link => link.slots({
-                            context: 'album',
-                            tab: 'separate',
-                          }))),
-                  }),
+                language.$('albumCommentaryPage.entry.title.albumCommentary.accent', {
+                  [language.onlyIfOptions]: ['listeningLinks'],
+                  listeningLinks:
+                    language.formatUnitList(
+                      relations.albumCommentaryListeningLinks
+                        .map(link => link.slots({
+                          context: 'album',
+                          tab: 'separate',
+                        }))),
+                }),
             }),
 
             relations.albumCommentaryCover
@@ -213,13 +213,13 @@ export default {
                   }),
 
                 accent:
-                  !empty(listeningLinks) &&
-                    language.$('albumCommentaryPage.entry.title.trackCommentary.accent', {
-                      listeningLinks:
-                        language.formatUnitList(
-                          listeningLinks.map(link =>
-                            link.slot('tab', 'separate'))),
-                    }),
+                  language.$('albumCommentaryPage.entry.title.trackCommentary.accent', {
+                    [language.onlyIfOptions]: ['listeningLinks'],
+                    listeningLinks:
+                      language.formatUnitList(
+                        listeningLinks.map(link =>
+                          link.slot('tab', 'separate'))),
+                  }),
               }),
 
               cover?.slots({mode: 'commentary'}),
diff --git a/src/content/dependencies/generateAlbumInfoPage.js b/src/content/dependencies/generateAlbumInfoPage.js
index 739a6669..ee08e507 100644
--- a/src/content/dependencies/generateAlbumInfoPage.js
+++ b/src/content/dependencies/generateAlbumInfoPage.js
@@ -213,10 +213,10 @@ export default {
             {[html.joinChildren]: html.tag('br')},
 
             [
-              data.dateAddedToWiki &&
-                language.$('releaseInfo.addedToWiki', {
-                  date: language.formatDate(data.dateAddedToWiki),
-                }),
+              language.$('releaseInfo.addedToWiki', {
+                [language.onlyIfOptions]: ['date'],
+                date: language.formatDate(data.dateAddedToWiki),
+              }),
             ]),
 
           sec.additionalFiles && [
diff --git a/src/content/dependencies/generateAlbumReleaseInfo.js b/src/content/dependencies/generateAlbumReleaseInfo.js
index 6fc1375b..1cd638ce 100644
--- a/src/content/dependencies/generateAlbumReleaseInfo.js
+++ b/src/content/dependencies/generateAlbumReleaseInfo.js
@@ -1,4 +1,4 @@
-import {accumulateSum, empty} from '#sugar';
+import {accumulateSum} from '#sugar';
 
 export default {
   contentDependencies: [
@@ -23,11 +23,9 @@ export default {
     relations.bannerArtistContributionsLine =
       relation('generateReleaseInfoContributionsLine', album.bannerArtistContribs);
 
-    if (!empty(album.urls)) {
-      relations.externalLinks =
-        album.urls.map(url =>
-          relation('linkExternal', url));
-    }
+    relations.externalLinks =
+      album.urls.map(url =>
+        relation('linkExternal', url));
 
     return relations;
   },
@@ -70,41 +68,42 @@ export default {
           relations.bannerArtistContributionsLine
             .slots({stringKey: 'releaseInfo.bannerArtBy'}),
 
-          data.date &&
-            language.$('releaseInfo.released', {
-              date: language.formatDate(data.date),
-            }),
-
-          data.coverArtDate &&
-            language.$('releaseInfo.artReleased', {
-              date: language.formatDate(data.coverArtDate),
-            }),
-
-          data.duration &&
-            language.$('releaseInfo.duration', {
-              duration:
-                language.formatDuration(data.duration, {
-                  approximate: data.durationApproximate,
-                }),
-            }),
+          language.$('releaseInfo.released', {
+            [language.onlyIfOptions]: ['date'],
+            date: language.formatDate(data.date),
+          }),
+
+          language.$('releaseInfo.artReleased', {
+            [language.onlyIfOptions]: ['date'],
+            date: language.formatDate(data.coverArtDate),
+          }),
+
+          language.$('releaseInfo.duration', {
+            [language.onlyIfOptions]: ['duration'],
+            duration:
+              language.formatDuration(data.duration, {
+                approximate: data.durationApproximate,
+              }),
+          }),
         ]),
 
-      relations.externalLinks &&
-        html.tag('p',
-          language.$('releaseInfo.listenOn', {
-            links:
-              language.formatDisjunctionList(
-                relations.externalLinks
-                  .map(link =>
-                    link.slot('context', [
-                      'album',
-                      (data.numTracks === 0
-                        ? 'albumNoTracks'
-                     : data.numTracks === 1
-                        ? 'albumOneTrack'
-                        : 'albumMultipleTracks'),
-                    ]))),
-          })),
+      html.tag('p',
+        {[html.onlyIfContent]: true},
+        language.$('releaseInfo.listenOn', {
+          [language.onlyIfOptions]: ['links'],
+          links:
+            language.formatDisjunctionList(
+              relations.externalLinks
+                .map(link =>
+                  link.slot('context', [
+                    'album',
+                    (data.numTracks === 0
+                      ? 'albumNoTracks'
+                   : data.numTracks === 1
+                      ? 'albumOneTrack'
+                      : 'albumMultipleTracks'),
+                  ]))),
+        })),
     ]);
   },
 };
diff --git a/src/content/dependencies/generateAlbumSidebarGroupBox.js b/src/content/dependencies/generateAlbumSidebarGroupBox.js
index 00a96c31..cc9b2c13 100644
--- a/src/content/dependencies/generateAlbumSidebarGroupBox.js
+++ b/src/content/dependencies/generateAlbumSidebarGroupBox.js
@@ -1,5 +1,5 @@
 import {sortChronologically} from '#sort';
-import {atOffset, empty} from '#sugar';
+import {atOffset} from '#sugar';
 
 export default {
   contentDependencies: [
@@ -89,26 +89,31 @@ export default {
           relations.description
             ?.slot('mode', 'multiline'),
 
-        !empty(relations.externalLinks) &&
-          html.tag('p',
-            language.$('releaseInfo.visitOn', {
-              links:
-                language.formatDisjunctionList(
-                  relations.externalLinks
-                    .map(link => link.slot('context', 'group'))),
-            })),
+        html.tag('p',
+          {[html.onlyIfContent]: true},
+
+          language.$('releaseInfo.visitOn', {
+            [language.onlyIfOptions]: ['links'],
+
+            links:
+              language.formatDisjunctionList(
+                relations.externalLinks
+                  .map(link => link.slot('context', 'group'))),
+          })),
 
         slots.mode === 'album' &&
-        relations.nextAlbumLink &&
           html.tag('p', {class: 'group-chronology-link'},
+            {[html.onlyIfContent]: true},
             language.$('albumSidebar.groupBox.next', {
+              [language.onlyIfOptions]: ['album'],
               album: relations.nextAlbumLink,
             })),
 
         slots.mode === 'album' &&
-        relations.previousAlbumLink &&
           html.tag('p', {class: 'group-chronology-link'},
+            {[html.onlyIfContent]: true},
             language.$('albumSidebar.groupBox.previous', {
+              [language.onlyIfOptions]: ['album'],
               album: relations.previousAlbumLink,
             })),
       ],
diff --git a/src/content/dependencies/generateArtistInfoPage.js b/src/content/dependencies/generateArtistInfoPage.js
index ac9209a7..363be023 100644
--- a/src/content/dependencies/generateArtistInfoPage.js
+++ b/src/content/dependencies/generateArtistInfoPage.js
@@ -153,7 +153,9 @@ export default {
 
         mainContent: [
           sec.contextNotes && [
-            html.tag('p', language.$('releaseInfo.note')),
+            html.tag('p',
+              language.$('releaseInfo.note')),
+
             html.tag('blockquote',
               sec.contextNotes.content),
           ],
diff --git a/src/content/dependencies/generateCommentaryEntry.js b/src/content/dependencies/generateCommentaryEntry.js
index 7994040d..036f8a6f 100644
--- a/src/content/dependencies/generateCommentaryEntry.js
+++ b/src/content/dependencies/generateCommentaryEntry.js
@@ -84,14 +84,14 @@ export default {
       html.tag('p', {class: 'commentary-entry-heading'},
         style,
         [
-          data.date &&
-            html.tag('time',
-              language.$(titlePrefix, 'date', {
-                date:
-                  language.formatDate(data.date),
-              })),
-
-          language.$(...titleParts, titleOptions)
+          html.tag('time',
+            {[html.onlyIfContent]: true},
+            language.$(titlePrefix, 'date', {
+              [language.onlyIfOptions]: ['date'],
+              date: language.formatDate(data.date),
+            })),
+
+          language.$(...titleParts, titleOptions),
         ]),
 
       html.tag('blockquote', {class: 'commentary-entry-body'},
diff --git a/src/content/dependencies/generateCoverArtwork.js b/src/content/dependencies/generateCoverArtwork.js
index 90c9db98..3d5a614f 100644
--- a/src/content/dependencies/generateCoverArtwork.js
+++ b/src/content/dependencies/generateCoverArtwork.js
@@ -1,4 +1,4 @@
-import {empty, stitchArrays} from '#sugar';
+import {stitchArrays} from '#sugar';
 
 export default {
   contentDependencies: ['image', 'linkArtTag'],
@@ -89,14 +89,15 @@ export default {
             ...sizeSlots,
           }),
 
-          !empty(relations.tagLinks) &&
-            html.tag('ul', {class: 'image-details'},
-              stitchArrays({
-                tagLink: relations.tagLinks,
-                preferShortName: data.preferShortName,
-              }).map(({tagLink, preferShortName}) =>
-                  html.tag('li',
-                    tagLink.slot('preferShortName', preferShortName)))),
+          html.tag('ul', {class: 'image-details'},
+            {[html.onlyIfContent]: true},
+
+            stitchArrays({
+              tagLink: relations.tagLinks,
+              preferShortName: data.preferShortName,
+            }).map(({tagLink, preferShortName}) =>
+                html.tag('li',
+                  tagLink.slot('preferShortName', preferShortName)))),
         ]);
 
       case 'thumbnail':
diff --git a/src/content/dependencies/generateFlashIndexPage.js b/src/content/dependencies/generateFlashIndexPage.js
index 36bfabae..eaea7e9c 100644
--- a/src/content/dependencies/generateFlashIndexPage.js
+++ b/src/content/dependencies/generateFlashIndexPage.js
@@ -1,4 +1,4 @@
-import {empty, stitchArrays} from '#sugar';
+import {stitchArrays} from '#sugar';
 
 export default {
   contentDependencies: [
@@ -87,11 +87,13 @@ export default {
 
       mainClasses: ['flash-index'],
       mainContent: [
-        !empty(data.jumpLinkLabels) && [
+        html.tags([
           html.tag('p', {class: 'quick-info'},
+            {[html.onlyIfSiblings]: true},
             language.$('misc.jumpTo')),
 
           html.tag('ul', {class: 'quick-info'},
+            {[html.onlyIfContent]: true},
             stitchArrays({
               colorStyle: relations.jumpLinkColorStyles,
               anchor: data.jumpLinkAnchors,
@@ -102,7 +104,7 @@ export default {
                     {href: '#' + anchor},
                     colorStyle,
                     label)))),
-        ],
+        ]),
 
         stitchArrays({
           colorStyle: relations.actColorStyles,
diff --git a/src/content/dependencies/generateFlashInfoPage.js b/src/content/dependencies/generateFlashInfoPage.js
index 05964936..fa30c6a2 100644
--- a/src/content/dependencies/generateFlashInfoPage.js
+++ b/src/content/dependencies/generateFlashInfoPage.js
@@ -19,16 +19,14 @@ export default {
   query(flash) {
     const query = {};
 
-    if (flash.page || !empty(flash.urls)) {
-      query.urls = [];
+    query.urls = [];
 
-      if (flash.page) {
-        query.urls.push(`https://homestuck.com/story/${flash.page}`);
-      }
+    if (flash.page) {
+      query.urls.push(`https://homestuck.com/story/${flash.page}`);
+    }
 
-      if (!empty(flash.urls)) {
-        query.urls.push(...flash.urls);
-      }
+    if (!empty(flash.urls)) {
+      query.urls.push(...flash.urls);
     }
 
     return query;
@@ -44,10 +42,9 @@ export default {
     relations.sidebar =
       relation('generateFlashActSidebar', flash.act, flash);
 
-    if (query.urls) {
-      relations.externalLinks =
-        query.urls.map(url => relation('linkExternal', url));
-    }
+    relations.externalLinks =
+      query.urls
+        .map(url => relation('linkExternal', url));
 
     // TODO: Flashes always have cover art (#175)
     /* eslint-disable-next-line no-constant-condition */
@@ -135,14 +132,15 @@ export default {
             date: language.formatDate(data.date),
           })),
 
-        relations.externalLinks &&
-          html.tag('p',
-            language.$('releaseInfo.playOn', {
-              links:
-                language.formatDisjunctionList(
-                  relations.externalLinks
-                    .map(link => link.slot('context', 'flash'))),
-            })),
+        html.tag('p',
+          {[html.onlyIfContent]: true},
+          language.$('releaseInfo.playOn', {
+            [language.onlyIfOptions]: ['links'],
+            links:
+              language.formatDisjunctionList(
+                relations.externalLinks
+                  .map(link => link.slot('context', 'flash'))),
+          })),
 
         html.tag('p',
           {[html.onlyIfContent]: true},
diff --git a/src/content/dependencies/generateGroupInfoPage.js b/src/content/dependencies/generateGroupInfoPage.js
index b5b456aa..e6b0ded1 100644
--- a/src/content/dependencies/generateGroupInfoPage.js
+++ b/src/content/dependencies/generateGroupInfoPage.js
@@ -69,11 +69,9 @@ export default {
 
     sec.info = {};
 
-    if (!empty(group.urls)) {
-      sec.info.visitLinks =
-        group.urls
-          .map(url => relation('linkExternal', url));
-    }
+    sec.info.visitLinks =
+      group.urls
+        .map(url => relation('linkExternal', url));
 
     if (group.description) {
       sec.info.description =
@@ -131,14 +129,15 @@ export default {
         color: data.color,
 
         mainContent: [
-          sec.info.visitLinks &&
-            html.tag('p',
-              language.$('releaseInfo.visitOn', {
-                links:
-                  language.formatDisjunctionList(
-                    sec.info.visitLinks
-                      .map(link => link.slot('context', 'group'))),
-              })),
+          html.tag('p',
+            {[html.onlyIfContent]: true},
+            language.$('releaseInfo.visitOn', {
+              [language.onlyIfOptions]: ['links'],
+              links:
+                language.formatDisjunctionList(
+                  sec.info.visitLinks
+                    .map(link => link.slot('context', 'group'))),
+            })),
 
           html.tag('blockquote',
             {[html.onlyIfContent]: true},
diff --git a/src/content/dependencies/generateListingPage.js b/src/content/dependencies/generateListingPage.js
index 23377afb..0b896ee0 100644
--- a/src/content/dependencies/generateListingPage.js
+++ b/src/content/dependencies/generateListingPage.js
@@ -34,13 +34,15 @@ export default {
       relations.sameTargetListingLinks =
         listing.target.listings
           .map(listing => relation('linkListing', listing));
+    } else {
+      relations.sameTargetListingLinks = [];
     }
 
-    if (!empty(listing.seeAlso)) {
-      relations.seeAlsoLinks =
-        listing.seeAlso
-          .map(listing => relation('linkListing', listing));
-    }
+    relations.seeAlsoLinks =
+      (!empty(listing.seeAlso)
+        ? listing.seeAlso
+            .map(listing => relation('linkListing', listing))
+        : []);
 
     return relations;
   },
@@ -167,33 +169,37 @@ export default {
       headingMode: 'sticky',
 
       mainContent: [
-        relations.sameTargetListingLinks &&
-          html.tag('p',
-            language.$('listingPage.listingsFor', {
-              target:
-                language.$('listingPage.target', data.targetStringsKey),
-
-              listings:
-                language.formatUnitList(
-                  stitchArrays({
-                    link: relations.sameTargetListingLinks,
-                    stringsKey: data.sameTargetListingStringsKeys,
-                  }).map(({link, stringsKey}, index) =>
-                      html.tag('span',
-                        index === data.sameTargetListingsCurrentIndex &&
-                          {class: 'current'},
-
-                        link.slots({
-                          attributes: {class: 'nowrap'},
-                          content: language.$('listingPage', stringsKey, 'title.short'),
-                        })))),
-            })),
-
-        relations.seeAlsoLinks &&
-          html.tag('p',
-            language.$('listingPage.seeAlso', {
-              listings: language.formatUnitList(relations.seeAlsoLinks),
-            })),
+        html.tag('p',
+          {[html.onlyIfContent]: true},
+          language.$('listingPage.listingsFor', {
+            [language.onlyIfOptions]: ['listings'],
+
+            target:
+              language.$('listingPage.target', data.targetStringsKey),
+
+            listings:
+              language.formatUnitList(
+                stitchArrays({
+                  link: relations.sameTargetListingLinks,
+                  stringsKey: data.sameTargetListingStringsKeys,
+                }).map(({link, stringsKey}, index) =>
+                    html.tag('span',
+                      index === data.sameTargetListingsCurrentIndex &&
+                        {class: 'current'},
+
+                      link.slots({
+                        attributes: {class: 'nowrap'},
+                        content: language.$('listingPage', stringsKey, 'title.short'),
+                      })))),
+          })),
+
+        html.tag('p',
+          {[html.onlyIfContent]: true},
+          language.$('listingPage.seeAlso', {
+            [language.onlyIfOptions]: ['listings'],
+            listings:
+              language.formatUnitList(relations.seeAlsoLinks),
+          })),
 
         slots.content,
 
diff --git a/src/content/dependencies/generateStickyHeadingContainer.js b/src/content/dependencies/generateStickyHeadingContainer.js
index 9becfb26..7f271715 100644
--- a/src/content/dependencies/generateStickyHeadingContainer.js
+++ b/src/content/dependencies/generateStickyHeadingContainer.js
@@ -22,10 +22,17 @@ export default {
         html.tag('div', {class: 'content-sticky-heading-row'}, [
           html.tag('h1', slots.title),
 
-          !html.isBlank(slots.cover) &&
-            html.tag('div', {class: 'content-sticky-heading-cover-container'},
-              html.tag('div', {class: 'content-sticky-heading-cover'},
-                slots.cover.slot('mode', 'thumbnail'))),
+          html.tag('div', {class: 'content-sticky-heading-cover-container'},
+            {[html.onlyIfContent]: true},
+
+            html.tag('div', {class: 'content-sticky-heading-cover'},
+              {[html.onlyIfContent]: true},
+
+              // TODO: We shouldn't need to do an isBlank check here,
+              // but a live blank value doesn't have a slot functions, so.
+              (html.isBlank(slots.cover)
+                ? html.blank()
+                : slots.cover.slot('mode', 'thumbnail')))),
         ]),
 
         html.tag('div', {class: 'content-sticky-subheading-row'},
diff --git a/src/content/dependencies/generateTrackReleaseInfo.js b/src/content/dependencies/generateTrackReleaseInfo.js
index 3bdeaa4f..88a4cdc7 100644
--- a/src/content/dependencies/generateTrackReleaseInfo.js
+++ b/src/content/dependencies/generateTrackReleaseInfo.js
@@ -59,20 +59,20 @@ export default {
           relations.coverArtistContributionsLine
             ?.slots({stringKey: 'releaseInfo.coverArtBy'}),
 
-          data.date &&
-            language.$('releaseInfo.released', {
-              date: language.formatDate(data.date),
-            }),
-
-          data.coverArtDate &&
-            language.$('releaseInfo.artReleased', {
-              date: language.formatDate(data.coverArtDate),
-            }),
-
-          data.duration &&
-            language.$('releaseInfo.duration', {
-              duration: language.formatDuration(data.duration),
-            }),
+          language.$('releaseInfo.released', {
+            [language.onlyIfOptions]: ['date'],
+            date: language.formatDate(data.date),
+          }),
+
+          language.$('releaseInfo.artReleased', {
+            [language.onlyIfOptions]: ['date'],
+            date: language.formatDate(data.coverArtDate),
+          }),
+
+          language.$('releaseInfo.duration', {
+            [language.onlyIfOptions]: ['duration'],
+            duration: language.formatDuration(data.duration),
+          }),
         ]),
 
       html.tag('p',
diff --git a/src/content/dependencies/generateWikiHomeAlbumsRow.js b/src/content/dependencies/generateWikiHomeAlbumsRow.js
index a19f104c..16c22bb3 100644
--- a/src/content/dependencies/generateWikiHomeAlbumsRow.js
+++ b/src/content/dependencies/generateWikiHomeAlbumsRow.js
@@ -113,10 +113,10 @@ export default {
           image.slots({
             path,
             missingSourceContent:
-              name &&
-                language.$('misc.albumGrid.noCoverArt', {
-                  album: name,
-                }),
+              language.$('misc.albumGrid.noCoverArt', {
+                [language.onlyIfOptions]: ['album'],
+                album: name,
+              }),
             }));
 
     commonSlots.actionLinks =