fix(payment): participantId stuck as empty string when participants load async

src/app/transactions/page.tsx

@@ -221,6 +221,12 @@ function MarkAsPaymentModal({
   const others = participants.filter((p) => p.name !== "Me");
 
   const [participantId, setParticipantId] = useState<number | "">(others[0]?.id ?? "");
+
+  useEffect(() => {
+    if (participantId === "" && others.length > 0) {
+      setParticipantId(others[0].id);
+    }
+  }, [others]);
   // For credits/refunds the default direction is "they paid me"
   const [direction, setDirection] = useState<"received" | "sent">(
     SPEND_TYPES.has(transaction.transaction_type) ? "sent" : "received"