feat: Einer Buchung sieht man an, ob sie ein Uebertrag ist – und was sie war

Drei Dinge, die zusammengehoeren.

1. Uebertraege sind als solche lesbar.

Stand nur eine Seite in der Liste – weil nach einem Konto gefiltert wird
oder die andere nicht mitgeladen war – trug die Zeile den Rohtext der
Bank als Ueberschrift. "To CHF MB:8f33c0aa-9c92-456b-a6fe-b64a858a019c"
sah aus wie eine Zahlung an jemanden; die Verknuepfung stand klein
darunter. Jetzt steht oben, zwischen WELCHEN Konten das Geld lief, in
beiden Faellen gleich, und daneben eine Marke "Transfer". Ein Uebertrag
ist weder Ausgabe noch Einnahme – das gehoert in die erste Zeile, nicht
in eine Fussnote.

2. Notiz je Buchung.

Das Feld gab es im Modell seit jeher, die Oberflaeche bot es nie an. Die
Kategorie sagt, in welche Schublade etwas gehoert – nicht, WAS es war.
"Amazon" kann Einrichtung sein, Werkzeug oder ein Geschenk, und in drei
Monaten weiss das niemand mehr. Die Notiz steht in der Liste und ist
mitdurchsuchbar: Wer sie schreibt, will spaeter danach suchen.

3. "Ignorieren" ist keine Einbahnstrasse mehr.

Ein abgelehntes Paar blieb bei jedem weiteren Suchlauf stumm, und nichts
verriet, dass es je einen Vorschlag gab. Wer einmal falsch klickte,
suchte danach einen Fehler in der Erkennung, den es nicht gab. Die
abgelehnten Paare lassen sich jetzt ansehen und zurueckholen.

Und wenn die Vorschlaege nicht geladen werden koennen, wird das gesagt
statt verschluckt – sonst sieht die Liste aus, als gaebe es nichts zu
verbinden.

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

web/src/api.js

@@ -250,6 +250,11 @@ export const api = {
     request(`/uebertraege/${linkId}`, { method: "DELETE" }),
   ignoreTransfer: (a_id, b_id) =>
     request("/uebertraege/ignorieren", { method: "POST", body: { a_id, b_id } }),
+  // Abgelehnte Vorschlaege ansehen und zuruecknehmen. Ohne das waere
+  // „Ignorieren" eine Einbahnstrasse.
+  ignoredTransfers: () => request("/uebertraege/ignoriert"),
+  unignoreTransfer: (a_id, b_id) =>
+    request("/uebertraege/ignoriert", { method: "DELETE", body: { a_id, b_id } }),
 
   listBankConnections: () => request("/bank/connections"),
   syncBankConnection: (id) => request(`/bank/connections/${id}/sync`, { method: "POST" }),

web/src/components/Uebertragsvorschlaege.jsx

@@ -18,6 +18,11 @@ export default function Uebertragsvorschlaege({ baseCurrency, onChange }) {
 
   const [stand, setStand] = useState(null);   // { verknuepft, vorschlaege }
   const [busy, setBusy] = useState(false);
+  // Abgelehnte Vorschlaege. Ohne diese Liste war „Ignorieren" endgueltig:
+  // Das Paar blieb bei jedem weiteren Lauf stumm, und nichts verriet, dass es
+  // je einen Vorschlag gab – wer einmal falsch klickte, suchte danach einen
+  // Fehler in der Erkennung, den es nicht gab.
+  const [abgelehnt, setAbgelehnt] = useState([]);
 
   async function suchen(melden = false) {
     setBusy(true);
@@ -37,7 +42,21 @@ export default function Uebertragsvorschlaege({ baseCurrency, onChange }) {
     }
   }
 
-  useEffect(() => { suchen(false); }, []);
+  async function abgelehnteLaden() {
+    try { setAbgelehnt(await api.ignoredTransfers()); } catch { /* still */ }
+  }
+
+  useEffect(() => { suchen(false); abgelehnteLaden(); }, []);
+
+  async function zurueckholen(paar) {
+    try {
+      await api.unignoreTransfer(paar.a.id, paar.b.id);
+      await abgelehnteLaden();
+      suchen(false);
+    } catch (e) {
+      toast(e.message, "error");
+    }
+  }
 
   async function verbinden(paar) {
     try {
@@ -53,6 +72,7 @@ export default function Uebertragsvorschlaege({ baseCurrency, onChange }) {
     try {
       await api.ignoreTransfer(paar.a.id, paar.b.id);
       suchen(false);
+      abgelehnteLaden();
     } catch (e) {
       toast(e.message, "error");
     }
@@ -60,7 +80,7 @@ export default function Uebertragsvorschlaege({ baseCurrency, onChange }) {
 
   // Vor dem ersten Ergebnis keine leere Karte zeigen.
   if (stand === null) return null;
-  if (stand.vorschlaege.length === 0) return null;
+  if (stand.vorschlaege.length === 0 && abgelehnt.length === 0) return null;
 
   return (
     <div className="card">
@@ -102,6 +122,30 @@ export default function Uebertragsvorschlaege({ baseCurrency, onChange }) {
           );
         })}
       </div>
+
+      {/* Der Rueckweg. Eingeklappt, weil man ihn selten braucht – aber da,
+          weil ein Klick sonst fuer immer gilt. */}
+      {abgelehnt.length > 0 && (
+        <details className="abgelehnte">
+          <summary className="muted small">
+            {t("transfers.ignoredCount", { count: abgelehnt.length })}
+          </summary>
+          <p className="muted small">{t("transfers.ignoredHint")}</p>
+          {abgelehnt.map((paar) => (
+            <div className="uebertrag-vorschlag" key={`x${paar.a.id}-${paar.b.id}`}>
+              <div className="uebertrag-seiten">
+                <Seite seite={paar.a} baseCurrency={baseCurrency} />
+                <Icon name="arrow-left-right" size={16} className="uebertrag-pfeil" />
+                <Seite seite={paar.b} baseCurrency={baseCurrency} />
+              </div>
+              <button className="btn sm" style={{ marginTop: "var(--sp-2)" }}
+                      onClick={() => zurueckholen(paar)}>
+                {t("transfers.unignore")}
+              </button>
+            </div>
+          ))}
+        </details>
+      )}
     </div>
   );
 }

web/src/finance.css

@@ -1208,6 +1208,24 @@ tr.row-dup {
   font-size: 0.9em;
 }
 
+/* Eigene Notiz an einer Buchung – von Hand geschrieben und deshalb
+   aussagekraeftiger als jeder Banktext. Abgesetzt, damit sie nicht mit dem
+   Verwendungszweck verwechselt wird. */
+.buchungsnotiz {
+  color: var(--muted);
+  font-style: italic;
+  opacity: 0.95;
+}
+.buchungsnotiz svg { vertical-align: -1px; }
+
+/* Der Rueckweg aus „Ignorieren" – selten gebraucht, aber vorhanden. */
+.abgelehnte {
+  margin-top: var(--sp-3);
+  border-top: 1px solid var(--border);
+  padding-top: var(--sp-2);
+}
+.abgelehnte summary { cursor: pointer; padding: 4px 0; }
+
 /* ---------- Übertrags-Vorschläge ---------- */
 .uebertrag-vorschlag {
   padding: var(--sp-3) 0;

web/src/locales/de.json

@@ -295,6 +295,8 @@
     "toAmount": "Gutschrift",
     "payee": "Empfänger",
     "description": "Verwendungszweck",
+    "notes": "Notiz",
+    "notesPlaceholder": "Wofür war das? z. B. „Geschenk“, „beruflich“, „Werkzeug“",
     "uncategorized": "Ohne Kategorie",
     "empty": "Noch keine Buchungen.",
     "needAccount": "Lege zuerst ein Konto an, um Buchungen zu erfassen.",
@@ -807,6 +809,12 @@
     "ignore": "Ignorieren",
     "hasCategory": "Eine der beiden hat eine Kategorie – sie fällt durchs Verbinden aus der Auswertung.",
     "linked": "Übertrag",
+    "linkedHint": "Übertrag zwischen eigenen Konten – zählt weder als Ausgabe noch als Einnahme.",
+    "suggestionsFailed": "Mögliche Überträge konnten nicht geladen werden: {{fehler}}",
+    "ignoredCount_one": "{{count}} abgelehnter Vorschlag",
+    "ignoredCount_other": "{{count}} abgelehnte Vorschläge",
+    "ignoredHint": "Abgelehnte Paare bleiben bei jedem weiteren Suchlauf stumm. Zurückholen heisst: Sie werden wieder vorgeschlagen.",
+    "unignore": "Wieder vorschlagen",
     "release": "Verknüpfung lösen",
     "releaseConfirm": "Die beiden Buchungen bleiben unverändert stehen und zählen danach wieder als Ausgabe und Einnahme.",
     "question": "Übertrag von/nach {{konto}}?"

web/src/locales/en.json

@@ -295,6 +295,8 @@
     "toAmount": "Credited",
     "payee": "Payee",
     "description": "Description",
+    "notes": "Note",
+    "notesPlaceholder": "What was it for? e.g. “gift”, “work”, “tools”",
     "uncategorized": "Uncategorized",
     "empty": "No transactions yet.",
     "needAccount": "Create an account first to record transactions.",
@@ -807,6 +809,12 @@
     "ignore": "Ignore",
     "hasCategory": "One of them has a category – connecting takes it out of the evaluation.",
     "linked": "Transfer",
+    "linkedHint": "Transfer between your own accounts — counts neither as an expense nor as income.",
+    "suggestionsFailed": "Possible transfers could not be loaded: {{fehler}}",
+    "ignoredCount_one": "{{count}} dismissed suggestion",
+    "ignoredCount_other": "{{count}} dismissed suggestions",
+    "ignoredHint": "Dismissed pairs stay silent in every later search. Bringing one back means it will be suggested again.",
+    "unignore": "Suggest again",
     "release": "Release link",
     "releaseConfirm": "Both transactions stay exactly as they are and count as expense and income again afterwards.",
     "question": "Transfer from/to {{konto}}?"

web/src/pages/Transactions.jsx

@@ -31,6 +31,7 @@ function emptyForm() {
     to_amount: "",
     payee: "",
     description: "",
+    notes: "",
     budget_as_expense: true,
     budget_category_id: "",
     // Leer heisst: aus dem Datum. Der Normalfall, und er bleibt es.
@@ -83,7 +84,12 @@ export default function Transactions() {
         api.transactionLinks().catch(() => ({})),
         // Nur fragen, nichts tun: Beim Anschauen der Liste darf nichts
         // verknüpft werden.
-        api.transferSuggestions().catch(() => ({ vorschlaege: [] })),
+        api.transferSuggestions().catch((e) => {
+          // Stillschweigen waere hier das Schlimmste: Die Liste saehe aus, als
+          // gaebe es nichts zu verbinden.
+          toast(t("transfers.suggestionsFailed", { fehler: e.message }), "error");
+          return { vorschlaege: [] };
+        }),
       ]);
       setTxns(liste);
       setLinks(verkn);
@@ -211,6 +217,7 @@ export default function Transactions() {
       to_amount: tx.to_amount_cents ? centsToInput(tx.to_amount_cents) : "",
       payee: tx.payee || "",
       description: tx.description || "",
+      notes: tx.notes || "",
       budget_as_expense: tx.budget_treatment !== "neutral",
       budget_category_id: tx.budget_category_id ? String(tx.budget_category_id) : "",
       // Nur der von Hand gesetzte Monat gehoert ins Formular. Leer heisst:
@@ -238,6 +245,7 @@ export default function Transactions() {
       amount_cents: cents,
       payee: form.payee.trim() || null,
       description: form.description.trim() || null,
+      notes: form.notes.trim() || null,
       budget_period: form.budget_period || null,
     };
     if (form.type === "transfer") {
@@ -295,11 +303,31 @@ export default function Transactions() {
       const von = accountById[tx.account_id]?.name || "?";
       const nach = accountById[gegen.account_id]?.name || "?";
       return {
-        icon: "arrow-left-right", color: "#6b7480",
+        icon: "arrow-left-right", color: "#6b7480", uebertrag: true,
         title: `${von} → ${nach}`,
         sub: tx.payee || tx.description || t("transactions.transfer"),
       };
     }
+    // Verknuepft, aber die Gegenseite ist nicht in der Liste (gefiltert oder
+    // auf einer anderen Seite). Dieselbe Darstellung wie beim Paar: Oben steht,
+    // zwischen WELCHEN Konten das Geld lief, und nicht ein Empfaengertext, den
+    // die Bank vergeben hat.
+    //
+    // Vorher stand hier der Rohtext als Titel und die Verknuepfung nur klein
+    // darunter – „To CHF MB:8f33c0aa-9c92-456b-a6fe-b64a858a019c" sah aus wie
+    // eine Zahlung an jemanden.
+    const link = links[String(tx.id)];
+    if (link) {
+      const eigen = accountById[tx.account_id]?.name || "?";
+      const anderes = accountById[link.other_account_id]?.name
+        || t("transfers.linked");
+      return {
+        icon: "arrow-left-right", color: "#6b7480", uebertrag: true,
+        title: link.richtung === "raus"
+          ? `${eigen} → ${anderes}` : `${anderes} → ${eigen}`,
+        sub: tx.payee || tx.description || "",
+      };
+    }
     if (tx.type === "transfer") {
       const from = accountById[tx.account_id]?.name || "?";
       const to = accountById[tx.to_account_id]?.name || "?";
@@ -330,7 +358,9 @@ export default function Transactions() {
     {
       // Wofür die Zahlung war – danach sucht man in der Liste.
       key: "text", header: t("transactions.subject"), grow: true, min: 190,
-      filterText: (tx) => rowLabel(tx).title,
+      // Auch die Notiz durchsuchbar: Wer sie schreibt, will spaeter danach
+      // suchen koennen („Geschenk", „beruflich").
+      filterText: (tx) => [rowLabel(tx).title, tx.notes].filter(Boolean).join(" "),
       sortValue: (tx) => rowLabel(tx).title,
       render: (tx) => {
         const l = rowLabel(tx);
@@ -343,6 +373,15 @@ export default function Transactions() {
                   stapeln macht die Zeilen hoch und den Blick eng. */}
               <div className="titelzeile">
                 <span className="ellipsis">{l.title}</span>
+                {/* Ein Uebertrag ist keine Ausgabe und keine Einnahme. Das
+                    gehoert in die erste Zeile, nicht in eine Fussnote. */}
+                {l.uebertrag && (
+                  <span className="badge accent herkunft"
+                        title={t("transfers.linkedHint")}>
+                    <Icon name="arrow-left-right" size={11} />
+                    {t("transactions.transfer")}
+                  </span>
+                )}
                 <span className="badge herkunft">{t(`todo.from.${tx.herkunft}`, {
                   defaultValue: tx.herkunft,
                 })}</span>
@@ -358,17 +397,16 @@ export default function Transactions() {
                 )}
               </div>
               {l.sub && <div className="named-sub ellipsis">{l.sub}</div>}
-              {/* Verknüpft heisst: zählt nicht als Ausgabe oder Einnahme.
-                  Ohne das Gegenkonto sagt „Übertrag" nichts. */}
-              {/* Bei einer Paar-Zeile steht das Gegenkonto schon im Titel –
-                  die Marke waere dort nur eine Wiederholung. */}
-              {links[String(tx.id)] && !paarZu[tx.id] && (
-                <div className="named-sub ellipsis uebertrag-marke">
-                  <Icon name="arrow-left-right" size={12} />{" "}
-                  {accountById[links[String(tx.id)].other_account_id]?.name
-                    || t("transfers.linked")}
+              {/* Von Hand geschrieben und deshalb aussagekraeftiger als jeder
+                  Banktext: „Amazon" kann Einrichtung sein, Werkzeug oder ein
+                  Geschenk. */}
+              {tx.notes && (
+                <div className="named-sub ellipsis buchungsnotiz" title={tx.notes}>
+                  <Icon name="edit" size={11} /> {tx.notes}
                 </div>
               )}
+              {/* Die fruehere Marke mit dem Gegenkonto ist entfallen: Das
+                  Gegenkonto steht jetzt im Titel, wo man es sucht. */}
               {/* Nachträglich erkannt: Auf einem anderen Konto steht der
                   gleiche Betrag am selben Tag in die andere Richtung. Fragen
                   statt tun – und die Antwort merken. */}
@@ -657,6 +695,16 @@ export default function Transactions() {
               <span>{t("transactions.description")}</span>
               <input value={form.description} onChange={(e) => setForm({ ...form, description: e.target.value })} />
             </label>
+            {/* Die Kategorie sagt, in welche Schublade es gehoert. Die Notiz
+                sagt, WAS es war – „Amazon" kann Einrichtung sein, Werkzeug
+                oder ein Geschenk, und in drei Monaten weiss das niemand mehr.
+                Freier Text, weil sich das nicht in Schubladen fassen laesst. */}
+            <label>
+              <span>{t("transactions.notes")}</span>
+              <textarea rows={2} value={form.notes}
+                        placeholder={t("transactions.notesPlaceholder")}
+                        onChange={(e) => setForm({ ...form, notes: e.target.value })} />
+            </label>
           </form>
         </Modal>
       )}