@rtsee/ngx 0.0.55 → 0.0.57

package/projects/ngx/src/lib/components/rtsee-auth/auth/auth.component.ts

@@ -0,0 +1,22 @@
+import { Component } from '@angular/core';
+import {SignInComponent} from "../sign-in/sign-in.component";
+import {SignUpComponent} from "../sign-up/sign-up.component";
+import {ForgotPasswordComponent} from "../forgot-password/forgot-password.component";
+import {ResetPasswordComponent} from "../reset-password/reset-password.component";
+import {NgIf} from "@angular/common";
+
+@Component({
+  selector: 'rtsee-auth',
+  templateUrl: './auth.component.html',
+  imports: [
+    SignInComponent,
+    SignUpComponent,
+    ForgotPasswordComponent,
+    ResetPasswordComponent,
+    NgIf
+  ],
+  standalone: true
+})
+export class AuthComponent {
+  activeComponent: 'reset-password' | 'sign-up' | 'sign-in' | 'forgot-password' = 'sign-in' ;
+}

package/projects/ngx/src/lib/components/rtsee-auth/forgot-password/forgot-password.component.html

@@ -0,0 +1,35 @@
+<div class="auth-container">
+  <img ngSrc="/assets/img.png"
+       alt="Company Logo"
+       class="auth-logo"
+       height="38"
+       width="37"
+  />
+  <h2 class="auth-title">Відновлення паролю</h2>
+  <p class="auth-title-description"
+  >Введіть вашу електронну пошту, щоб отримати інструкції з відновлення паролю</p>
+
+  <form class="auth-form"
+        [formGroup]="emailForm"
+        (ngSubmit)="submitEmail()">
+    <!-- Email Field -->
+    <label for="forgot-password-email" class="auth-sm-medium">Електронна пошта</label>
+    <input
+      [formControlName]="forgotPasswordFormKeys.email"
+      type="email"
+      id="forgot-password-email"
+      placeholder="Введіть електронну пошту"
+      class="auth-input-container email-input"
+    />
+
+    <!-- Submit Button -->
+    <button type="submit" class="auth-btn-container" [disabled]="isLoading">
+      <span> {{isLoading ? 'Завантаження...' : 'Відправити'}}</span>
+    </button>
+  </form>
+
+  <!-- Redirect to Sign-In -->
+  <p class="auth-media-blue-gray-sm-normal">
+    Пам'ятаєте пароль? <a [routerLink]="['/', 'sign-in']" class="auth-deep-blue-sm-medium">Увійдіть</a>
+  </p>
+</div>

package/projects/ngx/src/lib/components/rtsee-auth/forgot-password/forgot-password.component.ts

@@ -0,0 +1,35 @@
+import { Component } from '@angular/core';
+import {FormBuilder, FormGroup, ReactiveFormsModule, Validators} from '@angular/forms';
+import { UtilsService } from '../services/utils.service';
+import { ForgotPasswordForm, TypedReactiveForm } from '../types/auth-form.type';
+import {RouterLink} from "@angular/router";
+
+@Component({
+  selector: 'rtsee-forgot-password',
+  templateUrl: './forgot-password.component.html',
+  imports: [
+    ReactiveFormsModule,
+    RouterLink
+  ],
+  standalone: true
+})
+export class ForgotPasswordComponent {
+  public isLoading: boolean = false;
+  public readonly emailForm: FormGroup<TypedReactiveForm<ForgotPasswordForm>>;
+  public readonly forgotPasswordFormKeys: Record<keyof ForgotPasswordForm, string>;
+  constructor(
+    private readonly formBuilder: FormBuilder
+  ) {
+  this.emailForm= this.formBuilder.group<TypedReactiveForm<ForgotPasswordForm>>({
+      email: this.formBuilder.control(null, { validators: [Validators.required, Validators.email] }),
+    });
+  this.forgotPasswordFormKeys = UtilsService.getKeysAsValueObject(this.emailForm.getRawValue());
+
+  }
+
+  public submitEmail(): void {
+    if (this.emailForm.valid) {
+    }
+  }
+}
+

package/projects/ngx/src/lib/components/rtsee-auth/reset-password/reset-password.component.html

@@ -0,0 +1,43 @@
+<div class="auth-container">
+  <img src="assets/img.png" alt="Company Logo" class="logo" height="38" width="37" />
+  <h2 class="auth-title">Відновлення Пароля</h2>
+  <p class="auth-title-description">
+    Будь ласка, введіть новий пароль для вашого акаунту.
+  </p>
+
+  <form class="auth-form"
+        [formGroup]="resetPasswordForm"
+        (ngSubmit)="resetPassword()"
+  >
+    <!-- New Password Field -->
+    <label for="new-password"
+           class="auth-sm-medium"
+    >Новий пароль</label>
+    <input [formControlName]="passwordFormKeys.password"
+           type="password" id="new-password"
+           placeholder="Введіть новий пароль"
+           class="auth-input-container password-input"
+    />
+
+    <!-- Confirm Password Field -->
+    <label for="confirm-password"
+           class="auth-sm-medium"
+    >Підтвердження пароля</label>
+    <input [formControlName]="passwordFormKeys.passwordConfirm"
+           type="password" id="confirm-password"
+           placeholder="Підтвердіть пароль"
+           class="auth-input-container password-input"
+    />
+
+    <!-- Reset Password Button -->
+    <button type="submit"
+            class="auth-btn-container"
+    >Відновити Пароль</button>
+  </form>
+
+  <!-- Redirect to Login -->
+  <p class="auth-media-blue-gray-sm-normal">
+    <span>Згадали пароль?</span>
+    <a href="#" class="auth-deep-blue-sm-medium">Увійдіть</a>
+  </p>
+</div>

package/projects/ngx/src/lib/components/rtsee-auth/reset-password/reset-password.component.ts

@@ -0,0 +1,79 @@
+import { Component, OnInit } from '@angular/core';
+import {FormBuilder, FormGroup, ReactiveFormsModule, ValidatorFn, Validators} from '@angular/forms';
+import { ResetPasswordForm, TypedReactiveForm } from '../types/auth-form.type';
+import { UtilsService } from '../services/utils.service';
+import { ActivatedRoute, Router } from '@angular/router';
+import { FormErrorKey } from '../../enums/form.enum';
+import { COMMON_CONSTANTS } from '../../constans/common.const';
+
+@Component({
+  selector: 'rtsee-reset-password',
+  templateUrl: './reset-password.component.html',
+  imports: [
+    ReactiveFormsModule
+  ],
+  standalone: true
+})
+export class ResetPasswordComponent implements OnInit {
+  public isLoading: boolean = false;
+  public resetPasswordForm: FormGroup<TypedReactiveForm<ResetPasswordForm>>;
+  public passwordFormKeys: Record<keyof ResetPasswordForm, string>;
+  public hidePassword: Record<keyof ResetPasswordForm, boolean> = {
+    password: true,
+    passwordConfirm: true
+  };
+  private token!: string;
+
+  constructor(
+    private formBuilder: FormBuilder,
+    private route: ActivatedRoute,
+    private router: Router
+  ) {
+    this.resetPasswordForm = this.formBuilder.group({
+      password: this.formBuilder.control('', {validators: [Validators.required, Validators.minLength(COMMON_CONSTANTS.minPasswordLength)], nonNullable: true}),
+      passwordConfirm: this.formBuilder.control('', {validators: [Validators.required, Validators.minLength(COMMON_CONSTANTS.minPasswordLength)], nonNullable: true}),
+    }, {validators: [this.passwordMatchValidator()]});
+    this.passwordFormKeys = UtilsService.getKeysAsValueObject(this.resetPasswordForm.value);
+  }
+
+  public ngOnInit(): void {
+    this.token = this.route.snapshot.params['token'];
+  }
+
+  public resetPassword(): void {
+    if (this.resetPasswordForm.valid) {
+      // this.isLoading = true;
+      // this.accountService.resetPassword({passwords: this.resetPasswordForm.getRawValue(), token: this.token})
+      //   .subscribe((success) => {
+      //     this.isLoading = false;
+      //     if (success) {
+      //       this.router.navigate(['/', 'sign-in']);
+      //     }
+      //   })
+    }
+  }
+
+  private passwordMatchValidator(): ValidatorFn {
+    // @ts-ignore
+    return (form: FormGroup<TypedReactiveForm<ResetPasswordForm>>): ValidationErrors | null => {
+      const password = form.value.password;
+      const passwordConfirm = form.value.passwordConfirm;
+      if (password !== passwordConfirm) {
+        if (form.controls.password.valid) {
+          form.controls.password.setErrors({[FormErrorKey.passwordsMismatch]: true});
+        }
+        if (form.controls.passwordConfirm.valid) {
+          form.controls.passwordConfirm.setErrors({[FormErrorKey.passwordsMismatch]: true});
+        }
+        return {[FormErrorKey.passwordsMismatch]: true};
+      }
+      if (form.controls.password.hasError(FormErrorKey.passwordsMismatch)) {
+        form.controls.password.setErrors(null);
+      }
+      if (form.controls.passwordConfirm.hasError(FormErrorKey.passwordsMismatch)) {
+        form.controls.passwordConfirm.setErrors(null);
+      }
+      return null;
+    }
+  }
+}

package/projects/ngx/src/lib/components/rtsee-auth/services/utils.service.ts

@@ -0,0 +1,20 @@
+import { Injectable } from '@angular/core';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class UtilsService {
+
+  constructor() {
+  }
+
+  public static getKeysAsValueObject<T extends object>(obj: T): Record<string, string> { // object was {}
+    if (obj) {
+      return Object.keys(obj).reduce<Record<string, string>>((result, value) => {
+        result[value] = value;
+        return result;
+      }, {});
+    }
+    return {};
+  }
+}

package/projects/ngx/src/lib/components/rtsee-auth/sign-in/sign-in.component.html

@@ -0,0 +1,46 @@
+<div class="auth-container">
+  <img ngSrc="/assets/img.png"
+       alt="Company Logo"
+       class="auth-logo"
+       height="38"
+       width="37"
+  />
+  <h2 class="auth-title">Вхід в Особистий Кабінет</h2>
+  <p class="auth-title-description">Аби переглядати казки, увійдіть в свій особистий кабінет</p>
+
+  <form class="auth-form" [formGroup]="signInForm" (ngSubmit)="login()">
+    <label for="sign-in-email" class="auth-sm-medium">Електрон пош</label>
+    <input [formControlName]="signInFormKeys.username"
+           type="email"
+           id="sign-in-email"
+           placeholder="Введіть електронну пошту"
+           class="auth-input-container email-input"
+    />
+    <label for="password" class="auth-sm-medium">Пароль</label>
+    <input [formControlName]="signInFormKeys.password"
+           type="password"
+           id="password"
+           placeholder="Пароль"
+           class="auth-input-container password-input"
+    />
+    <div class="auth-options">
+      <label class="auth-checkbox-label">
+        <input type="checkbox" class="auth-deep-blue-sm-medium auth-remember-checkbox" />
+        Запам’ятати
+      </label>
+      <a href="#" [routerLink]="['/', 'forgot-password']"
+         class="auth-deep-blue-sm-medium"
+      >Забули пароль?</a>
+    </div>
+
+    <button type="submit" class="auth-btn-container">Увійти</button>
+  </form>
+  <p class="auth-media-blue-gray-sm-normal">
+    <span>Немає акаунту?</span>
+    <span>&nbsp;</span>
+    <a href="#"
+       [routerLink]="['/', 'sign-up']"
+       class="auth-deep-blue-sm-medium"
+    >Створіть!</a>
+  </p>
+</div>

package/projects/ngx/src/lib/components/rtsee-auth/sign-in/sign-in.component.ts

@@ -0,0 +1,44 @@
+import { Component } from '@angular/core';
+import {Router, RouterLink} from '@angular/router';
+import {FormBuilder, FormGroup, ReactiveFormsModule, Validators} from '@angular/forms';
+import { UtilsService } from '../services/utils.service';
+import { SignInForm, TypedReactiveForm } from '../types/auth-form.type';
+import {NgOptimizedImage} from "@angular/common";
+
+@Component({
+  selector: 'rtsee-sign-in',
+  templateUrl: './sign-in.component.html',
+  imports: [
+    NgOptimizedImage,
+    ReactiveFormsModule,
+    RouterLink
+  ],
+  standalone: true
+})
+export class SignInComponent {
+  public readonly signInForm: FormGroup<TypedReactiveForm<SignInForm>>
+  public readonly signInFormKeys: Record<keyof SignInForm, string>;
+
+  constructor(
+    private readonly formBuilder: FormBuilder,
+    private readonly router: Router
+  ) {
+    this.signInForm = this.formBuilder.group<TypedReactiveForm<SignInForm>>({
+      username: this.formBuilder.control(null, {validators: [Validators.required, Validators.email]}),
+      password: this.formBuilder.control(null, {validators: [Validators.required]}),
+      remember: this.formBuilder.control(false, {nonNullable: true})
+    });
+    this.signInFormKeys = UtilsService.getKeysAsValueObject(this.signInForm.getRawValue());
+  }
+
+  public login(): void {
+    if (this.signInForm.valid) {
+      // this.authService.signIn(this.signInForm.getRawValue())
+      //   .subscribe((success) => {
+      //     if (success) {
+      //       this.router.navigate(['/']);
+      //     }
+      //   });
+    }
+  }
+}

package/projects/ngx/src/lib/components/rtsee-auth/sign-up/sign-up.component.html

@@ -0,0 +1,51 @@
+<div class="auth-container">
+  <img ngSrc="/assets/img.png" alt="Company Logo" class="logo" height="38" width="37"/>
+  <h2 class="auth-title">Реєстрація в Особистий Кабінет</h2>
+  <p class="auth-title-description">Створіть свій особистий кабінет, щоб переглядати казки</p>
+
+  <form class="auth-form" [formGroup]="signUpForm" (ngSubmit)="signUp()">
+    <!-- Email Field -->
+    <label for="sign-up-email" class="auth-sm-medium">Електрон пошта</label>
+    <input [formControlName]="signUpFormKeys.email"
+           type="email" id="sign-up-email"
+           placeholder="Введіть електронну пошту"
+           class="auth-input-container email-input"
+    />
+
+    <!-- Password Field -->
+    <label for="sign-up-password" class="auth-sm-medium">Паро</label>
+    <input [formControlName]="signUpFormKeys.password"
+           type="password" id="sign-up-password"
+           placeholder="Створіть пароль"
+           class="auth-input-container password-input"
+    />
+
+    <!-- Confirm Password Field -->
+    <label for="confirm-password" class="auth-sm-medium">Підтверд пароль</label>
+    <input [formControlName]="signUpFormKeys.passwordConfirmation"
+           type="password"
+           id="confirm-password"
+           placeholder="Підтвердьте пароль"
+           class="auth-input-container password-input"
+    />
+
+    <!-- Terms and Conditions -->
+    <div class="auth-options">
+      <label class="auth-checkbox-label">
+        <input type="checkbox"
+               class="auth-deep-blue-sm-medium"
+               [formControlName]="signUpFormKeys.terms"
+        />
+        Я погоджуюсь з&nbsp;<a href="#" class="auth-deep-blue-sm-medium">умовами використання</a>
+      </label>
+    </div>
+
+    <!-- Sign-Up Button -->
+    <button type="submit" class="auth-btn-container">Зареєструватись</button>
+  </form>
+
+  <!-- Redirect to Sign-In -->
+  <p class="auth-media-blue-gray-sm-normal">
+    Вже маєте акаунт? <a href="#" [routerLink]="['/', 'sign-in']" class="auth-deep-blue-sm-medium">Увійдіть</a>
+  </p>
+</div>

package/projects/ngx/src/lib/components/rtsee-auth/sign-up/sign-up.component.ts

@@ -0,0 +1,51 @@
+import { Component } from '@angular/core';
+import {FormBuilder, FormGroup, ReactiveFormsModule, Validators} from '@angular/forms';
+import { SignUpForm, TypedReactiveForm } from '../types/auth-form.type';
+import { UtilsService } from '../services/utils.service';
+import {ConfirmPasswordValidator} from "../validators/form-fields-validators";
+import {RouterLink} from "@angular/router";
+import {NgOptimizedImage} from "@angular/common";
+
+@Component({
+  selector: 'rtsee-sign-up',
+  templateUrl: './sign-up.component.html',
+  imports: [
+    ReactiveFormsModule,
+    RouterLink,
+    NgOptimizedImage
+  ],
+  standalone: true
+})
+export class SignUpComponent {
+  public readonly signUpForm: FormGroup<TypedReactiveForm<SignUpForm>>;
+  public readonly signUpFormKeys: Record<keyof SignUpForm, string>;
+
+  constructor(
+    private readonly formBuilder: FormBuilder
+  ) {
+    this.signUpForm = this.formBuilder.group<TypedReactiveForm<SignUpForm>>({
+      email: this.formBuilder.control('', { validators: [Validators.required, Validators.email] }),
+      password: this.formBuilder.control('', { validators: [Validators.required, Validators.minLength(6)] }),
+      passwordConfirmation: this.formBuilder.control('', {
+        validators: [
+          Validators.required,
+          Validators.minLength(6)
+        ]
+      }),
+      terms: this.formBuilder.control(false, { nonNullable: true,
+        validators: [Validators.requiredTrue]
+      }),
+    }, { validators: [ ConfirmPasswordValidator.MatchFields ] });
+    this.signUpFormKeys = UtilsService.getKeysAsValueObject(this.signUpForm.getRawValue());
+  }
+
+  public signUp(): void {
+    if (this.signUpForm.valid) {
+      const formValue = this.signUpForm.getRawValue();
+
+
+      // Call sign-up API
+      // this.authService.signUp(formValue);
+    }
+  }
+}

package/projects/ngx/src/lib/components/rtsee-auth/types/auth-form.type.ts

@@ -0,0 +1,36 @@
+import { FormArray, FormControl, FormGroup } from '@angular/forms';
+
+export type SignUpForm = {
+  email: string | null;
+  password: string | null;
+  passwordConfirmation: string | null;
+  terms: boolean;
+};
+
+export type TypedReactiveForm<T> = {
+  [Key in keyof T]: T[Key] extends Array<infer Item>
+    ? Item extends object
+      ? FormArray<FormGroup<TypedReactiveForm<Item>>>
+      : FormControl<T[Key]>
+    : FormControl<T[Key]>;
+};
+
+export type ResetPasswordForm = {
+  password: string;
+  passwordConfirm: string;
+};
+
+export type ConfirmPasswordForm = {
+  password: string;
+  newPassword: string;
+};
+
+export type ForgotPasswordForm = {
+  email: string | null;
+};
+
+export type SignInForm = {
+  username: string | null;
+  password: string | null;
+  remember: boolean;
+};

package/projects/ngx/src/lib/components/rtsee-auth/validators/form-fields-validators.ts

@@ -0,0 +1,27 @@
+import {AbstractControl, ValidationErrors} from '@angular/forms';
+
+export class ConfirmPasswordValidator {
+  /**
+   * Check matching password with confirm password
+   * @param control AbstractControl
+   */
+  static MatchFields(control: AbstractControl): ValidationErrors | null {
+    const passwordField: AbstractControl | null = control.get('password');
+    const passwordConfirmationField: AbstractControl | null = control.get('passwordConfirmation');
+
+    if (!passwordField || ! passwordConfirmationField) {
+      throw new Error('MatchFieldsValidator unable to find password controls!');
+    }
+
+    const password: string = passwordField.getRawValue() as string;
+    const passwordConfirmation: string = passwordConfirmationField.getRawValue() as string;
+
+    if (password !== passwordConfirmation) {
+      return {
+        confirmPassword: true
+      };
+    }
+
+    return null;
+  }
+}

package/projects/ngx/src/lib/components/rtsee-auth/vendors/vendors.component.html

@@ -0,0 +1 @@
+<p>vendors works!</p>

package/projects/ngx/src/lib/components/rtsee-auth/vendors/vendors.component.ts

@@ -0,0 +1,10 @@
+import { Component } from '@angular/core';
+
+@Component({
+    selector: 'rtsee-vendors',
+    templateUrl: './vendors.component.html',
+    standalone: true
+})
+export class VendorsComponent {
+
+}

package/projects/ngx/src/lib/components/rtsee-container/rtsee-bottom-nav/rtsee-bottom-nav.component.html

@@ -0,0 +1,15 @@
+<div class="rtsee-bottom-nav">
+  <nav class="rtsee-nav-bar">
+    <a *ngFor="let route of config.routes"
+       [routerLink]="route.link"
+       routerLinkActive
+       [ngClass]="{'rtsee-nav-item-hidden': !route.isEnabled}"
+       [routerLinkActiveOptions]="{exact:true}"
+       class="rtsee-nav-bar-link rtsee-bottom-nav-bar-link"
+    >
+      <span class="rtsee-nav-bar-link-icon">
+        <span class="rtsee-nav-item-icon" [ngClass]="route.iconClassName"></span>
+      </span>
+    </a>
+  </nav>
+</div>

package/projects/ngx/src/lib/components/rtsee-container/rtsee-bottom-nav/rtsee-bottom-nav.component.ts

@@ -0,0 +1,20 @@
+import {Component, Input} from '@angular/core';
+import {INavigationConfig} from "@rtsee/factory/dist/factory/src/interfaces/NavigationConfig";
+import {RouterLink, RouterLinkActive} from "@angular/router";
+import {NgClass, NgForOf} from "@angular/common";
+
+
+@Component({
+  selector: 'rtsee-bottom-nav',
+  templateUrl: './rtsee-bottom-nav.component.html',
+  imports: [
+    RouterLink,
+    RouterLinkActive,
+    NgClass,
+    NgForOf
+  ],
+  standalone: true
+})
+export class RtseeBottomNavComponent {
+  @Input() public config!: INavigationConfig;
+}

package/projects/ngx/src/lib/components/rtsee-container/rtsee-container.component.html

@@ -0,0 +1,50 @@
+<div class="rtsee-shell"
+     [class.rtseeShellConferenceMode]="rtsee.eventsDashboard && rtsee.activeTab === 'events-dashboard'"
+     [ngClass]="{
+     'rtsee-shell-conference-mode': rtsee.conference && rtsee.conference.isInActiveCall,
+     'rtsee-shell-messenger-active': rtsee.messenger && rtsee.activeTab === 'messenger',
+     'rtsee-shell-dashboard-active': rtsee.eventsDashboard && rtsee.activeTab === 'events-dashboard',
+     'rtsee-shell-presentation-active': rtsee.presentation && rtsee.activeTab === 'presentation',
+     'rtsee-shell-side-nav-expanded': isSidenavExpanded
+     }"
+>
+  <div class="rtsee-sidenav-block">
+    <rtsee-sidenav [config]="navigationConfig" [isExpanded]="isSidenavExpanded" (toggleClicked)="onSidenavToggleClicked()"></rtsee-sidenav>
+  </div>
+
+  <div class="rtsee-shell-panel">
+    <div class="rtsee-conference-container"
+         *ngIf="rtsee.conference && rtsee.conference.isInActiveCall"
+    >
+      <rtsee-conference [rtSee]="rtsee.conference"
+      ></rtsee-conference>
+    </div>
+
+    <div class="rtsee-messenger-container"
+         *ngIf="rtsee.messenger"
+    >
+      <rtsee-messenger [messenger]="rtsee.messenger"
+      ></rtsee-messenger>
+    </div>
+
+    <div class="rtsee-events-dashboard-container"
+         *ngIf="rtsee.eventsDashboard && rtsee.eventsDashboard.isReady"
+    >
+      <rtsee-events-dashboard [eventsDashboard]="rtsee.eventsDashboard"
+      ></rtsee-events-dashboard>
+    </div>
+
+    <div class="rtsee-presentation-container"
+         *ngIf="rtsee.presentation && rtsee.presentation.isActive"
+    >
+      <rtsee-presentation [presentation]="rtsee.presentation"></rtsee-presentation>
+    </div>
+  </div>
+
+  <div class="rtsee-content">
+      <ng-content></ng-content>
+  </div>
+  <div class="rtsee-bottom-nav-block">
+    <rtsee-bottom-nav [config]="navigationConfig"></rtsee-bottom-nav>
+  </div>
+</div>

package/projects/ngx/src/lib/components/rtsee-container/rtsee-container.component.ts

@@ -0,0 +1,37 @@
+import {Component, Input} from '@angular/core';
+import {RTSee, INavigationConfig} from "@rtsee/factory";
+import {NgClass, NgIf} from "@angular/common";
+import {RtseeSidenavComponent} from "./rtsee-sidenav/rtsee-sidenav.component";
+import {RTSeeConferenceComponent} from "../rtsee/rtsee-conference.component";
+import {MessengerComponent} from "../rtsee-messenger/messenger/messenger.component";
+import {RtseeEventsDashboardComponent} from "../rtsee-events-dashboard/rtsee-events-dashboard.component";
+import {PresentationComponent} from "../rtsee-presentation/presentation/presentation.component";
+import {RtseeBottomNavComponent} from "./rtsee-bottom-nav/rtsee-bottom-nav.component";
+
+
+@Component({
+  selector: 'rtsee-container',
+  templateUrl: './rtsee-container.component.html',
+  imports: [
+    NgClass,
+    NgIf,
+    RtseeSidenavComponent,
+    RTSeeConferenceComponent,
+    MessengerComponent,
+    RtseeEventsDashboardComponent,
+    PresentationComponent,
+    RtseeBottomNavComponent
+  ],
+  standalone: true
+})
+export class RTSeeContainerComponent {
+  @Input() rtsee!: RTSee;
+  @Input() public navigationConfig!: INavigationConfig;
+
+  isSidenavExpanded: boolean = true;
+  isSidenavExpandededed: boolean = true;
+
+  onSidenavToggleClicked() {
+    this.isSidenavExpanded = !this.isSidenavExpanded;
+  }
+}