Changeset 47f1183 in Klonkt for src/views/pages/admin-migrate.ejs

Timestamp:

08/14/2026 03:02:35 AM (4 weeks ago)

Author:

Robin <roboburr@…>

Branches:

main

Children:

7e474f7

Parents:

f704237

Message:

Een stappenplan op de migrate-pagina, en de volgorde klopte niet

Robin: misschien moeten we bij migrate een stappenplan beschrijven, waaronder
dus ook dit (de Delete-ronde voor je een domein opzegt).

Bij het uitschrijven bleek de pagina zelf een verkeerde volgorde te suggereren.
Ik noemde het aankondigen "de laatste stap", maar ingestFromSource weigert met
not_moved_here zolang movedTo niet naar ons wijst. De ophaalknop werkt dus PAS
nadat de Move gedaan is. Aankondigen is stap 2, niet de afsluiter.

Met een zip mag het juist andersom: een bestand vraagt niemand toestemming. Die
twee volgordes naast elkaar zijn precies het soort ding waar je halverwege op
vastloopt zonder te snappen waarom, dus staan ze er nu uitgeschreven.

DE PAGINA DRAAIT OP BEIDE INSTANTIES. Stap 1, 3 en 4 horen op de nieuwe kant,
stap 2 en 5 op de oude. Een vast "hier" is dus op de helft van de schermen
onzin. Het plan draait mee met waar je kijkt, en op de vertrekkende kant staat
er een regel boven dat je naar de instantie kijkt die weggaat.

Die omkering had ik bij het bouwen precies verkeerd om: beide labels werden
"hier". Zag ik pas door hem te renderen, niet door hem te lezen.

STAP 5 heeft geen knop, en dat staat erbij. Verwijder je oude berichten voor je
het domein opzegt, zodat boosts van anderen netjes verdwijnen in plaats van te
blijven staan als kapotte kaart; haal daarna de alias weg, want die wijst naar
een adres dat je niet meer beheert. Een stappenplan dat een knop belooft die er
niet is, is erger dan geen stappenplan.

Changed files:
src/routes/admin-migrate.js

• stappen(): afleiden wat af is uit aliassen, moved_to, de moves-collectie en de vertaaltabel; meegegeven aan alle drie de renders

src/views/pages/admin-migrate.ejs

• het stappenplan bovenaan, met vinkjes en een waar-label per stap
• de labels draaien om vanaf de vertrekkende kant

src/services/i18n.js

• mig.plan_* in nl/en/de
• mig.move_title is "Stap 2" en niet meer "Laatste stap"
• de waarschuwing zegt nu dat dit EERST moet bij de ophaalknop

test/migrate-page.test.js

• het plan staat boven de knoppen die het beschrijft
• de perspectiefwissel, met de eis dat de twee labels nooit gelijk zijn
• geen "laatste stap" meer in een van de drie talen
• stap 5 noemt de Delete-ronde, de alias en dat er geen knop is

remarks: gerenderd vanaf beide kanten om het te controleren. Suite 1013 groen,
tegenproef op de perspectiefwissel.

-robo
Co-Authored-By: Claude Opus 4.8 <noreply@…>

File:

• src/views/pages/admin-migrate.ejs (modified) (2 diffs)

src/views/pages/admin-migrate.ejs

@@ -5 +5 @@
   <% if (typeof success !== 'undefined' && success) { %><div class="alert alert-success"><%= success %></div><% } %>
   <% if (typeof error !== 'undefined' && error) { %><div class="alert alert-error"><%= error %></div><% } %>
+
+  <%# ── Het stappenplan ────────────────────────────────────────── %>
+  <%# Bestaat omdat de VOLGORDE niet vanzelfsprekend is en een fout erin je
+      halverwege vastzet. Twee dingen die niemand raadt:
+        - de ophaalknop werkt PAS nadat de verhuizing is aangekondigd; de bron
+          geeft niets af aan een instantie die niet in zijn movedTo staat;
+        - met een zip kan het juist andersom, want een zip vraagt niemand iets.
+      En stap 5 staat erbij omdat hij bestaat, niet omdat er een knop voor is. %>
+  <section class="mig-card mig-plan">
+    <h2><%= t('mig.plan_title') %></h2>
+    <p class="form-hint"><%= t('mig.plan_hint') %></p>
+    <%# "hier" hangt af van WELKE kant je bekijkt. Deze pagina draait op allebei
+        de instanties, en een vaste tekst is dus op de helft van de schermen
+        onzin. Heeft deze site een moved_to, dan is dit de vertrekkende kant. %>
+    <%# Stap 1, 3 en 4 horen op de NIEUWE kant; stap 2 en 5 op de oude. Vanaf
+        welke instantie je kijkt bepaalt dus welk van de twee "hier" is. %>
+    <% var _hier = stap.isOud ? t('mig.plan_new')  : t('mig.plan_here');
+       var _daar = stap.isOud ? t('mig.plan_here') : t('mig.plan_old'); %>
+    <% if (stap.isOud) { %>
+      <p class="form-hint mig-warn"><%= t('mig.plan_from_old') %></p>
+    <% } %>
+    <ol class="mig-steps">
+      <li class="<%= stap.geclaimd ? 'is-done' : '' %>">
+        <strong><%= t('mig.plan_1') %></strong>
+        <span class="mig-waar"><%= _hier %></span>
+        <em><%= t('mig.plan_1_why') %></em>
+      </li>
+      <li class="<%= stap.aangekondigd ? 'is-done' : '' %>">
+        <strong><%= t('mig.plan_2') %></strong>
+        <span class="mig-waar"><%= _daar %></span>
+        <em><%= t('mig.plan_2_why') %></em>
+      </li>
+      <li class="<%= stap.opgehaald ? 'is-done' : '' %>">
+        <strong><%= t('mig.plan_3') %></strong>
+        <span class="mig-waar"><%= _hier %></span>
+        <em><%= t('mig.plan_3_why') %></em>
+      </li>
+      <li>
+        <strong><%= t('mig.plan_4') %></strong>
+        <span class="mig-waar"><%= _hier %></span>
+      </li>
+      <li class="mig-step-later">
+        <strong><%= t('mig.plan_5') %></strong>
+        <span class="mig-waar"><%= _daar %></span>
+        <em><%= t('mig.plan_5_why') %></em>
+      </li>
+    </ol>
+  </section>
 
   <%# ── Je oude account claimen (FEP-7628 alsoKnownAs) ─────────── %>
@@ -262 +310 @@
   .mig-report code { word-break: break-all; font-size: .88rem; }
   .mig-warn { color: var(--accent); }
+  .mig-plan { background: color-mix(in srgb, var(--ink, #000) 3%, transparent); }
+  .mig-steps { margin: 1rem 0 0; padding-left: 1.4rem; display: flex; flex-direction: column; gap: .7rem; }
+  .mig-steps li { color: var(--ink); }
+  .mig-steps li em { display: block; color: var(--sub); font-style: normal; font-size: .9rem; margin-top: .15rem; }
+  .mig-steps li.is-done > strong { text-decoration: line-through; opacity: .6; }
+  .mig-steps li.is-done::marker { content: '✓ '; }
+  .mig-steps li.mig-step-later { opacity: .8; }
+  .mig-waar { font-size: .8rem; padding: .05rem .4rem; border: 1px solid var(--rule); border-radius: 999px;
+              color: var(--sub); margin-left: .4rem; white-space: nowrap; }
   .mig-card-danger { border-color: color-mix(in srgb, var(--accent, #c33) 45%, var(--rule)); }
   textarea.mig-input { font-family: inherit; resize: vertical; }