adding filters to my-listing (listingnumber), updated/new label

bizmatch/src/app/pages/listings/business-listings/business-listings.component.html

@@ -26,10 +26,20 @@
               <span class="w-fit inline-flex items-center justify-center px-2 py-1 mb-4 text-xs font-bold leading-none bg-gray-200 text-gray-700 rounded-full">
                 {{ selectOptions.getState(listing.location.state) }}
               </span>
-              <p class="text-sm text-gray-600 mb-4">
-                <strong>{{ getDaysListed(listing) }} days listed</strong>
-              </p>
+
+              @if (getListingBadge(listing); as badge) {
+              <span
+                class="mb-4 h-fit inline-flex items-center justify-center px-2 py-1 text-xs font-bold leading-none rounded-full"
+                [ngClass]="{
+                  'bg-emerald-100 text-emerald-800': badge === 'NEW',
+                  'bg-blue-100 text-blue-800': badge === 'UPDATED'
+                }"
+              >
+                {{ badge }}
+              </span>
+              }
             </div>
+
             <p class="text-base font-bold text-gray-800 mb-2">
               <strong>Asking price:</strong> <span class="text-green-600"> {{ listing.price | currency : 'USD' : 'symbol' : '1.0-0' }}</span>
             </p>

bizmatch/src/app/pages/listings/business-listings/business-listings.component.ts

@@ -148,7 +148,16 @@ export class BusinessListingsComponent implements OnInit, OnDestroy {
     if (!listing.location) return 'Location not specified';
     return `${listing.location.name}, ${listing.location.state}`;
   }
+  private isWithinDays(date: Date | string | undefined | null, days: number): boolean {
+    if (!date) return false;
+    return dayjs().diff(dayjs(date), 'day') < days;
+  }
 
+  getListingBadge(listing: BusinessListing): 'NEW' | 'UPDATED' | null {
+    if (this.isWithinDays(listing.created, 14)) return 'NEW'; // Priorität
+    if (this.isWithinDays(listing.updated, 14)) return 'UPDATED';
+    return null;
+  }
   navigateToDetails(listingId: string): void {
     this.router.navigate(['/details-business', listingId]);
   }