From 2d41b4e5117ad324c1451777e1bc57fcaa784720 Mon Sep 17 00:00:00 2001
From: Oliver Lance <olly.lance15@gmail.com>
Date: Mon, 20 Jul 2020 10:15:20 -0400
Subject: [PATCH 1/5] add following already check

---
 .../src/app/user-page/user-page.component.ts  | 36 +++++++++++++++++--
 1 file changed, 34 insertions(+), 2 deletions(-)

diff --git a/angularSTEP/src/app/user-page/user-page.component.ts b/angularSTEP/src/app/user-page/user-page.component.ts
index 7604ae4..ad0db16 100644
--- a/angularSTEP/src/app/user-page/user-page.component.ts
+++ b/angularSTEP/src/app/user-page/user-page.component.ts
@@ -1,5 +1,6 @@
 import {ActivatedRoute, Router} from '@angular/router';
 import {AngularFirestore} from '@angular/fire/firestore';
+import {AngularFireAuth} from '@angular/fire/auth';
 import {Component, OnInit} from '@angular/core';
 import {User} from '../user';
 import {Converter} from '../converter';
@@ -15,12 +16,27 @@ export class UserPageComponent implements OnInit {
   displayName = '';
   picUrl = 'assets/images/blank-profile.png';
   profileLoaded = false;
+  userFollowing = false;
+  currentUserUid!: string;
+  currentUser: User | undefined = undefined;
 
   constructor(
     private router: Router,
     private activatedRoute: ActivatedRoute,
-    private afs: AngularFirestore
-  ) {}
+    private afs: AngularFirestore,
+    private fAuth: AngularFireAuth
+  ) {
+    this.fAuth.onAuthStateChanged(auth => {
+      if (auth) {
+        this.loggedIn = true;
+        this.currentUserUid = auth.uid;
+      } else {
+        this.loggedIn = false;
+        this.currentUser = undefined;
+        this.userFollowing = false;
+      }
+    });
+  }
 
   ngOnInit() {
     const username = this.activatedRoute.snapshot.paramMap.get('username');
@@ -42,6 +58,7 @@ export class UserPageComponent implements OnInit {
         .doc('/users/' + postUsername.data()?.uid + '/')
         .ref.withConverter(new Converter().userConverter)
         .get();
+      this.userFollowing = await this.isUserFollowing(postUsername.data()?.uid);
       if (postUser !== null && postUser.data() !== undefined) {
         const user: User = postUser.data()!;
         this.displayName = user.displayName !== null ? user.displayName : '';
@@ -55,4 +72,19 @@ export class UserPageComponent implements OnInit {
       }
     }
   }
+
+  async isUserFollowing(uid: string | undefined){
+    if(uid && this.loggedIn && this.currentUserUid){
+      const postUser = await this.afs.firestore
+      .doc('/users/' + this.currentUserUid + '/').withConverter(new Converter().userConverter).get();
+      if(postUser){
+        this.currentUser = postUser.data();
+        if(this.currentUser && this.currentUser.following.indexOf(uid) > -1){
+          return true;
+        }
+      }
+    }
+    return false;
+  }
+
 }

From 532b57adede905709bc55d83610fb7c443a24608 Mon Sep 17 00:00:00 2001
From: Oliver Lance <olly.lance15@gmail.com>
Date: Mon, 20 Jul 2020 12:31:54 -0400
Subject: [PATCH 2/5] add follow & unfollow functionality

---
 .../app/user-page/user-page.component.html    |  2 +
 .../src/app/user-page/user-page.component.ts  | 65 ++++++++++++++++---
 .../view-profiles/view-profiles.component.ts  |  9 ++-
 3 files changed, 63 insertions(+), 13 deletions(-)

diff --git a/angularSTEP/src/app/user-page/user-page.component.html b/angularSTEP/src/app/user-page/user-page.component.html
index 950a9ac..e053408 100644
--- a/angularSTEP/src/app/user-page/user-page.component.html
+++ b/angularSTEP/src/app/user-page/user-page.component.html
@@ -4,6 +4,8 @@
         <div class="name-header">
             <h1>{{ displayName }}</h1>
             <h3>@{{ username }}</h3>
+            <button *ngIf='!userFollowing && loggedIn' (click)='follow()' mat-button color="primary">Follow <mat-icon>check</mat-icon></button>
+            <button *ngIf='userFollowing && loggedIn' (click)='unfollow()' mat-button color="accent">Unfollow <mat-icon>close</mat-icon></button>
         </div>
     </div>
     <button mat-button routerLink="/users">Back</button>
diff --git a/angularSTEP/src/app/user-page/user-page.component.ts b/angularSTEP/src/app/user-page/user-page.component.ts
index ad0db16..3d3d56e 100644
--- a/angularSTEP/src/app/user-page/user-page.component.ts
+++ b/angularSTEP/src/app/user-page/user-page.component.ts
@@ -12,13 +12,14 @@ import {Converter} from '../converter';
 })
 export class UserPageComponent implements OnInit {
   username = '';
+  currentPageUid = '';
   loggedIn = false;
   displayName = '';
   picUrl = 'assets/images/blank-profile.png';
   profileLoaded = false;
   userFollowing = false;
   currentUserUid!: string;
-  currentUser: User | undefined = undefined;
+  currentUserData: User | undefined = undefined;
 
   constructor(
     private router: Router,
@@ -32,7 +33,7 @@ export class UserPageComponent implements OnInit {
         this.currentUserUid = auth.uid;
       } else {
         this.loggedIn = false;
-        this.currentUser = undefined;
+        this.currentUserData = undefined;
         this.userFollowing = false;
       }
     });
@@ -54,11 +55,12 @@ export class UserPageComponent implements OnInit {
       .ref.withConverter(new Converter().usernameConverter)
       .get();
     if (postUsername !== null && postUsername.data() !== undefined) {
+      this.currentPageUid = postUsername.data()?.uid!;
       const postUser = await this.afs
-        .doc('/users/' + postUsername.data()?.uid + '/')
+        .doc('/users/' + this.currentPageUid + '/')
         .ref.withConverter(new Converter().userConverter)
         .get();
-      this.userFollowing = await this.isUserFollowing(postUsername.data()?.uid);
+      this.userFollowing = await this.isUserFollowing();
       if (postUser !== null && postUser.data() !== undefined) {
         const user: User = postUser.data()!;
         this.displayName = user.displayName !== null ? user.displayName : '';
@@ -73,13 +75,18 @@ export class UserPageComponent implements OnInit {
     }
   }
 
-  async isUserFollowing(uid: string | undefined){
-    if(uid && this.loggedIn && this.currentUserUid){
+  async isUserFollowing() {
+    if (this.currentPageUid && this.loggedIn && this.currentUserUid) {
       const postUser = await this.afs.firestore
-      .doc('/users/' + this.currentUserUid + '/').withConverter(new Converter().userConverter).get();
-      if(postUser){
-        this.currentUser = postUser.data();
-        if(this.currentUser && this.currentUser.following.indexOf(uid) > -1){
+        .doc('/users/' + this.currentUserUid + '/')
+        .withConverter(new Converter().userConverter)
+        .get();
+      if (postUser) {
+        this.currentUserData = postUser.data();
+        if (
+          this.currentUserData &&
+          this.currentUserData.following.indexOf(this.currentPageUid) > -1
+        ) {
           return true;
         }
       }
@@ -87,4 +94,42 @@ export class UserPageComponent implements OnInit {
     return false;
   }
 
+  follow() {
+    if (this.currentUserData && this.currentUserData.following) {
+      this.currentUserData.following.push(this.currentPageUid);
+      this.fAuth.currentUser.then(user => {
+        if (user) {
+          this.afs
+            .collection('users')
+            .doc(this.currentUserUid)
+            .ref.withConverter(new Converter().userConverter)
+            .update({following: this.currentUserData!.following})
+            .then(() => {
+              this.userFollowing = true;
+            });
+        }
+      });
+    }
+  }
+
+  unfollow() {
+    if (this.currentUserData && this.currentUserData.following) {
+      const index = this.currentUserData.following.indexOf(this.currentPageUid);
+      if (index > -1) {
+        this.currentUserData.following.splice(index, 1);
+        this.fAuth.currentUser.then(user => {
+          if (user) {
+            this.afs
+              .collection('users')
+              .doc(this.currentUserUid)
+              .ref.withConverter(new Converter().userConverter)
+              .update({following: this.currentUserData!.following})
+              .then(() => {
+                this.userFollowing = false;
+              });
+          }
+        });
+      }
+    }
+  }
 }
diff --git a/angularSTEP/src/app/view-profiles/view-profiles.component.ts b/angularSTEP/src/app/view-profiles/view-profiles.component.ts
index e2a7371..17ab55b 100644
--- a/angularSTEP/src/app/view-profiles/view-profiles.component.ts
+++ b/angularSTEP/src/app/view-profiles/view-profiles.component.ts
@@ -2,7 +2,7 @@ import {
   AngularFirestore,
   AngularFirestoreCollection,
 } from '@angular/fire/firestore';
-import {Component, OnInit} from '@angular/core';
+import {Component, OnInit, NgZone} from '@angular/core';
 
 import {AngularFireAuth} from '@angular/fire/auth';
 import {Observable} from 'rxjs';
@@ -22,7 +22,8 @@ export class ViewProfilesComponent implements OnInit {
   constructor(
     public fAuth: AngularFireAuth,
     private router: Router,
-    private afs: AngularFirestore
+    private afs: AngularFirestore,
+    private zone: NgZone
   ) {
     this.userCollection = this.afs.collection('users');
     this.users = this.userCollection.valueChanges();
@@ -37,7 +38,9 @@ export class ViewProfilesComponent implements OnInit {
   }
 
   goToUser(username: string) {
-    this.router.navigate(['users/' + username]);
+    this.zone.run(() => {
+      this.router.navigate(['users/', username]);
+    })
   }
 
   ngOnInit() {}

From 72493e92c87ca4f99ffd69f23740467325e4a639 Mon Sep 17 00:00:00 2001
From: Oliver Lance <olly.lance15@gmail.com>
Date: Fri, 24 Jul 2020 08:15:59 -0400
Subject: [PATCH 3/5] fix private vs public issue

---
 .../app/current-profile-page/current-profile-page.component.ts  | 2 +-
 angularSTEP/src/app/email/email.component.ts                    | 2 +-
 angularSTEP/src/app/home/home.component.ts                      | 2 +-
 angularSTEP/src/app/login/login.component.ts                    | 2 +-
 angularSTEP/src/app/profile-menu/profile-menu.component.ts      | 2 +-
 angularSTEP/src/app/setup/setup.component.ts                    | 2 +-
 angularSTEP/src/app/signup/signup.component.ts                  | 2 +-
 angularSTEP/src/app/view-profiles/view-profiles.component.ts    | 2 +-
 8 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/angularSTEP/src/app/current-profile-page/current-profile-page.component.ts b/angularSTEP/src/app/current-profile-page/current-profile-page.component.ts
index bd49f10..df94785 100644
--- a/angularSTEP/src/app/current-profile-page/current-profile-page.component.ts
+++ b/angularSTEP/src/app/current-profile-page/current-profile-page.component.ts
@@ -19,7 +19,7 @@ export class CurrentProfilePageComponent implements OnInit {
   user!: User;
 
   constructor(
-    public fAuth: AngularFireAuth,
+    private fAuth: AngularFireAuth,
     private router: Router,
     private route: ActivatedRoute,
     private afs: AngularFirestore,
diff --git a/angularSTEP/src/app/email/email.component.ts b/angularSTEP/src/app/email/email.component.ts
index 89a4a29..7b53e5d 100644
--- a/angularSTEP/src/app/email/email.component.ts
+++ b/angularSTEP/src/app/email/email.component.ts
@@ -15,7 +15,7 @@ export class EmailComponent implements OnInit {
   logInForm: FormGroup;
 
   constructor(
-    public fAuth: AngularFireAuth,
+    private fAuth: AngularFireAuth,
     private router: Router,
     private fb: FormBuilder
   ) {
diff --git a/angularSTEP/src/app/home/home.component.ts b/angularSTEP/src/app/home/home.component.ts
index 79fc5b9..46943e4 100644
--- a/angularSTEP/src/app/home/home.component.ts
+++ b/angularSTEP/src/app/home/home.component.ts
@@ -12,7 +12,7 @@ import { AngularFireAuth } from '@angular/fire/auth';
 })
 export class HomeComponent implements OnInit {
 
-  constructor(public fAuth: AngularFireAuth, private afs: AngularFirestore) {}
+  constructor(private fAuth: AngularFireAuth, private afs: AngularFirestore) {}
 
   ngOnInit() {}
 }
diff --git a/angularSTEP/src/app/login/login.component.ts b/angularSTEP/src/app/login/login.component.ts
index ae2a8f8..d798e38 100644
--- a/angularSTEP/src/app/login/login.component.ts
+++ b/angularSTEP/src/app/login/login.component.ts
@@ -18,7 +18,7 @@ export class LoginComponent implements OnInit {
   //and there is no user in the database linked to the account
   //it will delete the user (in case user refreshes page before
   //setting a username but after signing in with Google
-  constructor(public fAuth: AngularFireAuth, public router: Router) {}
+  constructor(private fAuth: AngularFireAuth, private router: Router) {}
 
   //checks if google user is new, if so, calls setup component to
   //allow the user to create a username, if not new, redirects to home page
diff --git a/angularSTEP/src/app/profile-menu/profile-menu.component.ts b/angularSTEP/src/app/profile-menu/profile-menu.component.ts
index 637ead8..0aa66e5 100644
--- a/angularSTEP/src/app/profile-menu/profile-menu.component.ts
+++ b/angularSTEP/src/app/profile-menu/profile-menu.component.ts
@@ -20,7 +20,7 @@ export class ProfileMenuComponent implements OnInit {
   routerCheck!: Subscription;
 
   constructor(
-    public fAuth: AngularFireAuth,
+    private fAuth: AngularFireAuth,
     private router: Router,
     private afs: AngularFirestore,
     private zone: NgZone
diff --git a/angularSTEP/src/app/setup/setup.component.ts b/angularSTEP/src/app/setup/setup.component.ts
index 49b8fb6..2e8d0c3 100644
--- a/angularSTEP/src/app/setup/setup.component.ts
+++ b/angularSTEP/src/app/setup/setup.component.ts
@@ -21,7 +21,7 @@ export class SetupComponent implements OnInit {
   picUrl = '';
 
   constructor(
-    public fAuth: AngularFireAuth,
+    private fAuth: AngularFireAuth,
     private router: Router,
     private fb: FormBuilder,
     private afs: AngularFirestore
diff --git a/angularSTEP/src/app/signup/signup.component.ts b/angularSTEP/src/app/signup/signup.component.ts
index b88fd02..ee362a4 100644
--- a/angularSTEP/src/app/signup/signup.component.ts
+++ b/angularSTEP/src/app/signup/signup.component.ts
@@ -19,7 +19,7 @@ export class SignupComponent implements OnInit {
   picUrl = '';
 
   constructor(
-    public fAuth: AngularFireAuth,
+    private fAuth: AngularFireAuth,
     private router: Router,
     private fb: FormBuilder,
     private afs: AngularFirestore
diff --git a/angularSTEP/src/app/view-profiles/view-profiles.component.ts b/angularSTEP/src/app/view-profiles/view-profiles.component.ts
index 17ab55b..b2c738a 100644
--- a/angularSTEP/src/app/view-profiles/view-profiles.component.ts
+++ b/angularSTEP/src/app/view-profiles/view-profiles.component.ts
@@ -20,7 +20,7 @@ export class ViewProfilesComponent implements OnInit {
   users: Observable<User[]>;
 
   constructor(
-    public fAuth: AngularFireAuth,
+    private fAuth: AngularFireAuth,
     private router: Router,
     private afs: AngularFirestore,
     private zone: NgZone

From 944394b8f5bc93b19d833a7c367223b6e704ebf6 Mon Sep 17 00:00:00 2001
From: Oliver Lance <olly.lance15@gmail.com>
Date: Mon, 27 Jul 2020 15:41:09 -0400
Subject: [PATCH 4/5] fix design of signing in

---
 angularSTEP/src/app/converter.ts               |  2 +-
 angularSTEP/src/app/setup/setup.component.ts   | 14 +++++++-------
 angularSTEP/src/app/signup/signup.component.ts | 14 +++++++-------
 3 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/angularSTEP/src/app/converter.ts b/angularSTEP/src/app/converter.ts
index 10fc85b..41cb564 100644
--- a/angularSTEP/src/app/converter.ts
+++ b/angularSTEP/src/app/converter.ts
@@ -14,7 +14,7 @@ export class Converter {
         username: user.username,
         email: user.email,
         picUrl: user.picUrl,
-        timestamp: user.time,
+        time: user.time,
         recipes: user.recipes,
         wishlist: user.wishlist,
         shoppingList: user.shoppingList,
diff --git a/angularSTEP/src/app/setup/setup.component.ts b/angularSTEP/src/app/setup/setup.component.ts
index 2e8d0c3..4ee8567 100644
--- a/angularSTEP/src/app/setup/setup.component.ts
+++ b/angularSTEP/src/app/setup/setup.component.ts
@@ -37,12 +37,6 @@ export class SetupComponent implements OnInit {
   //creates and adds a user to Firestore
   addUser(dName: string, email: string, uid: string) {
     return this.afs
-      .collection('usernames')
-      .doc(this.usernameForm.value.username)
-      .ref.withConverter(new Converter().usernameConverter)
-      .set(new Username(this.usernameForm.value.username, uid))
-      .then(() => {
-        this.afs
           .collection('users')
           .doc(uid)
           .ref.withConverter(new Converter().userConverter)
@@ -61,7 +55,13 @@ export class SetupComponent implements OnInit {
             )
           )
           .then(() => {
-            this.router.navigate(['/home']);
+            this.afs
+            .collection('usernames')
+            .doc(this.usernameForm.value.username)
+            .ref.withConverter(new Converter().usernameConverter)
+            .set(new Username(this.usernameForm.value.username, uid))
+            .then(() => {
+              this.router.navigate(['/home']);
           });
       });
   }
diff --git a/angularSTEP/src/app/signup/signup.component.ts b/angularSTEP/src/app/signup/signup.component.ts
index ee362a4..a0f9e1c 100644
--- a/angularSTEP/src/app/signup/signup.component.ts
+++ b/angularSTEP/src/app/signup/signup.component.ts
@@ -78,12 +78,6 @@ export class SignupComponent implements OnInit {
   //creates the user and adds it to Firestore
   addUser(uid: string) {
     return this.afs
-      .collection('usernames')
-      .doc(this.signUpForm.value.username)
-      .ref.withConverter(new Converter().usernameConverter)
-      .set(new Username(this.signUpForm.value.username, uid))
-      .then(() => {
-        this.afs
           .collection('users')
           .doc(uid)
           .ref.withConverter(new Converter().userConverter)
@@ -102,7 +96,13 @@ export class SignupComponent implements OnInit {
             )
           )
           .then(() => {
-            this.router.navigate(['/home']);
+            this.afs
+            .collection('usernames')
+            .doc(this.signUpForm.value.username)
+            .ref.withConverter(new Converter().usernameConverter)
+            .set(new Username(this.signUpForm.value.username, uid))
+            .then(() => {
+              this.router.navigate(['/home']);
           });
       });
   }

From 4ba1a0f0df5556d33d761a3b60feddb0f91cc991 Mon Sep 17 00:00:00 2001
From: Oliver Lance <olly.lance15@gmail.com>
Date: Mon, 27 Jul 2020 15:57:39 -0400
Subject: [PATCH 5/5] add better readability

---
 .../src/app/user-page/user-page.component.ts  | 47 ++++++++++---------
 1 file changed, 24 insertions(+), 23 deletions(-)

diff --git a/angularSTEP/src/app/user-page/user-page.component.ts b/angularSTEP/src/app/user-page/user-page.component.ts
index 3d3d56e..4add8a1 100644
--- a/angularSTEP/src/app/user-page/user-page.component.ts
+++ b/angularSTEP/src/app/user-page/user-page.component.ts
@@ -1,9 +1,10 @@
 import {ActivatedRoute, Router} from '@angular/router';
 import {AngularFirestore} from '@angular/fire/firestore';
 import {AngularFireAuth} from '@angular/fire/auth';
-import {Component, OnInit} from '@angular/core';
+import {Component, OnInit, NgZone} from '@angular/core';
 import {User} from '../user';
 import {Converter} from '../converter';
+import { templateJitUrl } from '@angular/compiler';
 
 @Component({
   selector: 'app-user-page',
@@ -25,7 +26,8 @@ export class UserPageComponent implements OnInit {
     private router: Router,
     private activatedRoute: ActivatedRoute,
     private afs: AngularFirestore,
-    private fAuth: AngularFireAuth
+    private fAuth: AngularFireAuth,
+    private zone: NgZone
   ) {
     this.fAuth.onAuthStateChanged(auth => {
       if (auth) {
@@ -94,9 +96,16 @@ export class UserPageComponent implements OnInit {
     return false;
   }
 
-  follow() {
+  setFollowing(follow: boolean){
     if (this.currentUserData && this.currentUserData.following) {
-      this.currentUserData.following.push(this.currentPageUid);
+      if(follow){
+        this.currentUserData.following.push(this.currentPageUid);
+      } else {
+        const index = this.currentUserData.following.indexOf(this.currentPageUid);
+        if (index > -1) {
+          this.currentUserData.following.splice(index, 1);
+        }
+      }
       this.fAuth.currentUser.then(user => {
         if (user) {
           this.afs
@@ -105,31 +114,23 @@ export class UserPageComponent implements OnInit {
             .ref.withConverter(new Converter().userConverter)
             .update({following: this.currentUserData!.following})
             .then(() => {
-              this.userFollowing = true;
+                this.userFollowing = follow;
             });
         }
       });
     }
   }
 
+  follow() {
+    this.zone.run(() => {
+      this.setFollowing(true);
+    })
+  }
+  
+
   unfollow() {
-    if (this.currentUserData && this.currentUserData.following) {
-      const index = this.currentUserData.following.indexOf(this.currentPageUid);
-      if (index > -1) {
-        this.currentUserData.following.splice(index, 1);
-        this.fAuth.currentUser.then(user => {
-          if (user) {
-            this.afs
-              .collection('users')
-              .doc(this.currentUserUid)
-              .ref.withConverter(new Converter().userConverter)
-              .update({following: this.currentUserData!.following})
-              .then(() => {
-                this.userFollowing = false;
-              });
-          }
-        });
-      }
-    }
+    this.zone.run(() => {
+      this.setFollowing(false)
+    })
   }
 }