Issue + Candidate fixes (#160)

* addded nullcheck for issue priv check

* fixed issue routing after create

* removed forced redirect that breaks routing

* fixed routing by url

* removed issue scroll bar if list is empty

* removed tracing

* added fallback action for issue

* fixed console errors for pattern details

* added nullcheck

* removed store from candidate management

* removed unused imports

* updated typescript and fixed pr comments

* changed confirmdialog and route subscription unsubscribe

Author: mhinkie

package.json

@@ -78,7 +78,7 @@
     "stylelint": "^13.5.0",
     "stylelint-config-sass-guidelines": "^7.0.0",
     "ts-node": "~8.0.1",
-    "typescript": "~3.6.4"
+    "typescript": "~3.7.7"
   },
   "browser": {
     "fs": false

src/app/app-routing.module.ts

@@ -5,8 +5,6 @@ import { ToasterModule } from 'angular2-toaster';
 import { PageNotFoundComponent } from './core/component/page-not-found/page-not-found.component';
 import { AuthGuardService as AuthGuard } from './authentication/_services/auth-guard.service';
 import { PatternLanguageManagementResolverService } from './pattern-language-management/pattern-language-management/pattern-language-management-resolver.service'; // eslint-disable-line max-len
-import { UserRole } from './core/user-management';
-import { PrintHook } from '@angular/flex-layout';
 import { Privilege } from './core/user-management/_models/privilege.enum';
 import { globals } from './globals';
 /*
@@ -45,11 +43,11 @@ const routes: Routes = [
     loadChildren: () => import('./design-model-module/design-model.module').then(m => m.DesignModelModule),
   },
   {
-    path: 'candidate',
+    path: globals.pathConstants.candidate,
     loadChildren: () => import('./candidate-management/candidate-management.module').then(m => m.CandidateManagementModule),
   },
   {
-    path: 'issue',
+    path: globals.pathConstants.issue,
     loadChildren: () => import('./issue-management/issue-management.module').then(m => m.IssueManagementModule),
   },
   {
@@ -68,10 +66,7 @@ const routes: Routes = [
     path: 'oauth-callback',
     component: ProcessOauthCallbackComponent
   },
-  {
-    path: '**',
-    component: PageNotFoundComponent
-  },
+  { path: '**', component: PageNotFoundComponent }
 ];
 
 @NgModule({

src/app/authentication/_services/authentication.service.ts

@@ -52,7 +52,6 @@ export class AuthenticationService {
       } else if (token && !this.jwtHelper.isTokenExpired(token)) {
         this.getUserInfo();
         this.getRoles();
-        this.router.navigate(['/']);
 
       } else if (token && this.getRefreshToken() && this.jwtHelper.isTokenExpired(this.getAccessToken())) {
         this.refreshToken();

src/app/candidate-management/candidate-management-detail/candidate-management-detail.component.html

@@ -16,7 +16,7 @@
             </pp-author-picker>
 
             <pp-pattern-language-picker class="detail-component" [disabled]="disabled"
-                [patternLanguageSelected]="candidate.patternLanguageId" [confirmDialog]="confirmDialog"
+                [patternLanguageSelected]="candidate.patternLanguageId" [confirmDialog]="confirmDialogData"
                 (patternLanguageSelectedChange)="patternLanguageSelectedChange($event)"></pp-pattern-language-picker>
 
             <!-- <pp-rating class="detail-component" [disabled]="!candidate.id" [upVotes]="candidate.upVotes" -->
@@ -59,13 +59,13 @@
                 <button mat-flat-button type="button" color="warn" (click)="cancelPattern()">Cancel</button>
             </div>
         </mat-card>
-        <pp-evidence-list [evidences]="candidate.evidences" [disabled]="!candidate.id"
+        <pp-evidence-list [evidences]="candidate?.evidences" [disabled]="candidate?.id == null"
             (createEvidenceEvent)="createEvidence($event)" (updateEvidenceEvent)="updateEvidence($event)"
             (deleteEvidenceEvent)="deleteEvidence($event)" (ratingEvent)="updateRatingEvidence($event)">
         </pp-evidence-list>
     </div>
     <pp-comment-list *ngIf="candidateHeight" class="right" [style.height.px]="candidateHeight"
-        [data]="candidate.comments" [disabled]="!candidate.id" (createCommentEvent)="createComment($event)"
+        [data]="candidate?.comments" [disabled]="candidate?.id == null" (createCommentEvent)="createComment($event)"
         (updateCommentEvent)="updateComment($event)" (deleteCommentEvent)="deleteComment($event)"
         (ratingEvent)="updateRatingComment($event)">
     </pp-comment-list>

src/app/candidate-management/candidate-management-detail/candidate-management-detail.component.ts

@@ -1,7 +1,7 @@
-import { Component, OnInit, ViewChild, ElementRef, ChangeDetectorRef, AfterViewInit } from '@angular/core';
+import { Component, OnInit, ViewChild, ElementRef, ChangeDetectorRef, AfterViewInit, OnDestroy } from '@angular/core';
 import { Router, ActivatedRoute } from '@angular/router';
 import { TdTextEditorComponent } from '@covalent/text-editor';
-import { Candidate, CandidateManagementService, CandidateManagementStore } from 'src/app/core/candidate-management';
+import { Candidate, CandidateManagementService } from 'src/app/core/candidate-management';
 import PatternLanguageSchemaModel from 'src/app/core/model/pattern-language-schema.model';
 import PatternSectionSchema from 'src/app/core/model/hal/pattern-section-schema.model';
 import { patternLanguageNone } from 'src/app/core/component/pattern-language-picker/pattern-language-picker.component';
@@ -18,13 +18,14 @@ import { PrivilegeService } from 'src/app/authentication/_services/privilege.ser
 import { Author, AuthorModel } from 'src/app/core/author-management';
 import { environment } from 'src/environments/environment';
 import { AuthenticationService } from 'src/app/authentication/_services/authentication.service';
+import { Subscription } from 'rxjs';
 
 @Component({
   selector: 'pp-candidate-management-detail',
   templateUrl: './candidate-management-detail.component.html',
   styleUrls: ['./candidate-management-detail.component.scss']
 })
-export class CandidateManagementDetailComponent implements OnInit, AfterViewInit {
+export class CandidateManagementDetailComponent implements OnInit, AfterViewInit, OnDestroy {
 
   @ViewChild('textEditor') private _textEditor: TdTextEditorComponent;
   @ViewChild('candidateView') candidateDiv: ElementRef;
@@ -45,13 +46,14 @@ export class CandidateManagementDetailComponent implements OnInit, AfterViewInit
   pattern = false;
   treshhold = true;
   treshholdSetting = 4.0;
-  confirmDialog: ConfirmData;
+  private _confirmDialogData: ConfirmData;
+
+  private activeRouteSubscription: Subscription | null = null;
 
   constructor(
     private router: Router,
     private activeRoute: ActivatedRoute,
     private candidateManagementService: CandidateManagementService,
-    public candidateStore: CandidateManagementStore,
     private patternService: PatternService,
     public dialog: MatDialog,
     private p: PrivilegeService,
@@ -60,47 +62,63 @@ export class CandidateManagementDetailComponent implements OnInit, AfterViewInit
   ) { }
 
   ngOnInit(): void {
-
-    this.candidateStore.candidate.subscribe((_candidate: Candidate) => {
-      if (_candidate && this.router.url.includes('detail')) {
-        this.disabled = true;
-        this.candidate = _candidate;
-        this.contentToMarkdown();
-        this.checkTreshhold();
-
-      } else if (_candidate && this.router.url.includes('edit')) {
-        this.candidate = _candidate;
-        this.contentToMarkdown();
-        this.edit();
-        this.checkTreshhold();
-
-      } else if (!_candidate && window.history.state.data && window.history.state.data instanceof Candidate) {
-        this.candidate = window.history.state.data as Candidate
-        this.contentToMarkdown();
-        this.edit();
-        this.checkTreshhold();
-
-      } else {
-        this.disabled = false;
-        this.candidate = new Candidate(null, 'New Candidate', null, null);
-        this.patternLanguageSelectedChange(patternLanguageNone);
-        // Preset author
-        this.auth.user.subscribe(_user => {
-          if (_user && !this.candidate.authors) this.candidate.authors = [new AuthorModel(_user.id, Author.OWNER, _user.name)];
-        })
-      }
-      this.confirmDialog = {
-        title: `Change Pattern Language for Candidate ${this.candidate.name}`,
-        text: 'If you change the language everything writen will be deleted and the'
-          + ' new pattern schema will be used'
+    this.activeRouteSubscription = this.activeRoute.params.subscribe(params => {
+      let candidateUri = `/candidates/${params.name}`;
+      switch (params.action) {
+        case 'detail': {
+          this.disabled = true;
+          this.candidateManagementService.getCandidateByUri(candidateUri).subscribe(result => {
+            this.candidate = result;
+            this.contentToMarkdown();
+            this.checkTreshhold();
+          });
+          break;
+        }
+        case 'edit': {
+          this.candidateManagementService.getCandidateByUri(candidateUri).subscribe(result => {
+            this.candidate = result;
+            this.contentToMarkdown();
+            this.edit();
+            this.checkTreshhold();
+          });
+          break;
+        }
+        case 'create': {
+          this.disabled = false;
+          let candidateName = params.name ? params.name : 'New Candidate';
+          this.candidate = new Candidate(null, candidateName, null, null);
+          this.patternLanguageSelectedChange(patternLanguageNone);
+          // Preset author
+          this.auth.user.subscribe(_user => {
+            if (_user && !this.candidate.authors) this.candidate.authors = [new AuthorModel(_user.id, Author.OWNER, _user.name)];
+          });
+          break;
+        }
+        default: {
+          // Unknown action - show candidate list
+          this.router.navigateByUrl('/candidate');
+          break;
+        }
       }
     });
   }
 
+  ngOnDestroy(): void {
+    this.activeRouteSubscription?.unsubscribe();
+  }
+
   ngAfterViewInit(): void {
     this.setCommentSectionHeight();
   }
 
+  public get confirmDialogData() {
+    return {
+      title: `Change Pattern Language for Candidate ${this.candidate.name}`,
+      text: 'If you change the language everything writen will be deleted and the'
+        + ' new pattern schema will be used'
+    };
+  }
+
   // CHANGE MARKDOWN
   contentToMarkdown() {
     this.candidateMarkdown = `# ${this.candidate.name}\n`;
@@ -218,9 +236,6 @@ export class CandidateManagementDetailComponent implements OnInit, AfterViewInit
     })
 
     this.candidateManagementService.createCandidate(this.candidate).subscribe(result => {
-      this.candidate = result;
-      this.contentToMarkdown();
-
       // call update for all additional authors
       for(let author of authorlist) {
         if(author.userId !== first_author) {
@@ -230,7 +245,7 @@ export class CandidateManagementDetailComponent implements OnInit, AfterViewInit
         }
       }
 
-      this.disabled = true;
+      this.router.navigate(['./candidate/detail', this.candidate.name]);
     })
   }
 
@@ -239,6 +254,7 @@ export class CandidateManagementDetailComponent implements OnInit, AfterViewInit
       this.candidate = result;
       this.contentToMarkdown();
       this.disabled = true;
+      this.router.navigate(['./candidate/detail', this.candidate.name]);
     })
   }
 
@@ -390,4 +406,5 @@ export class CandidateManagementDetailComponent implements OnInit, AfterViewInit
     this.candidateHeight = this.candidateDiv.nativeElement.offsetHeight;
     this.ref.detectChanges();
   }
+
 }

src/app/candidate-management/candidate-management.module.ts

@@ -1,7 +1,7 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { CoreModule } from '../core/core.module';
-import { RouterModule } from '@angular/router';
+import { RouterModule, Routes } from '@angular/router';
 import { MatButtonModule } from '@angular/material/button';
 import { MatSelectModule } from '@angular/material/select';
 import { MatFormFieldModule } from '@angular/material/form-field';
@@ -15,7 +15,7 @@ import { MatToolbarModule } from '@angular/material/toolbar';
 import { MatExpansionModule } from '@angular/material/expansion';
 // Routing
 
-export const CANDIATE_ROTUES = [
+export const CANDIDATE_ROUTES : Routes = [
   {
     path: '',
     children: [
@@ -24,32 +24,12 @@ export const CANDIATE_ROTUES = [
         component: CandidateManagementListComponent,
       },
       {
-        path: 'detail/:name',
+        path: ':action',
         component: CandidateManagementDetailComponent,
-        // Will be used in the future
-        // canActivate: [AuthGuard],
-        // data: { role: UserRole.MEMBER }
       },
       {
-        path: 'edit/:name',
+        path: ':action/:name',
         component: CandidateManagementDetailComponent,
-        // Will be used in the future
-        // canActivate: [AuthGuard],
-        // data: { role: UserRole.MEMBER }
-      },
-      {
-        path: 'create',
-        component: CandidateManagementDetailComponent,
-        // Will be used in the future
-        // canActivate: [AuthGuard],
-        // data: { role: UserRole.MEMBER }
-      },
-      {
-        path: 'create/:name',
-        component: CandidateManagementDetailComponent,
-        // Will be used in the future
-        // canActivate: [AuthGuard],
-        // data: { role: UserRole.MEMBER }
       }
     ]
   }
@@ -63,7 +43,7 @@ export const CANDIATE_ROTUES = [
   imports: [
     CommonModule,
     CoreModule,
-    RouterModule.forChild(CANDIATE_ROTUES),
+    RouterModule.forChild(CANDIDATE_ROUTES),
     //Material
     MatButtonModule,
     MatSelectModule,