first iteration of favorites section

src/app/components/floating-column/manage-account/favorites/favorites.component.ts

@@ -1,15 +1,57 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, Output, EventEmitter, Input } from '@angular/core';
+
+import { StatusWrapper } from '../../../../models/common.model';
+import { OpenThreadEvent } from '../../../../services/tools.service';
+import { AccountWrapper } from '../../../../models/account.models';
+import { MastodonService } from '../../../../services/mastodon.service';
+import { Status } from '../../../../services/models/mastodon.interfaces';
+import { NotificationService } from '../../../../services/notification.service';
 
 @Component({
-  selector: 'app-favorites',
-  templateUrl: './favorites.component.html',
-  styleUrls: ['./favorites.component.scss']
+    selector: 'app-favorites',
+    templateUrl: '../../../stream/stream-statuses/stream-statuses.component.html',
+    styleUrls: ['../../../stream/stream-statuses/stream-statuses.component.scss', './favorites.component.scss']
 })
 export class FavoritesComponent implements OnInit {
+    statuses: StatusWrapper[] = [];
+    displayError: string;
+    isLoading = true; 
+    isThread = false;
+    hasContentWarnings = false;
 
-  constructor() { }
+    @Output() browseAccountEvent = new EventEmitter<string>();
+    @Output() browseHashtagEvent = new EventEmitter<string>();
+    @Output() browseThreadEvent = new EventEmitter<OpenThreadEvent>();
 
-  ngOnInit() {
-  }
+    @Input() account: AccountWrapper;
+
+    constructor(
+        private readonly notificationService: NotificationService,
+        private readonly mastodonService: MastodonService) { }
+
+    ngOnInit() {
+        this.getFavorites();
+    }
+
+    private getFavorites(){
+        this.isLoading = true;
+        this.statuses.length = 0;
+
+        this.mastodonService.getFavorites(this.account.info)
+            .then((statuses: Status[]) => {
+
+                for (const s of statuses) {
+                    const wrapper = new StatusWrapper(s, this.account.info);
+                    this.statuses.push(wrapper);
+                }
+            })
+            .catch(err => {
+                this.notificationService.notifyHttpError(err);
+            })
+            .then(() => {
+                this.isLoading = false;
+            });
+
+    }
 
 }

src/app/components/floating-column/manage-account/manage-account.component.html

@@ -29,7 +29,7 @@
     </div>
     
     <app-direct-messages class="account__body" *ngIf="subPanel === 'dm'"></app-direct-messages>
-    <app-favorites class="account__body" *ngIf="subPanel === 'favorites'"></app-favorites>
+    <app-favorites class="account__body" *ngIf="subPanel === 'favorites'" [account]="account"></app-favorites>
     <app-mentions class="account__body" *ngIf="subPanel === 'mentions'"></app-mentions>
     <app-my-account class="account__body" *ngIf="subPanel === 'account'" [account]="account">    
     </app-my-account>

src/app/components/floating-column/manage-account/manage-account.component.scss

@@ -55,6 +55,6 @@ $account-header-height: 60px;
         overflow: auto;
         height: calc(100% - #{$account-header-height} - 31px);
         display: block;
-        // border: 1px red solid;        
+        font-size: $default-font-size;
     }
 }

src/app/components/floating-column/manage-account/manage-account.component.ts

@@ -25,7 +25,7 @@ export class ManageAccountComponent implements OnInit {
 
     constructor() { }
 
-    ngOnInit() {       
+    ngOnInit() {        
     }
 
     loadSubPanel(subpanel: string): boolean {

src/app/services/mastodon.service.ts

@@ -7,7 +7,7 @@ import { AccountInfo } from '../states/accounts.state';
 import { StreamTypeEnum } from '../states/streams.state';
 
 @Injectable()
-export class MastodonService {
+export class MastodonService {    
     private apiRoutes = new ApiRoutes();
 
     constructor(private readonly httpClient: HttpClient) { }
@@ -133,6 +133,12 @@ export class MastodonService {
         const headers = new HttpHeaders({ 'Authorization': `Bearer ${account.token.access_token}` });
         return this.httpClient.get<Context>(route, { headers: headers }).toPromise();
     }
+    
+    getFavorites(account: AccountInfo): Promise<Status[]> {
+        const route = `https://${account.instance}${this.apiRoutes.getFavourites}`;
+        const headers = new HttpHeaders({ 'Authorization': `Bearer ${account.token.access_token}` });
+        return this.httpClient.get<Status[]>(route, { headers: headers }).toPromise();
+    }  
 
     searchAccount(account: AccountInfo, query: string, limit: number = 40, following: boolean = false): Promise<Account[]> {
         const route = `https://${account.instance}${this.apiRoutes.searchForAccounts}?q=${query}&limit=${limit}&following=${following}`;
@@ -162,9 +168,7 @@ export class MastodonService {
         const route = `https://${account.instance}${this.apiRoutes.unfavouritingStatus}`.replace('{0}', status.id);
         const headers = new HttpHeaders({ 'Authorization': `Bearer ${account.token.access_token}` });
         return this.httpClient.post<Status>(route, null, { headers: headers }).toPromise()
-    }
-
-    
+    } 
 
     getRelationships(account: AccountInfo, accountsToRetrieve: Account[]): Promise<Relationship[]> {
         let params = `?${this.formatArray(accountsToRetrieve.map(x => x.id.toString()), 'id')}`;