Переглянути джерело

Add un-/follow to profile

Carsten Porth 6 роки тому
батько
коміт
a50263789b

+ 2 - 0
app/src/components/profile-header/profile-header.html

@@ -6,6 +6,8 @@
       <polygon points="0,75  0,100 300,100 300,99" fill="#FFFFFF" />
     </svg>
     <img src="{{ user.profile_image_url_https }}" alt="{{ user.name }}" class="avatar">
+    <button ion-button color="primary" *ngIf="!user.following" (click)="follow(user.id_str)" class="follow-button">Follow</button>
+    <button ion-button color="danger" *ngIf="user.following" (click)="unfollow(user.id_str)" class="follow-button">Unfollow</button>
   </div>
   <div padding>
     <p class="profile-stats">{{ user.followers_count | friendlyNumber }} Followers | {{ user.friends_count |

+ 5 - 0
app/src/components/profile-header/profile-header.scss

@@ -16,4 +16,9 @@ profile-header {
     bottom: -10px;
     left: 15px;
   }
+  .follow-button {
+    position: absolute;
+    right: 16px;
+    bottom: -8px;
+  }
 }

+ 12 - 1
app/src/components/profile-header/profile-header.ts

@@ -1,4 +1,5 @@
 import { Component, Input } from "@angular/core";
+import { TwitterApiProvider } from "../../providers/twitter-api/twitter-api";
 
 /**
  * Generated class for the ProfileHeaderComponent component.
@@ -14,7 +15,7 @@ export class ProfileHeaderComponent {
   @Input()
   user: any;
 
-  constructor() {}
+  constructor(private twitter: TwitterApiProvider) {}
 
   get banner() {
     if (this.user.profile_banner_url) {
@@ -23,4 +24,14 @@ export class ProfileHeaderComponent {
       return this.user.profile_background_image_url_https;
     }
   }
+
+  async follow(userId) {
+    await this.twitter.createFriendship(userId);
+    this.user.following = true;
+  }
+
+  async unfollow(userId) {
+    await this.twitter.destroyFriendship(userId);
+    this.user.following = false;
+  }
 }