feat: transaction ui

postfinance · Jun 5, 2024 · 1cc3d3a · 1cc3d3a
1 parent ba89d9c
commit 1cc3d3a
Show file tree

Hide file tree

Showing 4 changed files with 90 additions and 9 deletions.
diff --git a/src/main/java/ch/postfinance/swiss/hacks/resource/TransactionsResourceImpl.java b/src/main/java/ch/postfinance/swiss/hacks/resource/TransactionsResourceImpl.java
@@ -9,6 +9,7 @@
 import io.quarkus.security.Authenticated;
 import jakarta.annotation.security.RolesAllowed;
 import jakarta.inject.Inject;
+import jakarta.ws.rs.BadRequestException;
 import jakarta.ws.rs.core.Response;
 import org.slf4j.Logger;
 import org.slf4j.LoggerFactory;
@@ -32,10 +33,13 @@ public TransferResponse transferFunds(FundTransfer fundTransfer) {
             transferResponse.setTransactionId(transactionId);
             transferResponse.setStatus(SUCCESS);
         } catch (IllegalTransactionException e) {
-            log.warn("Transaction failed!", e);
+            log.warn("Submitting transaction failed!", e);
 
             transferResponse.setTransactionId(e.getTransactionId().toString());
             transferResponse.setStatus(e.getStatus());
+
+            throw new BadRequestException(
+                "Submitting transaction failed! Status: " + e.getStatus().toString(), e);
         }
 
         return transferResponse;

diff --git a/src/main/resources/META-INF/resources/index.html b/src/main/resources/META-INF/resources/index.html
@@ -53,7 +53,9 @@ <h1>Swiss Bank</h1>
                 balanceCell.textContent = account.balance;
                 const actionCell = document.createElement('td');
                 actionCell.innerHTML = `
-                    <button type="button">Transfer Funds</button>`;
+                    <a href="/transaction.html?fromIban=${account.iban}">
+                        <button type="button">Transfer Funds</button>
+                    </a>`;
 
                 tableRow.appendChild(ibanCell);
                 tableRow.appendChild(balanceCell);

diff --git a/src/main/resources/META-INF/resources/registration.html b/src/main/resources/META-INF/resources/registration.html
@@ -25,9 +25,9 @@ <h1 id="title">Customer Registration</h1>
             const dateOfBirth = document.getElementById("dateOfBirth").value;
 
             const data = {
-                firstName: firstName,
-                lastName: lastName,
-                dateOfBirth: dateOfBirth
+                firstName,
+                lastName,
+                dateOfBirth
             };
 
             fetch("/customers/register", {
@@ -63,17 +63,14 @@ <h1 id="title">Customer Registration</h1>
                         });
                     } else {
                         const error = document.createElement("p");
-                        error.textContent = "Registration failed: " + response.statusText + " (" + response.status + "). Please try again."
+                        error.textContent = "Registration failed: " + response.statusText + " (" + response.status + "). Please check your input and try again."
                         error.style.color = "red";
 
                         const container = document.getElementById("responseContainer");
                         container.innerHTML = "";
                         container.appendChild(error);
                     }
                 })
-                .catch(error => {
-                    console.error("Error submitting registration:", error);
-                });
         });
     </script>
 </html>
diff --git a/src/main/resources/META-INF/resources/transaction.html b/src/main/resources/META-INF/resources/transaction.html
@@ -0,0 +1,78 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <title>Swiss Hacks 2024</title>
+        <style>
+        </style>
+    </head>
+    <body>
+        <h1 id="title">New Transaction</h1>
+        <form id="transactionForm">
+            <label for="fromIban">Sender IBAN:</label>
+            <input type="text" id="fromIban" name="fromIban" required><br><br>
+            <label for="toIban">Recipient IBAN:</label>
+            <input type="text" id="toIban" name="toIban" required><br><br>
+            <label for="amount">Amount:</label>
+            <input type="number" id="amount" name="amount" required><br><br>
+            <button type="submit">Submit</button>
+        </form>
+        <div id="responseContainer"></div>
+    </body>
+    <script>
+        document.getElementById("transactionForm").addEventListener("submit", function (event) {
+            event.preventDefault(); // Prevent default form submission
+
+            const fromIban = document.getElementById("fromIban").value;
+            const toIban = document.getElementById("toIban").value;
+            const amount = document.getElementById("amount").value;
+
+            const data = {
+                fromIban,
+                toIban,
+                amount
+            };
+
+            fetch("/transactions/transfer", {
+                method: "POST",
+                headers: {
+                    "accept": "application/json",
+                    "Content-Type": "application/json"
+                },
+                body: JSON.stringify(data)
+            })
+            .then(response => {
+                if (response.ok) {
+                    response.json().then(jsonBody => {
+                        const title = document.getElementById("title");
+                        title.textContent = "Transfer successful!";
+
+                        const container = document.getElementById("responseContainer");
+                        container.innerHTML = `
+                            <p>Transaction <i>${jsonBody.transactionId}</i> successfully executed.</p>
+
+                            <a href="/">
+                                <button type="button">Back</button>
+                            </a>`;
+
+                        document.getElementById("transactionForm").remove();
+                    });
+                } else {
+                    const error = document.createElement("p");
+                    error.textContent = "Transfer of funds failed: " + response.statusText + " (" + response.status + "). Please check your input and try again."
+                    error.style.color = "red";
+
+                    const container = document.getElementById("responseContainer");
+                    container.innerHTML = "";
+                    container.appendChild(error);
+                }
+            });
+        });
+
+        const urlParams = new URLSearchParams(window.location.search);
+
+        if (urlParams.has('fromIban')) {
+            const fromIbanInput = document.getElementById('fromIban');
+            fromIbanInput.value = urlParams.get('fromIban');
+        }
+    </script>
+</html>