Merge pull request '12-user-info-jwt' (#6) from 12-user-info-jwt into develop

Reviewed-on: #6

.drone.yml

@@ -1,6 +1,6 @@
 ---
 global-variables:
-  release: &release ${DRONE_BRANCH##**/}
+  release: &release ${DRONE_TAG}
   environment: &environment
     CRE_REGISTRY_IMAGE: registry.fyloz.dev:5443/colorrecipesexplorer/frontend
     CRE_PORT: 9102
@@ -21,6 +21,9 @@ steps:
       - echo -n "latest" > .tags
     when:
       branch: develop
+      event:
+        exclude:
+          - pull_request
 
   - name: set-docker-tags-release
     image: *alpine-image
@@ -29,9 +32,10 @@ steps:
     commands:
       - echo -n "latest-release,$CRE_RELEASE" > .tags
     when:
-      branch: release/**
+      event:
+        - tag
 
-  - name: containerize
+  - name: containerize-dev
     image: plugins/docker
     environment:
       <<: *environment
@@ -40,7 +44,16 @@ steps:
     when:
       branch:
         - develop
-        - release/**
+
+  - name: containerize-release
+    image: plugins/docker
+    environment:
+      <<: *environment
+    settings:
+      repo: *docker-registry-repo
+    when:
+      event:
+        - tag
 
   - name: deploy
     image: alpine:latest
@@ -70,10 +83,11 @@ steps:
       - ssh -p $DEPLOY_SERVER_SSH_PORT $DEPLOY_SERVER_USERNAME@$DEPLOY_SERVER "docker pull $CRE_REGISTRY_IMAGE:$CRE_RELEASE"
       - ssh -p $DEPLOY_SERVER_SSH_PORT $DEPLOY_SERVER_USERNAME@$DEPLOY_SERVER "docker run -d -p $CRE_PORT:80 --name=$DEPLOY_CONTAINER_NAME $CRE_REGISTRY_IMAGE:$CRE_RELEASE"
     when:
-      branch: release/**
+      event:
+        - tag
 
 trigger:
   branch:
     - develop
-    - release/**
+  event:
-    - master
+    - tag

src/app/modules/accounts/accounts-routing.module.ts

@@ -1,14 +1,13 @@
 import {NgModule} from '@angular/core'
 import {RouterModule, Routes} from '@angular/router'
-import {LogoutComponent} from './pages/logout/logout.component'
+import {Login, Logout} from './accounts'
-import {Login} from './accounts'
 
 const routes: Routes = [{
   path: 'login',
   component: Login
 }, {
   path: 'logout',
-  component: LogoutComponent
+  component: Logout
 }, {
   path: '',
   redirectTo: 'login'

src/app/modules/accounts/accounts.module.ts

@@ -1,19 +1,16 @@
 import {NgModule} from '@angular/core'
 
 import {AccountsRoutingModule} from './accounts-routing.module'
-import {LoginComponent} from './pages/login/login.component'
 import {SharedModule} from '../shared/shared.module'
-import {LogoutComponent} from './pages/logout/logout.component'
+import {Login, Logout} from './accounts'
-import {Login} from './accounts'
 import {CreInputsModule} from '../shared/components/inputs/inputs.module'
 import {CreButtonsModule} from '../shared/components/buttons/buttons.module'
 
 
 @NgModule({
   declarations: [
-    LoginComponent,
+    Login,
-    LogoutComponent,
+    Logout
-    Login
   ],
   imports: [
     SharedModule,

src/app/modules/accounts/accounts.ts

@@ -1,12 +1,11 @@
 import {Component, HostListener, ViewChild} from '@angular/core'
 import {FormControl, Validators} from '@angular/forms'
-import {ErrorHandlingComponent} from '../shared/components/subscribing.component'
+import {ErrorHandlingComponent, SubscribingComponent} from '../shared/components/subscribing.component'
 import {AccountService} from './services/account.service'
 import {AppState} from '../shared/app-state'
 import {ErrorHandler, ErrorService} from '../shared/service/error.service'
 import {ActivatedRoute, Router} from '@angular/router'
 import {CreForm, ICreForm} from "../shared/components/forms/forms";
-import {take, takeUntil} from "rxjs/operators";
 import {AlertService} from "../shared/service/alert.service";
 
 @Component({
@@ -61,3 +60,32 @@ export class Login extends ErrorHandlingComponent {
     }
   }
 }
+
+@Component({
+  selector: 'cre-logout',
+  template: ''
+})
+export class Logout extends SubscribingComponent {
+  constructor(
+    private accountService: AccountService,
+    private alertService: AlertService,
+    private appState: AppState,
+    errorService: ErrorService,
+    router: Router,
+    activatedRoute: ActivatedRoute
+  ) {
+    super(errorService, activatedRoute, router)
+    this.appState.title = 'Connexion'
+  }
+
+  ngOnInit(): void {
+    if (!this.appState.isAuthenticated) {
+      this.urlUtils.navigateTo('/account/login')
+    }
+
+    this.subscribeAndNavigate(
+      this.accountService.logout(),
+      '/account/login'
+    )
+  }
+}

src/app/modules/accounts/pages/login/login.component.html

@@ -1,36 +0,0 @@
-<form [formGroup]="form">
-  <mat-card class="x-centered y-centered">
-    <mat-card-header>
-      <mat-card-title>Connexion au système</mat-card-title>
-    </mat-card-header>
-    <mat-card-content>
-      <mat-form-field>
-        <mat-label>Numéro d'utilisateur</mat-label>
-        <input matInput [formControl]="idFormControl" type="text"/>
-        <mat-icon matSuffix>person</mat-icon>
-        <mat-error *ngIf="idFormControl.invalid">
-          <span *ngIf="idFormControl.errors.required">Un numéro d'utilisateur est requis</span>
-          <span *ngIf="idFormControl.errors.pattern">Le numéro d'utilisateur doit être un nombre</span>
-        </mat-error>
-      </mat-form-field>
-      <mat-form-field>
-        <mat-label>Mot de passe</mat-label>
-        <input matInput [formControl]="passwordFormControl" type="password"/>
-        <mat-icon matSuffix>lock</mat-icon>
-        <mat-error *ngIf="passwordFormControl.invalid">
-          <span *ngIf="passwordFormControl.errors.required">Un mot de passe est requis</span>
-        </mat-error>
-      </mat-form-field>
-    </mat-card-content>
-    <mat-card-actions class="justify-content-end">
-      <button
-        mat-raised-button
-        type="submit"
-        color="accent"
-        [disabled]="form.invalid"
-        (click)="submit()">
-        Connexion
-      </button>
-    </mat-card-actions>
-  </mat-card>
-</form>

src/app/modules/accounts/pages/login/login.component.sass

@@ -1,8 +0,0 @@
-mat-card
-  width: 25rem
-
-  .alert p
-    margin: 0
-
-  mat-form-field
-    width: 100%

src/app/modules/accounts/pages/login/login.component.ts

@@ -1,55 +0,0 @@
-import {Component, OnInit} from '@angular/core'
-import {FormBuilder, FormControl, FormGroup, Validators} from '@angular/forms'
-import {AccountService} from '../../services/account.service'
-import {ActivatedRoute, Router} from '@angular/router'
-import {ErrorService} from '../../../shared/service/error.service'
-import {ErrorHandlingComponent} from '../../../shared/components/subscribing.component'
-import {AppState} from '../../../shared/app-state'
-
-@Component({
-  selector: 'cre-login',
-  templateUrl: './login.component.html',
-  styleUrls: ['./login.component.sass']
-})
-export class LoginComponent extends ErrorHandlingComponent implements OnInit {
-  form: FormGroup
-  idFormControl: FormControl
-  passwordFormControl: FormControl
-
-  constructor(
-    private formBuilder: FormBuilder,
-    private accountService: AccountService,
-    private appState: AppState,
-    errorService: ErrorService,
-    router: Router,
-    activatedRoute: ActivatedRoute
-  ) {
-    super(errorService, activatedRoute, router)
-    this.appState.title = 'Connexion'
-  }
-
-  ngOnInit(): void {
-    this.errorService.activeErrorHandler = this
-
-    if (this.appState.isAuthenticated) {
-      this.router.navigate(['/color'])
-    }
-
-    this.idFormControl = this.formBuilder.control(null, Validators.compose([Validators.required, Validators.pattern(new RegExp('^[0-9]+$'))]))
-    this.passwordFormControl = this.formBuilder.control(null, Validators.required)
-    this.form = this.formBuilder.group({
-      id: this.idFormControl,
-      password: this.passwordFormControl
-    })
-  }
-
-  submit() {
-    this.subscribe(
-      this.accountService.login(
-        this.idFormControl.value,
-        this.passwordFormControl.value
-      ),
-      response => console.log(response)
-    )
-  }
-}

src/app/modules/accounts/pages/logout/logout.component.ts

@@ -1,35 +0,0 @@
-import {Component} from '@angular/core';
-import {AccountService} from "../../services/account.service";
-import {ActivatedRoute, Router} from "@angular/router";
-import {AppState} from "../../../shared/app-state";
-import {SubscribingComponent} from "../../../shared/components/subscribing.component";
-import {ErrorService} from "../../../shared/service/error.service";
-
-@Component({
-  selector: 'cre-logout',
-  templateUrl: './logout.component.html',
-  styleUrls: ['./logout.component.sass']
-})
-export class LogoutComponent extends SubscribingComponent {
-
-  constructor(
-    private accountService: AccountService,
-    private appState: AppState,
-    errorService: ErrorService,
-    router: Router,
-    activatedRoute: ActivatedRoute
-  ) {
-    super(errorService, activatedRoute, router)
-  }
-
-  ngOnInit(): void {
-    if (!this.appState.isAuthenticated) {
-      this.urlUtils.navigateTo('/account/login')
-    }
-
-    this.subscribeAndNavigate(
-      this.accountService.logout(),
-      '/account/login'
-    )
-  }
-}

src/app/modules/recipes/mix/mix.ts

@@ -27,7 +27,7 @@ abstract class _BaseMixPage extends SubscribingComponent {
     protected mixService: MixService,
     private recipeService: RecipeService,
     private materialTypeService: MaterialTypeService,
-    private materialService: MaterialService,
+    protected materialService: MaterialService,
     errorService: ErrorService,
     router: Router,
     activatedRoute: ActivatedRoute
@@ -50,13 +50,15 @@ abstract class _BaseMixPage extends SubscribingComponent {
 
   set recipe(recipe: Recipe) {
     this._recipe = recipe
-    this.materials$ = this.materialService.getAllForMixCreation(recipe.id)
+    this.materials$ = this.fetchMaterials(recipe.id)
   }
 
   get recipe(): Recipe {
     return this._recipe
   }
 
+  protected abstract fetchMaterials(recipeId: number): Observable<Material[]>
+
   abstract submit(dto: MixSaveDto)
 }
 
@@ -65,6 +67,10 @@ abstract class _BaseMixPage extends SubscribingComponent {
   templateUrl: 'add.html'
 })
 export class MixAdd extends _BaseMixPage {
+  protected fetchMaterials(recipeId: number): Observable<Material[]> {
+    return this.materialService.getAllForMixCreation(recipeId)
+  }
+
   submit(dto: MixSaveDto) {
     this.subscribeAndNavigate(
       this.mixService.saveDto(dto),
@@ -80,21 +86,27 @@ export class MixAdd extends _BaseMixPage {
 export class MixEdit extends _BaseMixPage {
   mix: Mix
 
+  private mixId: number
+
   ngOnInit() {
     super.ngOnInit()
 
+    this.mixId = this.urlUtils.parseIntUrlParam('id')
+
     this.fetchMix()
   }
 
   private fetchMix() {
-    const mixId = this.urlUtils.parseIntUrlParam('id')
-
     this.subscribe(
-      this.mixService.getById(mixId),
+      this.mixService.getById(this.mixId),
       mix => this.mix = mix
     )
   }
 
+  protected fetchMaterials(recipeId: number): Observable<Material[]> {
+    return this.materialService.getAllForMixUpdate(this.mixId)
+  }
+
   submit(dto: MixSaveDto) {
     this.subscribeAndNavigate(
       this.mixService.updateDto({...dto, id: this.mix.id}),