Say on a feed's Directory page why it is failing, and who subscribes (#142)

daily-quests, one subscriber and no items, showed "Nothing read from it yet. A feed nobody here
subscribes to is checked once a day." on its page in the Directory: the second sentence was
written whatever the count, and the feed had been failing since #119 said so, which the page
never showed, /api/directory/{id} sending no error.

It sends `failing` now, the reason a feed's own page gives (explain_failure), or that the last
check failed, never the error itself, which can name the feed's address, and the Directory names
none. The page shows it under the header in the error colour, and says a feed is checked once a
day only when nobody subscribes and nothing is wrong.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

web/src/dialogs.ts

@@ -138,6 +138,7 @@ function drawDirectory(box=$('#directory'), focus?: string){
         // Its category's page is one click away from here.
         show.category?`<button type="button" class="dlink" data-go="${esc(show.category)}">${esc(show.subcategory||show.category)}</button>`:''}
         <p class="sub">${n?`${n} ${n===1?'person here subscribes':'people here subscribe'}`:'Nobody here subscribes yet'}</p>
+        <p class="sub dfail" id="dfail" hidden></p>
         <div class="acts"><button class="btn ico primary" data-a="sub" title="Subscribe" aria-label="Subscribe">${ICON.plus}</button></div></div></div>
       <div class="about" id="dabout" hidden><p></p><button type="button" class="dlink" aria-expanded="false" hidden>More</button></div>`
       +sec(show.podcast?'Latest episodes':'Latest posts','<div class="latest" id="dshow"><p class="hint">Loading…</p></div>');
@@ -217,6 +218,8 @@ async function fillShow(box,p){
       more.textContent=open?'Less':'More'; more.setAttribute('aria-expanded',String(open));
     };
   }
+  // A broken feed says so, or it reads as a quiet one (#142).
+  if(got.failing){ const f=$('#dfail',box); f.textContent=got.failing; f.hidden=false; }
   const items=got.items;
   list.innerHTML=items.length?items.map(e=>{
     const name=entryName(e), text=name.derived?'':plainText(e.description).slice(0,500);
@@ -224,7 +227,8 @@ async function fillShow(box,p){
     return `<article class="lep"><b>${e.link?`<a href="${esc(e.link)}" target="_blank" rel="noopener">${esc(name.text)}</a>`:esc(name.text)}</b>`
       +(text?`<p>${esc(text)}</p>`:'')
       +(when.length?`<small>${when.map(s=>`<span>${s}</span>`).join('<span class="dot"></span>')}</small>`:'')+'</article>';
-  }).join(''):`<p class="hint">Nothing read from it yet. A feed nobody here subscribes to is checked once a day.</p>`;
+  }).join(''):`<p class="hint">Nothing read from it yet.${p.subscribers||got.failing?''
+    :' A feed nobody here subscribes to is checked once a day.'}</p>`;
 }
 
 /// A category as a tile: its name, how many feeds, and the covers of its three most subscribed