fix(meetings): load past and upcoming meetings separately (LFXV2-757)

Fixed recurring meetings incorrectly showing as past by refactoring to
use separate API endpoints for upcoming and past meetings:

- Load upcoming meetings via getMeetingsByProject()
- Load past meetings via getPastMeetingsByProject()
- React to timeFilter changes to call appropriate endpoint
- Hide RSVP button for non-organizers on past meetings
- Removed client-side time filtering (handled by API)

This ensures proper meeting categorization and enables accurate counts
for both upcoming and past meetings.

Generated with [Claude Code](https://claude.ai/code)

Signed-off-by: Asitha de Silva <asithade@gmail.com>

Author: asithade

apps/lfx-one/src/app/modules/meetings/meetings-dashboard/meetings-dashboard.component.html

@@ -45,21 +45,21 @@
         </div>
 
         <div class="flex-1">
-          @if (meetings()) {
+          @if (upcomingMeetings() || pastMeetings()) {
             <lfx-meetings-top-bar
               [(searchQuery)]="searchQuery"
               [(timeFilter)]="timeFilter"
               [(visibilityFilter)]="topBarVisibilityFilter"
               [viewMode]="currentView()"
-              [meetings]="meetings()" />
+              [meetings]="timeFilter() === 'past' ? pastMeetings() : upcomingMeetings()" />
           }
         </div>
       </div>
     </div>
   </div>
 
   <div class="min-h-[400px]">
-    @if (meetingsLoading()) {
+    @if ((timeFilter() === 'upcoming' && meetingsLoading()) || (timeFilter() === 'past' && pastMeetingsLoading())) {
       <div class="p-8">
         <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
           @for (item of [0, 1, 2, 3, 4, 5]; track item) {

apps/lfx-one/src/app/modules/meetings/meetings-dashboard/meetings-dashboard.component.ts

@@ -7,7 +7,7 @@ import { toObservable, toSignal } from '@angular/core/rxjs-interop';
 import { MeetingCardComponent } from '@app/shared/components/meeting-card/meeting-card.component';
 import { ProjectContextService } from '@app/shared/services/project-context.service';
 import { ButtonComponent } from '@components/button/button.component';
-import { Meeting, ProjectContext } from '@lfx-one/shared/interfaces';
+import { Meeting, PastMeeting, ProjectContext } from '@lfx-one/shared/interfaces';
 import { getCurrentOrNextOccurrence } from '@lfx-one/shared/utils';
 import { MeetingService } from '@services/meeting.service';
 import { PersonaService } from '@services/persona.service';
@@ -28,9 +28,11 @@ export class MeetingsDashboardComponent {
   private readonly personaService = inject(PersonaService);
 
   public meetingsLoading: WritableSignal<boolean>;
-  public meetings: Signal<Meeting[]> = signal([]);
+  public pastMeetingsLoading: WritableSignal<boolean>;
+  public upcomingMeetings: Signal<Meeting[]>;
+  public pastMeetings: Signal<PastMeeting[]>;
   public currentView: WritableSignal<'list' | 'calendar'>;
-  public filteredMeetings: Signal<Meeting[]>;
+  public filteredMeetings: Signal<(Meeting | PastMeeting)[]>;
   public refresh$: BehaviorSubject<void>;
   public searchQuery: WritableSignal<string>;
   public timeFilter: WritableSignal<'upcoming' | 'past'>;
@@ -49,14 +51,16 @@ export class MeetingsDashboardComponent {
 
     // Initialize state
     this.meetingsLoading = signal<boolean>(true);
+    this.pastMeetingsLoading = signal<boolean>(true);
     this.refresh$ = new BehaviorSubject<void>(undefined);
     this.currentView = signal<'list' | 'calendar'>('list');
     this.searchQuery = signal<string>('');
     this.timeFilter = signal<'upcoming' | 'past'>('upcoming');
     this.topBarVisibilityFilter = signal<'mine' | 'public'>('mine');
 
     // Initialize data with reactive pattern
-    this.meetings = this.initializeMeetings();
+    this.upcomingMeetings = this.initializeUpcomingMeetings();
+    this.pastMeetings = this.initializePastMeetings();
     this.filteredMeetings = this.initializeFilteredMeetings();
   }
 
@@ -66,10 +70,11 @@ export class MeetingsDashboardComponent {
 
   public refreshMeetings(): void {
     this.meetingsLoading.set(true);
+    this.pastMeetingsLoading.set(true);
     this.refresh$.next();
   }
 
-  private initializeMeetings(): Signal<Meeting[]> {
+  private initializeUpcomingMeetings(): Signal<Meeting[]> {
     // Convert project signal to observable to react to project changes
     const project$ = toObservable(this.project);
 
@@ -86,7 +91,7 @@ export class MeetingsDashboardComponent {
             return of([]);
           }
 
-          return this.meetingService.getMeetings().pipe(
+          return this.meetingService.getMeetingsByProject(project.projectId, 100).pipe(
             map((meetings) => {
               // Sort meetings by current or next occurrence start time (earliest first)
               return meetings.sort((a, b) => {
@@ -107,7 +112,7 @@ export class MeetingsDashboardComponent {
               });
             }),
             catchError((error) => {
-              console.error('Failed to load meetings:', error);
+              console.error('Failed to load upcoming meetings:', error);
               this.meetingsLoading.set(false);
               return of([]);
             }),
@@ -119,11 +124,44 @@ export class MeetingsDashboardComponent {
     );
   }
 
-  private initializeFilteredMeetings(): Signal<Meeting[]> {
+  private initializePastMeetings(): Signal<PastMeeting[]> {
+    // Convert project signal to observable to react to project changes
+    const project$ = toObservable(this.project);
+
+    return toSignal(
+      merge(
+        project$, // Triggers on project context changes
+        this.refresh$ // Triggers on manual refresh
+      ).pipe(
+        tap(() => this.pastMeetingsLoading.set(true)),
+        switchMap(() => {
+          const project = this.project();
+          if (!project?.projectId) {
+            this.pastMeetingsLoading.set(false);
+            return of([]);
+          }
+
+          return this.meetingService.getPastMeetingsByProject(project.projectId, 100).pipe(
+            catchError((error) => {
+              console.error('Failed to load past meetings:', error);
+              this.pastMeetingsLoading.set(false);
+              return of([]);
+            }),
+            tap(() => this.pastMeetingsLoading.set(false))
+          );
+        })
+      ),
+      { initialValue: [] }
+    );
+  }
+
+  private initializeFilteredMeetings(): Signal<(Meeting | PastMeeting)[]> {
     return computed(() => {
-      let filtered = this.meetings();
-      const now = new Date();
+      // Get appropriate meetings based on time filter
+      const timeFilter = this.timeFilter();
+      let filtered: (Meeting | PastMeeting)[] = timeFilter === 'past' ? this.pastMeetings() : this.upcomingMeetings();
 
+      // Apply search filter only - time filtering is handled by API
       const search = this.searchQuery()?.toLowerCase() || '';
       if (search) {
         filtered = filtered.filter(
@@ -135,21 +173,6 @@ export class MeetingsDashboardComponent {
         );
       }
 
-      const timeFilterValue = this.timeFilter();
-      if (timeFilterValue === 'upcoming') {
-        filtered = filtered.filter((meeting) => {
-          const meetingEndTime = new Date(meeting.start_time);
-          meetingEndTime.setMinutes(meetingEndTime.getMinutes() + meeting.duration + 40);
-          return meetingEndTime >= now;
-        });
-      } else {
-        filtered = filtered.filter((meeting) => {
-          const meetingEndTime = new Date(meeting.start_time);
-          meetingEndTime.setMinutes(meetingEndTime.getMinutes() + meeting.duration + 40);
-          return meetingEndTime < now;
-        });
-      }
-
       return filtered;
     });
   }

apps/lfx-one/src/app/shared/components/meeting-card/meeting-card.component.html

@@ -277,8 +277,8 @@ <h3 class="text-base font-medium text-gray-900 leading-tight tracking-tight" dat
             [additionalRegistrantsCount]="additionalRegistrantsCount()"
             (addParticipant)="openAddRegistrantModal()">
           </lfx-meeting-rsvp-details>
-        } @else {
-          <!-- Show RSVP Selection for authenticated non-organizers -->
+        } @else if (!pastMeeting()) {
+          <!-- Show RSVP Selection for authenticated non-organizers (upcoming meetings only) -->
           <lfx-rsvp-button-group [meeting]="meeting()" [occurrenceId]="occurrence()?.occurrence_id"> </lfx-rsvp-button-group>
         }