Einzelne Gruppenmitglieder, Austritt per Redesign, Ladebalken beim Abgleich

Bei einem CC mit mehreren Nutzern gibt es zwei Ebenen, und bisher liess sich
nur die obere bedienen. Jetzt beide:

Ein Spieler kann seinen Anteil redesignen und steigt damit aus - er bekommt
einen eigenen CC, die Gruppe laeuft unberuehrt weiter. Fuer ihn ist es ein
Tausch wie jeder andere: der Gruppenplatz geht weg, der eigene CC kommt an
seine Stelle, es kommt keiner hinzu. Wohin er gewechselt ist, bleibt an der
Mitgliedschaft festgehalten und steht bei den frueheren Nutzern. Das Redesign
der ganzen Gruppe, bei dem alle mitwandern, gibt es unveraendert daneben.

Ebenso koennen einzelne Nutzer ausfallen, ohne die uebrigen zu beruehren: bei
einem Trio kann einer im Rollenspiel sterben, waehrend die anderen
weiterspielen, und ebenso koennen alle nacheinander wegfallen. Grund und
Begruendung haengen jetzt auch an der Mitgliedschaft. Die Rueckkehr folgt
denselben Regeln wie beim eigenen CC - geputzt gratis, entzogen gegen
Guthaben, gestorben nur durch einen Administrator mit Begruendung. Wer
ausgefallen ist, sieht seinen CC weiter auf der Spielerseite; sonst gaebe es
nichts, worueber er zurueckkehren koennte. Ein freiwilliger Austritt bleibt
davon getrennt: dort gibt es nichts zurueckzuholen, ein Wiedereintritt kostet
neu.

Der GExtension-Abgleich hat denselben Ladebalken wie der Forumslauf bekommen,
fuer alle Spieler wie fuer einzelne, samt Protokoll. Beide teilen sich jetzt
dieselbe Anzeige.

Dabei aufgefallen: Zeitplan und Handklick konnten denselben Abgleich doppelt
starten und haetten dieselben Profile zweimal abgerufen. Die Sperre sitzt
jetzt im Lauf selbst statt im Starter, damit sie fuer beide Wege gilt.

web/src/pages/Forum.tsx

@@ -1,6 +1,7 @@
 import { useCallback, useEffect, useState } from 'react';
 import { Link, useNavigate } from 'react-router-dom';
 import Notice from '../components/Notice';
+import RunProgress from '../components/RunProgress';
 import { AssignModal, ClassifyModal } from '../components/ThreadModals';
 import { ApiError, api } from '../lib/api';
 import { BOARD_LABEL, CLASSIFICATION_LABEL, formatDate } from '../lib/format';
@@ -232,7 +233,19 @@ export default function Forum() {
       {error && <Notice kind="error" onDismiss={() => setError(null)}>{error}</Notice>}
       {flash && <Notice kind="success" onDismiss={() => setFlash(null)}>{flash}</Notice>}
 
-      {busy && <ScanProgress state={scanZustand} />}
+      {busy && (
+        <RunProgress
+          done={scanZustand?.pagesRead ?? 0}
+          total={scanZustand?.totalPages ?? 0}
+          current={
+            scanZustand?.currentBoard
+              ? `liest ${BOARD_PFAD[scanZustand.currentBoard] ?? scanZustand.currentBoard}`
+              : null
+          }
+          log={scanZustand?.log ?? []}
+          hint="Zwischen den Abrufen wird bewusst gewartet, damit das Forum den Zugriff nicht bremst. Der Lauf geht im Hintergrund weiter, auch wenn diese Seite geschlossen wird."
+        />
+      )}
 
       {notices.length > 0 && (
         <section className="block block-flag">
@@ -545,54 +558,3 @@ export default function Forum() {
     </div>
   );
 }
-
-/**
- * Was der Abgleich gerade tut. Der Umfang steht erst fest, wenn von jedem
- * Board die erste Seite gelesen ist - bis dahin läuft der Balken durch,
- * statt einen erfundenen Anteil zu behaupten.
- */
-function ScanProgress({ state }: { state: ScanState | null }) {
-  const gelesen = state?.pagesRead ?? 0;
-  const gesamt = state?.totalPages ?? 0;
-  const bekannt = gesamt > 0;
-  const anteil = bekannt ? Math.min(100, Math.round((gelesen / gesamt) * 100)) : 0;
-  const letzte = state?.log.slice(-6) ?? [];
-
-  return (
-    <section className="block progress">
-      <div className="progress-head">
-        <strong>
-          {bekannt
-            ? `${gelesen} von ${gesamt} Seiten gelesen`
-            : `Umfang wird ermittelt … (${gelesen} Seiten)`}
-        </strong>
-        <span className="muted">
-          {state?.currentBoard
-            ? `liest ${BOARD_PFAD[state.currentBoard] ?? state.currentBoard}`
-            : 'wird gespeichert'}
-          {bekannt && ` · ${anteil} %`}
-        </span>
-      </div>
-
-      <div className="progress-bar">
-        <div
-          className={bekannt ? 'progress-fill' : 'progress-fill is-unknown'}
-          style={bekannt ? { width: `${anteil}%` } : undefined}
-        />
-      </div>
-
-      {letzte.length > 0 && (
-        <ul className="progress-log">
-          {letzte.map((zeile, index) => (
-            <li key={`${index}-${zeile}`}>{zeile}</li>
-          ))}
-        </ul>
-      )}
-
-      <p className="muted small">
-        Zwischen den Abrufen wird bewusst gewartet, damit das Forum den Zugriff nicht bremst. Der
-        Lauf geht im Hintergrund weiter, auch wenn diese Seite geschlossen wird.
-      </p>
-    </section>
-  );
-}