frontend: enable filters in rooms list and update room service to support status and sorting options

This commit is contained in:
juancarmore 2025-12-22 19:29:12 +01:00
parent eb3e11c37c
commit f2c4df0de6
6 changed files with 64 additions and 55 deletions

View File

@ -93,7 +93,7 @@ export class RoomsListsComponent implements OnInit, OnChanges {
// Input properties
@Input() rooms: MeetRoom[] = [];
@Input() showSearchBox = true;
@Input() showFilters = false;
@Input() showFilters = true;
@Input() showSelection = true;
@Input() showLoadMore = false;
@Input() loading = false;
@ -128,9 +128,9 @@ export class RoomsListsComponent implements OnInit, OnChanges {
// Status options
statusOptions = [
{ value: '', label: 'All statuses' },
{ value: 'open', label: 'Open' },
{ value: 'active_meeting', label: 'Active Meeting' },
{ value: 'closed', label: 'Closed' }
{ value: MeetRoomStatus.OPEN, label: 'Open' },
{ value: MeetRoomStatus.ACTIVE_MEETING, label: 'Active Meeting' },
{ value: MeetRoomStatus.CLOSED, label: 'Closed' }
];
constructor() {}
@ -149,11 +149,7 @@ export class RoomsListsComponent implements OnInit, OnChanges {
this.updateSelectionState();
// Show message when no rooms match filters
if (this.rooms.length === 0 && this.hasActiveFilters()) {
this.showEmptyFilterMessage = true;
} else {
this.showEmptyFilterMessage = false;
}
this.showEmptyFilterMessage = this.rooms.length === 0 && this.hasActiveFilters();
}
}

View File

@ -95,13 +95,13 @@ export class RecordingsComponent implements OnInit {
nextPageToken: !refresh ? this.nextPageToken : undefined
};
// Apply room ID filter if provided
// Apply room filter if provided
if (filters?.nameFilter) {
recordingFilters.roomId = filters.nameFilter;
recordingFilters.roomName = filters.nameFilter;
}
// Filter by status on client side if needed
// Apply status filter if provided
if (filters?.statusFilter) {
recordingFilters.status = filters.statusFilter as MeetRecordingStatus;
}

View File

@ -37,7 +37,7 @@
[rooms]="rooms()"
[loading]="isLoading"
[showSearchBox]="true"
[showFilters]="false"
[showFilters]="true"
[showSelection]="true"
[showLoadMore]="hasMoreRooms"
[initialFilters]="initialFilters"

View File

@ -15,9 +15,6 @@ import { MatSortModule } from '@angular/material/sort';
import { MatTableModule } from '@angular/material/table';
import { MatTooltipModule } from '@angular/material/tooltip';
import { RouterModule } from '@angular/router';
import { DeleteRoomDialogComponent, RoomsListsComponent, RoomTableAction } from '../../../components';
import { DeleteRoomDialogOptions } from '../../../models';
import { NavigationService, NotificationService, RoomService } from '../../../services';
import {
MeetRoom,
MeetRoomDeletionErrorCode,
@ -28,28 +25,31 @@ import {
MeetRoomStatus
} from '@openvidu-meet/typings';
import { ILogger, LoggerService } from 'openvidu-components-angular';
import { DeleteRoomDialogComponent, RoomsListsComponent, RoomTableAction } from '../../../components';
import { DeleteRoomDialogOptions } from '../../../models';
import { NavigationService, NotificationService, RoomService } from '../../../services';
@Component({
selector: 'ov-rooms',
imports: [
MatListModule,
MatCardModule,
MatButtonModule,
MatIconModule,
RouterModule,
MatTableModule,
MatMenuModule,
MatTooltipModule,
MatDividerModule,
MatSortModule,
MatPaginatorModule,
MatProgressSpinnerModule,
MatFormFieldModule,
MatInputModule,
RoomsListsComponent
],
templateUrl: './rooms.component.html',
styleUrl: './rooms.component.scss'
selector: 'ov-rooms',
imports: [
MatListModule,
MatCardModule,
MatButtonModule,
MatIconModule,
RouterModule,
MatTableModule,
MatMenuModule,
MatTooltipModule,
MatDividerModule,
MatSortModule,
MatPaginatorModule,
MatProgressSpinnerModule,
MatFormFieldModule,
MatInputModule,
RoomsListsComponent
],
templateUrl: './rooms.component.html',
styleUrl: './rooms.component.scss'
})
export class RoomsComponent implements OnInit {
// @ViewChild(MatSort) sort!: MatSort;
@ -149,17 +149,21 @@ export class RoomsComponent implements OnInit {
roomFilters.roomName = filters.nameFilter;
}
const response = await this.roomService.listRooms(roomFilters);
// Apply status filter if provided
if (filters?.statusFilter) {
roomFilters.status = filters.statusFilter as MeetRoomStatus;
}
// TODO: Filter rooms by status
const response = await this.roomService.listRooms(roomFilters);
const rooms = response.rooms;
if (!refresh) {
// Update rooms list
const currentRooms = this.rooms();
this.rooms.set([...currentRooms, ...response.rooms]);
this.rooms.set([...currentRooms, ...rooms]);
} else {
// Replace rooms list
this.rooms.set(response.rooms);
this.rooms.set(rooms);
}
// TODO: Sort rooms

View File

@ -67,17 +67,26 @@ export class RoomService {
if (filters) {
const queryParams = new URLSearchParams();
if (filters.roomName) {
queryParams.set('roomName', filters.roomName);
}
if (filters.status) {
queryParams.set('status', filters.status);
}
if (filters.fields) {
queryParams.set('fields', filters.fields);
}
if (filters.maxItems) {
queryParams.set('maxItems', filters.maxItems.toString());
}
if (filters.nextPageToken) {
queryParams.set('nextPageToken', filters.nextPageToken);
}
if (filters.roomName) {
queryParams.set('roomName', filters.roomName);
if (filters.sortField) {
queryParams.set('sortField', filters.sortField);
}
if (filters.fields) {
queryParams.set('fields', filters.fields);
if (filters.sortOrder) {
queryParams.set('sortOrder', filters.sortOrder);
}
path += `?${queryParams.toString()}`;

24
pnpm-lock.yaml generated
View File

@ -12960,7 +12960,7 @@ snapshots:
'@npmcli/fs@4.0.0':
dependencies:
semver: 7.7.2
semver: 7.7.3
'@npmcli/git@6.0.3':
dependencies:
@ -12970,7 +12970,7 @@ snapshots:
npm-pick-manifest: 10.0.0
proc-log: 5.0.0
promise-retry: 2.0.1
semver: 7.7.2
semver: 7.7.3
which: 5.0.0
'@npmcli/installed-package-contents@3.0.0':
@ -12987,7 +12987,7 @@ snapshots:
hosted-git-info: 8.1.0
json-parse-even-better-errors: 4.0.0
proc-log: 5.0.0
semver: 7.7.2
semver: 7.7.3
validate-npm-package-license: 3.0.4
'@npmcli/promise-spawn@8.0.3':
@ -14108,7 +14108,7 @@ snapshots:
'@typescript-eslint/project-service@8.46.4(typescript@5.9.2)':
dependencies:
'@typescript-eslint/tsconfig-utils': 8.46.4(typescript@5.9.2)
'@typescript-eslint/types': 8.46.4
'@typescript-eslint/types': 8.50.0
debug: 4.4.3(supports-color@8.1.1)
typescript: 5.9.2
transitivePeerDependencies:
@ -18710,7 +18710,7 @@ snapshots:
make-fetch-happen: 14.0.3
nopt: 8.1.0
proc-log: 5.0.0
semver: 7.7.2
semver: 7.7.3
tar: 7.5.2
tinyglobby: 0.2.15
which: 5.0.0
@ -18754,7 +18754,7 @@ snapshots:
npm-install-checks@7.1.2:
dependencies:
semver: 7.7.2
semver: 7.7.3
npm-normalize-package-bin@4.0.0: {}
@ -18762,7 +18762,7 @@ snapshots:
dependencies:
hosted-git-info: 8.1.0
proc-log: 5.0.0
semver: 7.7.2
semver: 7.7.3
validate-npm-package-name: 6.0.2
npm-package-arg@13.0.0:
@ -18782,7 +18782,7 @@ snapshots:
npm-install-checks: 7.1.2
npm-normalize-package-bin: 4.0.0
npm-package-arg: 12.0.2
semver: 7.7.2
semver: 7.7.3
npm-registry-fetch@18.0.2:
dependencies:
@ -20391,7 +20391,7 @@ snapshots:
jest-worker: 27.5.1
schema-utils: 4.3.3
serialize-javascript: 6.0.2
terser: 5.43.1
terser: 5.44.1
webpack: 5.101.2(esbuild@0.25.9)
optionalDependencies:
esbuild: 0.25.9
@ -20858,7 +20858,7 @@ snapshots:
vite@7.1.11(@types/node@22.18.13)(jiti@1.21.7)(less@4.4.0)(sass@1.90.0)(terser@5.43.1)(tsx@4.20.6):
dependencies:
esbuild: 0.25.9
esbuild: 0.25.12
fdir: 6.5.0(picomatch@4.0.3)
picomatch: 4.0.3
postcss: 8.5.6
@ -20875,7 +20875,7 @@ snapshots:
vite@7.1.11(@types/node@22.18.13)(jiti@1.21.7)(less@4.4.0)(sass@1.90.0)(terser@5.44.1)(tsx@4.20.6):
dependencies:
esbuild: 0.25.9
esbuild: 0.25.12
fdir: 6.5.0(picomatch@4.0.3)
picomatch: 4.0.3
postcss: 8.5.6
@ -20892,7 +20892,7 @@ snapshots:
vite@7.1.11(@types/node@22.18.13)(jiti@1.21.7)(less@4.5.1)(sass@1.90.0)(terser@5.44.1)(tsx@4.20.6):
dependencies:
esbuild: 0.25.9
esbuild: 0.25.12
fdir: 6.5.0(picomatch@4.0.3)
picomatch: 4.0.3
postcss: 8.5.6