added followers retrieval

src/app/components/stream/user-follows/user-follows.component.html

@@ -1,3 +1,8 @@
-<p>
-  user-follows works!
-</p>
+<div class="follow flexcroll" #accountslist>
+    <app-waiting-animation *ngIf="isLoading" class="waiting-icon"></app-waiting-animation>
+    <div class="accounts" *ngIf="!isLoading">
+        <div class="account" *ngFor="let a of accounts">
+            ACC
+        </div>
+    </div>
+</div>

src/app/components/stream/user-follows/user-follows.component.scss

@@ -0,0 +1,10 @@
+@import "variables";
+@import "commons";
+
+.follow {
+    height: calc(100%);
+    width: calc(100%);
+    
+    overflow: auto;
+    position: relative;
+}

src/app/components/stream/user-follows/user-follows.component.ts

@@ -1,5 +1,13 @@
 import { Component, OnInit, Input, EventEmitter, Output, OnDestroy, ViewChild, ElementRef } from '@angular/core';
-import { Subscription } from 'rxjs';
+import { Subscription, Observable } from 'rxjs';
+import { Store } from '@ngxs/store';
+
+import { AccountInfo } from '../../../states/accounts.state';
+import { MastodonWrapperService } from '../../../services/mastodon-wrapper.service';
+import { ToolsService } from '../../../services/tools.service';
+import { Account } from "../../../services/models/mastodon.interfaces";
+
+
 
 @Component({
     selector: 'app-user-follows',
@@ -8,15 +16,18 @@ import { Subscription } from 'rxjs';
 })
 export class UserFollowsComponent implements OnInit, OnDestroy {
 
-    private _type: string;
+    private _type: 'follows' | 'followers';
     private _currentAccount: string;
 
+    isLoading: boolean = true;
+    accounts: Account[] = [];
+
     @Input('type')
-    set setType(type: string) {
+    set setType(type: 'follows' | 'followers') {
         this._type = type;
         this.load(this._type, this._currentAccount);
     }
-    get setType(): string {
+    get setType(): 'follows' | 'followers' {
         return this._type;
     }
 
@@ -34,12 +45,19 @@ export class UserFollowsComponent implements OnInit, OnDestroy {
 
     @Output() browseAccountEvent = new EventEmitter<string>();
 
-    @ViewChild('statusstream') public statustream: ElementRef;
+    @ViewChild('accountslist') public accountslist: ElementRef;
 
     private refreshSubscription: Subscription;
-    private goToTopSubscription: Subscription;
+    private goToTopSubscription: Subscription;    
+    // private accountSub: Subscription;    
+    // private accounts$: Observable<AccountInfo[]>;
 
-    constructor() { }
+    constructor(
+        private readonly store: Store,
+        private readonly toolsService: ToolsService,
+        private readonly mastodonService: MastodonWrapperService) { 
+            // this.accounts$ = this.store.select(state => state.registeredaccounts.accounts);
+        }
  
     ngOnInit() {
         if (this.refreshEventEmitter) {
@@ -58,19 +76,43 @@ export class UserFollowsComponent implements OnInit, OnDestroy {
     ngOnDestroy(): void {
         if (this.refreshSubscription) this.refreshSubscription.unsubscribe();
         if (this.goToTopSubscription) this.goToTopSubscription.unsubscribe();
+        // if (this.accountSub) this.accountSub.unsubscribe();
     }
 
-    private load(type: string, accountName: string) {
+    private load(type: 'follows' | 'followers', accountName: string) {
         if (type && accountName) {
             console.warn(`type: ${type} account ${accountName}`);
+            this.isLoading = true;
+
+            let currentAccount = this.toolsService.getSelectedAccounts()[0];
+            this.toolsService.findAccount(currentAccount, accountName)
+                .then((acc: Account) => {
+                    if(type === 'followers'){
+                        return this.mastodonService.getFollowers(currentAccount, acc.id, null, null);
+                    } else if(type === 'follows') {
+                        return this.mastodonService.getFollowing(currentAccount, acc.id, null, null);
+                    } else {
+                        throw Error('not implemented');
+                    }                    
+                })
+                .then((accounts: Account[]) => {
+                    this.accounts = accounts;
+                })
+                .catch(err => {
+
+                })
+                .then(() => {
+                    this.isLoading = false;
+                });
         }
     }
 
     refresh(): any {
+        this.load(this._type, this._currentAccount);
     }
 
     goToTop(): any {
-        const stream = this.statustream.nativeElement as HTMLElement;
+        const stream = this.accountslist.nativeElement as HTMLElement;
         setTimeout(() => {
             stream.scrollTo({
                 top: 0,

src/app/services/mastodon-wrapper.service.ts

@@ -11,7 +11,7 @@ import { AppInfo, RegisteredAppsStateModel } from '../states/registered-apps.sta
 @Injectable({
     providedIn: 'root'
 })
-export class MastodonWrapperService {
+export class MastodonWrapperService {    
     private refreshingToken: { [id: string]: Promise<AccountInfo> } = {};
 
     constructor(
@@ -391,4 +391,18 @@ export class MastodonWrapperService {
                 return this.mastodonService.deleteScheduledStatus(refreshedAccount, statusId);
             });
     }
+
+    getFollowing(account: AccountInfo, accountId: number, maxId: string, sinceId: string, limit: number = 40):  Promise<Account[]> {
+        return this.refreshAccountIfNeeded(account)
+            .then((refreshedAccount: AccountInfo) => {
+                return this.mastodonService.getFollowing(refreshedAccount, accountId, maxId, sinceId, limit);
+            });
+    }
+
+    getFollowers(account: AccountInfo, accountId: number, maxId: string, sinceId: string, limit: number = 40):  Promise<Account[]> {
+        return this.refreshAccountIfNeeded(account)
+            .then((refreshedAccount: AccountInfo) => {
+                return this.mastodonService.getFollowers(refreshedAccount, accountId, maxId, sinceId, limit);
+            });
+    }
 }

src/app/services/mastodon.service.ts

@@ -7,7 +7,7 @@ import { AccountInfo } from '../states/accounts.state';
 import { StreamTypeEnum, StreamElement } from '../states/streams.state';
 
 @Injectable()
-export class MastodonService {
+export class MastodonService {    
     private apiRoutes = new ApiRoutes();
 
     constructor(private readonly httpClient: HttpClient) { }
@@ -468,6 +468,27 @@ export class MastodonService {
         const headers = new HttpHeaders({ 'Authorization': `Bearer ${account.token.access_token}` });
         return this.httpClient.delete<ScheduledStatus>(route, { headers: headers }).toPromise();
     }
+
+    getFollowers(account: AccountInfo, targetAccountId: number, maxId: string = null, sinceId: string = null, limit: number = 40): Promise<Account[]> {
+        const route = `https://${account.instance}${this.apiRoutes.getFollowers}`.replace('{0}', targetAccountId.toString());
+
+        let params = `?limit=${limit}`;
+        if(maxId) params += `$max_id=${maxId}`;
+        if(sinceId) params += `$since_id=${sinceId}`;
+
+        const headers = new HttpHeaders({ 'Authorization': `Bearer ${account.token.access_token}` });
+        return this.httpClient.get<Account[]>(route + params, { headers: headers }).toPromise();
+    }
+    getFollowing(account: AccountInfo, targetAccountId: number, maxId: string, sinceId: string, limit: number = 40): Promise<Account[]> {
+        const route = `https://${account.instance}${this.apiRoutes.getFollowing}`.replace('{0}', targetAccountId.toString());
+        
+        let params = `?limit=${limit}`;
+        if(maxId) params += `$max_id=${maxId}`;
+        if(sinceId) params += `$since_id=${sinceId}`;
+
+        const headers = new HttpHeaders({ 'Authorization': `Bearer ${account.token.access_token}` });
+        return this.httpClient.get<Account[]>(route + params, { headers: headers }).toPromise();
+    }
 }
 
 export enum VisibilityEnum {

src/app/services/models/api.settings.ts

@@ -73,4 +73,6 @@ export class ApiRoutes {
     bookmarkingStatus = '/api/v1/statuses/{0}/bookmark';
     unbookmarkingStatus = '/api/v1/statuses/{0}/unbookmark';
     getBookmarks = '/api/v1/bookmarks';
+    getFollowers = '/api/v1/accounts/{0}/followers';
+    getFollowing = '/api/v1/accounts/{0}/following';
 }