start building post component

src/components/components.module.ts

@@ -0,0 +1,8 @@
+import { NgModule } from '@angular/core';
+import { PostComponent } from './post/post';
+@NgModule({
+	declarations: [PostComponent],
+	imports: [],
+	exports: [PostComponent]
+})
+export class ComponentsModule {}

src/components/post/post.html

@@ -0,0 +1,88 @@
+
+<ion-item color="{{ post.you_are_mentioned ? 'mention' : '' }}">
+  <ion-avatar item-start (click)="showProfile(post.user)">
+    <img src="{{ post.user.content.avatar_image.link }}">
+  </ion-avatar>
+  <h2>{{ post.user.name }}</h2>
+  <p>@{{ post.user.username }}</p>
+  <ion-note item-end>
+    <div text-right>
+      {{ post.created_at | timeago }}<br/>
+      {{ post.source.name }}
+    </div>
+  </ion-note>
+</ion-item>
+
+<ion-card-content>
+  <div *ngIf="post.is_deleted; else renderBlock"></div>
+  <ng-template #renderBlock >
+    <div [innerHTML]="post.content.html | parser"></div>
+    <div *ngIf="post.raw">
+      <div *ngFor="let r of post.raw">
+        <div *ngIf="r.type == 'nl.chimpnut.blog.post'">
+          <hr>
+          <div>{{ r.value.body }}</div>
+        </div>
+      </div>
+    </div>
+  </ng-template>
+</ion-card-content>
+
+<div *ngIf="post.raw">
+  <div *ngFor="let r of post.raw">
+    <div *ngIf="r.type == 'io.pnut.core.oembed'">
+      <ion-item>
+        <div *ngIf="hideImg; then imgbtn else thumbnail"></div>
+        <ng-template #imgbtn >
+          <button ion-button icon-start (click)="showImage(r.value.url)">
+            <ion-icon name="image"></ion-icon>
+            {{ r.value.title }}
+          </button>
+        </ng-template>
+        <ng-template #thumbnail >
+          <img src="{{ r.value.thumbnail_url || r.value.url }}" (click)="showImage(r.value.url)">
+        </ng-template>
+      </ion-item>
+    </div>
+  </div>
+</div>
+
+<div *ngIf="post.reposted_by_string">
+  <ion-item><ion-note>{{ post.reposted_by_string }}</ion-note></ion-item>
+</div>
+
+<ion-row>
+  <ion-col>
+    <button ion-button icon-left clear small block (click)="showReplyPost(post)">
+      <ion-icon name="ios-undo"></ion-icon>
+    </button>
+  </ion-col>
+  <ion-col>
+    <button ion-button icon-left clear small block (click)="showQuotedPost(post)">
+      <ion-icon name="quote"></ion-icon>
+    </button>
+  </ion-col>
+  <ion-col>
+    <button ion-button icon-left clear small block (click)="repost(post.id, post.you_reposted)">
+      <ion-icon name="repeat"></ion-icon>
+      <div *ngIf="post.counts.reposts > 0">{{ post.counts.reposts }}</div>
+    </button>
+  </ion-col>
+  <ion-col>
+    <button ion-button icon-left clear small block (click)="bookmark(post.id, post.you_bookmarked)">
+      <ion-icon name="star"></ion-icon>
+      <div *ngIf="post.counts.bookmarks > 0">{{ post.counts.bookmarks }}</div>
+    </button>
+  </ion-col>
+  <ion-col>
+    <button ion-button icon-left clear small block (click)="fetchThread(post.thread_id)">
+      <ion-icon name="chatboxes"></ion-icon>
+      <div *ngIf="post.counts.replies > 0">{{ post.counts.replies }}</div>
+    </button>
+  </ion-col>
+  <ion-col>
+    <button ion-button icon-left clear small block (click)="presentPostMenu($event, post)">
+      <ion-icon name="more"></ion-icon>
+    </button>
+  </ion-col>
+</ion-row>

src/components/post/post.scss

@@ -0,0 +1,3 @@
+post {
+
+}

src/components/post/post.ts

@@ -0,0 +1,22 @@
+import { Component } from '@angular/core';
+
+/**
+ * Generated class for the PostComponent component.
+ *
+ * See https://angular.io/api/core/Component for more info on Angular
+ * Components.
+ */
+@Component({
+  selector: 'post',
+  templateUrl: 'post.html'
+})
+export class PostComponent {
+
+  text: string;
+
+  constructor() {
+    console.log('Hello PostComponent Component');
+    this.text = 'Hello World';
+  }
+
+}