add last checked moment to repository card

Auth/InstallationFunction.cs

@@ -66,18 +66,26 @@ public static async Task<HttpResponseMessage> ListRepositoriesAsync(
                 throw new Exception("missing authentication");
             }
 
+            var storageAccount = CloudStorageAccount.Parse(Environment.GetEnvironmentVariable("AzureWebJobsStorage"));
+            var installationTable = storageAccount.CreateCloudTableClient().GetTableReference("installation");
             var repositoriesRequest = new HttpRequestMessage(HttpMethod.Get, $"https://api.github.com/user/installations/{installationid}/repositories?access_token=" + token);
             repositoriesRequest.Headers.Add("User-Agent", "IMGBOT");
             repositoriesRequest.Headers.Add("Accept", "application/vnd.github.machine-man-preview+json");
             var repositoriesResponse = await httpClient.SendAsync(repositoriesRequest);
             var repositoriesJson = await repositoriesResponse.Content.ReadAsStringAsync();
             var repositoriesData = JsonConvert.DeserializeObject<Repositories>(repositoriesJson);
 
-            var repositories = repositoriesData.repositories.Select(x => new
+            var repositories = await Task.WhenAll(repositoriesData.repositories.Select(async x =>
             {
-                x.id,
-                x.html_url,
-            });
+                var installation = await installationTable.ExecuteAsync(
+                    TableOperation.Retrieve<Common.TableModels.Installation>(installationid, x.name));
+                return new
+                {
+                    x.id,
+                    x.html_url,
+                    lastchecked = (installation.Result as Common.TableModels.Installation)?.LastChecked
+                };
+            }));
 
             var response = req.CreateResponse();
             response

Web/package.json

@@ -28,6 +28,7 @@
     "jquery": "^3.3.1",
     "lodash": "^4.17.11",
     "marked": "^0.5.1",
+    "moment": "^2.22.2",
     "vue": "^2.5.17",
     "vue-hot-reload-api": "^2.3.1",
     "vue-html-loader": "^1.2.4",

Web/src/app/vue/components/Installation.vue

@@ -11,8 +11,7 @@
       <repository
         v-for="repository in repositories"
         v-bind:key="repository.id"
-        v-bind:id="repository.id"
-        v-bind:html_url="repository.html_url"
+        v-bind:repository="repository"
       ></repository>
     </div>
   </div>

Web/src/app/vue/components/Repository.vue

@@ -1,13 +1,28 @@
 <template>
   <div class="card my-4">
-    <h5 class="card-title">{{ id }}</h5>
-    <h6 class="card-subtitle mb-2 text-muted">{{ html_url }}</h6>
+    <h5 class="card-title">{{ repository.id }}</h5>
+    <h6 class="card-subtitle mb-2 text-muted">{{ repository.html_url }}</h6>
+    <div class="card-text">{{ lastchecked }}</div>
   </div>
 </template>
 
 <script>
+import moment from 'moment'
+
 export default {
   name: 'Repository',
-  props: ['id', 'html_url']
+  props: ['repository'],
+  computed: {
+    lastchecked: function() {
+      if (this.repository.lastchecked) {
+        const ms = new Date().getTime() - new Date(this.repository.lastchecked).getTime()
+        //console.log(new Date().getTime())
+        const ago = moment.duration(ms, 'milliseconds').humanize()
+        return `Last checked: ${ago} ago`
+      } else {
+        return 'Last checked: Never'
+      }
+    }
+  }
 }
 </script>