displaying remote statuses

src/app/components/stream/status/action-bar/action-bar.component.ts

@@ -76,14 +76,18 @@ export class ActionBarComponent implements OnInit, OnDestroy {
     ngOnInit() {
         this.displayedStatus = this.statusWrapper.status;
         const account = this.statusWrapper.provider;
+        let accountId = 'remote';
+        if (account) {
+            accountId = account.id;
+        }
 
         if (this.displayedStatus.reblog) {
             this.displayedStatus = this.displayedStatus.reblog;
         }
 
-        this.favoriteStatePerAccountId[account.id] = this.displayedStatus.favourited;
-        this.bootedStatePerAccountId[account.id] = this.displayedStatus.reblogged;
-        this.bookmarkStatePerAccountId[account.id] = this.displayedStatus.bookmarked;
+        this.favoriteStatePerAccountId[accountId] = this.displayedStatus.favourited;
+        this.bootedStatePerAccountId[accountId] = this.displayedStatus.reblogged;
+        this.bookmarkStatePerAccountId[accountId] = this.displayedStatus.bookmarked;
 
         this.analyseMemoryStatus();
 
@@ -134,8 +138,13 @@ export class ActionBarComponent implements OnInit, OnDestroy {
     private checkStatus(accounts: AccountInfo[]): void {
         const status = this.statusWrapper.status;
         const provider = this.statusWrapper.provider;
-        this.selectedAccounts = accounts.filter(x => x.isSelected);
-        this.isProviderSelected = this.selectedAccounts.filter(x => x.id === provider.id).length > 0;
+        this.selectedAccounts = accounts.filter(x => x.isSelected);       
+
+        if (!this.statusWrapper.isRemote) {
+            this.isProviderSelected = this.selectedAccounts.filter(x => x.id === provider.id).length > 0;
+        } else {
+            this.isProviderSelected = false;
+        }
 
         if (status.visibility === 'direct' || status.visibility === 'private') {
             this.isBoostLocked = true;

src/app/components/stream/status/status.component.html

@@ -84,6 +84,9 @@
                 <div class="status__labels--label status__labels--old" title="this status is old" *ngIf="isOld && !statusWrapper.status.pinned">
                     old
                 </div>
+                <div class="status__labels--label status__labels--remote" title="this status isn't federated with this instance" *ngIf="isRemote">
+                    remote
+                </div>
             </div>
 
 

src/app/components/stream/status/status.component.scss

@@ -99,6 +99,11 @@
         &--old {
             background-color: rgb(150, 0, 0);
         }
+        &--remote {
+            background-color: rgb(161, 64, 140);
+            background-color: rgb(33, 69, 136);
+            background-color: rgb(38, 77, 148);
+        }
     }
     &__name {
         display: inline-block;

src/app/components/stream/status/status.component.ts

@@ -39,6 +39,7 @@ export class StatusComponent implements OnInit {
     contentWarningText: string;
     isDirectMessage: boolean;
     isSelected: boolean;
+    isRemote: boolean;
 
     hideStatus: boolean = false;
 
@@ -58,9 +59,9 @@ export class StatusComponent implements OnInit {
     @Input('statusWrapper')
     set statusWrapper(value: StatusWrapper) {
         this._statusWrapper = value;
-        // console.warn(value.status);
         this.status = value.status;
         this.isSelected = value.isSelected;
+        this.isRemote = value.isRemote;
 
         if (this.status.reblog) {
             this.reblog = true;
@@ -72,6 +73,7 @@ export class StatusComponent implements OnInit {
         this.isDirectMessage = this.displayedStatus.visibility === 'direct';
         let cwPolicy = this.toolsService.checkContentWarning(this.displayedStatus);
         this.displayedStatusWrapper = new StatusWrapper(cwPolicy.status, value.provider, cwPolicy.applyCw, cwPolicy.hide);
+        this.displayedStatusWrapper.isRemote = value.isRemote;
 
         this.checkLabels(this.displayedStatus);
         this.setContentWarning(this.displayedStatusWrapper);

src/app/components/stream/thread/thread.component.ts

@@ -213,8 +213,22 @@ export class ThreadComponent implements OnInit, OnDestroy {
                 id = webpage.split(`<meta content="https://${instance}/notice/`)[1].split('" property="og:url"')[0];
             }           
             
-            let statuses = await this.mastodonService.getRemoteStatusContext(instance, id);
-            console.warn(statuses);            
+            let context = await this.mastodonService.getRemoteStatusContext(instance, id);
+            let remoteStatuses = [...context.ancestors, ...context.descendants];
+
+            let unknownStatuses = remoteStatuses.filter(x => !this.statuses.find(y => y.status.url == x.url));
+            console.warn(unknownStatuses);
+            for(let s of unknownStatuses){
+                //TODO fetch settings
+                let wrapper = new StatusWrapper(s, null, false, false);
+                wrapper.isRemote = true;
+                this.statuses.push(wrapper);
+                this.statuses.sort((a,b) => { 
+                    if(a.status.created_at > b.status.created_at) return 1;
+                    if(a.status.created_at < b.status.created_at) return -1;
+                    return 0;
+                });
+            }            
         } catch (err) { };
     }
 

src/app/models/common.model.ts

@@ -21,4 +21,5 @@ export class StatusWrapper {
     ) { }
 
     public isSelected: boolean;
+    public isRemote: boolean;
 }