Merge remote-tracking branch 'origin/master' into content-only-scenarios

hobbyfarm · Mar 13, 2024 · bb439d6 · bb439d6
2 parents 174c321 + 3a4a465
commit bb439d6
Show file tree

Hide file tree

Showing 31 changed files with 2,529 additions and 1,468 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -36,6 +36,7 @@
     "chartjs-plugin-datalabels": "^2.1.0",
     "font-awesome": "^4.7.0",
     "marked": "^4.3.0",
+    "mermaid": "^10.6.0",
     "moment": "^2.29.4",
     "ng2-charts": "^4.0.0",
     "ng2-dragula": "^5.0.0",

diff --git a/src/app/alert/alert.component.ts b/src/app/alert/alert.component.ts
@@ -32,7 +32,7 @@ export class AlertComponent {
     this.doAlert(text, ClrAlertType.Warning, closable, timeout)
   }
 
-  private doAlert(text: string, type: ClrAlertType = ClrAlertType.Info, closable: boolean = true, timeout: number = 0) {
+  public doAlert(text: string, type: ClrAlertType = ClrAlertType.Info, closable: boolean = true, timeout: number = 0) {
     this.alert.alertType = type;
     this.text = text;
     this.alert.closable = closable;

diff --git a/src/app/alert/alert.ts b/src/app/alert/alert.ts
@@ -0,0 +1,8 @@
+import { ClrAlertType } from '../clr-alert-type';
+
+export class AlertDetails {
+    type: ClrAlertType;
+    message: string;
+    closable?: boolean = true;
+    duration?: number = 0;
+}
diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
@@ -17,93 +17,85 @@ import { StepComponent } from './step/step-component/step.component';
 import { TerminalComponent } from './step/terminal/terminal.component';
 import { RolesComponent } from './configuration/roles/roles/roles.component';
 import { SessionStatisticsComponent } from './session-statistics/session-statistics.component';
-import {SettingsComponent} from './configuration/settings/settings.component';
+import { SettingsComponent } from './configuration/settings/settings.component';
 import { DashboardDetailsComponent } from './dashboards/dashboard-details/dashboard-details.component';
 
 const routes: Routes = [
-  {path: '', redirectTo: '/home', pathMatch: 'full'},
-  {path: 'login', component: LoginComponent},
+  { path: '', redirectTo: '/home', pathMatch: 'full' },
+  { path: 'login', component: LoginComponent },
   {
     path: 'home',
     component: HomeComponent,
-    canActivate: [
-      AuthGuard
-    ],
+    canActivate: [AuthGuard],
     children: [
       {
         path: 'statistics/sessions',
-        component: SessionStatisticsComponent
-      }
-    ]
+        component: SessionStatisticsComponent,
+      },
+    ],
   },
   {
     path: 'dashboards',
     component: DashboardsComponent,
-    canActivate: [
-      AuthGuard
-    ],
+    canActivate: [AuthGuard],
     children: [
       {
         path: 'event/:id',
-        component: DashboardDetailsComponent
-      }
-    ]
+        component: DashboardDetailsComponent,
+      },
+    ],
   },
   {
     path: 'events',
     component: EventComponent,
-    canActivate: [
-      AuthGuard
-    ]
+    canActivate: [AuthGuard],
   },
   {
     path: 'content',
     component: ContentComponent,
-    canActivate: [
-      AuthGuard
-    ],
+    canActivate: [AuthGuard],
     children: [
       {
         path: 'scenarios',
-        component: ScenarioComponent
+        component: ScenarioComponent,
       },
       {
         path: 'courses',
-        component: CourseComponent
-      }
-    ]
+        component: CourseComponent,
+      },
+    ],
   },
   {
     path: 'users',
     component: UserComponent,
-    canActivate: [
-      AuthGuard
-    ]
+    canActivate: [AuthGuard],
   },
   {
     path: 'configuration',
     component: ConfigurationComponent,
-    canActivate: [
-      AuthGuard
-    ],
+    canActivate: [AuthGuard],
     children: [
+      {
+        path: 'settings/:scope',
+        component: SettingsComponent,
+      },
       {
         path: 'settings',
-        component: SettingsComponent
+        component: SettingsComponent,
       },
       {
         path: 'environments',
-        component: EnvironmentsComponent
+        component: EnvironmentsComponent,
       },
       {
         path: 'vmtemplates',
-        component: VmtemplatesComponent
+        component: VmtemplatesComponent,
       },
       {
         path: 'roles',
-        component: RolesComponent
-      }
-    ]
+        component: RolesComponent,
+      },
+    ],
   },
   {
     path: 'session/:session/steps/:step',
@@ -113,14 +105,12 @@ const routes: Routes = [
   {
     path: 'scenario/:scenario/printable',
     component: PrintableComponent,
-    canActivate: [
-      AuthGuard
-    ]
-  }
+    canActivate: [AuthGuard],
+  },
 ];
 
 @NgModule({
   imports: [RouterModule.forRoot(routes, {})],
-  exports: [RouterModule]
+  exports: [RouterModule],
 })
-export class AppRoutingModule { }
+export class AppRoutingModule {}
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
@@ -102,6 +102,9 @@ import { TypedArrayNumberComponent } from './typed-form/typed-array-number.compo
 import { TypedArrayBooleanComponent } from './typed-form/typed-array-boolean.component';
 import { CourseWizardComponent } from './course/course-wizard/course-wizard.component';
 import { CourseDetailsComponent } from './course/course-details/course-details.component';
+import { ScenarioWizardComponent } from './scenario/scenario-wizard/scenario-wizard.component';
+import { ScenarioDetailComponent } from './scenario/scenario-detail/scenario-detail.component';
+import { StepsScenarioComponent } from './scenario/steps-scenario/steps-scenario.component';
 import { DashboardDetailsComponent } from './dashboards/dashboard-details/dashboard-details.component';
 import '@cds/core/icon/register.js';
 import {
@@ -270,6 +273,9 @@ export function jwtOptionsFactory(): JwtConfig {
     TypedArrayNumberComponent,
     TypedArrayBooleanComponent,
     CourseWizardComponent,
+    ScenarioWizardComponent,
+    ScenarioDetailComponent,
+    StepsScenarioComponent,
     DashboardDetailsComponent,
   ],
   imports: [

diff --git a/src/app/configuration/configuration.component.html b/src/app/configuration/configuration.component.html
@@ -2,13 +2,6 @@
   <header class="header header-7" app-header></header>
   <div class="content-container">
     <clr-vertical-nav>
-      <a
-        clrVerticalNavLink
-        routerLink="./settings"
-        routerLinkActive="active"
-        *ngIf="showSettings"
-        >Settings</a
-      >
       <a
         clrVerticalNavLink
         routerLink="./environments"
@@ -30,6 +23,25 @@
         *ngIf="listRoles"
         >Roles</a
       >
+
+      <clr-vertical-nav-group routerLinkActive="active">
+        <a routerLink="./settings" hidden aria-hidden="true"></a>
+        Settings
+        <clr-vertical-nav-group-children
+          #activeChildren
+          *clrIfExpanded="expandedSettingsGroup"
+        >
+          <a
+            *ngFor="let scope of scopes"
+            clrVerticalNavLink
+            [routerLink]="['./settings/', scope.name]"
+            routerLinkActive="active"
+            [title]="scope.displayName"
+          >
+            {{ scope.displayName }}
+          </a>
+        </clr-vertical-nav-group-children>
+      </clr-vertical-nav-group>
     </clr-vertical-nav>
     <div class="content-area">
       <router-outlet></router-outlet>

diff --git a/src/app/configuration/configuration.component.ts b/src/app/configuration/configuration.component.ts
@@ -1,6 +1,10 @@
 import { Component, OnInit } from '@angular/core';
 import { RbacService } from '../data/rbac.service';
 import { Router } from '@angular/router';
+import {
+  PreparedScope,
+  TypedSettingsService,
+} from '../data/typedSettings.service';
 
 @Component({
   selector: 'app-configuration',
@@ -12,7 +16,15 @@ export class ConfigurationComponent implements OnInit {
   public listVMTemplates = false;
   public listRoles = false;
 
-  constructor(private rbacService: RbacService, private router: Router) {}
+  public scopes: PreparedScope[] = [];
+  public scopesLoading: boolean = true;
+  public expandedSettingsGroup = true;
+
+  constructor(
+    private rbacService: RbacService,
+    private router: Router,
+    private typedSettingsService: TypedSettingsService
+  ) {}
 
   ngOnInit() {
     const authorizationRequests = Promise.all([
@@ -31,15 +43,19 @@ export class ConfigurationComponent implements OnInit {
         this.listRoles = permissions[4];
 
         if (this.showSettings) {
-          this.router.navigateByUrl(`/configuration/settings`);
-        } else if (this.listEnvironments) {
-          this.router.navigateByUrl(`/configuration/environments`);
-        } else if (this.listVMTemplates) {
-          this.router.navigateByUrl(`/configuration/vmtemplates`);
-        } else if (this.listRoles) {
-          this.router.navigateByUrl(`/configuration/roles`);
+          this.getScopes();
         }
       }
     );
   }
+
+  getScopes() {
+    this.scopes = [];
+    this.typedSettingsService.listScopes().subscribe({
+      next: (scopes: PreparedScope[]) => {
+        this.scopes = scopes;
+        this.scopesLoading = false;
+      },
+    });
+  }
 }