Create ability to update an income.

bruno/Suma/Transaction/Search.bru

@@ -12,7 +12,7 @@ post {
 
 body:json {
   {
-    "account": "6884e6c54b81561c659e4d02",
+    "account": "68867678436e5ab643906229",
     "from": "2025-08-01",
     "to": "2025-08-01"
   }

src/main.rs

@@ -27,7 +27,7 @@ async fn main() -> std::io::Result<()> {
             .configure(routes::account::config)
             .configure(routes::transaction::config)
     })
-        .bind(("127.0.0.1", 8000))?
+        .bind(("0.0.0.0", 8000))?
         .run()
         .await
 }

src/views/css/viewCategory.css

@@ -24,6 +24,7 @@
     width: 100%;
     cursor: pointer;
     min-height: 55px;
+    border: none;
 }
 
 .viewCategoryItem:hover{

src/views/js/data/Income.js

@@ -1,10 +1,11 @@
 import Format from "../Format.js";
 
 export default class Income{
-    constructor(id, name, amount){
+    constructor(id, name, amount, active){
         this._id = id;
         this._name = name;
         this._amount = amount;
+        this._active = active;
     }
 
     get id(){
@@ -23,11 +24,16 @@ export default class Income{
         return "Income";
     }
 
+    get active(){
+        return this._active;
+    }
+
     static create(name, amount){
         return new Income(
             crypto.randomUUID(),
             name,
-            amount
+            amount,
+            true
         );
     }
 
@@ -35,7 +41,8 @@ export default class Income{
         return new Income(
             data.id,
             data.name,
-            data.amount
+            data.amount,
+            data.active
         );
     }
 
@@ -43,7 +50,8 @@ export default class Income{
         return {
             id: this._id,
             name: this._name,
-            amount: this._amount
+            amount: this._amount,
+            active: this._active
         };
     }
 }

src/views/js/index.js

@@ -15,6 +15,7 @@ import ViewTransactions from "./pages/ViewTransactions.js";
 import TransactionDetails from "./pages/TransactionDetails.js";
 import EditTransaction from "./pages/EditTransaction.js";
 import ViewIncome from "./pages/ViewIncome.js";
+import EditIncome from "./pages/EditIncome.js";
 
 const pages = document.querySelector(".page");
 let currentPage;
@@ -38,6 +39,7 @@ window.changePage = (page, data)=>{
         case "transactionDetails": currentPage = new TransactionDetails(data); break;
         case "editTransaction": currentPage = new EditTransaction(data); break;
         case "viewIncome": currentPage = new ViewIncome(); break;
+        case "editIncome": currentPage = new EditIncome(data); break;
     }
     console.timeEnd("change page");
 }

src/views/js/pages/EditIncome.js

@@ -0,0 +1,63 @@
+import Page from "./Page.js";
+import Elem from "../Elem.js";
+
+export default class EditIncome extends Page{
+    constructor(income){
+        super("EditIncome", ["home", "back-viewIncome", "logout"]);
+
+        this.render(income);
+    }
+
+    submit(income){
+        event.preventDefault();
+
+        const select = this.container.querySelector.bind(this.container);
+        income.name = select(".name").value;
+        income.amount = select(".amount").value;
+
+        user.account.save();
+        changePage("viewIncome");
+    }
+
+    render(income){
+        new Elem("form")
+            .addClass("standardForm")
+            .onsubmit(()=>{this.submit(income)})
+            .append(new Elem("h1")
+                .text(income.name)
+            )
+            .append(new Elem("h3")
+                .text("Income")
+            )
+            .append(new Elem("label")
+                .text("Name")
+                .append(new Elem("input")
+                    .type("text")
+                    .addClass("name")
+                    .value(income.name)
+                    .required()
+                    .focus()
+                )
+            )
+            .append(new Elem("label")
+                .text("Amount")
+                .append(new Elem("input")
+                    .type("number")
+                    .addClass("amount")
+                    .value(income.amount)
+                    .step("0.01")
+                    .min("0")
+                    .required()
+                )
+            )
+            .append(new Elem("button")
+                .text("Update")
+            )
+            .append(new Elem("button")
+                .text(income.active ? "Archive" : "Restore")
+                .addClass("archive")
+                .type("button")
+            )
+            .appendTo(this.container);
+    }
+}

src/views/js/pages/Login.js

@@ -71,6 +71,7 @@ export default class Login extends Page{
                 changePage("home");
             })
             .catch((err)=>{
+                console.log(err);
                 if(err.error){
                     new Notifier("error", err.error.message);
                 }else{

src/views/js/pages/ViewIncome.js

@@ -42,8 +42,9 @@ export default class ViewIncome extends Page{
             const amount = income[i].amount;
             const amountAsCurrency = Format.currency(income[i].amount);
 
-            new Elem("div")
+            new Elem("button")
                 .addClass("viewCategoryItem")
+                .onclick(()=>{changePage("editIncome", income[i])})
                 .append(new Elem("p")
                     .text(income[i].name)
                 )