Revert "Feature/transaction pop up (#160)" (#161)

This reverts commit b2ab5e5.

frontend/src/components/Transaction.jsx

@@ -1,13 +1,11 @@
 import React, { useEffect, useState, useContext } from "react";
 import TransactionContext from "../context/TransactionContext";
-import TransactionDetailsPopup from "../components/TransactionDetailPopup";
 
 const Transaction = ({ transaction }) => {
   const [isAmountNegative, setIsAmountNegative] = useState(false);
   const [convertedAmount, setConvertedAmount] = useState(transaction.amount);
-  const [showDetails, setShowDetails] = useState(false);
   const { currency, convertCurrency, handleSelect } =
-  useContext(TransactionContext);
+    useContext(TransactionContext);
 
   // useEffect to check if each transaction is negative and then convert the currency
   useEffect(() => {
@@ -27,40 +25,22 @@ const Transaction = ({ transaction }) => {
     handleSelect(transaction.id, e.target.checked);
     console.log("clicked: ", transaction.id);
   };
-
   return (
-  <>
-      <div className="flex flex-row justify-start text-body pl-[8x] ">
-        <input className="cursor-pointer" type="checkbox" onChange={handleCheckboxChange} />
-
-          <div 
-            className={` w-full flex flex-row justify-between text-body ml-[8px] pl-2 pr-2 rounded-2xl ${
-              isAmountNegative ? "text-red-500" : "text-green-500"} hover:bg-gray-300 cursor-pointer`}
-            onClick={() => setShowDetails(true)}>
-
-            <p>
-              {isAmountNegative ? convertedAmount : `+${convertedAmount}`}:{" "}
-              {transaction.title}
-            </p>
-
-            <p className="self-end">{transaction.created_at.substring(0, 10)}</p>
-
-          </div>
+    <div className="flex flex-row justify-start text-body pl-[8x]">
+      <input type="checkbox" onChange={handleCheckboxChange} />
+      <div
+        className={` w-full flex flex-row justify-between text-body pl-[8px] ${
+          isAmountNegative ? "text-red-500" : "text-green-500"
+        }`}
+      >
+        <p>
+          {isAmountNegative ? convertedAmount : `+${convertedAmount}`}:{" "}
+          {transaction.description}
+        </p>
+        <p className="self-end">{transaction.created_at.substring(0, 10)}</p>
       </div>
-
-    {/*displays the currently hovered transaction in a popup*/
-
-    showDetails && (
-        <div className="absolute">
-          <TransactionDetailsPopup
-            transaction={transaction}
-            setShowDetails={setShowDetails}
-          />
-        </div>
-      )
-    }
-  </>
-  )
+    </div>
+  );
 };
 
 export default Transaction;