3 files changed, 16 insertions, 4 deletions
diff --git a/ufund-ui/src/app/components/dashboard/dashboard.component.css b/ufund-ui/src/app/components/dashboard/dashboard.component.css
index 54f362b..cb4ad74 100644
--- a/ufund-ui/src/app/components/dashboard/dashboard.component.css
+++ b/ufund-ui/src/app/components/dashboard/dashboard.component.css
@@ -17,7 +17,7 @@
 }
 
 .card {
-    background-color: #2e2e2e;
+    background-color: var(--tertiary-color);
     width: 400px;
     height: 130px;
     border-radius: 5px;
@@ -34,7 +34,7 @@
 .listCard {
     display: flex;
     flex-direction: column;
-    background-color: #2e2e2e;
+    background-color: var(--tertiary-color);
     border-radius: 5px;
     padding: 10px;
     gap: 10px;
diff --git a/ufund-ui/src/app/components/dashboard/dashboard.component.html b/ufund-ui/src/app/components/dashboard/dashboard.component.html
index 233096a..20e1676 100644
--- a/ufund-ui/src/app/components/dashboard/dashboard.component.html
+++ b/ufund-ui/src/app/components/dashboard/dashboard.component.html
@@ -21,6 +21,12 @@
             <span>Most fulfilled needs</span>
             <app-mini-need-list [needList]="mostFulfilledNeeds.getValue()" label="Most fulfilled"> </app-mini-need-list>
         </div>
+        <div class="listCard">
+            <span>Total physical contributions</span>
+            <ul>
+                <li id="physicalContent" *ngFor="let need of physicalTotal">{{need}} </li>
+            </ul>
+        </div>
 
     } @else {
         <h1>Unauthorized</h1>
diff --git a/ufund-ui/src/app/components/dashboard/dashboard.component.ts b/ufund-ui/src/app/components/dashboard/dashboard.component.ts
index 2ab4db2..b73be44 100644
--- a/ufund-ui/src/app/components/dashboard/dashboard.component.ts
+++ b/ufund-ui/src/app/components/dashboard/dashboard.component.ts
@@ -16,10 +16,11 @@ import {userType} from '../../models/User';
 export class DashboardComponent implements OnInit{
 
     protected count = new BehaviorSubject<number | undefined>(undefined)
-    protected totalDonations = new BehaviorSubject<number | undefined>(undefined)
+    protected totalDonations = new BehaviorSubject<String | undefined>(undefined)
     protected totalNeeds = new BehaviorSubject<number | undefined>(undefined)
     protected fulfilledNeeds = new BehaviorSubject<Need[] | undefined>(undefined)
     protected mostFulfilledNeeds = new BehaviorSubject<Need[] | undefined>(undefined)
+    protected physicalTotal: string[] = []
 
     constructor(
         protected authService: AuthService,
@@ -30,15 +31,20 @@ export class DashboardComponent implements OnInit{
 
     ngOnInit() {
         this.userService.getCount().subscribe(count => this.count.next(count))
+        this.physicalTotal = []
         this.cupboardService.getNeeds().subscribe(needs => {
             let totalValue = 0
             for (let need of needs) {
                 if (need.type === GoalType.MONETARY) {
                     totalValue += need.current
-                    this.totalDonations.next(totalValue)
+                    this.totalDonations.next(totalValue.toLocaleString())
+                } else {
+                    this.physicalTotal.push(need.name + ": " + need.current)
                 }
 
             }
+
+            this.physicalTotal.sort((a, b) => a < b ? -1 : 1);
             this.fulfilledNeeds.next(needs.filter(a => ((a.current / a.maxGoal)) >= 1))
             needs.sort((a, b) => b.current/b.maxGoal - a.current/a.maxGoal)