Fix: Date and edit dates work in ascending to descending order

MShaw1223 · Nov 28, 2024 · 1e02a8b · 1e02a8b
1 parent f31f43f
commit 1e02a8b
Show file tree

Hide file tree

Showing 3 changed files with 75 additions and 39 deletions.
diff --git a/src/app/card-container/card-container.component.html b/src/app/card-container/card-container.component.html
@@ -7,13 +7,23 @@
   </select>
 
   <input
+    *ngIf="selectedFilter !== 'edit' && selectedFilter !== 'date'"
     [(ngModel)]="searchTerm"
-    [placeholder]="'Search by ' + (selectedFilter || '...')"
+    [placeholder]="'Search by ' + selectedFilter || '...'"
     (input)="applyFilter()"
   />
+  <select
+    name="ascdesc"
+    [(ngModel)]="searchTerm"
+    *ngIf="selectedFilter === 'edit' || selectedFilter === 'date'"
+    (change)="applyFilter()"
+  >
+    <option value="" disabled>Select Order</option>
+    <option value="a">Ascending</option>
+    <option value="d">Descending</option>
+  </select>
   <button (click)="clearFilter()">Clear Filter</button>
 </div>
-
 <div class="card-container">
   <div *ngFor="let repo of filteredRepositories" class="card">
     <h3>{{ repo.name }}</h3>

diff --git a/src/app/card-container/card-container.component.ts b/src/app/card-container/card-container.component.ts
@@ -21,6 +21,7 @@ export class CardContainerComponent {
     { value: 'language', label: 'Language' },
     { value: 'name', label: 'Name' },
     { value: 'date', label: 'Date Created' },
+    { value: 'edit', label: 'Last Edited' },
   ];
   selectedFilter = '';
   searchTerm = '';
@@ -57,41 +58,66 @@ export class CardContainerComponent {
     }
 
     this.filteredRepositories = this.repositories.filter((repo) => {
-      if (this.selectedFilter === 'language') {
-        return (
-          repo.language &&
-          repo.language.toLowerCase().includes(this.searchTerm.toLowerCase())
-        );
-      } else if (this.selectedFilter === 'date') {
-        const createdDate = new Date(repo.created_at);
-        return (
-          createdDate.toISOString().startsWith(this.searchTerm) || // Partial date match
-          createdDate
-            .toDateString()
-            .toLowerCase()
-            .includes(this.searchTerm.toLowerCase())
-        );
-      } else if (this.selectedFilter === 'name') {
-        return (
-          repo.name &&
-          repo.name.toLowerCase().includes(this.searchTerm.toLowerCase())
-        );
-      } else if (this.selectedFilter === 'all') {
-        return (
-          (repo.name &&
-            repo.name.toLowerCase().includes(this.searchTerm.toLowerCase())) ||
-          (repo.language &&
-            repo.language
-              .toLowerCase()
-              .includes(this.searchTerm.toLowerCase())) ||
-          (repo.description &&
-            repo.description
-              .toLowerCase()
-              .includes(this.searchTerm.toLowerCase()))
-        );
+      switch (this.selectedFilter) {
+        case 'language':
+          return (
+            repo.language &&
+            repo.language.toLowerCase().includes(this.searchTerm.toLowerCase())
+          );
+        case 'name':
+          return (
+            repo.name &&
+            repo.name.toLowerCase().includes(this.searchTerm.toLowerCase())
+          );
+        case 'all':
+          return (
+            (repo.name &&
+              repo.name
+                .toLowerCase()
+                .includes(this.searchTerm.toLowerCase())) ||
+            (repo.language &&
+              repo.language
+                .toLowerCase()
+                .includes(this.searchTerm.toLowerCase())) ||
+            (repo.description &&
+              repo.description
+                .toLowerCase()
+                .includes(this.searchTerm.toLowerCase()))
+          );
+        default:
+          return false;
       }
-      return false;
     });
+
+    if (this.selectedFilter === 'edit') {
+      this.filteredRepositories = [...this.repositories];
+
+      this.filteredRepositories.sort((a, b) => {
+        const dateA = new Date(a.pushed_at).getTime();
+        const dateB = new Date(b.pushed_at).getTime();
+        if (this.searchTerm.toLowerCase() === 'a') {
+          return dateA - dateB;
+        } else if (this.searchTerm.toLowerCase() === 'd') {
+          return dateB - dateA;
+        } else {
+          return 0;
+        }
+      });
+    }
+    if (this.selectedFilter === 'date') {
+      this.filteredRepositories = [...this.repositories];
+      this.filteredRepositories.sort((a, b) => {
+        const bDate = new Date(b.created_at).getTime();
+        const aDate = new Date(a.created_at).getTime();
+        if (this.searchTerm.toLowerCase() === 'a') {
+          return aDate - bDate;
+        } else if (this.searchTerm.toLowerCase() === 'd') {
+          return bDate - aDate;
+        } else {
+          return 0;
+        }
+      });
+    }
   }
   clearFilter(): void {
     this.selectedFilter = '';

diff --git a/src/app/services/github.service.ts b/src/app/services/github.service.ts
@@ -2,16 +2,16 @@ import { HttpClient, HttpHeaders } from '@angular/common/http';
 import { Injectable } from '@angular/core';
 import { Observable } from 'rxjs';
 import { Repository } from '../card-container/repositories.model';
-import { environment } from '../../environment/environment';
-// import { dev_environment } from '../../environment/environment.dev';
+// import { environment } from '../../environment/environment';
+import { dev_environment } from '../../environment/environment.dev';
 
 @Injectable({
   providedIn: 'root',
 })
 export class GithubService {
   private apiUrl = 'https://api.github.com';
-  private token = environment.GH_TOKEN;
-  // private token = dev_environment.GH_TOKEN;
+  // private token = environment.GH_TOKEN;
+  private token = dev_environment.GH_TOKEN;
 
   constructor(private http: HttpClient) {}