Time since

src/views/ProjectViewView.vue

@@ -71,9 +71,9 @@
         <div class="flex justify-between gap-4 text-sm mb-3">
           <span><fa icon="user" class="fa-fw text-slate-400"></fa> Rotary</span>
           <span
-            ><fa icon="calendar" class="fa-fw text-slate-400"></fa> 8 days
-            ago</span
-          >
+            ><fa icon="calendar" class="fa-fw text-slate-400"></fa
+            >{{ timeSince }}
+          </span>
         </div>
 
         <div class="text-sm text-slate-500">
@@ -138,6 +138,7 @@ import { accessToken } from "@/libs/crypto";
 import { db } from "../db";
 import { IIdentifier } from "@veramo/core";
 import { AppString } from "@/constants/app";
+import * as moment from "moment";
 
 @Options({
   components: {},
@@ -148,6 +149,7 @@ export default class ProjectViewView extends Vue {
   description = "";
   truncatedDesc = "";
   truncateLength = 40;
+  timeSince = "";
   projectId =
     localStorage.getItem("projectId") === null
       ? ""
@@ -175,6 +177,12 @@ export default class ProjectViewView extends Vue {
       console.log(resp.status, resp.data);
       if (resp.status === 200) {
         const claim = resp.data.claim;
+        const issuedAt = resp.data.issuedAt;
+        const eventDate = new Date(issuedAt);
+        const now = moment.now();
+        this.timeSince = moment.utc(now).to(eventDate);
+
+        console.log(this.timeSince);
         this.name = claim.name;
         this.description = claim.description;
         this.truncatedDesc = this.description.slice(0, this.truncateLength);