source: Klonkt/src/views/pages/admin-migrate.ejs@ fbfd7a1

<div class="container mig-wrap">
  <h1><%= t('mig.title') %></h1>
  <p class="mig-lead"><%= t('mig.lead') %></p>

  <% if (typeof success !== 'undefined' && success) { %><div class="alert alert-success"><%= success %></div><% } %>
  <% if (typeof error !== 'undefined' && error) { %><div class="alert alert-error"><%= error %></div><% } %>

  <%# ── Exporteren ─────────────────────────────────────────────── %>
  <section class="mig-card">
    <h2><%= t('mig.export_title') %></h2>
    <p class="form-hint"><%= t('mig.export_hint') %></p>

    <% if (telling) { %>
      <ul class="mig-counts">
        <li><strong><%= telling.posts %></strong> <%= t('mig.c_posts') %></li>
        <li><strong><%= telling.replies %></strong> <%= t('mig.c_replies') %></li>
        <li><strong><%= telling.media %></strong> <%= t('mig.c_media') %></li>
        <% if (typeof telling.following === 'number') { %>
          <li><strong><%= telling.following %></strong> <%= t('mig.c_following') %></li>
        <% } %>
        <li><strong><%= mb(telling.bytes) %></strong> <%= t('mig.c_size') %></li>
      </ul>

      <% if (telling.ontbrekend) { %>
        <%# Niets stils: media die op schijf ontbreekt wordt geteld en gemeld, want
            een archief dat stilzwijgend minder bevat is erger dan een waarschuwing. %>
        <p class="alert alert-error"><%= t('mig.missing', { n: telling.ontbrekend }) %></p>
      <% } %>

      <% if (telling.groot) { %>
        <p class="alert alert-error"><%= t('mig.too_big') %></p>
      <% } else { %>
        <p><a class="btn btn-primary" href="/admin/migrate/export"><%= t('mig.export_btn') %></a></p>
      <% } %>
    <% } else { %>
      <p class="form-hint"><%= t('mig.export_none') %></p>
    <% } %>
  </section>

  <%# ── Rechtstreeks ophalen (FEP-1580) ────────────────────────── %>
  <section class="mig-card">
    <h2><%= t('mig.pull_title') %></h2>
    <p class="form-hint"><%= t('mig.pull_hint') %></p>

    <% if (haalVerslag) { %>
      <div class="mig-report<%= haalVerslag.error ? '' : ' is-done' %>">
        <% if (haalVerslag.error) { %>
          <h3><%= t('mig.pull_failed') %></h3>
          <%# Elke weigering krijgt een eigen zin. "Er ging iets mis" laat je
              raden welke van de twee kanten van de afspraak ontbreekt, en dat
              is precies wat je moet weten om het op te lossen. %>
          <p><%= t('mig.e_' + haalVerslag.error) !== 'mig.e_' + haalVerslag.error
                   ? t('mig.e_' + haalVerslag.error) : (haalVerslag.melding || haalVerslag.error) %></p>
          <% if (haalVerslag.error === 'not_moved_here' && haalVerslag.movedTo) { %>
            <p class="form-hint"><%= t('mig.e_points_at') %> <code><%= haalVerslag.movedTo %></code></p>
          <% } %>
        <% } else { %>
          <h3><%= t('mig.pull_done') %></h3>
          <ul class="mig-counts">
            <li><strong><%= haalVerslag.posts %></strong> <%= t('mig.r_imported') %></li>
            <% if (haalVerslag.overgeslagen) { %><li><strong><%= haalVerslag.overgeslagen %></strong> <%= t('mig.r_skipped') %></li><% } %>
            <% if (haalVerslag.media) { %><li><strong><%= haalVerslag.media %></strong> <%= t('mig.r_media') %></li><% } %>
            <% if (haalVerslag.blocks) { %><li><strong><%= haalVerslag.blocks %></strong> <%= t('mig.r_blocks') %></li><% } %>
          </ul>
        <% } %>
        <% if (haalVerslag.waarschuwingen && haalVerslag.waarschuwingen.length) { %>
          <ul class="mig-warnlist">
            <% haalVerslag.waarschuwingen.slice(0, 6).forEach(function (w) { %><li><%= w %></li><% }); %>
          </ul>
        <% } %>
      </div>
    <% } %>

    <form method="post" action="/admin/migrate/pull">
      <label for="mig-bron"><%= t('mig.pull_source') %></label>
      <input type="url" id="mig-bron" name="bron" value="<%= bron || '' %>"
             placeholder="https://oude-klonkt.nl/ap/users/jij" class="mig-input">
      <p class="form-hint"><%= t('mig.pull_source_hint') %></p>
      <button type="submit" class="btn"><%= t('mig.pull_btn') %></button>
    </form>

    <% if (mig && (mig.total || mig.moves)) { %>
      <p class="form-hint mig-state">
        <%= t('mig.state', { n: mig.total }) %>
        <%= mig.complete ? t('mig.state_done') : t('mig.state_busy') %>
      </p>
    <% } %>
  </section>

  <%# ── Importeren ─────────────────────────────────────────────── %>
  <section class="mig-card">
    <h2><%= t('mig.import_title') %></h2>
    <p class="form-hint"><%= t('mig.import_hint') %></p>

    <% if (verslag) { %>
      <div class="mig-report<%= verslag.echt ? ' is-done' : '' %>">
        <h3><%= verslag.echt ? t('mig.r_done') : t('mig.r_dry') %></h3>
        <p class="form-hint"><%= verslag.bestand %> &middot; <%= mb(verslag.bytes) %></p>
        <ul class="mig-counts">
          <li><strong><%= verslag.posts %></strong> <%= verslag.echt ? t('mig.r_imported') : t('mig.r_would') %></li>
          <li><strong><%= verslag.overgeslagen %></strong> <%= t('mig.r_skipped') %></li>
          <% if (verslag.overschreven) { %><li><strong><%= verslag.overschreven %></strong> <%= t('mig.r_overwritten') %></li><% } %>
          <% if (verslag.mediaMissing) { %><li><strong><%= verslag.mediaMissing %></strong> <%= t('mig.r_media_missing') %></li><% } %>
          <% if (verslag.media) { %><li><strong><%= verslag.media %></strong> <%= t('mig.r_media') %></li><% } %>
        </ul>
        <% if (verslag.waarschuwingen && verslag.waarschuwingen.length) { %>
          <ul class="mig-warnlist">
            <% verslag.waarschuwingen.slice(0, 6).forEach(function (w) { %><li><%= w %></li><% }); %>
          </ul>
        <% } %>
        <% if (verslag.idsBehouden === false) { %>
          <%# Dit is de belangrijkste regel van het hele verslag: komt het archief
              van een ANDER adres, dan krijgen de posts nieuwe id's en zijn het
              nieuwe objecten voor de fediverse. %>
          <p class="alert alert-error"><%= t('mig.r_new_ids') %></p>
        <% } %>

        <% if (!verslag.echt && verslag.posts > 0) { %>
          <form method="post" action="/admin/migrate/import" enctype="multipart/form-data" class="mig-confirm">
            <p class="form-hint"><%= t('mig.r_confirm_hint') %></p>
            <label for="mig-file2"><%= t('mig.file_label') %></label>
            <input type="file" id="mig-file2" name="archief" accept=".zip,application/zip" required>
            <input type="hidden" name="echt" value="1">
            <% if (verslag.overschrijf) { %><input type="hidden" name="overschrijf" value="1"><% } %>
            <button type="submit" class="btn btn-primary"><%= t('mig.r_confirm_btn') %></button>
          </form>
        <% } %>
      </div>
    <% } %>

    <form method="post" action="/admin/migrate/import" enctype="multipart/form-data">
      <label for="mig-file"><%= t('mig.file_label') %></label>
      <input type="file" id="mig-file" name="archief" accept=".zip,application/zip" required>

      <label class="mig-check">
        <input type="checkbox" name="overschrijf" value="1">
        <%= t('mig.overwrite_label') %>
      </label>
      <p class="form-hint mig-warn"><%= t('mig.overwrite_hint') %></p>

      <button type="submit" class="btn"><%= t('mig.check_btn') %></button>
      <p class="form-hint"><%= t('mig.check_hint') %></p>
    </form>
  </section>

  <%# ── Wie je volgt ────────────────────────────────────────────── %>
  <section class="mig-card">
    <h2><%= t('mig.follows_title') %></h2>
    <p class="form-hint"><%= t('mig.follows_hint') %></p>
    <p><a class="btn" href="/connect"><%= t('mig.follows_btn') %></a></p>
  </section>
</div>

<style>
  .mig-wrap { max-width: 46rem; }
  .mig-lead { color: var(--sub); margin-bottom: 1.5rem; }
  .mig-card { border: 1px solid var(--rule); border-radius: 12px; padding: 1.25rem 1.4rem; margin-bottom: 1.25rem; }
  .mig-card h2 { margin: 0 0 .35rem; font-size: 1.1rem; }
  .mig-counts { list-style: none; padding: 0; margin: .9rem 0; display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; }
  .mig-counts li { color: var(--sub); font-size: .94rem; }
  .mig-counts strong { color: var(--ink); font-size: 1.05rem; }
  .mig-card label { display: block; margin: .9rem 0 .35rem; font-weight: 600; font-size: .92rem; }
  .mig-card input[type="file"] { display: block; margin-bottom: .6rem; }
  .mig-check { display: flex; align-items: center; gap: .5rem; font-weight: 400 !important; }
  .mig-input { width: 100%; max-width: 34rem; padding: .5rem .6rem; border: 1px solid var(--rule);
               border-radius: 8px; background: transparent; color: var(--ink); font-size: .95rem; }
  .mig-state { margin-top: .9rem; }
  .mig-report code { word-break: break-all; font-size: .88rem; }
  .mig-warn { color: var(--accent); }
  .mig-report { border-left: 3px solid var(--accent); padding: .8rem 1rem; margin-bottom: 1.2rem;
                background: color-mix(in srgb, var(--ink, #000) 4%, transparent); border-radius: 0 8px 8px 0; }
  .mig-report.is-done { border-left-color: #3fa843; }
  .mig-report h3 { margin: 0 0 .3rem; font-size: 1rem; }
  .mig-warnlist { margin: .5rem 0; padding-left: 1.2rem; color: var(--accent); font-size: .9rem; }
  .mig-confirm { margin-top: .9rem; padding-top: .9rem; border-top: 1px solid var(--rule); }
</style>