From 42ca152bfba16a1ab022e22885f3aa659bb108a0 Mon Sep 17 00:00:00 2001
From: James Cole <james@firefly-iii.org>
Date: Sat, 22 Aug 2026 08:18:33 +0200
Subject: [PATCH] Expand modal, add copyright.

---
 .../Account/UpdatesAccountInformation.php     | 21 +++++
 .../System/HandlesNewUserRegistration.php     | 21 +++++
 public/v1/js/css/app.css                      | 20 +++++
 public/v1/js/css/layout.css                   | 20 +++++
 .../assets/v3/js/pages/transactions/create.js | 12 +--
 .../assets/v3/js/pages/transactions/edit.js   |  4 +
 .../js/pages/transactions/shared/add-split.js |  1 +
 .../pages/transactions/shared/clear-fields.js | 20 +++++
 .../transactions/shared/clear-location.js     | 20 +++++
 .../shared/detect-transaction-type.js         | 20 +++++
 .../shared/determine-amount-currency.js       | 20 +++++
 .../pages/transactions/shared/display-map.js  | 20 +++++
 .../transactions/shared/load-custom-fields.js | 20 +++++
 .../pages/transactions/shared/on-map-click.js | 20 +++++
 .../pages/transactions/shared/on-map-zoom.js  | 20 +++++
 .../pages/transactions/shared/remove-split.js | 27 +++++++
 .../pages/transactions/shared/render-map.js   | 20 +++++
 .../components/transaction/split.blade.php    | 77 ++++++++++++++++++-
 .../partials/form/transaction/links.blade.php |  6 +-
 resources/views/transactions/create.blade.php | 53 -------------
 20 files changed, 377 insertions(+), 65 deletions(-)
 create mode 100644 resources/assets/v3/js/pages/transactions/shared/remove-split.js

diff --git a/app/Listeners/Model/Account/UpdatesAccountInformation.php b/app/Listeners/Model/Account/UpdatesAccountInformation.php
index 1f5f1160da..e4419cc54b 100644
--- a/app/Listeners/Model/Account/UpdatesAccountInformation.php
+++ b/app/Listeners/Model/Account/UpdatesAccountInformation.php
@@ -1,5 +1,26 @@
 <?php
 
+
+/*
+ * UpdatesAccountInformation.php
+ * Copyright (c) 2026 james@firefly-iii.org
+ *
+ * This file is part of Firefly III (https://github.com/firefly-iii).
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
 declare(strict_types=1);
 
 /*
diff --git a/app/Listeners/Security/System/HandlesNewUserRegistration.php b/app/Listeners/Security/System/HandlesNewUserRegistration.php
index 4a951c94e3..af3d2df704 100644
--- a/app/Listeners/Security/System/HandlesNewUserRegistration.php
+++ b/app/Listeners/Security/System/HandlesNewUserRegistration.php
@@ -1,5 +1,26 @@
 <?php
 
+
+/*
+ * HandlesNewUserRegistration.php
+ * Copyright (c) 2026 james@firefly-iii.org
+ *
+ * This file is part of Firefly III (https://github.com/firefly-iii).
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
 declare(strict_types=1);
 
 /*
diff --git a/public/v1/js/css/app.css b/public/v1/js/css/app.css
index 8b13789179..d52ac0aecf 100755
--- a/public/v1/js/css/app.css
+++ b/public/v1/js/css/app.css
@@ -1 +1,21 @@
+/*
+ * app.css
+ * Copyright (c) 2026 james@firefly-iii.org
+ *
+ * This file is part of Firefly III (https://github.com/firefly-iii).
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
 
diff --git a/public/v1/js/css/layout.css b/public/v1/js/css/layout.css
index 8b13789179..8f78b70d25 100755
--- a/public/v1/js/css/layout.css
+++ b/public/v1/js/css/layout.css
@@ -1 +1,21 @@
+/*
+ * layout.css
+ * Copyright (c) 2026 james@firefly-iii.org
+ *
+ * This file is part of Firefly III (https://github.com/firefly-iii).
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
 
diff --git a/resources/assets/v3/js/pages/transactions/create.js b/resources/assets/v3/js/pages/transactions/create.js
index e0be37d9bf..82ea8c038e 100644
--- a/resources/assets/v3/js/pages/transactions/create.js
+++ b/resources/assets/v3/js/pages/transactions/create.js
@@ -52,6 +52,7 @@ import {onMapClick} from './shared/on-map-click.js';
 import {onMapZoom} from "./shared/on-map-zoom.js";
 import {clearLocation} from './shared/clear-location.js';
 import bootstrap from "bootstrap/dist/js/bootstrap.bundle.js";
+import {removeSplit} from "./shared/remove-split.js";
 
 
 let create = function () {
@@ -62,6 +63,9 @@ let create = function () {
         // transactions are stored in "entries":
         entries: [],
 
+        // links are stored in "links" for each transaction journal.
+        links: [],
+
         // maps are stored in this array so they can be referred to.
         maps: [],
         markers: [],
@@ -155,6 +159,7 @@ let create = function () {
         showMessageOrRedirectUser: showMessageOrRedirectUser,
         parseErrors: parseErrors,
         addSplit:addSplit,
+        removeSplit: removeSplit,
         clearSourceAccount: clearSourceAccount,
         clearDestinationAccount: clearDestinationAccount,
         detectTransactionType: detectTransactionType,
@@ -347,12 +352,7 @@ let create = function () {
             });
         },
 
-        removeSplit(index) {
-            this.entries.splice(index, 1);
-            // fall back to index 0
-            const triggerFirstTabEl = document.querySelector('#split-0-tab')
-            triggerFirstTabEl.click();
-        },
+
 
     }
 }
diff --git a/resources/assets/v3/js/pages/transactions/edit.js b/resources/assets/v3/js/pages/transactions/edit.js
index 4108d85e0e..b20dd7aeda 100644
--- a/resources/assets/v3/js/pages/transactions/edit.js
+++ b/resources/assets/v3/js/pages/transactions/edit.js
@@ -54,6 +54,7 @@ import 'leaflet/dist/leaflet.css';
 import {onMapClick} from './shared/on-map-click.js';
 import {onMapZoom} from './shared/on-map-zoom.js';
 import {clearLocation} from './shared/clear-location.js';
+import {removeSplit} from "./shared/remove-split.js";
 
 const urls = getUrls();
 
@@ -65,6 +66,7 @@ let transactions = function () {
         // transactions are stored in "entries":
         entries: [],
         originals: [],
+        links: [],
 
         // maps are stored in this array so they can be referred to.
         maps: [],
@@ -113,6 +115,7 @@ let transactions = function () {
         // properties for the entire transaction group
         groupProperties: {
             transactionType: 'unknown',
+            titleErrors: [],
             title: null,
             editTitle: null,
             id: null, totalAmount: 0,
@@ -152,6 +155,7 @@ let transactions = function () {
         onMapClick: onMapClick,
         onMapZoom: onMapZoom,
         clearLocation: clearLocation,
+        removeSplit: removeSplit,
 
 
         // part of the account selection auto-complete
diff --git a/resources/assets/v3/js/pages/transactions/shared/add-split.js b/resources/assets/v3/js/pages/transactions/shared/add-split.js
index 8b74c2e7b7..379ddd9996 100644
--- a/resources/assets/v3/js/pages/transactions/shared/add-split.js
+++ b/resources/assets/v3/js/pages/transactions/shared/add-split.js
@@ -24,6 +24,7 @@ import {addAllAutocompleteToForm} from "./add-autocomplete.js";
 export function addSplit() {
     console.log('addSplit()');
     this.entries.push(createEmptySplit());
+    this.links.push([]);
     this.disableSplitAccounts();
     this.addAllAutocompleteToForm();
     this.addTabListener();
diff --git a/resources/assets/v3/js/pages/transactions/shared/clear-fields.js b/resources/assets/v3/js/pages/transactions/shared/clear-fields.js
index 2d2d637494..d4d85856a0 100644
--- a/resources/assets/v3/js/pages/transactions/shared/clear-fields.js
+++ b/resources/assets/v3/js/pages/transactions/shared/clear-fields.js
@@ -1,3 +1,23 @@
+/*
+ * clear-fields.js
+ * Copyright (c) 2026 james@firefly-iii.org
+ *
+ * This file is part of Firefly III (https://github.com/firefly-iii).
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
 import {getAccount} from "./create-empty-split.js";
 
 export function clearSourceAccount(index) {
diff --git a/resources/assets/v3/js/pages/transactions/shared/clear-location.js b/resources/assets/v3/js/pages/transactions/shared/clear-location.js
index caa5d11edb..4d9994878c 100644
--- a/resources/assets/v3/js/pages/transactions/shared/clear-location.js
+++ b/resources/assets/v3/js/pages/transactions/shared/clear-location.js
@@ -1,3 +1,23 @@
+/*
+ * clear-location.js
+ * Copyright (c) 2026 james@firefly-iii.org
+ *
+ * This file is part of Firefly III (https://github.com/firefly-iii).
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
 export function clearLocation(e) {
 
     let index = parseInt(e.currentTarget.dataset.index);
diff --git a/resources/assets/v3/js/pages/transactions/shared/detect-transaction-type.js b/resources/assets/v3/js/pages/transactions/shared/detect-transaction-type.js
index b233a01ac5..e93bd58d21 100644
--- a/resources/assets/v3/js/pages/transactions/shared/detect-transaction-type.js
+++ b/resources/assets/v3/js/pages/transactions/shared/detect-transaction-type.js
@@ -1,3 +1,23 @@
+/*
+ * detect-transaction-type.js
+ * Copyright (c) 2026 james@firefly-iii.org
+ *
+ * This file is part of Firefly III (https://github.com/firefly-iii).
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
 export function detectTransactionType() {
     const sourceType = this.entries[0].source_account.type ?? 'unknown';
     const destType = this.entries[0].destination_account.type ?? 'unknown';
diff --git a/resources/assets/v3/js/pages/transactions/shared/determine-amount-currency.js b/resources/assets/v3/js/pages/transactions/shared/determine-amount-currency.js
index 5521046844..6709f0c3e0 100644
--- a/resources/assets/v3/js/pages/transactions/shared/determine-amount-currency.js
+++ b/resources/assets/v3/js/pages/transactions/shared/determine-amount-currency.js
@@ -1,3 +1,23 @@
+/*
+ * determine-amount-currency.js
+ * Copyright (c) 2026 james@firefly-iii.org
+ *
+ * This file is part of Firefly III (https://github.com/firefly-iii).
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
 export function determineAmountCurrency(code) {
     let list = [];
     let currency;
diff --git a/resources/assets/v3/js/pages/transactions/shared/display-map.js b/resources/assets/v3/js/pages/transactions/shared/display-map.js
index 051eb21437..311d9fa4e7 100644
--- a/resources/assets/v3/js/pages/transactions/shared/display-map.js
+++ b/resources/assets/v3/js/pages/transactions/shared/display-map.js
@@ -1,3 +1,23 @@
+/*
+ * display-map.js
+ * Copyright (c) 2026 james@firefly-iii.org
+ *
+ * This file is part of Firefly III (https://github.com/firefly-iii).
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
 export function displayMap(index) {
     index = parseInt(index);
     // show location?
diff --git a/resources/assets/v3/js/pages/transactions/shared/load-custom-fields.js b/resources/assets/v3/js/pages/transactions/shared/load-custom-fields.js
index 8334731c9c..5accb2a71d 100644
--- a/resources/assets/v3/js/pages/transactions/shared/load-custom-fields.js
+++ b/resources/assets/v3/js/pages/transactions/shared/load-custom-fields.js
@@ -1,4 +1,24 @@
 
+/*
+ * load-custom-fields.js
+ * Copyright (c) 2026 james@firefly-iii.org
+ *
+ * This file is part of Firefly III (https://github.com/firefly-iii).
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
 import Preferences from '../../../api/preferences/index.js';
 
 export function loadCustomFields() {
diff --git a/resources/assets/v3/js/pages/transactions/shared/on-map-click.js b/resources/assets/v3/js/pages/transactions/shared/on-map-click.js
index d8c3468df4..2f48101134 100644
--- a/resources/assets/v3/js/pages/transactions/shared/on-map-click.js
+++ b/resources/assets/v3/js/pages/transactions/shared/on-map-click.js
@@ -1,4 +1,24 @@
 
+/*
+ * on-map-click.js
+ * Copyright (c) 2026 james@firefly-iii.org
+ *
+ * This file is part of Firefly III (https://github.com/firefly-iii).
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
 import L from 'leaflet';
 import markerIcon from "leaflet/dist/images/marker-icon.png";
 import markerRetinaIcon from "leaflet/dist/images/marker-icon-2x.png";
diff --git a/resources/assets/v3/js/pages/transactions/shared/on-map-zoom.js b/resources/assets/v3/js/pages/transactions/shared/on-map-zoom.js
index 646bc78d4f..37b1db7aa2 100644
--- a/resources/assets/v3/js/pages/transactions/shared/on-map-zoom.js
+++ b/resources/assets/v3/js/pages/transactions/shared/on-map-zoom.js
@@ -1,4 +1,24 @@
 
+/*
+ * on-map-zoom.js
+ * Copyright (c) 2026 james@firefly-iii.org
+ *
+ * This file is part of Firefly III (https://github.com/firefly-iii).
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
 import L from 'leaflet';
 import markerIcon from "leaflet/dist/images/marker-icon.png";
 import markerRetinaIcon from "leaflet/dist/images/marker-icon-2x.png";
diff --git a/resources/assets/v3/js/pages/transactions/shared/remove-split.js b/resources/assets/v3/js/pages/transactions/shared/remove-split.js
new file mode 100644
index 0000000000..844b241a73
--- /dev/null
+++ b/resources/assets/v3/js/pages/transactions/shared/remove-split.js
@@ -0,0 +1,27 @@
+/*
+ * remove-split.js
+ * Copyright (c) 2026 james@firefly-iii.org
+ *
+ * This file is part of Firefly III (https://github.com/firefly-iii).
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+export function removeSplit(index) {
+    this.entries.splice(index, 1);
+    this.links.splice(index, 1);
+    // fall back to index 0
+    const triggerFirstTabEl = document.querySelector('#split-0-tab')
+    triggerFirstTabEl.click();
+};
diff --git a/resources/assets/v3/js/pages/transactions/shared/render-map.js b/resources/assets/v3/js/pages/transactions/shared/render-map.js
index e35cb2dc41..9e23c8c56a 100644
--- a/resources/assets/v3/js/pages/transactions/shared/render-map.js
+++ b/resources/assets/v3/js/pages/transactions/shared/render-map.js
@@ -1,4 +1,24 @@
 
+/*
+ * render-map.js
+ * Copyright (c) 2026 james@firefly-iii.org
+ *
+ * This file is part of Firefly III (https://github.com/firefly-iii).
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
 import L from 'leaflet';
 import markerIcon from "leaflet/dist/images/marker-icon.png";
 import markerRetinaIcon from "leaflet/dist/images/marker-icon-2x.png";
diff --git a/resources/views/components/transaction/split.blade.php b/resources/views/components/transaction/split.blade.php
index 8c8037aee5..9420bad0a6 100644
--- a/resources/views/components/transaction/split.blade.php
+++ b/resources/views/components/transaction/split.blade.php
@@ -1,4 +1,5 @@
-<div :class="{'tab-pane fade pt-2':true, 'show active': index ===0 }" :id="'split-'+index+'-pane'" role="tabpanel" :aria-labelledby="'split-'+index+'-tab'" tabindex="0" x-init="addedSplit()">
+<div :class="{'tab-pane fade pt-2':true, 'show active': index ===0 }" :id="'split-'+index+'-pane'" role="tabpanel"
+     :aria-labelledby="'split-'+index+'-tab'" tabindex="0" x-init="addedSplit()">
     <div class="row mb-2">
         <div class="col-xl-6 col-lg-6 col-md-12 col-xs-12 mb-2">
             <!-- BASIC TRANSACTION INFORMATION -->
@@ -135,4 +136,78 @@
 
         </div>
     </div>
+    <!-- Modal for links -->
+    <div class="modal modal-xl fade" :id="'linksModal_' + index" data-bs-backdrop="static" tabindex="-1"
+         aria-labelledby="exampleModalLabel" aria-hidden="true">
+        <div class="modal-dialog">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <h1 class="modal-title fs-5" id="exampleModalLabel">Transaction relations</h1>
+                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+                </div>
+                <div class="modal-body">
+                    <div class="container-fluid">
+                        <div class="row">
+                            <div class="col">
+                                <p><em class="text-info">
+                                        Bla bla bla explanation.
+                                    </em>
+                                    <template x-if="0 === links[index].length">
+                                        <em>This transaction has no relations to other transactions (yet).</em>
+                                    </template>
+                                </p>
+                            </div>
+                        </div>
+                        <template x-if="links[index].length > 0">
+                            <div class="row">
+                                <div class="col">
+                                    <table class="table table-sm table-bordered">
+                                        <tr>
+                                            <th colspan="2">Transaction relations</th>
+                                        </tr>
+                                        <tr>
+                                            <td>Pays for / is paid by <a href="#">#123: something else</a></td>
+                                            <td class="w-20">
+                                                switch,change, del
+                                            </td>
+                                        </tr>
+                                    </table>
+                                </div>
+                            </div>
+                        </template>
+                        <div class="row">
+                            <div class="col">
+                                <h5>Add a new relation</h5>
+                                <div class="row">
+                                    <div class="col">
+                                        <input type="text" readonly class="form-control-plaintext" value="This transaction">
+                                    </div>
+                                    <div class="col">
+                                        <input type="text" class="form-control" placeholder="First name" aria-label="First name">
+                                    </div>
+                                    <div class="col">
+                                        <input type="text" class="form-control" placeholder="Last name" aria-label="Last name">
+                                    </div>
+                                    <div class="col">
+                                        <input type="submit" class="btn btn-primary">
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                </div>
+                <div class="modal-footer">
+                    <div class="row inline" style="width:100%;">
+                        <div class="col align-middle d-flex align-items-center">
+                            <em><small>Changes are saved automatically</small></em>
+                        </div>
+                        <div class="col text-end">
+                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
 </div>
diff --git a/resources/views/partials/form/transaction/links.blade.php b/resources/views/partials/form/transaction/links.blade.php
index 0722661c3a..b7470ca4c2 100644
--- a/resources/views/partials/form/transaction/links.blade.php
+++ b/resources/views/partials/form/transaction/links.blade.php
@@ -7,12 +7,8 @@
         <div class="form-group">
 
         <div class="form-control-plaintext">
-            <button class="btn btn-sm btn-outline-primary">Manage related transactions</button>
+            <button class="btn btn-sm btn-outline-primary" data-bs-toggle="modal" :data-bs-target="'#linksModal_' + index" type="button">Manage related transactions</button>
         </div>
-            <!-- Button trigger modal -->
-            <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal">
-                Launch demo modal
-            </button>
         </div>
     </div>
 </div>
diff --git a/resources/views/transactions/create.blade.php b/resources/views/transactions/create.blade.php
index 4b3bce295e..955e6cd1ce 100644
--- a/resources/views/transactions/create.blade.php
+++ b/resources/views/transactions/create.blade.php
@@ -9,59 +9,6 @@
                 </template>
             </div>
 
-
-
-    <!-- Modal -->
-    <div class="modal modal-lg fade" id="exampleModal" data-bs-backdrop="static" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
-        <div class="modal-dialog">
-            <div class="modal-content">
-                <div class="modal-header">
-                    <h1 class="modal-title fs-5" id="exampleModalLabel">Transaction relations</h1>
-                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-                </div>
-                <div class="modal-body">
-                    <div class="row">
-                        <div class="col">
-                            <p><em class="text-info">
-                                Bla bla bla explanation
-                                </em>
-                                <em>This transaction has no relations to other transactions (yet)</em>
-                            </p>
-                        </div>
-                    </div>
-                    <div class="row">
-                        <div class="col">
-                            <p>This transaction is or will be...</p>
-                            <table class="table table-sm table-bordered">
-                                <tr>
-                                    <th colspan="2">Transaction relations</th>
-                                </tr>
-                                <tr>
-                                    <td>Related to <a href="#">#123: something else</a></td>
-                                    <td class="w-20">
-                                        switch,change, del
-                                    </td>
-                                </tr>
-                            </table>
-                        </div>
-                    </div>
-                    <div class="row">
-                        <div class="col">
-                            <strong>Add a new relation</strong><br>
-                            This transaction: [ -- relation --]  [ -- transaction -- ] [ OK ]
-
-                        </div>
-                    </div>
-
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
-                    <button type="button" class="btn btn-primary">Save changes</button>
-                </div>
-            </div>
-        </div>
-    </div>
-
     </div>