From 8ac5e2d46f38b8a7809c1c7c09d50e65cf962b0d Mon Sep 17 00:00:00 2001
From: juancarmore <juancar_more2@hotmail.com>
Date: Wed, 6 Aug 2025 13:34:20 +0200
Subject: [PATCH] frontend: update recording components to display roomName
 instead of roomId

---
 .../recording-lists/recording-lists.component.html    |  2 +-
 .../room-recordings/room-recordings.component.ts      | 11 ++++++++---
 .../view-recording/view-recording.component.html      |  2 +-
 3 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/frontend/projects/shared-meet-components/src/lib/components/recording-lists/recording-lists.component.html b/frontend/projects/shared-meet-components/src/lib/components/recording-lists/recording-lists.component.html
index 796221a..90be189 100644
--- a/frontend/projects/shared-meet-components/src/lib/components/recording-lists/recording-lists.component.html
+++ b/frontend/projects/shared-meet-components/src/lib/components/recording-lists/recording-lists.component.html
@@ -115,7 +115,7 @@
 					<th mat-header-cell *matHeaderCellDef class="room-header">Room</th>
 					<td mat-cell *matCellDef="let recording" class="room-cell">
 						<div class="room-info">
-							<!-- <span class="room-name">{{ recording.roomName }}</span> -->
+							<span class="room-name">{{ recording.roomName }}</span>
 							<span class="room-id">{{ recording.roomId }}</span>
 							<!-- @if (recording.filename) {
 								<span class="filename">{{ recording.filename }}</span>
diff --git a/frontend/projects/shared-meet-components/src/lib/pages/room-recordings/room-recordings.component.ts b/frontend/projects/shared-meet-components/src/lib/pages/room-recordings/room-recordings.component.ts
index 04649eb..2ea344d 100644
--- a/frontend/projects/shared-meet-components/src/lib/pages/room-recordings/room-recordings.component.ts
+++ b/frontend/projects/shared-meet-components/src/lib/pages/room-recordings/room-recordings.component.ts
@@ -44,11 +44,16 @@ export class RoomRecordingsComponent implements OnInit {
 
 	async ngOnInit() {
 		this.roomId = this.route.snapshot.paramMap.get('room-id')!;
-		const parts = this.roomId.split('-');
-		this.roomName = parts.slice(0, -1).join('-');
-
 		this.canDeleteRecordings = this.recordingService.canDeleteRecordings();
 		await this.loadRecordings();
+
+		// Set room name based on recordings or roomId
+		if (this.recordings()) {
+			this.roomName = this.recordings()[0].roomName;
+		} else {
+			const parts = this.roomId.split('-');
+			this.roomName = parts.slice(0, -1).join('-');
+		}
 	}
 
 	async goBackToRoom() {
diff --git a/frontend/projects/shared-meet-components/src/lib/pages/view-recording/view-recording.component.html b/frontend/projects/shared-meet-components/src/lib/pages/view-recording/view-recording.component.html
index a779971..0daf794 100644
--- a/frontend/projects/shared-meet-components/src/lib/pages/view-recording/view-recording.component.html
+++ b/frontend/projects/shared-meet-components/src/lib/pages/view-recording/view-recording.component.html
@@ -45,7 +45,7 @@
 					</div>
 					<div class="header-info">
 						<div class="recording-info">
-							<h1 class="recording-title">{{ recording.roomId }}</h1>
+							<h1 class="recording-title">{{ recording.roomName }}</h1>
 							<div class="recording-metadata">
 								<span class="recording-date">
 									<mat-icon class="ov-action-icon">schedule</mat-icon>