header and user permissions

Author: =

README.md

@@ -5,14 +5,10 @@
 
 # Mixeway User Interface <img src="https://mixeway.github.io/img/logo_dashboard.png" height="60px">
 
-### Disclaimer:
-> The current version of Mixaway (0.9) is considered as beta. It contains several bugs and vulnerabilities. Every fix
-is put on the board and proceed to make sure version 1.0 will be vulnerability and bug-free. 
-
-
 ### About Mixeway:
 Mixeway is an OpenSource software that is meant to simplify the process of security assurance of projects which are implemented using CICD procedures. **Mixawey is not another vulnerability scanning
 software - it is security orchestration tool**.
+Mixeway frontend is based on ngx-admin dashboard - https://github.com/akveo/ngx-admin
 
 With number of plugins for Vulnerability Scanners :
 <img src="https://mixeway.github.io/img/nessus.png" height="50px">

src/app/@core/constants/AdminConstants.ts

@@ -36,6 +36,10 @@ export class AdminConstants {
       'name': 'Admin',
       'id': 'ROLE_ADMIN',
     },
+    {
+      'name': 'Auditor',
+      'id': 'ROLE_AUDITOR',
+    },
     {
       'name': 'Viewer',
       'id': 'ROLE_USER',
@@ -47,12 +51,7 @@ export class AdminConstants {
     {
       'name': 'API',
       'id': 'ROLE_API',
-    },
-    {
-      'name': 'CICD',
-      'id': 'ROLE_API_CICD',
-    },
-  ];
+    }];
   OPERATION_SUCCESS_PROXY_DELETE: string = 'The Proxy is successfully deleted.';
   ADMIN_PAGE_TITLE: string = 'Admin panel';
   ADMIN_TAB_USERS: string = 'Users';
@@ -153,6 +152,7 @@ export class AdminConstants {
   ADMIN_FORM_PROJECTS = 'Permissions for projects';
   ADMIN_FORM_PROJECTS2 = 'Select projects...';
   ADMIN_ROLE_USER = 'ROLE_USER';
+  ADMIN_ROLE_USER2 = 'ROLE_EDITOR_RUNNER';
   ADMIN_FORM_EDIT = 'Edit';
   ADMIN_EDIT_USER = 'Editing user';
   ADMIN_TOOLTIP_EDIT = 'Edit user';

src/app/@theme/components/header/header.component.html

@@ -16,7 +16,12 @@
                nbTooltip="Swagger API REST"></nb-icon>
     </nb-action>
     <nb-action class="control-item">
-      <nb-icon icon="question-mark-circle-outline" pack="eva" [options]="{ animation: { type: 'pulse' } }" (click)="showTutorialWizzard()" nbTooltip="Tutorial"></nb-icon>
+      <nb-icon icon="github-outline" pack="eva" [options]="{ animation: { type: 'pulse' } }" (click)="openGitHub()"
+               nbTooltip="GitHub Docs"></nb-icon>
+    </nb-action>
+    <nb-action class="control-item">
+      <nb-icon icon="bulb-outline" pack="eva" [options]="{ animation: { type: 'pulse' } }" (click)="openTutorials()"
+               nbTooltip="Tutorials"></nb-icon>
     </nb-action>
     <nb-action class="control-item">
       <nb-search type="rotate-layout" nbTooltip="Look for..."></nb-search>

src/app/@theme/components/header/header.component.ts

@@ -10,7 +10,6 @@ import {LayoutService} from '../../../@core/utils';
 import { Subject } from 'rxjs';
 import {DashboardService} from '../../../@core/service/DashboardService';
 import {Router} from '@angular/router';
-import {StepperComponent} from '../stepper/stepper.component';
 import {CookieService} from 'ngx-cookie-service';
 
 @Component({
@@ -33,10 +32,12 @@ export class HeaderComponent implements OnInit, OnDestroy {
     },
   ];
 
-  currentTheme = 'material-lightś';
+  currentTheme = 'material-light';
 
   userMenu = [ { title: 'Profile' }, { title: 'Log out' } ];
 
+  docsMenu = [ {title: 'Swagger'}, { title: 'GitHub' }, { title: 'Tutorials' } ];
+
   constructor(private sidebarService: NbSidebarService,
               private menuService: NbMenuService,
               private themeService: NbThemeService,
@@ -49,6 +50,7 @@ export class HeaderComponent implements OnInit, OnDestroy {
     this.menuService.onItemClick().subscribe(( event ) => {
       this.onItemSelection(event.item.title);
     });
+
     this.searchService.onSearchSubmit()
       .subscribe((data: any) => {
         this.router.routeReuseStrategy.shouldReuseRoute = function () {
@@ -77,9 +79,6 @@ export class HeaderComponent implements OnInit, OnDestroy {
   getUserName() {
     return this.dashboardService.getSessionOwner().subscribe(data => {
       this.user = data;
-      if (this.user.logins < 2) {
-        this.showTutorialWizzard();
-      }
       });
   }
 
@@ -104,11 +103,7 @@ export class HeaderComponent implements OnInit, OnDestroy {
     this.menuService.navigateHome();
     return false;
   }
-  showTutorialWizzard() {
-    this.dialogService.open(
-      StepperComponent,
-      { context: 'this is some additional data passed to dialog' });
-  }
+
 
   showSwaggerDoc() {
     window.location.href = '/swagger-ui.html';
@@ -119,4 +114,12 @@ export class HeaderComponent implements OnInit, OnDestroy {
       this.themeService.changeTheme(theme[0].value);
     }
   }
+
+  openGitHub() {
+    window.location.href = 'https://github.com/mixeway/mixewayhub';
+  }
+
+  openTutorials() {
+    window.location.href = 'https://mixeway.io/category/tutorial/';
+  }
 }

src/app/@theme/theme.module.ts

@@ -2,17 +2,17 @@ import { ModuleWithProviders, NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { MatRippleModule } from '@angular/material/core';
 import {
-  NbActionsModule,
-  NbLayoutModule,
-  NbMenuModule,
-  NbSearchModule,
-  NbSidebarModule,
-  NbUserModule,
-  NbContextMenuModule,
-  NbButtonModule,
-  NbSelectModule,
-  NbIconModule,
-  NbThemeModule,
+    NbActionsModule,
+    NbLayoutModule,
+    NbMenuModule,
+    NbSearchModule,
+    NbSidebarModule,
+    NbUserModule,
+    NbContextMenuModule,
+    NbButtonModule,
+    NbSelectModule,
+    NbIconModule,
+    NbThemeModule, NbTooltipModule,
 } from '@nebular/theme';
 import { NbEvaIconsModule } from '@nebular/eva-icons';
 import { NbSecurityModule } from '@nebular/security';
@@ -74,7 +74,7 @@ const PIPES = [
 ];
 
 @NgModule({
-  imports: [CommonModule, MatRippleModule, ...NB_MODULES],
+    imports: [CommonModule, MatRippleModule, ...NB_MODULES, NbTooltipModule],
   exports: [CommonModule, MatRippleModule, ...PIPES, ...COMPONENTS],
   declarations: [...COMPONENTS, ...PIPES],
 })

src/app/pages/admin/user/user.component.html

@@ -59,7 +59,7 @@
           <label for="userPassword" class="label">{{constants.ADMIN_FORM_USER_PASSWORD}} </label>
           <input type="password" nbInput fullWidth id="userPassword" [placeholder]="constants.ADMIN_FORM_USER_PASSWORD" formControlName="userPassword">
         </div>
-        <div class="form-group" *ngIf="userForm.value.userRole == constants.ADMIN_ROLE_USER">
+        <div class="form-group" *ngIf="( userForm.value.userRole==constants.ADMIN_ROLE_USER)">
           <label for="permissionsProject" class="label">{{constants.ADMIN_FORM_PROJECTS}}</label>
           <ejs-multiselect formControlName="projects" id="permissionsProject" [dataSource]='projects' [fields]='fields' (filtering)='onFiltering($event)' [allowFiltering]='true'
                            [placeholder]='constants.ADMIN_FORM_PROJECTS2'></ejs-multiselect>

src/app/pages/admin/user/user.component.ts

@@ -19,7 +19,6 @@ import { EmitType } from '@syncfusion/ej2-base/src/base';
 })
 export class UserComponent implements OnInit {
   @ViewChild('apiKeyModal', { read: TemplateRef }) apiKeyModal: TemplateRef<HTMLElement>;
-  asd: any = 'ROLE_EDITOR_RUNNER';
   proxies: Proxies[];
   projects: { [key: string]: Object; }[] = [];
   auth: boolean;
@@ -90,7 +89,7 @@ export class UserComponent implements OnInit {
           this.toast.showToast('success', this.constants.TOAST_SUCCESS, this.constants.OPERATION_SUCCESS_USER_SAVE);
           this.loadUsers();
           ref.close();
-          if (this.userForm.value.userRole === 'ROLE_API_CICD') {
+          if (this.userForm.value.userRole === 'ROLE_API') {
             this.windowService.open(
               this.apiKeyModal,
               { title: this.constants.ADMIN_APIKEY_MODAL_HEADER, context: data },
@@ -168,10 +167,10 @@ export class UserComponent implements OnInit {
   }
 
   changedRole($event: any) {
-    if ($event === 'ROLE_USER' || $event === 'ROLE_ADMIN' || $event === 'ROLE_EDITOR_RUNNER' || $event === 'ROLE_API') {
+    if ($event === 'ROLE_USER' || $event === 'ROLE_ADMIN' || $event === 'ROLE_AUDITOR' || $event === 'ROLE_EDITOR_RUNNER') {
       this.showUsername = true;
       this.showOptions = true;
-    } else if ($event === 'ROLE_API_CICD') {
+    } else if ($event === 'ROLE_API') {
       this.showUsername = true;
       this.showOptions = false;
     }

src/app/pages/pages-menu-user.ts

@@ -10,6 +10,11 @@ export const MENU_ITEMS_USER: NbMenuItem[] = [
     title: 'Statistics',
     group: true,
   },
+  {
+    title: 'Vulnerabilities',
+    icon: 'bar-chart-outline',
+    link: '/pages/vulns',
+  },
   {
     title: 'CI/CD',
     icon: 'pie-chart-outline',

src/app/pages/user-profile/user-profile.component.html

@@ -76,7 +76,7 @@
             CICD Api Key
           </nb-card-header>
           <nb-card-body>
-            <button nbButton status="primary" (click)="generateApiKey()"><nb-icon icon="refresh"></nb-icon>Generate new CICD Api Key (old one will be disabled)</button>
+            <button nbButton status="primary" (click)="generateApiKey()"><nb-icon icon="refresh"></nb-icon>Generate new Api Key (old one will be disabled)</button>
           </nb-card-body>
         </nb-card>
       </nb-card-footer>