fix #43 (but limitations due to the API)

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

@@ -4,8 +4,10 @@
 </div>
 <div class="status">
 
-    <a href class="status__profile-link" title="{{displayedStatus.account.acct}}" (click)="openAccount(displayedStatus.account)">
+    <a href class="status__profile-link" title="{{displayedStatus.account.acct}}"
-        <img [class.status__avatar--boosted]="reblog" class="status__avatar" src="{{ displayedStatus.account.avatar }}" />
+        (click)="openAccount(displayedStatus.account)">
+        <img [class.status__avatar--boosted]="reblog" class="status__avatar"
+            src="{{ displayedStatus.account.avatar }}" />
         <!-- <img *ngIf="reblog" class="status__avatar--reblog" src="{{ status.account.avatar }}" /> -->
         <span class="status__name">
             <span class="status__name--displayname" innerHTML="{{displayedStatus.account.display_name}}"></span><span
@@ -17,15 +19,28 @@
             {{ status.created_at | timeAgo | async }}
         </a>
     </div>
+    <div class="status__automation-data">
+        <div class="status__automation-data--label status__automation-data--bot" title="bot"
+            *ngIf="status.account.bot">
+            bot
+        </div>
+        <div class="status__automation-data--label status__automation-data--xpost" title="cross-poster"
+            *ngIf="isCrossPoster">
+            x-post
+        </div>
+    </div>
     <!-- <div #content class="status__content" innerHTML="{{displayedStatus.content}}"></div> -->
 
-    <app-databinded-text class="status__content" [text]="displayedStatus.content" (accountSelected)="accountSelected($event)"
+    <app-databinded-text class="status__content" [text]="displayedStatus.content"
-        (hashtagSelected)="hashtagSelected($event)" (textSelected)="textSelected()"></app-databinded-text>
+        (accountSelected)="accountSelected($event)" (hashtagSelected)="hashtagSelected($event)"
+        (textSelected)="textSelected()"></app-databinded-text>
 
 
-    <app-attachements *ngIf="hasAttachments" class="attachments" [attachments]="displayedStatus.media_attachments"></app-attachements>
+    <app-attachements *ngIf="hasAttachments" class="attachments" [attachments]="displayedStatus.media_attachments">
+    </app-attachements>
 
     <app-action-bar [statusWrapper]="statusWrapper" (replyEvent)="openReply()"></app-action-bar>
 
-    <app-reply-to-status *ngIf="replyingToStatus" [statusReplyingToWrapper]="statusWrapper" (onClose)="closeReply()"></app-reply-to-status>
+    <app-reply-to-status *ngIf="replyingToStatus" [statusReplyingToWrapper]="statusWrapper" (onClose)="closeReply()">
+    </app-reply-to-status>
 </div>

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

@@ -1,5 +1,4 @@
 @import "variables";
-
 .reblog {
     position: relative;
     margin: 5px 0 0 10px;
@@ -48,6 +47,32 @@
             border-radius: 2px;
         }
     }
+    &__automation-data {
+        position: absolute;
+        top: 65px;
+        left: 10px;
+        width: 50px;
+        cursor: default;
+
+        &--label {
+            text-transform: uppercase;
+            text-align: center;
+            font-size: 7px;
+            margin-bottom: 3px; // color: #000;
+            border-radius: 2px; //border: 1px solid greenyellow;
+            padding-top: 1px;
+        }
+        &--bot {
+            background-color: rgb(0, 225, 255);
+            background-color: rgb(0, 159, 180);
+            background-color: rgb(0, 114, 129);
+        }
+        &--xpost {
+            background-color: rgb(255, 153, 0);
+            background-color: rgb(189, 113, 0);
+            background-color: rgb(156, 94, 0);
+        }
+    }
     &__name {
         display: inline-block;
         width: calc(100% - 40px);
@@ -78,8 +103,7 @@
         word-wrap: break-word;
         margin: 0 10px 0 $avatar-column-space;
         display: block;
-    }
+    } // &__content p {
-    // &__content p {
     //     margin: 0 !important;
     //     font-size: 0.85em;
     // }
@@ -87,11 +111,9 @@
         position: absolute;
         top: 7px;
         right: 5px;
-
         &--link {
             color: $status-secondary-color;
             text-decoration: none;
-            
             &:hover {
                 color: lighten($status-secondary-color, 20);
             }
@@ -100,7 +122,6 @@
 }
 
 .attachments {
-    display: block;
+    display: block; // width: calc(100% - 80px);
-    // width: calc(100% - 80px);
     margin: 10px 10px 0 $avatar-column-space;
 }

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

@@ -13,6 +13,7 @@ export class StatusComponent implements OnInit {
     reblog: boolean;
     hasAttachments: boolean;
     replyingToStatus: boolean;
+    isCrossPoster: boolean;
 
     @Output() browseAccountEvent = new EventEmitter<string>();
     @Output() browseHashtagEvent = new EventEmitter<string>();
@@ -25,6 +26,8 @@ export class StatusComponent implements OnInit {
         this._statusWrapper = value;
         this.status = value.status;
 
+        this.checkCrossPosting(this.status);
+
         if (this.status.reblog) {
             this.reblog = true;
             this.displayedStatus = this.status.reblog;
@@ -49,6 +52,21 @@ export class StatusComponent implements OnInit {
     ngOnInit() {
     }
 
+    private checkCrossPosting(status: Status) {
+        //since API is limited with federated status...
+        if(status.uri.includes('birdsite.link')){
+            this.isCrossPoster = true;
+        }
+
+        if (status.application) {
+            console.warn(status.application);
+            const usedApp = status.application.name.toLowerCase();
+            if (usedApp && (usedApp.includes('moa') || usedApp.includes('birdsite') || usedApp.includes('twitter'))) {
+                this.isCrossPoster = true;
+            }
+        }
+    }
+
     openAccount(account: Account): boolean {
         let accountName = account.acct;
         if (!accountName.includes('@'))