Browse Source

Make action sheet dynamic

Carsten Porth 5 years ago
parent
commit
675cc7be9a

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

@@ -1,7 +1,7 @@
 <!-- Generated template for the TweetHeaderComponent component -->
 <div class="header-container">
   <img src="{{ user.profile_image_url_https }}" alt="{{ user.name }}" class="avatar" (click)="showProfile(user.id_str)">
-  <div class="username" (click)="showProfile(user.id)">
+  <div class="username" (click)="showProfile(user.id_str)">
     <span>
       {{ user.name }}
       <ion-icon name="ios-checkmark-circle" *ngIf="user.verified" class="icon-verified"></ion-icon>
@@ -9,5 +9,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>
+  <ion-icon name="ios-arrow-down" class="options" (click)="showActions(user.id_str)"></ion-icon>
 </div>

+ 77 - 32
app/src/components/tweet-header/tweet-header.ts

@@ -29,39 +29,84 @@ export class TweetHeaderComponent {
   }
 
   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");
-          }
+    this.twitter.fetchUser(userId).then(user => {
+      this.actionSheetCtrl
+        .create({
+          title: "@" + this.user["screen_name"],
+          buttons: this.getButtonsForActionSheet(user)
+        })
+        .present();
+    });
+  }
+
+  private getButtonsForActionSheet(user) {
+    const buttons = [];
+    if (user.following) {
+      // Unfollow
+      buttons.push({
+        text: "Unfollow",
+        role: "destructive",
+        handler: () => {
+          this.twitter.destroyFriendship(user.id_str);
+        }
+      });
+    } else {
+      // Follow
+      buttons.push({
+        text: "Follow",
+        role: "destructive",
+        handler: () => {
+          this.twitter.createFriendship(user.id_str);
+        }
+      });
+    }
+
+    if (user.muting) {
+      // unmute
+      buttons.push({
+        text: "Unmute",
+        role: "destructive",
+        handler: () => {
+          this.twitter.unmuteUser(user.id_str);
         }
-      ]
+      });
+    } else {
+      // mute
+      buttons.push({
+        text: "Mute",
+        role: "destructive",
+        handler: () => {
+          this.twitter.muteUser(user.id_str);
+        }
+      });
+    }
+
+    if (user.blocking) {
+      // Unblock
+      buttons.push({
+        text: "Unblock",
+        role: "destructive",
+        handler: () => {
+          this.twitter.unblockUser(user.id_str);
+        }
+      });
+    } else {
+      // Block
+      buttons.push({
+        text: "Block",
+        role: "destructive",
+        handler: () => {
+          this.twitter.blockUser(user.id_str);
+        }
+      });
+    }
+
+    // Cancel button
+    buttons.push({
+      text: "Cancel",
+      role: "cancel"
     });
-    actionSheet.present();
+
+    return buttons;
   }
 }