Fixed issue in hire navigation flow

src/app/app.component.ts

@@ -28,6 +28,11 @@ export class AppComponent {
       url: '/myreservation',
       icon: 'clipboard'
     },
+    {
+      title: 'My Rides',
+      url: '/hirebike',
+      icon: 'clipboard'
+    },
     {
       title: 'Logout',
       url: '/login',

src/app/hirebike/hirebike.page.html

@@ -4,16 +4,19 @@
       <ion-menu-button></ion-menu-button>
     </ion-buttons>
     <ion-title slot="start">
-      Hire Bike
+      My Ride
     </ion-title>
   </ion-toolbar>
 </ion-header>
 
 <ion-content>
   <div>
-    <ion-item>
+    <ion-item *ngIf="!isBikeHired">
       <ion-input type="text" [(ngModel)]="Destination" placeholder="Enter Destination"></ion-input>
     </ion-item>
+    <ion-item *ngIf="isBikeHired">
+      <ion-input type="text" [(ngModel)]="Destination" placeholder="Ongoing Trip" readonly></ion-input>
+    </ion-item>
   </div>
   <div #mapElement style="width: 100%; height: 100%" id="mapContainer"></div>
 </ion-content>

src/app/hirebike/hirebike.page.ts

@@ -74,6 +74,7 @@ export class HirebikePage implements OnInit {
         console.log('Reserved Bike', resp);
         if (resp.data) {
           this.reservedBike = resp.data;
+          this.isBikeHired=this.reservedBike.rented;
           //Call Bike Details api
           let bikeDetailsUrl = 'http://193.196.52.237:8081/bikes/' + this.reservedBike.bikeId;
           let bikeDetailsApi = this.httpClient.get(bikeDetailsUrl, { headers });
@@ -101,10 +102,9 @@ export class HirebikePage implements OnInit {
       bikeApi.subscribe((resp) => {
         console.log('my data: ', resp);
         this.toastService.showToast("Trip Started");
-        this.isBikeHired=true;
       }, (error) => {
         console.log(error)
-        this.toastService.showToast("Unable to Hire Bike")
+        this.toastService.showToast("This is ongoing Trip")
       });
     });
 

src/app/myreservation/myreservation.page.ts

@@ -23,6 +23,7 @@ export class MyreservationPage implements OnInit {
 
   reservedBike: any = {};
   bikeDetails: any = {};
+  isBikeHired=false;
 
   noReservation = true;
 
@@ -74,6 +75,7 @@ export class MyreservationPage implements OnInit {
         console.log('Reserved Bike', resp);
         if (resp.data) {
           this.reservedBike = resp.data;
+          this.isBikeHired = this.reservedBike.rented;
           //Call Bike Details api
           let bikeDetailsUrl = 'http://193.196.52.237:8081/bikes/' + this.reservedBike.bikeId;
           let bikeDetailsApi = this.httpClient.get(bikeDetailsUrl, { headers });
@@ -261,6 +263,9 @@ export class MyreservationPage implements OnInit {
     }
   };
   hireBike() {
+    if (this.isBikeHired)
+    this.toastService.showToast("You already Hired this bike");
+    else
     this.router.navigateByUrl('/hirebike');
   }
 }