US09-04: Write the User Manual with Generated Screenshots (#110)

frontend/js/archive.js

@@ -9,7 +9,7 @@
 // is not mounted produces an instruction naming it rather than a disabled mystery,
 // and an operation whose evidence is ambiguous offers no button at all.
 import { api } from "./api.js";
-import { el, errorBanner, setActiveNav } from "./dom.js";
+import { el, errorBanner, setActiveNav, show } from "./dom.js";
 import { subscribeJob } from "./events.js";
 import { navigate } from "./router.js";
 
@@ -46,7 +46,7 @@ export async function renderArchive(root, params = {}) {
   try {
     locations = (await api.archiveLocations()).locations;
   } catch (error) {
-    root.replaceChildren(errorBanner(`Failed to load archive locations: ${error.message}`));
+    show(root, errorBanner(`Failed to load archive locations: ${error.message}`));
     return;
   }
   const location = locations.find((l) => l.id === params.location) || locations[0] || null;
@@ -61,7 +61,7 @@ export async function renderArchive(root, params = {}) {
       ),
       outcomeBanner()
     );
-    root.replaceChildren(...nodes.filter(Boolean));
+    show(root, ...nodes.filter(Boolean));
     return;
   }
 
@@ -95,7 +95,7 @@ export async function renderArchive(root, params = {}) {
     archived ? archivedSection(archived.items, locations) : null,
     restore ? restoreSection(restore, location) : null
   );
-  root.replaceChildren(...nodes.filter(Boolean));
+  show(root, ...nodes.filter(Boolean));
 }
 
 function plans(listed) {