From a627fb1f8a0f6c5cfa00b18a308e117d50da5c9e Mon Sep 17 00:00:00 2001
From: Keannu Bernasol <noehbernasol0@gmail.com>
Date: Thu, 21 Dec 2023 16:07:13 +0800
Subject: [PATCH] Improve transaction entry component

---
 .../TransactionEntry/TransactionEntry.tsx          | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/Components/TransactionEntry/TransactionEntry.tsx b/src/Components/TransactionEntry/TransactionEntry.tsx
index 4dc64b2..cbd874c 100644
--- a/src/Components/TransactionEntry/TransactionEntry.tsx
+++ b/src/Components/TransactionEntry/TransactionEntry.tsx
@@ -45,8 +45,8 @@ export default function TransactionEntry(props: props) {
         width: "384px",
         backgroundColor: colors.header_color,
         borderRadius: 16,
-        margin: "16px",
-        padding: "16px",
+        margin: "8px",
+        padding: "8px",
       }}
     >
       <div style={styles.flex_row}>
@@ -66,7 +66,7 @@ export default function TransactionEntry(props: props) {
             ...{ textAlign: "right", flex: 2 },
           }}
         >
-          Timestamp: {props.transaction.timestamp}
+          {props.transaction.timestamp}
         </p>
       </div>
       <div style={styles.flex_row}>
@@ -78,7 +78,8 @@ export default function TransactionEntry(props: props) {
               ...{ textAlign: "left", margin: 0 },
             }}
           >
-            Borrower: {props.transaction.borrower.name}
+            Borrower: {props.transaction.borrower.name}{" "}
+            {`(ID:${props.transaction.borrower.id})`}
           </p>
           <p
             style={{
@@ -87,10 +88,11 @@ export default function TransactionEntry(props: props) {
               ...{ textAlign: "left", margin: 0 },
             }}
           >
-            Teacher: {props.transaction.teacher.name}
+            Teacher: {props.transaction.teacher.name}{" "}
+            {`(ID:${props.transaction.teacher.id})`}
           </p>
         </div>
-        <div style={{ flex: 2 }}>
+        <div style={{ flex: 1 }}>
           <p
             style={{
               ...styles.text_dark,