Add quick actions (mute, block, unfollow) to tweet-header

app/src/components/tweet-header/tweet-header.html

@@ -6,4 +6,5 @@
       <span class="twitter-handle">@{{user.screen_name}}</span>
   </div>
   <div class="timestamp">{{ tweetCreatedAt | diffForHumans }}</div>
+  <ion-icon name="ios-arrow-down" class="options" (click)="showActions(user.id)"></ion-icon>
 </div>

app/src/components/tweet-header/tweet-header.scss

@@ -30,6 +30,10 @@ tweet-header {
         color: #aaa;
         font-size: 10px;
         margin-left: auto;
-        align-self: flex-start;
+    }
+
+    .options {
+        margin-left: 5px;
+        color: #666;
     }
 }

app/src/components/tweet-header/tweet-header.ts

@@ -1,6 +1,7 @@
 import { Component, Input } from '@angular/core';
-import { NavController } from 'ionic-angular';
+import { NavController, ActionSheetController } from 'ionic-angular';
 import { ProfilePage } from '../../pages/profile/profile';
+import { TwitterApiProvider } from '../../providers/twitter-api/twitter-api';
 /**
  * Generated class for the TweetHeaderComponent component.
  *
@@ -16,10 +17,46 @@ export class TweetHeaderComponent {
   @Input() tweetCreatedAt: string;
 
   constructor(
-    public navCtrl: NavController
+    public navCtrl: NavController,
+    public actionSheetCtrl: ActionSheetController,
+    private twitter: TwitterApiProvider
   ) { }
 
   showProfile(userId) {
     this.navCtrl.push(ProfilePage, { userId });
   }
+
+  showActions(userId) {
+    let actionSheet = this.actionSheetCtrl.create({
+      title: '@' + this.user["screen_name"],
+      buttons: [
+        {
+          text: 'Unfollow',
+          role: 'destructive',
+          handler: () => {
+            this.twitter.destroyFriendship(userId);
+          }
+        }, {
+          text: 'Mute',
+          role: 'destructive',
+          handler: () => {
+            this.twitter.muteUser(userId);
+          }
+        }, {
+          text: 'Block',
+          role: 'destructive',
+          handler: () => {
+            this.twitter.blockUser(userId);
+          }
+        }, {
+          text: 'Cancel',
+          role: 'cancel',
+          handler: () => {
+            console.log('Cancel clicked');
+          }
+        }
+      ]
+    });
+    actionSheet.present();
+  }
 }

app/src/providers/twitter-api/twitter-api.ts

@@ -80,4 +80,34 @@ export class TwitterApiProvider {
         console.log(err);
       });
   }
+
+  public destroyFriendship(userId) {
+    return this.client.post('friendships/destroy', { user_id: userId })
+      .then(res => {
+        return res;
+      })
+      .catch(err => {
+        console.log(err);
+      });
+  }
+
+  public muteUser(userId) {
+    return this.client.post('mutes/users/create', { user_id: userId })
+      .then(res => {
+        return res;
+      })
+      .catch(err => {
+        console.log(err);
+      });
+  }
+  
+  public blockUser(userId) {
+    return this.client.post('blocks/create', { user_id: userId })
+      .then(res => {
+        return res;
+      })
+      .catch(err => {
+        console.log(err);
+      });
+  }
 }