#1 handle reservation not found

src/app/app-routing.module.ts

@@ -11,6 +11,7 @@ import { ViewTicketComponent } from './view-ticket/view-ticket.component';
 import { ReservationGuard } from './reservation/reservation.guard';
 import { ProcessingPaymentComponent } from './reservation/processing-payment/processing-payment.component';
 import { LanguageGuard } from './language.guard';
+import { NotFoundComponent } from './reservation/not-found/not-found.component';
 
 const routes: Routes = [
   { path: '', component: EventListComponent, canActivate: [LanguageGuard] },
@@ -21,7 +22,8 @@ const routes: Routes = [
     { path: 'waitingPayment', redirectTo: 'waiting-payment'},
     { path: 'waiting-payment', component: OfflinePaymentComponent, canActivate: [ReservationGuard] },
     { path: 'processing-payment', component: ProcessingPaymentComponent, canActivate: [ReservationGuard] },
-    { path: 'success', component: SuccessComponent, canActivate: [ReservationGuard]}
+    { path: 'success', component: SuccessComponent, canActivate: [ReservationGuard]},
+    { path: 'not-found', component: NotFoundComponent, canActivate: [ReservationGuard]}
   ]},
   { path: 'event/:eventShortName/ticket/:ticketId/view', component: ViewTicketComponent, canActivate: [LanguageGuard] }
 ];

src/app/app.module.ts

@@ -42,6 +42,7 @@ import { InvalidFeedbackDirective } from './shared/invalid-feedback.directive';
 import { AdditionalServiceComponent } from './additional-service/additional-service.component';
 import { RecaptchaComponent } from './recaptcha/recaptcha.component';
 import { CustomLoader } from './shared/i18n.service';
+import { NotFoundComponent } from './reservation/not-found/not-found.component';
 
 
 
@@ -78,7 +79,8 @@ export function HttpLoaderFactory(http: HttpClient) {
     InvoiceFormComponent,
     InvalidFeedbackDirective,
     AdditionalServiceComponent,
-    RecaptchaComponent
+    RecaptchaComponent,
+    NotFoundComponent
   ],
   imports: [
     BrowserModule,

src/app/model/reservation-info.ts

@@ -70,7 +70,7 @@ export class SummaryRow {
 
 export type ReservationStatus = 'PENDING' | 'IN_PAYMENT' | 'EXTERNAL_PROCESSING_PAYMENT' |
                                 'WAITING_EXTERNAL_CONFIRMATION' | 'OFFLINE_PAYMENT' |
-                                'COMPLETE' | 'STUCK' | 'CANCELLED' | 'CREDIT_NOTE_ISSUED';
+                                'COMPLETE' | 'STUCK' | 'CANCELLED' | 'CREDIT_NOTE_ISSUED' | 'NOT_FOUND';
 
 export type ItalianEInvoicingReferenceType = 'ADDRESSEE_CODE' | 'PEC' | 'NONE'
 

src/app/reservation/not-found/not-found.component.html

@@ -0,0 +1,2 @@
+<p>{{'reservation-page-not-found.reservation-with-id-does-not-exist'|translate: {'0':reservationId} }}</p>
+<p [innerHTML]="'reservation-page-not-found.go-back-to-event' | translate: {'0': eventUrl}"></p>

src/app/reservation/not-found/not-found.component.ts

@@ -0,0 +1,33 @@
+import { Component, OnInit } from '@angular/core';
+import { I18nService } from 'src/app/shared/i18n.service';
+import { ActivatedRoute, Router, UrlSerializer } from '@angular/router';
+import { EventService } from 'src/app/shared/event.service';
+
+@Component({
+  selector: 'app-not-found',
+  templateUrl: './not-found.component.html'
+})
+export class NotFoundComponent implements OnInit {
+
+  eventShortName: string;
+  reservationId: string;
+  eventUrl: string;
+
+  constructor(
+    private route: ActivatedRoute,
+    private router: Router,
+    private serializer: UrlSerializer,
+    private eventService: EventService,
+    private i18nService: I18nService) { }
+
+  ngOnInit() {
+    this.route.parent.params.subscribe(params => {
+      this.eventShortName = params['eventShortName'];
+      this.reservationId = params['reservationId'];
+      this.eventUrl = this.serializer.serialize(this.router.createUrlTree(['event', this.eventShortName]))
+      this.eventService.getEvent(this.eventShortName).subscribe(ev => {
+        this.i18nService.setPageTitle('reservation-page-not-found.header.title', ev.displayName);
+      });
+    });
+  }
+}

src/app/reservation/reservation.guard.ts

@@ -1,7 +1,7 @@
 import { Injectable } from '@angular/core';
 import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, UrlTree, Router } from '@angular/router';
-import { Observable } from 'rxjs';
-import { map } from 'rxjs/operators';
+import { Observable, of } from 'rxjs';
+import { map, catchError } from 'rxjs/operators';
 import { ReservationService } from '../shared/reservation.service';
 import { ReservationStatus } from '../model/reservation-info';
 import { SuccessComponent } from './success/success.component';
@@ -10,6 +10,7 @@ import { BookingComponent } from './booking/booking.component';
 import { OfflinePaymentComponent } from './offline-payment/offline-payment.component';
 import { ReservationComponent } from './reservation.component';
 import { ProcessingPaymentComponent } from './processing-payment/processing-payment.component';
+import { NotFoundComponent } from './not-found/not-found.component';
 
 @Injectable({
     providedIn: 'root'
@@ -34,13 +35,11 @@ export class ReservationGuard implements CanActivate {
     }
 
     private checkAndRedirect(eventShortName: string, reservationId: string, component: any): Observable<boolean | UrlTree> {
-        return this.reservationService.getReservationStatusInfo(eventShortName, reservationId).pipe(map(reservation => {
-
+        return this.reservationService.getReservationStatusInfo(eventShortName, reservationId).pipe(catchError(err => of({status: <ReservationStatus>'NOT_FOUND' , validatedBookingInformation: false})), map(reservation => {
             const selectedComponent = getCorrespondingController(reservation.status, reservation.validatedBookingInformation);
             if (component === selectedComponent) {
                 return true;
             }
-
             return this.router.createUrlTree(getRouteFromComponent(selectedComponent, eventShortName, reservationId));
         }));
     }
@@ -57,6 +56,8 @@ function getRouteFromComponent(component: any, eventShortName: string, reservati
         return ['event', eventShortName, 'reservation', reservationId, 'waiting-payment'];
     } else if (component === ProcessingPaymentComponent) {
         return ['event', eventShortName, 'reservation', reservationId, 'processing-payment'];
+    } else if (component === NotFoundComponent) {
+        return ['event', eventShortName, 'reservation', reservationId, 'not-found']
     }
 }
 
@@ -67,6 +68,7 @@ function getCorrespondingController(status: ReservationStatus, validatedBookingI
         case 'OFFLINE_PAYMENT': return OfflinePaymentComponent;
         case 'EXTERNAL_PROCESSING_PAYMENT':
         case 'WAITING_EXTERNAL_CONFIRMATION': return ProcessingPaymentComponent;
+        case 'NOT_FOUND': return NotFoundComponent;
         case 'IN_PAYMENT':
         case 'STUCK': break;
     }

src/app/reservation/success/success.component.ts

@@ -1,13 +1,12 @@
 import { Component, OnInit } from '@angular/core';
 import { ReservationService } from '../../shared/reservation.service';
-import { ActivatedRoute, Router } from '@angular/router';
+import { ActivatedRoute } from '@angular/router';
 import { Event } from 'src/app/model/event';
 import { EventService } from 'src/app/shared/event.service';
 import { TicketService } from 'src/app/shared/ticket.service';
 import { Ticket } from 'src/app/model/ticket';
 import { ReservationInfo } from 'src/app/model/reservation-info';
 import { I18nService } from 'src/app/shared/i18n.service';
-import { HttpErrorResponse } from '@angular/common/http';
 import { AnalyticsService } from 'src/app/shared/analytics.service';
 import { handleServerSideValidationError } from 'src/app/shared/validation-helper';
 import { FormGroup } from '@angular/forms';
@@ -36,7 +35,6 @@ export class SuccessComponent implements OnInit {
 
   constructor(
     private route: ActivatedRoute,
-    private router: Router,
     private reservationService: ReservationService,
     private eventService: EventService,
     private ticketService: TicketService,
@@ -72,13 +70,6 @@ export class SuccessComponent implements OnInit {
           this.ticketsAllAssigned = this.ticketsAllAssigned && ticket.assigned;
         });
       });
-    }, err => {
-      // reservation has been cancelled!
-      if (err instanceof HttpErrorResponse && err.status === 404) {
-        this.router.navigate(['event', this.eventShortName]);
-      } else {
-        console.log('error while loading reservation ', this.reservationId);
-      }
     });
   }