From 8ec987f46b4ef3ff1ce23d9942662a74e162689d Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Thu, 20 Mar 2025 09:58:32 -0400
Subject: need-list search embedded in normal display with better feedback

---
 .../components/need-list/need-list.component.css   |  2 +-
 .../components/need-list/need-list.component.html  | 23 ++++-----
 .../components/need-list/need-list.component.ts    | 60 +++++++++++-----------
 3 files changed, 41 insertions(+), 44 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.css b/ufund-ui/src/app/components/need-list/need-list.component.css
index bbc3f2c..88bdfbe 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.css
+++ b/ufund-ui/src/app/components/need-list/need-list.component.css
@@ -15,7 +15,7 @@ li, div {
 
 }
 
-#search-form {
+#search-container {
     background-color: #d9d9d9;
     padding: 10px 20px 20px 20px;
     border: 2px solid #000;
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index 36c12d0..504deb9 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -1,25 +1,20 @@
 <h1>Needs List</h1>
 <input id="search-button" type="button" value="Search" (click)="open()">
-<div id="search-form">
-    <form #searchForm="ngForm">
+<div id="search-container">
+    <form id="search-form" #searchForm="ngForm">
         <label>Search:</label><br>
         <input type="text" name="search" (input)="search(searchForm.value)" ngModel>
-        <input type="button" value="Clear" (click)="searchForm.reset()"> <br>
+        <input type="reset" value="Clear" (click)="search(null)"> <br>
     </form>
     <button (click)="close()">Close</button>
-    <div>
-        <h2 id="search-status">Search Results:</h2>
-        <div *ngFor="let need of searchResults">
-            <a routerLink="/need/{{need.id}}">
-                {{need.name}}
-            </a>
-            <button (click)="delete(need.id)" *ngIf="isManager()">Delete</button>
-            <!-- <button (click)="add(need)" *ngIf="isHelper()">Add To Basket</button> -->
-        </div>
-    </div>
 </div>
 
-<li *ngFor="let need of needs">
+<!-- display for when results are present and filtered-->
+<h2 *ngIf="searchResults.length < needs.length && searchResults.length != 0"> Search Results({{needs.length - searchResults.length}} needs filtered): </h2>
+<h2 *ngIf="searchResults.length == needs.length"> All Needs </h2>
+<h2 *ngIf="searchResults.length == 0"> No Results Found </h2>
+
+<li *ngFor="let need of searchResults">
     <a routerLink="/need/{{need.id}}">
         {{need.name}}
     </a>
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index 25f05d6..f5d7855 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -1,4 +1,5 @@
 import { Component } from '@angular/core';
+import { NgForm } from '@angular/forms';
 import {Need} from '../../models/Need';
 import {CupboardService} from '../../services/cupboard.service';
 import { UsersService } from '../../services/users.service';
@@ -19,12 +20,16 @@ export class NeedListComponent {
   ) {}
 
     refresh() {
-        this.cupboardService.getNeeds().subscribe(n => this.needs = n)
+        this.cupboardService.getNeeds().subscribe(n => {
+          this.needs = n;
+          this.searchResults = this.needs;
+        });
+        
+        console.log(this.searchResults);
     }
 
   ngOnInit(): void {
     this.refresh()
-   
      this.close();
   }
 
@@ -42,20 +47,13 @@ export class NeedListComponent {
     }
   }
 
-  private updateSearchStatus(text: string) {
-    let element = document.getElementById('search-status');
-    if (element) {
-      element.innerHTML = text;
-    }
-  }
-
   open() {
     this.hideElement(document.getElementById('search-button'));
-    this.showElement(document.getElementById('search-form'));
+    this.showElement(document.getElementById('search-container'));
   }
 
   close() {
-    this.hideElement(document.getElementById('search-form'));
+    this.hideElement(document.getElementById('search-container'));
     this.showElement(document.getElementById('search-button'));
     this.hideElement(document.getElementById('search-status'));
   }
@@ -69,24 +67,28 @@ export class NeedListComponent {
     if (this.searchDelay) {
       clearTimeout(this.searchDelay);
     }
+    if (form) {
+      this.searchDelay = setTimeout(() => {
+        
+        if (form) {
+          const currentSearchValue = form.search; //latest value of the search
+          this.cupboardService.searchNeeds(currentSearchValue).subscribe((n) => {
+            this.searchResults = n;
+            console.log(currentSearchValue, this.searchResults);
+            this.showElement(document.getElementById('search-results'));
+            this.showElement(document.getElementById('search-status'));
+            });
+          }
+        }, 250);
+      } else {
+        //user has cleared the search bar, we can skip the timeout for a 1/4 second faster response
+        //clear timeout to stop pending search
+        clearTimeout(this.searchDelay);
+        this.searchResults = this.needs;
+      }
+      
 
-    this.searchDelay = setTimeout(() => {
-      const currentSearchValue = form.search; //latest value of the search
-      this.cupboardService.searchNeeds(currentSearchValue).subscribe((n) => {
-        this.searchResults = n;
-        console.log(currentSearchValue, this.searchResults);
-        this.showElement(document.getElementById('search-results'));
-        this.showElement(document.getElementById('search-status'));
-        if (this.searchResults.length === this.needs.length) {
-          this.updateSearchStatus("Please refine your search");
-          this.searchResults = [];
-        } else if (this.searchResults.length === 0) {
-          this.updateSearchStatus("No results found");
-        } else {
-          this.updateSearchStatus("Search results:");
-        }
-      });
-    }, 250);
+     
   }
 
   delete(id : number) {
@@ -127,6 +129,6 @@ export class NeedListComponent {
   }
 
   back() {
-    this.searchResults = [];
+    this.searchResults = this.needs;
   }
 }
-- 
cgit v1.2.3


From 237b9197c08c46a11fe45347e2d41428a558f75b Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Thu, 20 Mar 2025 10:18:43 -0400
Subject: component style refactor for simpler display

---
 .../app/components/cupboard/cupboard.component.css |  20 +++-
 .../components/cupboard/cupboard.component.html    | 101 +++++++++++----------
 .../app/components/cupboard/cupboard.component.ts  |   2 -
 3 files changed, 69 insertions(+), 54 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.css b/ufund-ui/src/app/components/cupboard/cupboard.component.css
index fe4971a..4c6ac4b 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.css
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.css
@@ -1,18 +1,30 @@
 :host {
-    display: block;
+    display: flex;
+      justify-content: left;
     border: 2px solid #000;
     border-radius: 5px;
     padding: 10px 20px;
 }
+#menu {
+      display: flex;
+      justify-content: space-between;
+      margin: 10px;
+      * {
+         border: 3px solid #000;
+         
+         border-top-left-radius: 5px;
+         border-top-right-radius: 5px;
+         margin-right: 5px;
+         border-bottom: 0px;
+      }
+}
 
-#menu, #create-form, #delete-form, #update-form {
+#create-form, #delete-form, #update-form {
    background-color: #d9d9d9;
    padding: 10px 20px 20px 20px;
    border: 2px solid #000;
    border-radius: 5px;  
-   width: 20%;
    visibility: visible;
-
 }
 
 #create-button {
diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.html b/ufund-ui/src/app/components/cupboard/cupboard.component.html
index 0d64475..4577844 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.html
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.html
@@ -1,50 +1,55 @@
-<h1> Cupboard </h1>
-<h2 *ngIf="isManager()" > Admin View </h2>
-<div id="menu" *ngIf="isManager()">
-    <button (click)="opencreate()">Create new Need</button>
-    <button (click)="openupdate()">Update existing Need</button>
+<div>
+    <h1> Cupboard </h1>
+    <app-need-list #needList></app-need-list>
 </div>
-<div id="create-form">
-    <h1> Create a new need </h1>
-    <form #cupboardForm="ngForm" (ngSubmit)="submit(cupboardForm.value)">
-        <label>Name:</label><br>
-        <input type="text" name="name" ngModel><br>
-        <label>Max Goal:</label><br>
-        <input type="number" name="maxGoal" ngModel><br>
-        <label>Type</label><br>
-        <input type="radio" name="type" value="MONETARY" ngModel>
-        <label>Monetary</label><br>
-        <input type="radio" name="type" value="PHYSICAL" ngModel>
-        <label>Physical</label><br>
-        <input type="submit" value="Submit">
-    </form>
-    <button (click)="back()">Close</button>
-    <span *ngIf="statusText">‼️{{statusText | async}}</span>
-
+<div *ngIf="isManager()" >
+    <h2 > Admin View </h2>
+    <div id="menu">
+        <button (click)="opencreate()">Create new Need</button>
+        <button (click)="openupdate()">Update existing Need</button>
+    </div>
+    <div id="create-form">
+        <h1> Create a new need </h1>
+        <form #cupboardForm="ngForm" (ngSubmit)="submit(cupboardForm.value)">
+            <label>Name:</label><br>
+            <input type="text" name="name" ngModel><br>
+            <label>Max Goal:</label><br>
+            <input type="number" name="maxGoal" ngModel><br>
+            <label>Type</label><br>
+            <input type="radio" name="type" value="MONETARY" ngModel>
+            <label>Monetary</label><br>
+            <input type="radio" name="type" value="PHYSICAL" ngModel>
+            <label>Physical</label><br>
+            <input type="submit" value="Submit">
+        </form>
+        <button (click)="back()">Close</button>
+        <span *ngIf="statusText">‼️{{statusText | async}}</span>
+    
+    </div>
+    <div id="update-form">
+        <h1> Update a need </h1>
+        <label>Needs:</label><br>
+        <form #updateForm="ngForm" (ngSubmit)="update(updateForm.value)">
+            <div *ngFor="let need of needs">
+    
+                <input type="radio" name="id" [value]=need.id [(ngModel)]="selectedNeedId" (change)="populateForm(need)">
+                <label name="template">{{need.name}}</label><br>
+            </div>
+            <label>Name:</label><br>
+            <input type="text" name="name" [(ngModel)]="selectedNeed.name"><br>
+            <label>Max Goal:</label><br>
+            <input type="number" name="maxGoal" [(ngModel)]="selectedNeed.maxGoal"><br>
+            <label>Type</label><br>
+            <input type="radio" name="type" value="MONETARY" [(ngModel)]="selectedNeed.type">
+            <label>Monetary</label><br>
+            <input type="radio" name="type" value="PHYSICAL" [(ngModel)]="selectedNeed.type">
+            <label>Physical</label><br>
+            <input type="submit" value="Submit">
+        </form>
+        <button (click)="back()">Close</button>
+        <span *ngIf="statusText">{{statusText | async}}</span>
+    
+    </div>
+    <hr>
+    
 </div>
-<div id="update-form">
-    <h1> Update a need </h1>
-    <label>Needs:</label><br>
-    <form #updateForm="ngForm" (ngSubmit)="update(updateForm.value)">
-        <div *ngFor="let need of needs">
-
-            <input type="radio" name="id" [value]=need.id [(ngModel)]="selectedNeedId" (change)="populateForm(need)">
-            <label name="template">{{need.name}}</label><br>
-        </div>
-        <label>Name:</label><br>
-        <input type="text" name="name" [(ngModel)]="selectedNeed.name"><br>
-        <label>Max Goal:</label><br>
-        <input type="number" name="maxGoal" [(ngModel)]="selectedNeed.maxGoal"><br>
-        <label>Type</label><br>
-        <input type="radio" name="type" value="MONETARY" [(ngModel)]="selectedNeed.type">
-        <label>Monetary</label><br>
-        <input type="radio" name="type" value="PHYSICAL" [(ngModel)]="selectedNeed.type">
-        <label>Physical</label><br>
-        <input type="submit" value="Submit">
-    </form>
-    <button (click)="back()">Close</button>
-    <span *ngIf="statusText">{{statusText | async}}</span>
-
-</div>
-<hr>
-<app-need-list #needList></app-need-list>
diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.ts b/ufund-ui/src/app/components/cupboard/cupboard.component.ts
index 24b3e2d..f8023c3 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.ts
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.ts
@@ -55,7 +55,6 @@ export class CupboardComponent implements OnInit {
             element.style.position = 'relative';
         }
     }
-
     openmenu() {
         const menuElement = document.getElementById('menu');
         this.showElement(menuElement);
@@ -79,7 +78,6 @@ export class CupboardComponent implements OnInit {
     close() {
         this.hideElement(document.getElementById('create-form'));
         this.hideElement(document.getElementById('destroy-form'));
-        this.hideElement(document.getElementById('menu'));
         this.hideElement(document.getElementById('update-form'));
     }
 
-- 
cgit v1.2.3


From bab829a60dc243b5987873ea0f0114b032643995 Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Thu, 20 Mar 2025 10:18:55 -0400
Subject: need list size fix

---
 ufund-ui/src/app/components/need-list/need-list.component.css | 1 -
 1 file changed, 1 deletion(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.css b/ufund-ui/src/app/components/need-list/need-list.component.css
index 88bdfbe..64988d1 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.css
+++ b/ufund-ui/src/app/components/need-list/need-list.component.css
@@ -2,7 +2,6 @@
     list-style-type:circle;
     border: 2px solid #000;
     display: block;
-    width: 30%;
     border-radius: 5px;
     
 }
-- 
cgit v1.2.3


From d386b35bf24444240b0d670674c3e75ea5d8b3ce Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Fri, 21 Mar 2025 10:07:45 -0400
Subject: delete icon in need list

---
 ufund-ui/src/app/components/need-list/need-list.component.css | 11 ++++++++++-
 .../src/app/components/need-list/need-list.component.html     |  7 ++++---
 2 files changed, 14 insertions(+), 4 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.css b/ufund-ui/src/app/components/need-list/need-list.component.css
index 64988d1..f8948ee 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.css
+++ b/ufund-ui/src/app/components/need-list/need-list.component.css
@@ -3,7 +3,6 @@
     border: 2px solid #000;
     display: block;
     border-radius: 5px;
-    
 }
 
 li, div {
@@ -11,7 +10,17 @@ li, div {
     border-radius: 5px;
     padding: 5px;
     margin: 5px;
+}
+
+li {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
 
+.icon {
+    width: 15px;
+    margin: 3px -3px -1px -3px;
 }
 
 #search-container {
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index 504deb9..9f22633 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -1,12 +1,11 @@
 <h1>Needs List</h1>
-<input id="search-button" type="button" value="Search" (click)="open()">
 <div id="search-container">
     <form id="search-form" #searchForm="ngForm">
         <label>Search:</label><br>
         <input type="text" name="search" (input)="search(searchForm.value)" ngModel>
         <input type="reset" value="Clear" (click)="search(null)"> <br>
     </form>
-    <button (click)="close()">Close</button>
+    <!--<button (click)="close()">Close</button>-->
 </div>
 
 <!-- display for when results are present and filtered-->
@@ -18,6 +17,8 @@
     <a routerLink="/need/{{need.id}}">
         {{need.name}}
     </a>
-    <button (click)="delete(need.id)" *ngIf="isManager()">Delete</button>
+    <button (click)="delete(need.id)" *ngIf="isManager()"> 
+        <img class="icon" src="/delete.png" alt="Delete">
+    </button>
     <button (click)="add(need)" *ngIf="isHelper()">Add To Basket</button>
 </li>
-- 
cgit v1.2.3


From 2b67bd14828c8c0bffe461a66542a2dba6c19f93 Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Sat, 22 Mar 2025 11:21:30 -0400
Subject: API creation bug fix- the max goal would not be casted properly

---
 ufund-ui/src/app/components/cupboard/cupboard.component.css   | 9 ++++++---
 ufund-ui/src/app/components/need-list/need-list.component.css | 1 -
 2 files changed, 6 insertions(+), 4 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.css b/ufund-ui/src/app/components/cupboard/cupboard.component.css
index 4c6ac4b..434b136 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.css
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.css
@@ -1,17 +1,21 @@
 :host {
     display: flex;
-      justify-content: left;
+    justify-content: space-evenly;
     border: 2px solid #000;
     border-radius: 5px;
     padding: 10px 20px;
+    > div {
+      width: 40%;
+    }
 }
+
+
 #menu {
       display: flex;
       justify-content: space-between;
       margin: 10px;
       * {
          border: 3px solid #000;
-         
          border-top-left-radius: 5px;
          border-top-right-radius: 5px;
          margin-right: 5px;
@@ -29,5 +33,4 @@
 
 #create-button {
    padding: 10px 20px;
-   
 }
\ No newline at end of file
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.css b/ufund-ui/src/app/components/need-list/need-list.component.css
index f8948ee..bf7b982 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.css
+++ b/ufund-ui/src/app/components/need-list/need-list.component.css
@@ -4,7 +4,6 @@
     display: block;
     border-radius: 5px;
 }
-
 li, div {
     border: 2px solid #000;
     border-radius: 5px;
-- 
cgit v1.2.3


From 2abd4b4ba9171821ac545f8dcb67be1e7d722e01 Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Sat, 22 Mar 2025 11:58:39 -0400
Subject: replaced unneccicary methods for form selection with ngIf

---
 ufund-ui/src/app/components/cupboard/cupboard.component.css  |  2 +-
 ufund-ui/src/app/components/cupboard/cupboard.component.html | 12 +++++-------
 2 files changed, 6 insertions(+), 8 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.css b/ufund-ui/src/app/components/cupboard/cupboard.component.css
index 434b136..6c2e5c6 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.css
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.css
@@ -12,7 +12,7 @@
 
 #menu {
       display: flex;
-      justify-content: space-between;
+      
       margin: 10px;
       * {
          border: 3px solid #000;
diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.html b/ufund-ui/src/app/components/cupboard/cupboard.component.html
index 4577844..41bb4a7 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.html
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.html
@@ -5,10 +5,10 @@
 <div *ngIf="isManager()" >
     <h2 > Admin View </h2>
     <div id="menu">
-        <button (click)="opencreate()">Create new Need</button>
-        <button (click)="openupdate()">Update existing Need</button>
+        <button (click)="selectForm('create')">Create new Need</button>
+        <button (click)="selectForm('update')">Update existing Need</button>
     </div>
-    <div id="create-form">
+    <div id="create-form" *ngIf="selectedForm === 'create'">
         <h1> Create a new need </h1>
         <form #cupboardForm="ngForm" (ngSubmit)="submit(cupboardForm.value)">
             <label>Name:</label><br>
@@ -22,11 +22,10 @@
             <label>Physical</label><br>
             <input type="submit" value="Submit">
         </form>
-        <button (click)="back()">Close</button>
-        <span *ngIf="statusText">‼️{{statusText | async}}</span>
+        <span *ngIf="statusText">{{statusText | async}}</span>
     
     </div>
-    <div id="update-form">
+    <div id="update-form" *ngIf="selectedForm === 'update'">
         <h1> Update a need </h1>
         <label>Needs:</label><br>
         <form #updateForm="ngForm" (ngSubmit)="update(updateForm.value)">
@@ -46,7 +45,6 @@
             <label>Physical</label><br>
             <input type="submit" value="Submit">
         </form>
-        <button (click)="back()">Close</button>
         <span *ngIf="statusText">{{statusText | async}}</span>
     
     </div>
-- 
cgit v1.2.3


From e9564ba2514f32c63d2ce4ecfc9eeb9f3269f3dd Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Sat, 22 Mar 2025 12:14:00 -0400
Subject: [ngClass] tab styling

---
 .../app/components/cupboard/cupboard.component.css | 21 ++++++----
 .../components/cupboard/cupboard.component.html    |  4 +-
 .../app/components/cupboard/cupboard.component.ts  | 46 ++--------------------
 3 files changed, 20 insertions(+), 51 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.css b/ufund-ui/src/app/components/cupboard/cupboard.component.css
index 6c2e5c6..6e70951 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.css
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.css
@@ -14,13 +14,20 @@
       display: flex;
       
       margin: 10px;
-      * {
-         border: 3px solid #000;
-         border-top-left-radius: 5px;
-         border-top-right-radius: 5px;
-         margin-right: 5px;
-         border-bottom: 0px;
-      }
+      
+}
+
+.tab, .selected-tab {
+   background-color: lightgray;
+   border: 3px solid #000;
+   border-top-left-radius: 5px;
+   border-top-right-radius: 5px;
+   margin-right: 5px;
+   border-bottom: 0px;
+}
+
+.selected-tab {
+   background-color: white;
 }
 
 #create-form, #delete-form, #update-form {
diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.html b/ufund-ui/src/app/components/cupboard/cupboard.component.html
index 41bb4a7..9b74b2a 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.html
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.html
@@ -5,8 +5,8 @@
 <div *ngIf="isManager()" >
     <h2 > Admin View </h2>
     <div id="menu">
-        <button (click)="selectForm('create')">Create new Need</button>
-        <button (click)="selectForm('update')">Update existing Need</button>
+        <button [ngClass]="selectedForm === 'create' ? 'selected-tab' : 'tab'" (click)="selectForm('create')">Create new Need</button>
+        <button [ngClass]="selectedForm === 'update' ? 'selected-tab' : 'tab'" (click)="selectForm('update')">Update existing Need</button>
     </div>
     <div id="create-form" *ngIf="selectedForm === 'create'">
         <h1> Create a new need </h1>
diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.ts b/ufund-ui/src/app/components/cupboard/cupboard.component.ts
index f8023c3..646c4ff 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.ts
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.ts
@@ -16,7 +16,7 @@ import { NeedListComponent } from '../need-list/need-list.component';
 export class CupboardComponent implements OnInit {
 
     protected statusText = new BehaviorSubject("")
-
+    selectedForm = "create"
     needs: any;
     @ViewChild("needList") needList?: NeedListComponent
 
@@ -24,9 +24,6 @@ export class CupboardComponent implements OnInit {
 
     ngOnInit(): void {
         this.cupboardService.getNeeds().subscribe(n => this.needs = n);
-        this.close();
-        this.openmenu();
-
         if (this.isManager()) {
             console.log("Admin view of Cupboard");
         } else {
@@ -41,44 +38,9 @@ export class CupboardComponent implements OnInit {
         type: ''
     };
     selectedNeedId: number | null = null;
-
-    private hideElement(element: any) {
-        if (element) {
-            element.style.visibility = 'hidden';
-            element.style.position = 'absolute';
-        }
-    }
-
-    private showElement(element: any) {
-        if (element) {
-            element.style.visibility = 'visible';
-            element.style.position = 'relative';
-        }
-    }
-    openmenu() {
-        const menuElement = document.getElementById('menu');
-        this.showElement(menuElement);
-    }
-
-    opencreate() {
-        this.close();
-        this.showElement(document.getElementById('create-form'));
-    }
-
-    openupdate() {
-        this.close();
-        this.showElement(document.getElementById('update-form'));
-    }
-
-    back() {
-        this.close();
-        this.openmenu();
-    }
-
-    close() {
-        this.hideElement(document.getElementById('create-form'));
-        this.hideElement(document.getElementById('destroy-form'));
-        this.hideElement(document.getElementById('update-form'));
+    
+    selectForm(name: string) {
+        this.selectedForm = name;
     }
 
     populateForm(need: any): void {
-- 
cgit v1.2.3


From d8b9c0da32383630f0831fdf6a7f13c96174ee4c Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Sat, 22 Mar 2025 12:17:50 -0400
Subject: removing unneccicary functions for element visiblity in need list

---
 .../components/need-list/need-list.component.css   |  3 +--
 .../components/need-list/need-list.component.ts    | 29 ----------------------
 2 files changed, 1 insertion(+), 31 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.css b/ufund-ui/src/app/components/need-list/need-list.component.css
index bf7b982..29a9626 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.css
+++ b/ufund-ui/src/app/components/need-list/need-list.component.css
@@ -26,6 +26,5 @@ li {
     background-color: #d9d9d9;
     padding: 10px 20px 20px 20px;
     border: 2px solid #000;
-    border-radius: 5px;  
-    visibility: visible;
+    border-radius: 5px;
  }
\ No newline at end of file
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index f5d7855..3f77df4 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -24,38 +24,11 @@ export class NeedListComponent {
           this.needs = n;
           this.searchResults = this.needs;
         });
-        
         console.log(this.searchResults);
     }
 
   ngOnInit(): void {
     this.refresh()
-     this.close();
-  }
-
-  private showElement(element: any) {
-    if (element){
-      element.style.visibility = 'visible';
-      element.style.position = 'relative';
-    }
-  }
-
-  private hideElement(element: any) {
-    if (element){
-      element.style.visibility = 'hidden';
-      element.style.position = 'absolute';
-    }
-  }
-
-  open() {
-    this.hideElement(document.getElementById('search-button'));
-    this.showElement(document.getElementById('search-container'));
-  }
-
-  close() {
-    this.hideElement(document.getElementById('search-container'));
-    this.showElement(document.getElementById('search-button'));
-    this.hideElement(document.getElementById('search-status'));
   }
 
   private searchDelay: any;
@@ -75,8 +48,6 @@ export class NeedListComponent {
           this.cupboardService.searchNeeds(currentSearchValue).subscribe((n) => {
             this.searchResults = n;
             console.log(currentSearchValue, this.searchResults);
-            this.showElement(document.getElementById('search-results'));
-            this.showElement(document.getElementById('search-status'));
             });
           }
         }, 250);
-- 
cgit v1.2.3


From 2ae7c1036b7ce398e2b18928215f74d57bb3cec6 Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Sat, 22 Mar 2025 12:28:36 -0400
Subject: search reformatting

---
 ufund-ui/src/app/components/need-list/need-list.component.css  | 1 -
 ufund-ui/src/app/components/need-list/need-list.component.html | 3 +--
 2 files changed, 1 insertion(+), 3 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.css b/ufund-ui/src/app/components/need-list/need-list.component.css
index 29a9626..2e4a31b 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.css
+++ b/ufund-ui/src/app/components/need-list/need-list.component.css
@@ -24,7 +24,6 @@ li {
 
 #search-container {
     background-color: #d9d9d9;
-    padding: 10px 20px 20px 20px;
     border: 2px solid #000;
     border-radius: 5px;
  }
\ No newline at end of file
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index 9f22633..0345519 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -1,8 +1,7 @@
 <h1>Needs List</h1>
 <div id="search-container">
     <form id="search-form" #searchForm="ngForm">
-        <label>Search:</label><br>
-        <input type="text" name="search" (input)="search(searchForm.value)" ngModel>
+        <input type="text" name="search" placeholder="Search in {{needs.length}} needs..." (input)="search(searchForm.value)" ngModel>
         <input type="reset" value="Clear" (click)="search(null)"> <br>
     </form>
     <!--<button (click)="close()">Close</button>-->
-- 
cgit v1.2.3


From b725948521e81965a18991e7dd59a2bc84dbd460 Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Sat, 22 Mar 2025 12:56:28 -0400
Subject: need list uses button instead of link

---
 .../app/components/need-list/need-list.component.css | 15 ++++++++++++---
 .../components/need-list/need-list.component.html    | 20 +++++++++++---------
 2 files changed, 23 insertions(+), 12 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.css b/ufund-ui/src/app/components/need-list/need-list.component.css
index 2e4a31b..8f017cd 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.css
+++ b/ufund-ui/src/app/components/need-list/need-list.component.css
@@ -1,17 +1,26 @@
 :host {
-    list-style-type:circle;
+    list-style-type: none;
     border: 2px solid #000;
     display: block;
     border-radius: 5px;
 }
-li, div {
+
+div, li > button {
     border: 2px solid #000;
     border-radius: 5px;
     padding: 5px;
     margin: 5px;
 }
 
-li {
+ul {
+    list-style-type: none;
+    padding-inline-start: 0px;
+}
+
+li > button {
+    width: 98%;
+    padding: 1%;
+    margin: 1%;
     display: flex;
     justify-content: space-between;
     align-items: center;
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index 0345519..fef22d7 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -12,12 +12,14 @@
 <h2 *ngIf="searchResults.length == needs.length"> All Needs </h2>
 <h2 *ngIf="searchResults.length == 0"> No Results Found </h2>
 
-<li *ngFor="let need of searchResults">
-    <a routerLink="/need/{{need.id}}">
-        {{need.name}}
-    </a>
-    <button (click)="delete(need.id)" *ngIf="isManager()"> 
-        <img class="icon" src="/delete.png" alt="Delete">
-    </button>
-    <button (click)="add(need)" *ngIf="isHelper()">Add To Basket</button>
-</li>
+<ul>
+    <li *ngFor="let need of searchResults">
+        <button [routerLink]="'/need/' + need.id">
+            {{need.name}}
+            <button (click)="delete(need.id)" *ngIf="isManager()"> 
+                <img class="icon" src="/delete.png" alt="Delete">
+            </button>
+            <button (click)="add(need)" *ngIf="isHelper()">Add To Basket</button>
+        </button>
+    </li>
+</ul>
\ No newline at end of file
-- 
cgit v1.2.3


From a05f6f0ab8dead76f937a2d7196fa005af0367fe Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Mon, 24 Mar 2025 10:27:31 -0400
Subject: hover feedback for need list's button

---
 ufund-ui/src/app/components/need-list/need-list.component.css  | 6 ++++++
 ufund-ui/src/app/components/need-list/need-list.component.html | 4 ++--
 ufund-ui/src/app/components/need-list/need-list.component.ts   | 7 +++++++
 3 files changed, 15 insertions(+), 2 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.css b/ufund-ui/src/app/components/need-list/need-list.component.css
index 8f017cd..c2b8b90 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.css
+++ b/ufund-ui/src/app/components/need-list/need-list.component.css
@@ -24,8 +24,14 @@ li > button {
     display: flex;
     justify-content: space-between;
     align-items: center;
+    transition: all 0.3s ease;
 }
 
+li > button:hover p {
+    font-weight: bold;
+}
+
+
 .icon {
     width: 15px;
     margin: 3px -3px -1px -3px;
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index fef22d7..fc2daa5 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -13,9 +13,9 @@
 <h2 *ngIf="searchResults.length == 0"> No Results Found </h2>
 
 <ul>
-    <li *ngFor="let need of searchResults">
+    <li *ngFor="let need of searchResults" id="need-button-{{need.id}}" (mouseenter) ="changeText(need.id, need.name + '(Click to view)')" (mouseleave)="changeText(need.id, need.name)" >
         <button [routerLink]="'/need/' + need.id">
-            {{need.name}}
+            <p id="need-label-{{need.id}}">{{need.name}}</p>
             <button (click)="delete(need.id)" *ngIf="isManager()"> 
                 <img class="icon" src="/delete.png" alt="Delete">
             </button>
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index 3f77df4..8ae7370 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -78,6 +78,13 @@ export class NeedListComponent {
     return type === ("HELPER" as unknown as userType);
   }
 
+  changeText(id : number, text : string) {
+    const label = document.getElementById('need-label-' + id);
+    if (label) {
+      label.innerHTML = text;
+    }
+  }
+
   add(need: Need) {
     const currentUser = this.usersService.getCurrentUser();
     //console.log("get current user in angular:", currentUser)
-- 
cgit v1.2.3


From 1c1d3922e7eea35764ebab39b18172ed2c8c82d9 Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Mon, 24 Mar 2025 10:38:40 -0400
Subject: better feedback using a <span>

---
 ufund-ui/src/app/components/need-list/need-list.component.css  | 8 +++++++-
 ufund-ui/src/app/components/need-list/need-list.component.html | 4 ++--
 ufund-ui/src/app/components/need-list/need-list.component.ts   | 8 ++++----
 3 files changed, 13 insertions(+), 7 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.css b/ufund-ui/src/app/components/need-list/need-list.component.css
index c2b8b90..c42dfda 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.css
+++ b/ufund-ui/src/app/components/need-list/need-list.component.css
@@ -25,10 +25,16 @@ li > button {
     justify-content: space-between;
     align-items: center;
     transition: all 0.3s ease;
+    font-weight: bold;
+}
+
+li > button span {
+    font-style: italic;
+    font-weight: normal;
 }
 
 li > button:hover p {
-    font-weight: bold;
+    text-decoration: underline;
 }
 
 
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index fc2daa5..741b899 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -13,9 +13,9 @@
 <h2 *ngIf="searchResults.length == 0"> No Results Found </h2>
 
 <ul>
-    <li *ngFor="let need of searchResults" id="need-button-{{need.id}}" (mouseenter) ="changeText(need.id, need.name + '(Click to view)')" (mouseleave)="changeText(need.id, need.name)" >
+    <li *ngFor="let need of searchResults" id="need-button-{{need.id}}" (mouseenter) ="changeText(need.id, '(details)')" (mouseleave)="changeText(need.id, '')" >
         <button [routerLink]="'/need/' + need.id">
-            <p id="need-label-{{need.id}}">{{need.name}}</p>
+            <p>{{need.name}}<span id="hover-status-label-{{need.id}}"> </span></p>
             <button (click)="delete(need.id)" *ngIf="isManager()"> 
                 <img class="icon" src="/delete.png" alt="Delete">
             </button>
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index 8ae7370..0f86921 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -79,10 +79,10 @@ export class NeedListComponent {
   }
 
   changeText(id : number, text : string) {
-    const label = document.getElementById('need-label-' + id);
-    if (label) {
-      label.innerHTML = text;
-    }
+    const span = document.getElementById('hover-status-label-' + id);  
+    if (span) {
+      span.innerHTML = ' ' + text;
+    }    
   }
 
   add(need: Need) {
-- 
cgit v1.2.3


From f0ac1eda74367afc375112a7269c085a511ce490 Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Mon, 24 Mar 2025 22:23:36 -0400
Subject: viewing search results inside cupboard component

---
 .../components/cupboard/cupboard.component.html    | 11 +++------
 .../app/components/cupboard/cupboard.component.ts  | 28 +++++++++++++++++++---
 2 files changed, 28 insertions(+), 11 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.html b/ufund-ui/src/app/components/cupboard/cupboard.component.html
index 9b74b2a..3ed06fb 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.html
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.html
@@ -9,7 +9,7 @@
         <button [ngClass]="selectedForm === 'update' ? 'selected-tab' : 'tab'" (click)="selectForm('update')">Update existing Need</button>
     </div>
     <div id="create-form" *ngIf="selectedForm === 'create'">
-        <h1> Create a new need </h1>
+        <h1> Create Need </h1>
         <form #cupboardForm="ngForm" (ngSubmit)="submit(cupboardForm.value)">
             <label>Name:</label><br>
             <input type="text" name="name" ngModel><br>
@@ -26,15 +26,10 @@
     
     </div>
     <div id="update-form" *ngIf="selectedForm === 'update'">
-        <h1> Update a need </h1>
+        <h1> Update Need </h1>
         <label>Needs:</label><br>
         <form #updateForm="ngForm" (ngSubmit)="update(updateForm.value)">
-            <div *ngFor="let need of needs">
-    
-                <input type="radio" name="id" [value]=need.id [(ngModel)]="selectedNeedId" (change)="populateForm(need)">
-                <label name="template">{{need.name}}</label><br>
-            </div>
-            <label>Name:</label><br>
+            <label>Currently Editing : need.name</label><br>
             <input type="text" name="name" [(ngModel)]="selectedNeed.name"><br>
             <label>Max Goal:</label><br>
             <input type="number" name="maxGoal" [(ngModel)]="selectedNeed.maxGoal"><br>
diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.ts b/ufund-ui/src/app/components/cupboard/cupboard.component.ts
index 646c4ff..e38f8c0 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.ts
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.ts
@@ -16,10 +16,9 @@ import { NeedListComponent } from '../need-list/need-list.component';
 export class CupboardComponent implements OnInit {
 
     protected statusText = new BehaviorSubject("")
-    selectedForm = "create"
+    selectedForm = "create";
     needs: any;
-    @ViewChild("needList") needList?: NeedListComponent
-
+    @ViewChild("needList") needList?: NeedListComponent;
     constructor(private cupboardService: CupboardService, private usersService: UsersService) { }
 
     ngOnInit(): void {
@@ -38,9 +37,32 @@ export class CupboardComponent implements OnInit {
         type: ''
     };
     selectedNeedId: number | null = null;
+    searchResults: any[] = [];
     
     selectForm(name: string) {
+        //get search results from the need list 
+        if (this.needList) {
+            this.searchResults = this.needList.searchResults;
+        }
+        console.log(this.searchResults)
         this.selectedForm = name;
+        if (name == 'update') {
+            if (this.searchResults) {
+                this.searchResults.forEach((element: any) => {
+                    console.log(element)
+                });
+            }
+
+        }
+    }
+
+    async updateSearchResults() {
+        if (this.needList) {
+            while (this.selectedForm == 'update') {
+                this.searchResults = this.needList.searchResults
+                await new Promise(resolve => setTimeout(resolve, 100));
+            }
+        }
     }
 
     populateForm(need: any): void {
-- 
cgit v1.2.3


From 20458b2ae22466d0b75a2ae60f318e514c0d905f Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Tue, 25 Mar 2025 08:46:45 -0400
Subject: need list reformatting- button does not span whole list element

---
 .../app/components/need-list/need-list.component.css  | 19 ++++++++++++++-----
 .../app/components/need-list/need-list.component.html | 14 ++++++++++----
 .../app/components/need-list/need-list.component.ts   |  7 ++++++-
 3 files changed, 30 insertions(+), 10 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.css b/ufund-ui/src/app/components/need-list/need-list.component.css
index c42dfda..74dbc34 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.css
+++ b/ufund-ui/src/app/components/need-list/need-list.component.css
@@ -5,7 +5,7 @@
     border-radius: 5px;
 }
 
-div, li > button {
+div {
     border: 2px solid #000;
     border-radius: 5px;
     padding: 5px;
@@ -17,17 +17,26 @@ ul {
     padding-inline-start: 0px;
 }
 
-li > button {
-    width: 98%;
-    padding: 1%;
-    margin: 1%;
+li {
     display: flex;
     justify-content: space-between;
     align-items: center;
     transition: all 0.3s ease;
     font-weight: bold;
+    border: 2px solid #000;
+    border-radius: 5px;
+    margin: 5px;
+    
+    > button {
+        width: 90%;
+        float: left;
+        transition: all 0.3s ease;
+        font-weight: bold;
+        display: flex;
+    }
 }
 
+
 li > button span {
     font-style: italic;
     font-weight: normal;
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index 741b899..b31ccf0 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -13,13 +13,19 @@
 <h2 *ngIf="searchResults.length == 0"> No Results Found </h2>
 
 <ul>
-    <li *ngFor="let need of searchResults" id="need-button-{{need.id}}" (mouseenter) ="changeText(need.id, '(details)')" (mouseleave)="changeText(need.id, '')" >
-        <button [routerLink]="'/need/' + need.id">
+    <li *ngFor="let need of searchResults" id="need-button-{{need.id}}" >
+        <button [routerLink]="'/need/' + need.id" (mouseenter) ="changeText(need.id, '(details)')" (mouseleave)="changeText(need.id, '')">
             <p>{{need.name}}<span id="hover-status-label-{{need.id}}"> </span></p>
+        </button>
+
+        <button (click)="add(need)" *ngIf="isHelper()">Add To Basket</button>
+        <section *ngIf="isManager()">
+            <button (click)="select(need)">
+                <img class="icon" src="/edit.png" alt="Select">
+            </button>
             <button (click)="delete(need.id)" *ngIf="isManager()"> 
                 <img class="icon" src="/delete.png" alt="Delete">
             </button>
-            <button (click)="add(need)" *ngIf="isHelper()">Add To Basket</button>
-        </button>
+        </section>
     </li>
 </ul>
\ No newline at end of file
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index 0f86921..e47929b 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -11,6 +11,7 @@ import { userType } from '../../models/User';
   styleUrl: './need-list.component.css'
 })
 export class NeedListComponent {
+  selectedNeed: Need | undefined;
   needs: Need[] = [];
   searchResults: Need[] = [];
 
@@ -109,4 +110,8 @@ export class NeedListComponent {
   back() {
     this.searchResults = this.needs;
   }
-}
+
+  select(need : Need) {
+    this.selectedNeed = need;
+  }
+}
\ No newline at end of file
-- 
cgit v1.2.3


From f7cd2d90191c1d81526ed549514d82864c1aebb2 Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Tue, 25 Mar 2025 09:08:26 -0400
Subject: restyling of need list results

---
 .../app/components/need-list/need-list.component.css  | 19 +++++++++++++++----
 1 file changed, 15 insertions(+), 4 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.css b/ufund-ui/src/app/components/need-list/need-list.component.css
index 74dbc34..c763105 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.css
+++ b/ufund-ui/src/app/components/need-list/need-list.component.css
@@ -1,4 +1,5 @@
 :host {
+    --list-background-color: lightgray;
     list-style-type: none;
     border: 2px solid #000;
     display: block;
@@ -18,6 +19,7 @@ ul {
 }
 
 li {
+    background-color: var(--list-background-color);
     display: flex;
     justify-content: space-between;
     align-items: center;
@@ -25,17 +27,26 @@ li {
     font-weight: bold;
     border: 2px solid #000;
     border-radius: 5px;
-    margin: 5px;
-    
+    margin: 5px; 
     > button {
-        width: 90%;
+        background-color: var(--list-background-color);
+        width: 88%;
         float: left;
         transition: all 0.3s ease;
         font-weight: bold;
         display: flex;
+        border: none;
+        border-radius: 5px;
+    }
+
+    > section {
+        width: 12%;
     }
 }
 
+section button{
+    margin: 4%;
+}
 
 li > button span {
     font-style: italic;
@@ -48,7 +59,7 @@ li > button:hover p {
 
 
 .icon {
-    width: 15px;
+    width: 18px;
     margin: 3px -3px -1px -3px;
 }
 
-- 
cgit v1.2.3


From 304b867c6fa5c1192e8cdec7fd22affb50e244b3 Mon Sep 17 00:00:00 2001
From: Akash Keshav <112591754+domesticchores@users.noreply.github.com>
Date: Tue, 25 Mar 2025 09:37:49 -0400
Subject: implement sorting algorithms with selection buttons. -ak

---
 .../components/need-list/need-list.component.html  |  7 ++++
 .../components/need-list/need-list.component.ts    | 46 ++++++++++++++++++++--
 2 files changed, 50 insertions(+), 3 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index 36c12d0..c5faf74 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -1,4 +1,11 @@
 <h1>Needs List</h1>
+<div style="display: flex;">
+    <h3>Sort by:</h3>
+    <table style="margin-left: 10px; display: flex; column-gap: 24px;">
+        <tr><h3><button (click)="changeSortAlgo('sortByName',searchForm.value)">Name(A-Z)</button></h3></tr>
+        <tr><h3><button (click)="changeSortAlgo('sortByMaxGoal',searchForm.value)">Max Goal(Descending)</button></h3></tr>
+    </table>
+</div>
 <input id="search-button" type="button" value="Search" (click)="open()">
 <div id="search-form">
     <form #searchForm="ngForm">
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index 25f05d6..be444fb 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -1,8 +1,28 @@
-import { Component } from '@angular/core';
+import { Component, Input } from '@angular/core';
 import {Need} from '../../models/Need';
 import {CupboardService} from '../../services/cupboard.service';
 import { UsersService } from '../../services/users.service';
 import { userType } from '../../models/User';
+
+interface sortAlgo {
+  (a: Need,b: Need): number;
+}
+
+// sort functions
+const sortByName: sortAlgo = (a: Need, b: Need): number => {
+  if(a.name.toLocaleLowerCase() < b.name.toLocaleLowerCase()) {
+    return -1;
+  }
+  return 1;
+}
+
+const sortByMaxGoal: sortAlgo = (a: Need, b: Need): number => {
+  if(a.maxGoal >= b.maxGoal) {
+    return -1;
+  }
+  return 1;
+}
+
 @Component({
   selector: 'app-need-list',
   standalone: false,
@@ -12,6 +32,12 @@ import { userType } from '../../models/User';
 export class NeedListComponent {
   needs: Need[] = [];
   searchResults: Need[] = [];
+  currentSortAlgo: sortAlgo = sortByMaxGoal;
+
+  SortingAlgoArrays: {func:sortAlgo,name:string}[] = [
+    {func:sortByMaxGoal,name:"sortByMaxGoal"},
+    {func:sortByName,name:"sortByName"},
+  ];
 
   constructor(
     private cupboardService: CupboardService,
@@ -19,7 +45,7 @@ export class NeedListComponent {
   ) {}
 
     refresh() {
-        this.cupboardService.getNeeds().subscribe(n => this.needs = n)
+        this.cupboardService.getNeeds().subscribe(n => this.needs = n.sort(this.currentSortAlgo))
     }
 
   ngOnInit(): void {
@@ -60,6 +86,19 @@ export class NeedListComponent {
     this.hideElement(document.getElementById('search-status'));
   }
 
+  changeSortAlgo(algoName: string, form: any) {
+    console.log(algoName);
+    this.SortingAlgoArrays.forEach(algo => {
+      if(algo.name === algoName) {
+        this.currentSortAlgo = algo.func;
+        console.log("changed sorting algorithm to: ", algo.name)
+        return
+      }
+    });
+    this.refresh()
+    this.search(form);
+  }
+
   private searchDelay: any;
 
   async search(form: any) {
@@ -72,8 +111,9 @@ export class NeedListComponent {
 
     this.searchDelay = setTimeout(() => {
       const currentSearchValue = form.search; //latest value of the search
+      console.log("current search value: ", currentSearchValue)
       this.cupboardService.searchNeeds(currentSearchValue).subscribe((n) => {
-        this.searchResults = n;
+        this.searchResults = n.sort(this.currentSortAlgo);
         console.log(currentSearchValue, this.searchResults);
         this.showElement(document.getElementById('search-results'));
         this.showElement(document.getElementById('search-status'));
-- 
cgit v1.2.3


From 07d191cb1fc8890f66e9af7d19e8276089d18d8b Mon Sep 17 00:00:00 2001
From: Akash Keshav <112591754+domesticchores@users.noreply.github.com>
Date: Tue, 25 Mar 2025 09:45:38 -0400
Subject: added more sort options; fix HTML error

---
 .../src/app/components/need-list/need-list.component.html |  2 ++
 .../src/app/components/need-list/need-list.component.ts   | 15 ++++++++++++++-
 2 files changed, 16 insertions(+), 1 deletion(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index c5faf74..283cc99 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -3,7 +3,9 @@
     <h3>Sort by:</h3>
     <table style="margin-left: 10px; display: flex; column-gap: 24px;">
         <tr><h3><button (click)="changeSortAlgo('sortByName',searchForm.value)">Name(A-Z)</button></h3></tr>
+        <tr><h3><button (click)="changeSortAlgo('sortByNameReverse',searchForm.value)">Name(Z-A)</button></h3></tr>
         <tr><h3><button (click)="changeSortAlgo('sortByMaxGoal',searchForm.value)">Max Goal(Descending)</button></h3></tr>
+        <tr><h3><button (click)="changeSortAlgo('sortByMinGoal',searchForm.value)">Max Goal(Ascending)</button></h3></tr>
     </table>
 </div>
 <input id="search-button" type="button" value="Search" (click)="open()">
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index be444fb..06bb17e 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -16,13 +16,24 @@ const sortByName: sortAlgo = (a: Need, b: Need): number => {
   return 1;
 }
 
+const sortByNameReverse: sortAlgo = (a: Need, b: Need): number => {
+  return sortByName(a,b)*-1;
+}
+
 const sortByMaxGoal: sortAlgo = (a: Need, b: Need): number => {
-  if(a.maxGoal >= b.maxGoal) {
+  if(a.maxGoal == b.maxGoal) {
+    return sortByName(a,b);
+  }
+  else if(a.maxGoal > b.maxGoal) {
     return -1;
   }
   return 1;
 }
 
+const sortByMinGoal: sortAlgo = (a: Need, b: Need): number => {
+  return sortByMaxGoal(a,b)*-1;
+}
+
 @Component({
   selector: 'app-need-list',
   standalone: false,
@@ -37,6 +48,8 @@ export class NeedListComponent {
   SortingAlgoArrays: {func:sortAlgo,name:string}[] = [
     {func:sortByMaxGoal,name:"sortByMaxGoal"},
     {func:sortByName,name:"sortByName"},
+    {func:sortByNameReverse,name:"sortByNameReverse"},
+    {func:sortByMinGoal,name:"sortByMinGoal"},
   ];
 
   constructor(
-- 
cgit v1.2.3


From d9eb78521f29ead3a9f70b09e18a6d9560cc849c Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Tue, 25 Mar 2025 10:43:52 -0400
Subject: fancy selection animation for need list

---
 .../components/need-list/need-list.component.css   |  2 +-
 .../components/need-list/need-list.component.html  |  4 ++--
 .../components/need-list/need-list.component.ts    | 28 +++++++++++++++++++++-
 3 files changed, 30 insertions(+), 4 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.css b/ufund-ui/src/app/components/need-list/need-list.component.css
index c763105..2eb6a8d 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.css
+++ b/ufund-ui/src/app/components/need-list/need-list.component.css
@@ -29,7 +29,7 @@ li {
     border-radius: 5px;
     margin: 5px; 
     > button {
-        background-color: var(--list-background-color);
+        background-color: transparent;
         width: 88%;
         float: left;
         transition: all 0.3s ease;
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index b31ccf0..eaa8a6f 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -13,14 +13,14 @@
 <h2 *ngIf="searchResults.length == 0"> No Results Found </h2>
 
 <ul>
-    <li *ngFor="let need of searchResults" id="need-button-{{need.id}}" >
+    <li *ngFor="let need of searchResults" id="need-button-{{need.id}}">
         <button [routerLink]="'/need/' + need.id" (mouseenter) ="changeText(need.id, '(details)')" (mouseleave)="changeText(need.id, '')">
             <p>{{need.name}}<span id="hover-status-label-{{need.id}}"> </span></p>
         </button>
 
         <button (click)="add(need)" *ngIf="isHelper()">Add To Basket</button>
         <section *ngIf="isManager()">
-            <button (click)="select(need)">
+            <button (click)="select(need)" id="need-edit-button-{{need.id}}">
                 <img class="icon" src="/edit.png" alt="Select">
             </button>
             <button (click)="delete(need.id)" *ngIf="isManager()"> 
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index e47929b..9ef191a 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -112,6 +112,32 @@ export class NeedListComponent {
   }
 
   select(need : Need) {
-    this.selectedNeed = need;
+    if (this.selectedNeed) {
+      //revert already selected need to previous style
+      console.log(need.id);
+      let button = document.getElementById('need-button-' + this.selectedNeed.id);
+      if (button) {
+        console.log(button)
+        button.style.background = 'lightgray';
+        button.style.marginLeft = '0%';
+        button.style.width = '98%';
+      }
+      button = document.getElementById('need-edit-button-' + this.selectedNeed.id);
+      if (button) {
+        button.style.visibility = 'visible';
+      }
+    }
+      //change selected need to selected style
+      this.selectedNeed = need;
+      let button = document.getElementById('need-button-' + need.id);
+      if (button) {
+        button.style.background = 'white';
+        button.style.marginLeft = '4%';
+        button.style.width = '100%';
+      }
+      button = document.getElementById('need-edit-button-' + need.id);
+      if (button) {
+        button.style.visibility = 'hidden';
+      }
   }
 }
\ No newline at end of file
-- 
cgit v1.2.3


From 0829feb20e60bc6d323dcc0d9376f4feb45115eb Mon Sep 17 00:00:00 2001
From: sowgro <tpoke.ferrari@gmail.com>
Date: Wed, 26 Mar 2025 18:23:17 -0400
Subject: Push starter code for Input()

---
 .../app/components/cupboard/cupboard.component.html    |  8 ++++----
 .../src/app/components/cupboard/cupboard.component.ts  |  6 +++---
 .../app/components/need-list/need-list.component.ts    | 18 ++++++++++--------
 3 files changed, 17 insertions(+), 15 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.html b/ufund-ui/src/app/components/cupboard/cupboard.component.html
index 3ed06fb..c2d146b 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.html
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.html
@@ -1,6 +1,6 @@
 <div>
     <h1> Cupboard </h1>
-    <app-need-list #needList></app-need-list>
+    <app-need-list [editF]="" #needList></app-need-list>
 </div>
 <div *ngIf="isManager()" >
     <h2 > Admin View </h2>
@@ -23,7 +23,7 @@
             <input type="submit" value="Submit">
         </form>
         <span *ngIf="statusText">{{statusText | async}}</span>
-    
+
     </div>
     <div id="update-form" *ngIf="selectedForm === 'update'">
         <h1> Update Need </h1>
@@ -41,8 +41,8 @@
             <input type="submit" value="Submit">
         </form>
         <span *ngIf="statusText">{{statusText | async}}</span>
-    
+
     </div>
     <hr>
-    
+
 </div>
diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.ts b/ufund-ui/src/app/components/cupboard/cupboard.component.ts
index e38f8c0..cf9b95e 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.ts
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit, ViewChild } from '@angular/core';
+import {Component, Input, OnInit, ViewChild} from '@angular/core';
 import { CupboardService } from '../../services/cupboard.service';
 import { UsersService } from '../../services/users.service';
 import { Need, GoalType } from '../../models/Need';
@@ -38,9 +38,9 @@ export class CupboardComponent implements OnInit {
     };
     selectedNeedId: number | null = null;
     searchResults: any[] = [];
-    
+
     selectForm(name: string) {
-        //get search results from the need list 
+        //get search results from the need list
         if (this.needList) {
             this.searchResults = this.needList.searchResults;
         }
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index 9ef191a..bf78d99 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -1,4 +1,4 @@
-import { Component } from '@angular/core';
+import {Component, Input} from '@angular/core';
 import { NgForm } from '@angular/forms';
 import {Need} from '../../models/Need';
 import {CupboardService} from '../../services/cupboard.service';
@@ -15,6 +15,8 @@ export class NeedListComponent {
   needs: Need[] = [];
   searchResults: Need[] = [];
 
+  @Input() editF?: Function
+
   constructor(
     private cupboardService: CupboardService,
     private usersService: UsersService
@@ -43,7 +45,7 @@ export class NeedListComponent {
     }
     if (form) {
       this.searchDelay = setTimeout(() => {
-        
+
         if (form) {
           const currentSearchValue = form.search; //latest value of the search
           this.cupboardService.searchNeeds(currentSearchValue).subscribe((n) => {
@@ -58,9 +60,9 @@ export class NeedListComponent {
         clearTimeout(this.searchDelay);
         this.searchResults = this.needs;
       }
-      
 
-     
+
+
   }
 
   delete(id : number) {
@@ -80,10 +82,10 @@ export class NeedListComponent {
   }
 
   changeText(id : number, text : string) {
-    const span = document.getElementById('hover-status-label-' + id);  
+    const span = document.getElementById('hover-status-label-' + id);
     if (span) {
       span.innerHTML = ' ' + text;
-    }    
+    }
   }
 
   add(need: Need) {
@@ -101,7 +103,7 @@ export class NeedListComponent {
       } else {
         window.alert("This need is already in your basket!")
       }
-      
+
 
     }
 
@@ -140,4 +142,4 @@ export class NeedListComponent {
         button.style.visibility = 'hidden';
       }
   }
-}
\ No newline at end of file
+}
-- 
cgit v1.2.3


From 0549991d0b32de4de544d16478ce5b2782c1809d Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Wed, 26 Mar 2025 18:59:55 -0400
Subject: use (output) for need edit selection

---
 ufund-ui/src/app/components/cupboard/cupboard.component.html | 2 +-
 ufund-ui/src/app/components/need-list/need-list.component.ts | 8 +++++---
 2 files changed, 6 insertions(+), 4 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.html b/ufund-ui/src/app/components/cupboard/cupboard.component.html
index c2d146b..4b76f25 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.html
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.html
@@ -1,6 +1,6 @@
 <div>
     <h1> Cupboard </h1>
-    <app-need-list [editF]="" #needList></app-need-list>
+    <app-need-list (currentNeed) = populateForm($event) #needList></app-need-list>
 </div>
 <div *ngIf="isManager()" >
     <h2 > Admin View </h2>
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index bf78d99..2eed87d 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -1,4 +1,4 @@
-import {Component, Input} from '@angular/core';
+import {Component, Output, EventEmitter} from '@angular/core';
 import { NgForm } from '@angular/forms';
 import {Need} from '../../models/Need';
 import {CupboardService} from '../../services/cupboard.service';
@@ -11,11 +11,11 @@ import { userType } from '../../models/User';
   styleUrl: './need-list.component.css'
 })
 export class NeedListComponent {
-  selectedNeed: Need | undefined;
+  selectedNeed: Need | null = null;
   needs: Need[] = [];
   searchResults: Need[] = [];
 
-  @Input() editF?: Function
+  @Output() currentNeed = new EventEmitter<Need>();
 
   constructor(
     private cupboardService: CupboardService,
@@ -114,6 +114,8 @@ export class NeedListComponent {
   }
 
   select(need : Need) {
+    //emit value
+    this.currentNeed.emit(need);
     if (this.selectedNeed) {
       //revert already selected need to previous style
       console.log(need.id);
-- 
cgit v1.2.3


From 959aa5101fbba55f20eda46d02addd27a74cf950 Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Wed, 26 Mar 2025 19:03:16 -0400
Subject: snap form open on edit event

---
 ufund-ui/src/app/components/cupboard/cupboard.component.ts | 1 +
 1 file changed, 1 insertion(+)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.ts b/ufund-ui/src/app/components/cupboard/cupboard.component.ts
index cf9b95e..0d2c1f5 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.ts
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.ts
@@ -66,6 +66,7 @@ export class CupboardComponent implements OnInit {
     }
 
     populateForm(need: any): void {
+        this.selectForm('update');
         this.selectedNeed = { ...need };
     }
 
-- 
cgit v1.2.3


From d5ae670dbce9e5cabbd594759df490176fd8cecd Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Wed, 26 Mar 2025 19:12:52 -0400
Subject: use selected id for the update form

---
 ufund-ui/src/app/components/cupboard/cupboard.component.html | 1 -
 ufund-ui/src/app/components/cupboard/cupboard.component.ts   | 5 ++---
 2 files changed, 2 insertions(+), 4 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.html b/ufund-ui/src/app/components/cupboard/cupboard.component.html
index 4b76f25..d54eed9 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.html
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.html
@@ -29,7 +29,6 @@
         <h1> Update Need </h1>
         <label>Needs:</label><br>
         <form #updateForm="ngForm" (ngSubmit)="update(updateForm.value)">
-            <label>Currently Editing : need.name</label><br>
             <input type="text" name="name" [(ngModel)]="selectedNeed.name"><br>
             <label>Max Goal:</label><br>
             <input type="number" name="maxGoal" [(ngModel)]="selectedNeed.maxGoal"><br>
diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.ts b/ufund-ui/src/app/components/cupboard/cupboard.component.ts
index 0d2c1f5..a8b9c14 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.ts
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.ts
@@ -79,14 +79,13 @@ export class CupboardComponent implements OnInit {
         console.log(form);
         const need: Need = {
             name: form.name,
-            id: form.id, //system will control this
+            id: this.selectedNeed.id, //system will control this
             maxGoal: form.maxGoal,
             type: GoalType[form.type as keyof typeof GoalType],
             filterAttributes: [],
             current: 0
         };
-        console.log("need:", need);
-        console.log(need.id, need, "need updated");
+       
         this.cupboardService.updateNeed(need.id, need)
             .pipe(catchError((ex, r) => {
                 if (ex.status == 500) {
-- 
cgit v1.2.3


From 057efa1b557d5d874300c6cda8c7d74519c946d6 Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Thu, 27 Mar 2025 08:50:12 -0400
Subject: use <selection> instead of table with *ngFor for sort algorithms

---
 .../src/app/components/need-list/need-list.component.html | 15 ++++++---------
 .../src/app/components/need-list/need-list.component.ts   |  1 +
 2 files changed, 7 insertions(+), 9 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index de4be58..9799493 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -1,14 +1,11 @@
 <h1>Needs List</h1>
 <div id="search-container">
-  <div style="display: flex;">
-    <h3>Sort by:</h3>
-    <table style="margin-left: 10px; display: flex; column-gap: 24px;">
-        <tr><h3><button (click)="changeSortAlgo('sortByName',searchForm.value)">Name(A-Z)</button></h3></tr>
-        <tr><h3><button (click)="changeSortAlgo('sortByNameReverse',searchForm.value)">Name(Z-A)</button></h3></tr>
-        <tr><h3><button (click)="changeSortAlgo('sortByMaxGoal',searchForm.value)">Max Goal(Descending)</button></h3></tr>
-        <tr><h3><button (click)="changeSortAlgo('sortByMinGoal',searchForm.value)">Max Goal(Ascending)</button></h3></tr>
-    </table>
-  </div>
+    <label for="sort">Sort by:</label>
+    <select [(ngModel)]="sortSelection" id="sort" (change)="changeSortAlgo(sortSelection, searchForm.value)">
+        <option *ngFor="let algorithm of SortingAlgoArrays" value="{{algorithm.name}}">
+            {{algorithm.name}}
+        </option>
+    </select>
     <form id="search-form" #searchForm="ngForm">
         <input type="text" name="search" placeholder="Search in {{needs.length}} needs..." (input)="search(searchForm.value)" ngModel>
         <input type="reset" value="Clear" (click)="search(null)"> <br>
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index 208045f..c1063ce 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -45,6 +45,7 @@ export class NeedListComponent {
   selectedNeed: Need | null = null;
   needs: Need[] = [];
   searchResults: Need[] = [];
+  sortSelection: string = '';
   currentSortAlgo: sortAlgo = sortByMaxGoal;
 
   SortingAlgoArrays: {func:sortAlgo,name:string}[] = [
-- 
cgit v1.2.3


From 84083e7229678c30d827270bfa25de66a02d7b8c Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Thu, 27 Mar 2025 08:54:06 -0400
Subject: display name for algorithms

---
 ufund-ui/src/app/components/need-list/need-list.component.html |  2 +-
 ufund-ui/src/app/components/need-list/need-list.component.ts   | 10 +++++-----
 2 files changed, 6 insertions(+), 6 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index 9799493..a653527 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -3,7 +3,7 @@
     <label for="sort">Sort by:</label>
     <select [(ngModel)]="sortSelection" id="sort" (change)="changeSortAlgo(sortSelection, searchForm.value)">
         <option *ngFor="let algorithm of SortingAlgoArrays" value="{{algorithm.name}}">
-            {{algorithm.name}}
+            {{algorithm.display}}
         </option>
     </select>
     <form id="search-form" #searchForm="ngForm">
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index c1063ce..2fdd993 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -48,11 +48,11 @@ export class NeedListComponent {
   sortSelection: string = '';
   currentSortAlgo: sortAlgo = sortByMaxGoal;
 
-  SortingAlgoArrays: {func:sortAlgo,name:string}[] = [
-    {func:sortByMaxGoal,name:"sortByMaxGoal"},
-    {func:sortByName,name:"sortByName"},
-    {func:sortByNameReverse,name:"sortByNameReverse"},
-    {func:sortByMinGoal,name:"sortByMinGoal"},
+  SortingAlgoArrays: {func:sortAlgo,name:string,display:string}[] = [
+    {func:sortByMaxGoal,name:"sortByMaxGoal", display:"Max Goal"},
+    {func:sortByName,name:"sortByName", display:"Name"},
+    {func:sortByNameReverse,name:"sortByNameReverse", display:"Name (reverse)"},
+    {func:sortByMinGoal,name:"sortByMinGoal", display:"Min Goal"},
   ];
 
   @Output() currentNeed = new EventEmitter<Need>();
-- 
cgit v1.2.3


From 65590e6dfbed90e4acd342a72feb8d7b5120d70c Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Thu, 27 Mar 2025 09:49:41 -0400
Subject: refactor sorting to use acending descending toggle

---
 .../components/need-list/need-list.component.html  |  5 ++-
 .../components/need-list/need-list.component.ts    | 46 +++++++++++++---------
 2 files changed, 31 insertions(+), 20 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index a653527..5be915c 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -3,9 +3,12 @@
     <label for="sort">Sort by:</label>
     <select [(ngModel)]="sortSelection" id="sort" (change)="changeSortAlgo(sortSelection, searchForm.value)">
         <option *ngFor="let algorithm of SortingAlgoArrays" value="{{algorithm.name}}">
-            {{algorithm.display}}
+            {{algorithm.display[sortMode === 'Ascending' ? 0 : 1]}}
         </option>
     </select>
+    <button (click)="changeSortMode(searchForm.value)">
+        {{sortMode}}
+    </button>
     <form id="search-form" #searchForm="ngForm">
         <input type="text" name="search" placeholder="Search in {{needs.length}} needs..." (input)="search(searchForm.value)" ngModel>
         <input type="reset" value="Clear" (click)="search(null)"> <br>
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index 2fdd993..97be0cb 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -17,11 +17,7 @@ const sortByName: sortAlgo = (a: Need, b: Need): number => {
   return 1;
 }
 
-const sortByNameReverse: sortAlgo = (a: Need, b: Need): number => {
-  return sortByName(a,b)*-1;
-}
-
-const sortByMaxGoal: sortAlgo = (a: Need, b: Need): number => {
+const sortByGoal: sortAlgo = (a: Need, b: Need): number => {
   if(a.maxGoal == b.maxGoal) {
     return sortByName(a,b);
   }
@@ -31,10 +27,6 @@ const sortByMaxGoal: sortAlgo = (a: Need, b: Need): number => {
   return 1;
 }
 
-const sortByMinGoal: sortAlgo = (a: Need, b: Need): number => {
-  return sortByMaxGoal(a,b)*-1;
-}
-
 @Component({
   selector: 'app-need-list',
   standalone: false,
@@ -45,14 +37,13 @@ export class NeedListComponent {
   selectedNeed: Need | null = null;
   needs: Need[] = [];
   searchResults: Need[] = [];
+  sortMode = 'Ascending'
   sortSelection: string = '';
-  currentSortAlgo: sortAlgo = sortByMaxGoal;
+  currentSortAlgo: sortAlgo = sortByGoal;
 
-  SortingAlgoArrays: {func:sortAlgo,name:string,display:string}[] = [
-    {func:sortByMaxGoal,name:"sortByMaxGoal", display:"Max Goal"},
-    {func:sortByName,name:"sortByName", display:"Name"},
-    {func:sortByNameReverse,name:"sortByNameReverse", display:"Name (reverse)"},
-    {func:sortByMinGoal,name:"sortByMinGoal", display:"Min Goal"},
+  SortingAlgoArrays: {func:sortAlgo,name:string, display:string[]}[] = [
+    {func:sortByGoal,name:"sortByMaxGoal", display:["Max Goal", "Min Goal"]},
+    {func:sortByName,name:"sortByName", display:["Name", "Name (Descending)"]},
   ];
 
   @Output() currentNeed = new EventEmitter<Need>();
@@ -64,22 +55,34 @@ export class NeedListComponent {
 
     refresh() {
         this.cupboardService.getNeeds().subscribe(n => {
-          this.needs = n.sort(this.currentSortAlgo);
+          if (this.sortMode == 'Ascending') {
+            this.needs = n.sort(this.currentSortAlgo);
+          } else {
+            this.needs = n.sort(this.currentSortAlgo).reverse();
+          }
           this.searchResults = this.needs;
         });
-        console.log(this.searchResults);
     }
 
   ngOnInit(): void {
     this.refresh()
   }
 
+  changeSortMode(form : any) {
+    if (this.sortMode == 'Ascending'){
+      this.sortMode = 'Descending'
+    } else {
+      this.sortMode = 'Ascending'
+    }
+    this.search(form)
+  }
+
   changeSortAlgo(algoName: string, form: any) {
     console.log(algoName);
     this.SortingAlgoArrays.forEach(algo => {
       if(algo.name === algoName) {
         this.currentSortAlgo = algo.func;
-        console.log("changed sorting algorithm to: ", algo.name)
+        console.log("changed sorting algorithm to: ", algo.name + this.sortMode)
         return
       }
     });
@@ -102,7 +105,12 @@ export class NeedListComponent {
         if (form) {
           const currentSearchValue = form.search; //latest value of the search
           this.cupboardService.searchNeeds(currentSearchValue).subscribe((n) => {
-            this.searchResults = n.sort(this.currentSortAlgo);
+            if (this.sortMode == 'Ascending') {
+              this.searchResults = n.sort(this.currentSortAlgo);
+            } else {
+              this.searchResults = n.sort(this.currentSortAlgo).reverse();
+            }
+            
             console.log(currentSearchValue, this.searchResults);
             });
           }
-- 
cgit v1.2.3


From ee4154df85a971f3a0f8e43fd6afdfa6a620ea99 Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Thu, 27 Mar 2025 10:09:19 -0400
Subject: refactor change sort algo func with [(ngModel)] binding

---
 .../components/need-list/need-list.component.html  |  2 +-
 .../components/need-list/need-list.component.ts    | 25 ++++++++++------------
 2 files changed, 12 insertions(+), 15 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index 5be915c..4f259a0 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -1,7 +1,7 @@
 <h1>Needs List</h1>
 <div id="search-container">
     <label for="sort">Sort by:</label>
-    <select [(ngModel)]="sortSelection" id="sort" (change)="changeSortAlgo(sortSelection, searchForm.value)">
+    <select [(ngModel)] = "sortSelection" id="sort" (change)="search(searchForm.value)">
         <option *ngFor="let algorithm of SortingAlgoArrays" value="{{algorithm.name}}">
             {{algorithm.display[sortMode === 'Ascending' ? 0 : 1]}}
         </option>
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index 97be0cb..177d9f7 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -38,8 +38,9 @@ export class NeedListComponent {
   needs: Need[] = [];
   searchResults: Need[] = [];
   sortMode = 'Ascending'
-  sortSelection: string = '';
+
   currentSortAlgo: sortAlgo = sortByGoal;
+  sortSelection: string = this.currentSortAlgo.name;
 
   SortingAlgoArrays: {func:sortAlgo,name:string, display:string[]}[] = [
     {func:sortByGoal,name:"sortByMaxGoal", display:["Max Goal", "Min Goal"]},
@@ -77,19 +78,6 @@ export class NeedListComponent {
     this.search(form)
   }
 
-  changeSortAlgo(algoName: string, form: any) {
-    console.log(algoName);
-    this.SortingAlgoArrays.forEach(algo => {
-      if(algo.name === algoName) {
-        this.currentSortAlgo = algo.func;
-        console.log("changed sorting algorithm to: ", algo.name + this.sortMode)
-        return
-      }
-    });
-    this.refresh()
-    this.search(form);
-  }
-
   private searchDelay: any;
 
   async search(form: any) {
@@ -103,6 +91,15 @@ export class NeedListComponent {
       this.searchDelay = setTimeout(() => {
 
         if (form) {
+          //sorting based on algo selected
+          this.SortingAlgoArrays.forEach(algo => {
+            if(algo.name === this.sortSelection) {
+              this.currentSortAlgo = algo.func;
+              console.log("changed sorting algorithm to: ", algo.name + this.sortMode)
+              return
+            }
+          });
+
           const currentSearchValue = form.search; //latest value of the search
           this.cupboardService.searchNeeds(currentSearchValue).subscribe((n) => {
             if (this.sortMode == 'Ascending') {
-- 
cgit v1.2.3


From 0b4c76c5dc7313ae42c62be3c682c1f88cec13fd Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Thu, 27 Mar 2025 10:36:32 -0400
Subject: defaut value for sorting

---
 ufund-ui/src/app/components/need-list/need-list.component.html | 2 +-
 ufund-ui/src/app/components/need-list/need-list.component.ts   | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index 4f259a0..693307f 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -1,7 +1,7 @@
 <h1>Needs List</h1>
 <div id="search-container">
     <label for="sort">Sort by:</label>
-    <select [(ngModel)] = "sortSelection" id="sort" (change)="search(searchForm.value)">
+    <select [(ngModel)] = "sortSelection" id="sort" (change)="search(searchForm.value)" [value]="sortSelection">
         <option *ngFor="let algorithm of SortingAlgoArrays" value="{{algorithm.name}}">
             {{algorithm.display[sortMode === 'Ascending' ? 0 : 1]}}
         </option>
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index 177d9f7..f935e03 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -40,10 +40,10 @@ export class NeedListComponent {
   sortMode = 'Ascending'
 
   currentSortAlgo: sortAlgo = sortByGoal;
-  sortSelection: string = this.currentSortAlgo.name;
+  sortSelection: string = 'sortByGoal';
 
   SortingAlgoArrays: {func:sortAlgo,name:string, display:string[]}[] = [
-    {func:sortByGoal,name:"sortByMaxGoal", display:["Max Goal", "Min Goal"]},
+    {func:sortByGoal,name:"sortByGoal", display:["Max Goal", "Min Goal"]},
     {func:sortByName,name:"sortByName", display:["Name", "Name (Descending)"]},
   ];
 
-- 
cgit v1.2.3


From 9e011d85fd307768f7cec7214ca873208574ecfb Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Fri, 28 Mar 2025 21:56:47 -0400
Subject: changed styling of search display to be wider and expand filter
 descriptions

---
 .../components/need-list/need-list.component.css   |  3 +++
 .../components/need-list/need-list.component.html  | 30 ++++++++++++----------
 .../components/need-list/need-list.component.ts    |  2 +-
 3 files changed, 21 insertions(+), 14 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.css b/ufund-ui/src/app/components/need-list/need-list.component.css
index 2eb6a8d..19c126f 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.css
+++ b/ufund-ui/src/app/components/need-list/need-list.component.css
@@ -67,4 +67,7 @@ li > button:hover p {
     background-color: #d9d9d9;
     border: 2px solid #000;
     border-radius: 5px;
+    .wide-input {
+        width: 60%;
+    }
  }
\ No newline at end of file
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index 693307f..5e9a540 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -1,18 +1,22 @@
 <h1>Needs List</h1>
 <div id="search-container">
-    <label for="sort">Sort by:</label>
-    <select [(ngModel)] = "sortSelection" id="sort" (change)="search(searchForm.value)" [value]="sortSelection">
-        <option *ngFor="let algorithm of SortingAlgoArrays" value="{{algorithm.name}}">
-            {{algorithm.display[sortMode === 'Ascending' ? 0 : 1]}}
-        </option>
-    </select>
-    <button (click)="changeSortMode(searchForm.value)">
-        {{sortMode}}
-    </button>
-    <form id="search-form" #searchForm="ngForm">
-        <input type="text" name="search" placeholder="Search in {{needs.length}} needs..." (input)="search(searchForm.value)" ngModel>
-        <input type="reset" value="Clear" (click)="search(null)"> <br>
-    </form>
+    <section>
+        <label for="sort">Sort by: </label>
+        <select [(ngModel)] = "sortSelection" class="wide-input" (change)="search(searchForm.value)" [value]="sortSelection">
+            <option *ngFor="let algorithm of SortingAlgoArrays" value="{{algorithm.name}}">
+                {{algorithm.display[sortMode === 'Ascending' ? 0 : 1]}}
+            </option>
+        </select>
+        <button (click)="changeSortMode(searchForm.value)">
+            {{sortMode}}
+        </button>
+    </section>
+    <section>
+        <form id="search-form" #searchForm="ngForm">
+            <input type="text" name="search" class="wide-input" placeholder="Search in {{needs.length}} needs..." (input)="search(searchForm.value)" ngModel>
+            <input type="reset" value="Clear" (click)="search(null)"> <br>
+        </form>
+    </section>
     <!--<button (click)="close()">Close</button>-->
 </div>
 
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index f935e03..4359cfa 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -43,7 +43,7 @@ export class NeedListComponent {
   sortSelection: string = 'sortByGoal';
 
   SortingAlgoArrays: {func:sortAlgo,name:string, display:string[]}[] = [
-    {func:sortByGoal,name:"sortByGoal", display:["Max Goal", "Min Goal"]},
+    {func:sortByGoal,name:"sortByGoal", display:["Maximum Goal", "Minimum Goal"]},
     {func:sortByName,name:"sortByName", display:["Name", "Name (Descending)"]},
   ];
 
-- 
cgit v1.2.3


From 61b5b762b150c82e7d48190bcfe3416bfea96059 Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Sat, 29 Mar 2025 14:37:57 -0400
Subject: frontend implementation of a needs' urgency and location

---
 ufund-ui/src/app/components/cupboard/cupboard.component.html |  9 +++++++++
 ufund-ui/src/app/components/cupboard/cupboard.component.ts   |  8 +++++++-
 ufund-ui/src/app/components/need-list/need-list.component.ts | 12 ++++++------
 ufund-ui/src/app/models/Need.ts                              |  2 ++
 4 files changed, 24 insertions(+), 7 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.html b/ufund-ui/src/app/components/cupboard/cupboard.component.html
index d54eed9..bc5ac1c 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.html
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.html
@@ -13,6 +13,8 @@
         <form #cupboardForm="ngForm" (ngSubmit)="submit(cupboardForm.value)">
             <label>Name:</label><br>
             <input type="text" name="name" ngModel><br>
+            <label>Location:</label><br>
+            <input type="text" name="location" ngModel><br>
             <label>Max Goal:</label><br>
             <input type="number" name="maxGoal" ngModel><br>
             <label>Type</label><br>
@@ -20,7 +22,10 @@
             <label>Monetary</label><br>
             <input type="radio" name="type" value="PHYSICAL" ngModel>
             <label>Physical</label><br>
+            <input type="checkbox" name="urgent" value="false" ngModel>
+            <label>Urgent</label><br>
             <input type="submit" value="Submit">
+            
         </form>
         <span *ngIf="statusText">{{statusText | async}}</span>
 
@@ -30,6 +35,7 @@
         <label>Needs:</label><br>
         <form #updateForm="ngForm" (ngSubmit)="update(updateForm.value)">
             <input type="text" name="name" [(ngModel)]="selectedNeed.name"><br>
+            <input type="text" name="location" [(ngModel)]="selectedNeed.location"><br>
             <label>Max Goal:</label><br>
             <input type="number" name="maxGoal" [(ngModel)]="selectedNeed.maxGoal"><br>
             <label>Type</label><br>
@@ -37,7 +43,10 @@
             <label>Monetary</label><br>
             <input type="radio" name="type" value="PHYSICAL" [(ngModel)]="selectedNeed.type">
             <label>Physical</label><br>
+            <input type="checkbox" name="urgent" [(ngModel)]="selectedNeed.urgent">
+            <label>Urgent</label> <br>
             <input type="submit" value="Submit">
+           
         </form>
         <span *ngIf="statusText">{{statusText | async}}</span>
 
diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.ts b/ufund-ui/src/app/components/cupboard/cupboard.component.ts
index a8b9c14..540a058 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.ts
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.ts
@@ -32,9 +32,11 @@ export class CupboardComponent implements OnInit {
 
     selectedNeed: any = {
         name: '',
+        location:'',
         id: null,
         maxGoal: null,
-        type: ''
+        type: '',
+        urgent: false
     };
     selectedNeedId: number | null = null;
     searchResults: any[] = [];
@@ -79,9 +81,11 @@ export class CupboardComponent implements OnInit {
         console.log(form);
         const need: Need = {
             name: form.name,
+            location: form.location,
             id: this.selectedNeed.id, //system will control this
             maxGoal: form.maxGoal,
             type: GoalType[form.type as keyof typeof GoalType],
+            urgent: form.urgent,
             filterAttributes: [],
             current: 0
         };
@@ -113,9 +117,11 @@ export class CupboardComponent implements OnInit {
     submit(form: any) {
         const need: Need = {
             name: form.name,
+            location: form.location,
             id: 0,
             maxGoal: form.maxGoal,
             type: form.type,
+            urgent: form.urgent,
             filterAttributes: [],
             current: 0
         };
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index 4359cfa..37a3775 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -1,5 +1,4 @@
-import {Component, input, Output, EventEmitter} from '@angular/core';
-import { NgForm } from '@angular/forms';
+import {Component , Output, EventEmitter} from '@angular/core';
 import {Need} from '../../models/Need';
 import {CupboardService} from '../../services/cupboard.service';
 import { UsersService } from '../../services/users.service';
@@ -39,12 +38,13 @@ export class NeedListComponent {
   searchResults: Need[] = [];
   sortMode = 'Ascending'
 
-  currentSortAlgo: sortAlgo = sortByGoal;
-  sortSelection: string = 'sortByGoal';
+  currentSortAlgo: sortAlgo = sortByName;
+  sortSelection: string = 'sortByName';
 
   SortingAlgoArrays: {func:sortAlgo,name:string, display:string[]}[] = [
-    {func:sortByGoal,name:"sortByGoal", display:["Maximum Goal", "Minimum Goal"]},
-    {func:sortByName,name:"sortByName", display:["Name", "Name (Descending)"]},
+    {func:sortByName,name:"sortByName", display:["Name (Alphabetical)", "Name (Reverse)"]},
+    {func:sortByGoal,name:"sortByGoal", display:["Largest Maximum Goal", "Smallest Maximum Goal"]},
+    {func:sortByName,name:"sortByPriority", display:["Highest Priority", "Lowest Priority"]},
   ];
 
   @Output() currentNeed = new EventEmitter<Need>();
diff --git a/ufund-ui/src/app/models/Need.ts b/ufund-ui/src/app/models/Need.ts
index 9e97fd4..de6504a 100644
--- a/ufund-ui/src/app/models/Need.ts
+++ b/ufund-ui/src/app/models/Need.ts
@@ -2,9 +2,11 @@ export interface Need {
   name: string,
   id: number,
   filterAttributes: string[],
+  location: string;
   type: GoalType;
   maxGoal: number;
   current: number;
+  urgent: boolean;
 }
 
 export enum GoalType {
-- 
cgit v1.2.3


From e0a3f2c2c0fec40aa50c8889e343a1dbc7f9d7fb Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Sat, 29 Mar 2025 15:01:12 -0400
Subject: API functionality for urgency and location

---
 ufund-ui/src/app/components/need-list/need-list.component.html | 2 +-
 ufund-ui/src/app/components/need-page/need-page.component.html | 3 ++-
 2 files changed, 3 insertions(+), 2 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index 5e9a540..ed151a3 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -28,7 +28,7 @@
 <ul>
     <li *ngFor="let need of searchResults" id="need-button-{{need.id}}">
         <button [routerLink]="'/need/' + need.id" (mouseenter) ="changeText(need.id, '(details)')" (mouseleave)="changeText(need.id, '')">
-            <p>{{need.name}}<span id="hover-status-label-{{need.id}}"> </span></p>
+            <p>{{need.name}} <span id="hover-status-label-{{need.id}}"> </span></p>
         </button>
 
         <button (click)="add(need)" *ngIf="isHelper()">Add To Basket</button>
diff --git a/ufund-ui/src/app/components/need-page/need-page.component.html b/ufund-ui/src/app/components/need-page/need-page.component.html
index 90fd459..004f9eb 100644
--- a/ufund-ui/src/app/components/need-page/need-page.component.html
+++ b/ufund-ui/src/app/components/need-page/need-page.component.html
@@ -16,7 +16,8 @@
 </div>
 
 <hr>
-
+<p>Location: {{need?.location}}</p>
 <p>Goal: {{need?.maxGoal}}</p>
 <p>Current: {{need?.current}}</p>
+<p>Urgent: {{need?.urgent}}</p>
 <p>This goal is <strong>{{(((need?.current ?? 0)*100) / (need?.maxGoal ?? 0)).toFixed(0)}}%</strong> complete!</p>
\ No newline at end of file
-- 
cgit v1.2.3


From 88650361adfc9be8344b0d383100b0c6ab513973 Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Sun, 30 Mar 2025 00:33:41 -0400
Subject: basic css and info display for needs

---
 .../src/app/components/need-list/need-list.component.css    | 13 +++++++++++--
 .../src/app/components/need-list/need-list.component.html   |  9 ++++++++-
 2 files changed, 19 insertions(+), 3 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.css b/ufund-ui/src/app/components/need-list/need-list.component.css
index 19c126f..345326f 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.css
+++ b/ufund-ui/src/app/components/need-list/need-list.component.css
@@ -31,12 +31,21 @@ li {
     > button {
         background-color: transparent;
         width: 88%;
-        float: left;
         transition: all 0.3s ease;
         font-weight: bold;
-        display: flex;
         border: none;
         border-radius: 5px;
+        padding-left: 1.5%;
+        > section {
+            width: 100%;
+            flex: none;
+            display: inline-block;
+            background-color: magenta;            
+            > progress {
+                width: 25%;
+                float: none;
+            }
+        }
     }
 
     > section {
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index ed151a3..88b9752 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -28,7 +28,14 @@
 <ul>
     <li *ngFor="let need of searchResults" id="need-button-{{need.id}}">
         <button [routerLink]="'/need/' + need.id" (mouseenter) ="changeText(need.id, '(details)')" (mouseleave)="changeText(need.id, '')">
-            <p>{{need.name}} <span id="hover-status-label-{{need.id}}"> </span></p>
+            <section>{{need.name}} | {{need.location}} {{need.urgent ? "URGENT" : ""}}<span id="hover-status-label-{{need.id}}"> </span></section>
+            <section>
+                <progress value="need.current" max="need.maxGoal"></progress>
+                <progress value="need.current" max="need.maxGoal"></progress>
+                <progress value="need.current" max="need.maxGoal"></progress>
+                <progress value="need.current" max="need.maxGoal"></progress>
+            </section>
+            <section>{{need.current}}/{{need.maxGoal}} {{(need.current / need.maxGoal) * 100}}% <span>{{need.type}}</span></section>
         </button>
 
         <button (click)="add(need)" *ngIf="isHelper()">Add To Basket</button>
-- 
cgit v1.2.3


From daae556a1be7a30bc6f4606bd1b1567b713d054a Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Sun, 30 Mar 2025 00:39:23 -0400
Subject: better display for urgency

---
 ufund-ui/src/app/components/need-list/need-list.component.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index 88b9752..866e5e4 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -28,7 +28,7 @@
 <ul>
     <li *ngFor="let need of searchResults" id="need-button-{{need.id}}">
         <button [routerLink]="'/need/' + need.id" (mouseenter) ="changeText(need.id, '(details)')" (mouseleave)="changeText(need.id, '')">
-            <section>{{need.name}} | {{need.location}} {{need.urgent ? "URGENT" : ""}}<span id="hover-status-label-{{need.id}}"> </span></section>
+            <section> <p> {{need.name}} | {{need.location}} <span> {{need.urgent ? "URGENT" : ""}} </span> <span id="hover-status-label-{{need.id}}"> </span> </section>
             <section>
                 <progress value="need.current" max="need.maxGoal"></progress>
                 <progress value="need.current" max="need.maxGoal"></progress>
-- 
cgit v1.2.3


From 760b8efef4d683d26404ebca75b7a9c44a1db3a9 Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Sun, 30 Mar 2025 00:46:50 -0400
Subject: urgency sorting

---
 .../src/app/components/cupboard/cupboard.component.ts    |  2 +-
 .../src/app/components/need-list/need-list.component.ts  | 16 +++++++++++++---
 2 files changed, 14 insertions(+), 4 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.ts b/ufund-ui/src/app/components/cupboard/cupboard.component.ts
index 540a058..ad68c38 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.ts
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.ts
@@ -121,7 +121,7 @@ export class CupboardComponent implements OnInit {
             id: 0,
             maxGoal: form.maxGoal,
             type: form.type,
-            urgent: form.urgent,
+            urgent: form.urgent ? true : false,
             filterAttributes: [],
             current: 0
         };
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index 37a3775..4ae8f4a 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -26,6 +26,16 @@ const sortByGoal: sortAlgo = (a: Need, b: Need): number => {
   return 1;
 }
 
+const sortByPriority: sortAlgo = (a: Need, b: Need): number => {
+  if(a.urgent == b.urgent) {
+    return sortByGoal(a,b);
+  }
+  else if(a.urgent && !b.urgent) {
+    return -1;
+  }
+  return 1;
+}
+
 @Component({
   selector: 'app-need-list',
   standalone: false,
@@ -38,13 +48,13 @@ export class NeedListComponent {
   searchResults: Need[] = [];
   sortMode = 'Ascending'
 
-  currentSortAlgo: sortAlgo = sortByName;
-  sortSelection: string = 'sortByName';
+  currentSortAlgo: sortAlgo = sortByPriority;
+  sortSelection: string = 'sortByPriority';
 
   SortingAlgoArrays: {func:sortAlgo,name:string, display:string[]}[] = [
     {func:sortByName,name:"sortByName", display:["Name (Alphabetical)", "Name (Reverse)"]},
     {func:sortByGoal,name:"sortByGoal", display:["Largest Maximum Goal", "Smallest Maximum Goal"]},
-    {func:sortByName,name:"sortByPriority", display:["Highest Priority", "Lowest Priority"]},
+    {func:sortByPriority,name:"sortByPriority", display:["Highest Priority", "Lowest Priority"]},
   ];
 
   @Output() currentNeed = new EventEmitter<Need>();
-- 
cgit v1.2.3


From f23afc7f3b0b62384b3b54a0864b02abc3b48b01 Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Sun, 30 Mar 2025 00:50:43 -0400
Subject: sortByCompletion

---
 .../src/app/components/need-list/need-list.component.ts     | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index 4ae8f4a..17bb3e6 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -26,6 +26,16 @@ const sortByGoal: sortAlgo = (a: Need, b: Need): number => {
   return 1;
 }
 
+const sortByCompletion: sortAlgo = (a: Need, b: Need): number => {
+  if(a.current == b.current) {
+    return sortByGoal(a,b);
+  }
+  else if(a.current > b.current) {
+    return -1;
+  }
+  return 1;
+}
+
 const sortByPriority: sortAlgo = (a: Need, b: Need): number => {
   if(a.urgent == b.urgent) {
     return sortByGoal(a,b);
@@ -52,8 +62,9 @@ export class NeedListComponent {
   sortSelection: string = 'sortByPriority';
 
   SortingAlgoArrays: {func:sortAlgo,name:string, display:string[]}[] = [
-    {func:sortByName,name:"sortByName", display:["Name (Alphabetical)", "Name (Reverse)"]},
+    {func:sortByName,name:"sortByName", display:["Name (A to Z)", "Name (Z to A)"]},
     {func:sortByGoal,name:"sortByGoal", display:["Largest Maximum Goal", "Smallest Maximum Goal"]},
+    {func:sortByCompletion,name:"sortByCompletion", display:["Most Completed", "Least Completed"]},
     {func:sortByPriority,name:"sortByPriority", display:["Highest Priority", "Lowest Priority"]},
   ];
 
-- 
cgit v1.2.3


From 42725635e70426c4d2923c680609da8277c693ea Mon Sep 17 00:00:00 2001
From: sowgro <tpoke.ferrari@gmail.com>
Date: Sun, 30 Mar 2025 14:44:04 -0400
Subject: fix imports in need-list.component.ts

---
 .../components/need-list/need-list.component.ts    | 25 +++++++++++++---------
 1 file changed, 15 insertions(+), 10 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index 2bbacb0..66e53e8 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -3,6 +3,8 @@ import {Need} from '../../models/Need';
 import {CupboardService} from '../../services/cupboard.service';
 import { UsersService } from '../../services/users.service';
 import { userType } from '../../models/User';
+import {AuthService} from '../../services/auth.service';
+import {catchError, of} from 'rxjs';
 
 interface sortAlgo {
   (a: Need,b: Need): number;
@@ -72,7 +74,8 @@ export class NeedListComponent {
 
   constructor(
     private cupboardService: CupboardService,
-    private usersService: UsersService
+    private usersService: UsersService,
+    private authService: AuthService
   ) {}
 
     refresh() {
@@ -148,12 +151,12 @@ export class NeedListComponent {
   }
 
   isManager() {
-    const type = this.usersService.getCurrentUser()?.type;
+    const type = this.authService.getCurrentUser()?.type;
     return type === ("MANAGER" as unknown as userType);
   }
 
   isHelper() {
-    const type = this.usersService.getCurrentUser()?.type;
+    const type = this.authService.getCurrentUser()?.type;
     return type === ("HELPER" as unknown as userType);
   }
 
@@ -165,17 +168,19 @@ export class NeedListComponent {
   }
 
   add(need: Need) {
-    const currentUser = this.usersService.getCurrentUser();
+    const currentUser = this.authService.getCurrentUser();
     //console.log("get current user in angular:", currentUser)
     if (currentUser) {
       if (!currentUser.basket.includes(need.id)) {
         currentUser.basket.push(need.id);
-        this.usersService.updateUser(currentUser).subscribe(() => {
-          this.usersService.refreshBasket();
-          error: (err: any) => {
-            console.error(err);
-          }
-        });
+        this.usersService.updateUser(currentUser)
+            .pipe(catchError((err, _) =>  {
+                console.error(err);
+                return of();
+            }))
+            .subscribe(() => {
+                this.usersService.refreshBasket();
+            });
       } else {
         window.alert("This need is already in your basket!")
       }
-- 
cgit v1.2.3


From 5eba2e924c57a7771c002fa3833beb5ed4275fd2 Mon Sep 17 00:00:00 2001
From: benal01 <bja4245@rit.edu>
Date: Sun, 30 Mar 2025 16:44:38 -0400
Subject: location filter, filter order change, and refresh() resets search
 field for increased usability

---
 .../components/need-list/need-list.component.ts    | 22 ++++++++++++++++++++--
 1 file changed, 20 insertions(+), 2 deletions(-)

(limited to 'ufund-ui/src')

diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index 66e53e8..af8cab4 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -1,4 +1,5 @@
 import {Component , Output, EventEmitter} from '@angular/core';
+import { NgForm } from '@angular/forms';
 import {Need} from '../../models/Need';
 import {CupboardService} from '../../services/cupboard.service';
 import { UsersService } from '../../services/users.service';
@@ -48,6 +49,13 @@ const sortByPriority: sortAlgo = (a: Need, b: Need): number => {
   return 1;
 }
 
+const sortByLocation: sortAlgo = (a: Need, b: Need): number => {
+  if(a.location.toLocaleLowerCase() < b.location.toLocaleLowerCase()) {
+    return -1;
+  }
+  return 1;
+}
+
 @Component({
   selector: 'app-need-list',
   standalone: false,
@@ -64,10 +72,11 @@ export class NeedListComponent {
   sortSelection: string = 'sortByPriority';
 
   SortingAlgoArrays: {func:sortAlgo,name:string, display:string[]}[] = [
+    {func:sortByPriority,name:"sortByPriority", display:["Highest Priority", "Lowest Priority"]},
     {func:sortByName,name:"sortByName", display:["Name (A to Z)", "Name (Z to A)"]},
-    {func:sortByGoal,name:"sortByGoal", display:["Largest Maximum Goal", "Smallest Maximum Goal"]},
+    {func:sortByLocation,name:"sortByLocation", display:["Location (A to Z)", "Location (Z to A)"]},
     {func:sortByCompletion,name:"sortByCompletion", display:["Most Completed", "Least Completed"]},
-    {func:sortByPriority,name:"sortByPriority", display:["Highest Priority", "Lowest Priority"]},
+    {func:sortByGoal,name:"sortByGoal", display:["Largest Maximum Goal", "Smallest Maximum Goal"]},
   ];
 
   @Output() currentNeed = new EventEmitter<Need>();
@@ -87,6 +96,10 @@ export class NeedListComponent {
           }
           this.searchResults = this.needs;
         });
+
+        const form = document.getElementById('search-form') as HTMLFormElement;
+        form.reset(); 
+        this.search(null);
     }
 
   ngOnInit(): void {
@@ -148,6 +161,7 @@ export class NeedListComponent {
     this.cupboardService.deleteNeed(id).subscribe(() => {
       this.needs = this.needs.filter(n => n.id !== id)
     })
+    this.refresh();
   }
 
   isManager() {
@@ -226,3 +240,7 @@ export class NeedListComponent {
       }
   }
 }
+function not(location: string) {
+  throw new Error('Function not implemented.');
+}
+
-- 
cgit v1.2.3