localstorage for page (keeps current page on refresh/back arrow)

2 files changed, 13 insertions, 3 deletions

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 ae6bc99..39ff538 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
@@ -68,7 +68,7 @@ export class NeedListComponent {
   searchResults: Need[] = [];
   visibleNeeds: Need[] = [];
   sortMode: 'Ascending' | 'Descending' = 'Ascending'
-  currentPage: number = 0;
+  currentPage: number = localStorage.getItem('currentPage') ? parseInt(localStorage.getItem('currentPage')!) : 0;
   itemsPerPage: number = 5;
   totalPages: number = Math.ceil(this.needs.length / this.itemsPerPage);
 
@@ -76,26 +76,33 @@ export class NeedListComponent {
       return (need.type === GoalType.MONETARY) ? "$" : "";
   }
 
+  //increment/decrement
   decrementPage() {
     this.currentPage--;
+    localStorage.setItem('currentPage', this.currentPage.toString());
     this.updateVisibleNeeds();
   }
 
   incrementPage() {
     this.currentPage++;
+    localStorage.setItem('currentPage', this.currentPage.toString());
     this.updateVisibleNeeds();
   }
 
+  //skipping pages
   lastPage() {
       this.currentPage = this.totalPages - 1
+      localStorage.setItem('currentPage', this.currentPage.toString());
       this.updateVisibleNeeds()
   }
 
   firstPage() {
       this.currentPage = 0
+      localStorage.setItem('currentPage', this.currentPage.toString());
       this.updateVisibleNeeds()
   }
 
+  //user editing needs per page
   editNeedsPerPage() {
     if (this.itemsPerPage > this.searchResults.length) {
       this.itemsPerPage = this.searchResults.length;
@@ -106,13 +113,16 @@ export class NeedListComponent {
     this.resetVisibleNeeds();
   }
 
+  //refresing visible needs
   updateVisibleNeeds() {
     this.totalPages = Math.ceil(this.searchResults.length / this.itemsPerPage);
     this.visibleNeeds = this.searchResults.slice(this.currentPage * this.itemsPerPage, (this.currentPage + 1) * this.itemsPerPage);
   }
 
+  //reset back to first page and refresh needs
   resetVisibleNeeds() {
     this.currentPage = 0;
+    localStorage.setItem('currentPage', this.currentPage.toString());
     this.updateVisibleNeeds();
   }
 
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 f5f78f6..a4937ed 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
@@ -13,9 +13,9 @@
  
     <span><strong>Target Goal:</strong> {{(need.type === GoalType.MONETARY) ? "$" : ""}}{{need.maxGoal}}</span>
 
-        <span><strong>Amount Currently Collected:</strong> {{need.type.toString() == 'MONETARY' ? '$' : ''}}{{need.current}}</span>
+    <span><strong>Amount Currently Collected:</strong> {{need.type.toString() == 'MONETARY' ? '$' : ''}}{{need.current}}</span>
 
-        <span><strong>Location:</strong> {{need.location}}</span>
+    <span><strong>Location:</strong> {{need.location}}</span>
 
     <span><strong>Urgency: </strong>
         <span *ngIf="!need.urgent">Not urgent</span>