transaction: only get payee suggestions once

Also refactor posting list to use Svelte #each directly. The reactivity
bug that forced us to implement this differently seems to be gone.

Author: yagebu

frontend/src/entry-forms/Posting.svelte

@@ -32,7 +32,7 @@
   }: Props = $props();
 
   let amount_number = $derived(posting.amount.replace(/[^\-?0-9.]/g, ""));
-  let amountSuggestions = $derived(
+  let amount_suggestions = $derived(
     $currencies.map((c) => `${amount_number} ${c}`),
   );
 
@@ -98,7 +98,7 @@
   />
   <AutocompleteInput
     placeholder={_("Amount")}
-    suggestions={amountSuggestions}
+    suggestions={amount_suggestions}
     bind:value={
       () => posting.amount,
       (amount: string) => {

frontend/src/entry-forms/Transaction.svelte

@@ -27,6 +27,12 @@
   let payee = $derived(entry.payee);
   let narration = $derived(entry.get_narration_tags_links());
 
+  let payee_accounts = $derived(
+    $payees.includes(payee)
+      ? fetch_payee_accounts($ledger_mtime, payee)
+      : undefined,
+  );
+
   // Autofill complete transactions.
   async function autocomplete_select_payee() {
     if (entry.narration || entry.postings.some((p) => !p.is_empty())) {
@@ -119,31 +125,25 @@
 <div class="flex-row hide-on-desktop">
   <span class="label">{_("Postings")}:</span>
 </div>
-{#each entry.postings, index}
-  <!-- Using the indexed access (instead of `as posting` in the each) seems to track
-         the reactivity differently and avoids cursor jumping on the posting inputs. -->
-  {@const posting = entry.postings[index]}
-  {#if posting != null}
-    <PostingSvelte
-      bind:posting={
-        () => posting,
-        (posting: Posting) => {
-          entry = entry.set("postings", entry.postings.with(index, posting));
-        }
+<!-- eslint-disable-next-line svelte/require-each-key -->
+{#each entry.postings as posting, index}
+  <PostingSvelte
+    bind:posting={
+      () => posting,
+      (posting: Posting) => {
+        entry = entry.set("postings", entry.postings.with(index, posting));
       }
-      {index}
-      suggestions={$payees.includes(payee)
-        ? fetch_payee_accounts($ledger_mtime, payee).data
-        : undefined}
-      date={entry.date}
-      move={({ from, to }: { from: number; to: number }) => {
-        entry = entry.set("postings", move(entry.postings, from, to));
-      }}
-      remove={() => {
-        entry = entry.set("postings", entry.postings.toSpliced(index, 1));
-      }}
-    />
-  {/if}
+    }
+    {index}
+    suggestions={payee_accounts?.data}
+    date={entry.date}
+    move={({ from, to }: { from: number; to: number }) => {
+      entry = entry.set("postings", move(entry.postings, from, to));
+    }}
+    remove={() => {
+      entry = entry.set("postings", entry.postings.toSpliced(index, 1));
+    }}
+  />
 {/each}
 
 <style>

src/fava/translations/messages.pot

@@ -123,19 +123,19 @@ msgstr ""
 msgid "Amount"
 msgstr ""
 
-#: frontend/src/entry-forms/Transaction.svelte:77
-#: frontend/src/entry-forms/Transaction.svelte:79
+#: frontend/src/entry-forms/Transaction.svelte:83
+#: frontend/src/entry-forms/Transaction.svelte:85
 #: frontend/src/reports/journal/JournalHeaders.svelte:51
 msgid "Payee"
 msgstr ""
 
-#: frontend/src/entry-forms/Transaction.svelte:90
-#: frontend/src/entry-forms/Transaction.svelte:92
+#: frontend/src/entry-forms/Transaction.svelte:96
+#: frontend/src/entry-forms/Transaction.svelte:98
 #: frontend/src/reports/journal/JournalHeaders.svelte:51
 msgid "Narration"
 msgstr ""
 
-#: frontend/src/entry-forms/Transaction.svelte:120
+#: frontend/src/entry-forms/Transaction.svelte:126
 #: frontend/src/reports/journal/JournalFilters.svelte:44
 msgid "Postings"
 msgstr ""