Get everything working enough to go in main

11 files changed, 66 insertions, 27 deletions

diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.css b/ufund-ui/src/app/components/cupboard/cupboard.component.css
index 4116a77..e45d929 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.css
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.css
@@ -30,13 +30,25 @@
 }
 
 #create-form, #delete-form, #update-form {
-   background-color: #d9d9d9;
+   background-color: #3a3a3a;
    padding: 10px 20px 20px 20px;
    border: 2px solid #000;
    border-radius: 5px;
    visibility: visible;
+    /*position: absolute;*/
 }
 
-#create-button {
-   padding: 10px 20px;
+#header {
+    display: flex;
+    gap: 20px;
+    align-items: center;
+
+    h1 {
+        display: inline;
+        width: min-content;
+    }
+
+    button {
+        margin-top: 3px;
+    }
 }
diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.html b/ufund-ui/src/app/components/cupboard/cupboard.component.html
index 2cfbe2d..37954bb 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.html
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.html
@@ -1,14 +1,14 @@
 <div id="box">
-    <h1> Cupboard </h1>
+    <div id="header">
+        <h1> Cupboard </h1>
+        <button *ngIf="isManager()" class="button2" (click)="this.selectForm('create')"><span class="icon">add</span>Create Need</button>
+    </div>
     <app-need-list (currentNeed) = populateForm($event) #needList></app-need-list>
 </div>
-<div *ngIf="isManager()" >
-    <h2 > Admin View </h2>
-    <div id="menu">
-        <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>
-    <app-need-edit [selectedNeed]="selectedNeed" (refreshNeedList)="needList.refresh()"></app-need-edit>
+<ng-template [ngIf]="isManager()" >
+<div>
+    <app-need-edit *ngIf="selectedForm === 'update'" [selectedNeed]="selectedNeed" (refreshNeedList)="needList.refresh()"></app-need-edit>
+    <div>
     <div id="create-form" *ngIf="selectedForm === 'create'">
         <h1> Create Need </h1>
         <form #cupboardForm="ngForm" (ngSubmit)="submit(cupboardForm.value)">
@@ -27,12 +27,12 @@
             <label>Physical</label><br>
             <input type="checkbox" name="urgent" value="false" ngModel>
             <label>Urgent</label><br>
-            <label>Description</label>
-            <textarea name="description" [(ngModel)]="selectedNeed.description"></textarea><br>
+            <label>Description</label><br>
+            <textarea name="description"></textarea><br>
             <input type="submit" value="Submit">
 
         </form>
     </div>
-    <hr>
-
+    </div>
 </div>
+</ng-template>
diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.ts b/ufund-ui/src/app/components/cupboard/cupboard.component.ts
index e70d98f..2230cd3 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 {ToastsService, ToastType} from '../../services/toasts.service';
 
 export class CupboardComponent implements OnInit {
 
-    selectedForm = "create";
+    selectedForm?: string = undefined;
     needs: any;
     @ViewChild("needList") needList?: NeedListComponent
 
diff --git a/ufund-ui/src/app/components/dashboard/dashboard.component.html b/ufund-ui/src/app/components/dashboard/dashboard.component.html
index 330d1f3..6a95ecd 100644
--- a/ufund-ui/src/app/components/dashboard/dashboard.component.html
+++ b/ufund-ui/src/app/components/dashboard/dashboard.component.html
@@ -2,4 +2,4 @@
 <h1>Your Dashboard</h1>
 <app-mini-need-list [needList]="topNeeds" jtitle="Top needs" url="/cupboard"/>
 <app-mini-need-list [needList]="almostThere" jtitle="Almost there" url="/cupboard"/>
-<app-mini-need-list [needList]="inBasket" jtitle="In your basket" url="/cupboard"/>
+<app-mini-need-list [needList]="inBasket" jtitle="In your basket" url="/basket"/>
diff --git a/ufund-ui/src/app/components/dashboard/dashboard.component.ts b/ufund-ui/src/app/components/dashboard/dashboard.component.ts
index 645893f..c94b5c6 100644
--- a/ufund-ui/src/app/components/dashboard/dashboard.component.ts
+++ b/ufund-ui/src/app/components/dashboard/dashboard.component.ts
@@ -4,6 +4,7 @@ import {Router} from '@angular/router';
 import {Need} from '../../models/Need';
 import {CupboardService} from '../../services/cupboard.service';
 import {firstValueFrom} from 'rxjs';
+import {UsersService} from '../../services/users.service';
 
 @Component({
     selector: 'app-dashboard',
@@ -20,7 +21,8 @@ export class DashboardComponent implements OnInit{
     constructor(
         protected authService: AuthService,
         protected router: Router,
-        protected cupboardService: CupboardService
+        protected cupboardService: CupboardService,
+        protected userService: UsersService
     ) {}
 
     ngOnInit() {
@@ -33,7 +35,10 @@ export class DashboardComponent implements OnInit{
         firstValueFrom(this.cupboardService.getNeeds()).then(r => {
             this.topNeeds = r.sort((a, b) => b.current - a.current)
             this.almostThere = r.sort((a, b) => a.current/a.maxGoal - b.current/b.maxGoal)
-            this.inBasket = r.filter(n => n.id in user!.basket)
+        })
+
+        this.userService.getBasket().subscribe(r => {
+            this.inBasket = r;
         })
     }
 
diff --git a/ufund-ui/src/app/components/funding-basket/funding-basket.component.css b/ufund-ui/src/app/components/funding-basket/funding-basket.component.css
index dff6e06..c46ef57 100644
--- a/ufund-ui/src/app/components/funding-basket/funding-basket.component.css
+++ b/ufund-ui/src/app/components/funding-basket/funding-basket.component.css
@@ -20,7 +20,7 @@
 #needList {
     display: flex;
     flex-direction: column;
-    gap: 10px;
+    gap: 15px;
     max-width: 1000px;
 }
 
diff --git a/ufund-ui/src/app/components/need-edit/need-edit.component.css b/ufund-ui/src/app/components/need-edit/need-edit.component.css
index e69de29..17605c2 100644
--- a/ufund-ui/src/app/components/need-edit/need-edit.component.css
+++ b/ufund-ui/src/app/components/need-edit/need-edit.component.css
@@ -0,0 +1,21 @@
+:host {
+    /*position: absolute;*/
+    /*background-color: rgba(0, 0, 0, 0.5);*/
+    /*display: flex;*/
+    /*height: 100%;*/
+    /*top: 0;*/
+    /*left: 0;*/
+    /*right: 0;*/
+    /*z-index: 5;*/
+    /*justify-content: center;*/
+}
+
+#create-form, #delete-form, #update-form {
+    margin-top: 50px;
+    background-color: #3a3a3a;
+    padding: 10px 20px 20px 20px;
+    border: 2px solid #000;
+    border-radius: 5px;
+    /*visibility: visible;*/
+    /*position: absolute;*/
+}
diff --git a/ufund-ui/src/app/components/need-edit/need-edit.component.html b/ufund-ui/src/app/components/need-edit/need-edit.component.html
index bcb166b..e776415 100644
--- a/ufund-ui/src/app/components/need-edit/need-edit.component.html
+++ b/ufund-ui/src/app/components/need-edit/need-edit.component.html
@@ -1,9 +1,11 @@
 <div id="update-form">
     <h1> Update Need </h1>
-    <label>Needs:</label><br>
     <form #updateForm="ngForm" (ngSubmit)="update(updateForm.value)">
+        <label>Name:</label><br>
         <input type="text" name="name" [(ngModel)]="selectedNeed.name"><br>
+        <label>Image:</label><br>
         <input type="text" name="image" [(ngModel)]="selectedNeed.image"><br>
+        <label>Location:</label><br>
         <input type="text" name="location" [(ngModel)]="selectedNeed.location"><br>
         <label>Max Goal:</label><br>
         <input type="number" name="maxGoal" [(ngModel)]="selectedNeed.maxGoal"><br>
@@ -19,4 +21,4 @@
         <input type="submit" value="Submit">
 
     </form>
-</div>
\ No newline at end of file
+</div>
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 041b4ce..5f2e5e1 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
@@ -14,7 +14,7 @@
 #needList {
     display: flex;
     flex-direction: column;
-    gap: 10px
+    gap: 15px
 }
 
 select {
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 8ea88b1..c0501ba 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
@@ -25,7 +25,6 @@
 <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>
-
 <div id="needList">
     <div *ngFor="let need of visibleNeeds" class="needEntry">
         <div [routerLink]="'/need/' + need.id" class="clickable">
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 e8d292e..958dfa6 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
@@ -35,9 +35,9 @@
         <button *ngIf="isHelper()" (click)="add(need!)">
             <span class="icon">add</span>Add To Basket
         </button>
-        <button *ngIf="isManager()" (click)="edit(need!)">
-            <span class="icon">edit</span>Edit Need
-        </button>
+<!--        <button *ngIf="isManager()" (click)="edit(need!)">-->
+<!--            <span class="icon">edit</span>Edit Need-->
+<!--        </button>-->
         <button *ngIf="isManager()" (click)="delete(need!.id)" >
             <span class="icon">delete</span>Delete Need
         </button>