add back button in edit pages (#96)

closes #89

Reviewed-on: #96

frontend/allowance-planner-v2/src/app/pages/edit-allowance/edit-allowance.module.ts

@@ -7,6 +7,7 @@ import { IonicModule } from '@ionic/angular';
 import { EditAllowancePageRoutingModule } from './edit-allowance-routing.module';
 
 import { EditAllowancePage } from './edit-allowance.page';
+import { MatIconModule } from '@angular/material/icon';
 
 @NgModule({
   imports: [
@@ -14,7 +15,8 @@ import { EditAllowancePage } from './edit-allowance.page';
     FormsModule,
     IonicModule,
     EditAllowancePageRoutingModule,
-    ReactiveFormsModule
+    ReactiveFormsModule,
+    MatIconModule
   ],
   declarations: [EditAllowancePage]
 })

frontend/allowance-planner-v2/src/app/pages/edit-allowance/edit-allowance.page.html

@@ -1,6 +1,9 @@
 <ion-header [translucent]="true">
   <ion-toolbar>
     <div class="toolbar">
+      <div class="icon" (click)="navigateBack()">
+        <mat-icon>arrow_back</mat-icon>
+      </div>
       <ion-title *ngIf="isAddMode">Create Goal</ion-title>
       <ion-title *ngIf="!isAddMode && goalId != 0">Edit Goal</ion-title>
       <ion-title *ngIf="!isAddMode && goalId == 0">Edit Allowance</ion-title>

frontend/allowance-planner-v2/src/app/pages/edit-allowance/edit-allowance.page.scss

@@ -1,5 +1,6 @@
 .toolbar {
     display: flex;
+    align-items: center;
 }
 
 .remove-button {
@@ -53,4 +54,8 @@ button {
 button:disabled,
 button[disabled]{
     opacity: 0.5;
+}
+
+.icon {
+    margin-left: 5px;
 }

frontend/allowance-planner-v2/src/app/pages/edit-allowance/edit-allowance.page.ts

@@ -1,3 +1,4 @@
+import { Location } from '@angular/common';
 import { Component, OnInit } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { ActivatedRoute, Router } from '@angular/router';
@@ -31,7 +32,8 @@ export class EditAllowancePage implements OnInit {
     private route: ActivatedRoute,
     private formBuilder: FormBuilder,
     private allowanceService: AllowanceService,
-    private router: Router
+    private router: Router,
+    private location: Location
   ) {
     this.userId = this.route.snapshot.params['id'];
     this.goalId = this.route.snapshot.params['goalId'];
@@ -98,4 +100,8 @@ export class EditAllowancePage implements OnInit {
     this.allowanceService.deleteAllowance(this.goalId, this.userId);
     this.router.navigate(['/tabs/allowance', this.userId]);
   }
+
+  navigateBack() {
+    this.location.back();
+  }
 }