frontend: enable filters in rooms list and update room service to support status and sorting options
This commit is contained in:
parent
eb3e11c37c
commit
f2c4df0de6
@ -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();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -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;
|
||||
}
|
||||
|
||||
@ -37,7 +37,7 @@
|
||||
[rooms]="rooms()"
|
||||
[loading]="isLoading"
|
||||
[showSearchBox]="true"
|
||||
[showFilters]="false"
|
||||
[showFilters]="true"
|
||||
[showSelection]="true"
|
||||
[showLoadMore]="hasMoreRooms"
|
||||
[initialFilters]="initialFilters"
|
||||
|
||||
@ -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
|
||||
|
||||
@ -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
24
pnpm-lock.yaml
generated
@ -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
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user