feat - users manager

Author: 1001daysofcode

.sourcemaps/main.js.map

@@ -53,7 +53,9 @@ export class HomePage {
     this.postsLoaded = false;
     this.requestUID().then((uid) => {
       this.uid = uid;
-      this.loadHome();
+      this.checkIfProfileBlocked().subscribe(() => {
+        this.loadHome();
+      })
     });
     this.initPushNotification();
   }
@@ -71,7 +73,6 @@ export class HomePage {
   }
 
   loadHome() {
-    this.checkIfProfileBlocked();
     this.startLoader();
     this.timestampFeed().subscribe(() => {
       if (this.feedTimestamp.day == 'Sunday') { this.sunday = true } 
@@ -234,10 +235,14 @@ export class HomePage {
   }
 
   checkIfProfileBlocked() {
-    this.requestProfile().subscribe((profile) => {
-      if (profile.blocked) {
-        this.handleBlocked();
-      }
+    return Observable.create((observer) => {
+      return this.requestProfile().subscribe((profile) => {
+        if (profile.blocked) {
+          this.handleBlocked();
+        } else {
+          observer.next()
+        }
+      });
     });
   }
 
@@ -287,6 +292,8 @@ export class HomePage {
 
   handleBlocked() {
     this.navCtrl.setRoot(LoginPage);
+    this.firebase.logOut();
+    this.storage.clear();
     this.presentBlocked();
   }
 
@@ -296,7 +303,7 @@ export class HomePage {
       message: 'This account has been blocked',
       buttons: [
         {
-          text: 'Okay',
+          text: 'Ok',
         }
       ]
     });

src/pages/home/home.ts

@@ -11,7 +11,7 @@
   <header></header>
   <ion-row *ngIf="this.thereAreFlaggedPosts">
     <ion-col text-center>
-      <h2>Reported Posts</h2>
+      <h3>Reported Posts</h3>
     </ion-col>
   </ion-row>
   <div *ngIf="this.thereAreFlaggedPosts" class="flagged-posts">

src/pages/posts-manager/posts-manager.html

@@ -144,20 +144,22 @@ describe('PostsManagerPage', () => {
         expect(component.title).toBe('Posts Manager');
     });
 
-    it('should display reported posts', () => {
-        let de: DebugElement;
-        let el: HTMLElement;
-        de = fixture.debugElement.query(By.css('h2'));
-        el = de.nativeElement.innerHTML
-        expect(el).toContain('Reported Posts')
-    });
-
     it('should load flagged posts on view load', () => {
         spyOn(component, 'loadFlaggedPosts').and.returnValue({ subscribe: () => {}});
         component.ionViewDidLoad();
         expect(component.loadFlaggedPosts).toHaveBeenCalled();
     });
 
+    it('should display reported posts if there are any', () => {
+        component.thereAreFlaggedPosts = true;
+        fixture.detectChanges();
+        let de: DebugElement;
+        let el: HTMLElement;
+        de = fixture.debugElement.query(By.css('h3'));
+        el = de.nativeElement.innerHTML
+        expect(el).toContain('Reported Posts')
+    });
+
     it('should restore post', fakeAsync(() => {
         component.firebase.list('testPath').push('post')
         tick();

src/pages/posts-manager/posts-manager.spec.ts

@@ -34,9 +34,6 @@ export class PostsManagerPage {
   loadFlaggedPosts() {
     let path = 'flagged/posts';
     this.firebase.list(path).subscribe((flaggedPosts) => {
-      console.log("Got flagged posts");
-      console.log(flaggedPosts);
-      console.log("There are flagged posts " + this.thereAreFlaggedPosts)
       if (flaggedPosts.length > 0) {
         this.flaggedPosts = flaggedPosts;
         this.thereAreFlaggedPosts = true;
@@ -45,8 +42,6 @@ export class PostsManagerPage {
   }
 
   restorePost(post) {
-    console.log("Restoring post");
-    console.log("post");
     post.onFeed = true;
     post.flagged = false;
     post.flaggedId = null;
@@ -62,8 +57,6 @@ export class PostsManagerPage {
   getPosts(searchbar) {
     let search = searchbar.srcElement.value;
     this.firebase.queriedList('posts', 'title', search).subscribe((posts) => {
-      console.log("Got posts");
-      console.log(posts);
       if (posts.length > 0) {
         this.posts = []
         this.posts = posts;

src/pages/posts-manager/posts-manager.ts

@@ -9,6 +9,11 @@
         <ion-icon name="ios-options"></ion-icon>
       </button>
     </ion-buttons>
+    <ion-buttons *ngIf="editor" end>
+        <button ion-button icon-only (click)="blockUser()">
+          <ion-icon name="ios-flag"></ion-icon>
+        </button>
+      </ion-buttons>
   </ion-navbar>
 </ion-header>
 

src/pages/profile/profile.html

@@ -34,6 +34,7 @@ export class ProfilePage {
   twitter: any;
   linkedin: any;
   refreshing: any;
+  editor = false;
 
   constructor(
     private navCtrl: NavController,
@@ -60,6 +61,8 @@ export class ProfilePage {
         if (mine) {
           this.mine = true;
           this.checkForFlaggedPosts();
+        } else {
+          this.checkIfEditor();
         }
       });
       this.syncProfile();
@@ -137,6 +140,15 @@ export class ProfilePage {
     });
   }
 
+  checkIfEditor() {
+    this.requestUID().then((uid) => {
+      let path = 'users/' + uid
+      this.firebase.object(path).subscribe((user) => {
+        if (user.editor) this.editor = true;
+      });
+    });
+  }
+
   requestUID() {
     return this.storage.ready().then(() => {
       return this.storage.get(('uid'));
@@ -372,4 +384,25 @@ export class ProfilePage {
     this.navCtrl.push(CreateStatementPage);
   }
 
+  blockUser() {
+    console.log("Block user clicked");
+    this.profile.blocked = true;
+    let path = '/users/' + this.uid;
+    this.firebase.object(path).update(this.profile).then(() => {
+      this.firebase.list('flagged/users').push(this.profile).then((token) => {
+        this.addIDToFlaggedUser(token).then(() => {
+          this.navCtrl.setRoot(AccountPage);
+        });
+      });
+    });
+  }
+
+  addIDToFlaggedUser(token) {
+    let path = 'flagged/users/' + token.key;
+    let post = {
+      flaggedID: token.key
+    }
+    return this.firebase.object(path).update(post)
+  }
+  
 }

src/pages/profile/profile.ts

@@ -6,8 +6,52 @@
     <ion-title color='primary'>{{title}}</ion-title>
   </ion-navbar>
 </ion-header>
-
-
-<ion-content padding>
-
+<ion-content>
+  <header></header>
+  <ion-row *ngIf="this.thereAreBlockedUsers">
+    <ion-col text-center>
+      <h3>Blocked Users</h3>
+    </ion-col>
+  </ion-row>
+  <div *ngIf="this.thereAreBlockedUsers" class="flagged-users">
+    <ion-list>
+      <ion-item (click)="viewProfile(blockedUser.id)" *ngFor="let blockedUser of blockedUsers">
+        <ion-row text-center>
+          <ion-col>
+            {{ blockedUser.name }}
+          </ion-col>
+          <ion-col>
+            <button id="unblockUserButton" ion-button (click)="unblockUser(blockedUser)" color="primary" round>Unblock User</button>
+          </ion-col>
+        </ion-row>
+      </ion-item>
+    </ion-list>
+  </div>
+  <div class="flagged-users" *ngIf="!this.thereAreBlockedUsers">
+    <ion-row>
+      <ion-col text-center>
+        <h6>There are no blocked users</h6>
+      </ion-col>
+    </ion-row>
+  </div>
+  <ion-searchbar placeholder="Search By User Email" (ionInput)="getUsers($event)"></ion-searchbar>
+  <ion-card (click)="viewProfile(user.uid)" *ngFor="let user of users">
+    <ion-row text-center>
+      <ion-col>
+        <b>
+          <h4>{{ user?.name}} </h4>
+        </b>
+      </ion-col>
+    </ion-row>
+    <ion-row text-center>
+      <ion-col>
+        <img class="avatar" src="{{ user?.photo }}">
+      </ion-col>
+    </ion-row>
+    <ion-row text-center *ngIf="user?.bio">
+      <ion-col>
+        <h6 class="bio">{{ user?.bio}} </h6>
+      </ion-col>
+    </ion-row>
+  </ion-card>
 </ion-content>

src/pages/users-manager/users-manager.html

@@ -1,3 +1,17 @@
 page-users-manager {
 
+    .flagged-users {
+        border-top: thick solid color($colors, primary);   
+        border-bottom: thick solid color($colors, primary); 
+    }
+
+    .avatar {
+        display: round;
+        margin-left: auto ; 
+        margin-right: auto;
+        max-width: 150px;
+        border-radius: 50%;
+        text-align: center;
+    }
+
 }

src/pages/users-manager/users-manager.scss

@@ -131,9 +131,40 @@ describe('UsersManagerPage', () => {
     it('should be created', () => {
         expect(component instanceof UsersManagerPage).toBe(true);
     });  
+
+    it('should display header component', () => {
+        let de: DebugElement;
+        let el: HTMLElement;
+        de = fixture.debugElement.query(By.css('header'));
+        el = de.nativeElement.src;
+        expect(el).toBeUndefined();
+    });
 
-    it('should have title called Manage Users', () => {
-        expect(component.title).toBe('Manage Users');
+    it('should have title called Users Manager', () => {
+        expect(component.title).toBe('Users Manager');
+    });
+
+    it('should load blocked users on view load', () => {
+        spyOn(component, 'loadBlockedUsers').and.returnValue({ subscribe: () => {}});
+        component.ionViewDidLoad();
+        expect(component.loadBlockedUsers).toHaveBeenCalled();
     });
 
+    it('should display blocked users if there are any', () => {
+        component.thereAreBlockedUsers = true;
+        fixture.detectChanges();
+        let de: DebugElement;
+        let el: HTMLElement;
+        de = fixture.debugElement.query(By.css('h3'));
+        el = de.nativeElement.innerHTML
+        expect(el).toContain('Blocked Users')
+    });
+
+    it('should unblock user', fakeAsync(() => {
+        component.firebase.list('testPath').push('user')
+        tick();
+        fixture.detectChanges();
+        expect(listSpy).toHaveBeenCalled();
+        expect(pushSpy).toHaveBeenCalled();
+    }));
 });