1 files changed, 46 insertions, 0 deletions

diff --git a/client/src/app/shared/shared-main/date/date-toggle.component.ts b/client/src/app/shared/shared-main/date/date-toggle.component.ts
new file mode 100644
index 000000000..bedf0ba4e
--- /dev/null
+++ b/client/src/app/shared/shared-main/date/date-toggle.component.ts
@@ -0,0 +1,46 @@
+import { DatePipe } from '@angular/common'
+import { Component, Input, OnChanges, OnInit } from '@angular/core'
+import { FromNowPipe } from '../angular/from-now.pipe'
+
+@Component({
+  selector: 'my-date-toggle',
+  templateUrl: './date-toggle.component.html',
+  styleUrls: [ './date-toggle.component.scss' ]
+})
+export class DateToggleComponent implements OnInit, OnChanges {
+  @Input() date: Date
+  @Input() toggled = false
+
+  dateRelative: string
+  dateAbsolute: string
+
+  constructor (
+    private datePipe: DatePipe,
+    private fromNowPipe: FromNowPipe
+  ) { }
+
+  ngOnInit () {
+    this.updateDates()
+  }
+
+  ngOnChanges () {
+    this.updateDates()
+  }
+
+  toggle () {
+    this.toggled = !this.toggled
+  }
+
+  getTitle () {
+    return this.toggled ? this.dateRelative : this.dateAbsolute
+  }
+
+  getContent () {
+    return this.toggled ? this.dateAbsolute : this.dateRelative
+  }
+
+  private updateDates () {
+    this.dateRelative = this.fromNowPipe.transform(this.date)
+    this.dateAbsolute = this.datePipe.transform(this.date, 'long')
+  }
+}