diff --git a/frontend/projects/shared-meet-components/src/lib/pages/console/rooms/room-basic-creation/room-basic-creation.component.html b/frontend/projects/shared-meet-components/src/lib/pages/console/rooms/room-basic-creation/room-basic-creation.component.html index b2ae9a5..35dbe9c 100644 --- a/frontend/projects/shared-meet-components/src/lib/pages/console/rooms/room-basic-creation/room-basic-creation.component.html +++ b/frontend/projects/shared-meet-components/src/lib/pages/console/rooms/room-basic-creation/room-basic-creation.component.html @@ -12,14 +12,14 @@
-
+ Room Name label Enter a custom room name, or leave blank to use the default name "Room". - @if (roomCreationForm.get('roomName')?.hasError('maxlength')) { + @if (roomDetailsForm.get('roomName')?.hasError('maxlength')) { Room name cannot exceed 50 characters } diff --git a/frontend/projects/shared-meet-components/src/lib/pages/console/rooms/room-basic-creation/room-basic-creation.component.ts b/frontend/projects/shared-meet-components/src/lib/pages/console/rooms/room-basic-creation/room-basic-creation.component.ts index b1cd4a7..2dfe50a 100644 --- a/frontend/projects/shared-meet-components/src/lib/pages/console/rooms/room-basic-creation/room-basic-creation.component.ts +++ b/frontend/projects/shared-meet-components/src/lib/pages/console/rooms/room-basic-creation/room-basic-creation.component.ts @@ -1,10 +1,12 @@ -import { Component, EventEmitter, OnDestroy, Output } from '@angular/core'; +import { Component, effect, EventEmitter, OnDestroy, Output } from '@angular/core'; import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms'; import { MatButtonModule } from '@angular/material/button'; import { MatFormFieldModule } from '@angular/material/form-field'; import { MatIconModule } from '@angular/material/icon'; import { MatInputModule } from '@angular/material/input'; import { MatTooltipModule } from '@angular/material/tooltip'; +import { RoomWizardStateService } from '@lib/services'; +import { MeetRoomOptions } from '@lib/typings/ce'; import { Subject, takeUntil } from 'rxjs'; @Component({ @@ -25,15 +27,22 @@ export class RoomBasicCreationComponent implements OnDestroy { @Output() createRoom = new EventEmitter(); @Output() openAdvancedMode = new EventEmitter(); - roomCreationForm = new FormGroup({ + roomDetailsForm = new FormGroup({ roomName: new FormControl('Room', [Validators.maxLength(50)]) }); private destroy$ = new Subject(); - constructor() { - this.roomCreationForm.valueChanges.pipe(takeUntil(this.destroy$)).subscribe((value) => { - // Optional: Save form data to local storage or service if needed + constructor(private wizardService: RoomWizardStateService) { + effect(() => { + const steps = this.wizardService.steps(); + if (steps.length !== 0) { + this.roomDetailsForm = steps[0].formGroup; + + this.roomDetailsForm.valueChanges.pipe(takeUntil(this.destroy$)).subscribe((value) => { + this.saveFormData(value); + }); + } }); } @@ -42,9 +51,16 @@ export class RoomBasicCreationComponent implements OnDestroy { this.destroy$.complete(); } + private saveFormData(formValue: any) { + const stepData: Partial = { + roomName: formValue.roomName + }; + this.wizardService.updateStepData('roomDetails', stepData); + } + onCreateRoom() { - if (this.roomCreationForm.valid) { - const formValue = this.roomCreationForm.value; + if (this.roomDetailsForm.valid) { + const formValue = this.roomDetailsForm.value; this.createRoom.emit(formValue.roomName || undefined); } } @@ -54,6 +70,6 @@ export class RoomBasicCreationComponent implements OnDestroy { } get isFormValid(): boolean { - return this.roomCreationForm.valid && !this.roomCreationForm.pending; + return this.roomDetailsForm.valid && !this.roomDetailsForm.pending; } } diff --git a/frontend/projects/shared-meet-components/src/lib/pages/console/rooms/room-wizard/room-wizard.component.ts b/frontend/projects/shared-meet-components/src/lib/pages/console/rooms/room-wizard/room-wizard.component.ts index 187d788..05fbf32 100644 --- a/frontend/projects/shared-meet-components/src/lib/pages/console/rooms/room-wizard/room-wizard.component.ts +++ b/frontend/projects/shared-meet-components/src/lib/pages/console/rooms/room-wizard/room-wizard.component.ts @@ -9,12 +9,12 @@ import { StepIndicatorComponent, WizardNavComponent } from '@lib/components'; import { WizardNavigationConfig, WizardStep } from '@lib/models'; import { NavigationService, NotificationService, RoomService, RoomWizardStateService } from '@lib/services'; import { MeetRoomOptions } from '@lib/typings/ce'; -import { RoomWizardRoomDetailsComponent } from './steps/room-details/room-details.component'; +import { RoomBasicCreationComponent } from '../room-basic-creation/room-basic-creation.component'; import { RecordingLayoutComponent } from './steps/recording-layout/recording-layout.component'; import { RecordingPreferencesComponent } from './steps/recording-preferences/recording-preferences.component'; import { RecordingTriggerComponent } from './steps/recording-trigger/recording-trigger.component'; +import { RoomWizardRoomDetailsComponent } from './steps/room-details/room-details.component'; import { RoomPreferencesComponent } from './steps/room-preferences/room-preferences.component'; -import { RoomBasicCreationComponent } from '../room-basic-creation/room-basic-creation.component'; @Component({ selector: 'ov-room-wizard',