nice date view

admin/src/components/Federation/FederationVisualizeItem.vue

@@ -3,14 +3,19 @@
     <b-row>
       <b-col><b-icon :icon="icon" :variant="variant" class="mr-4"></b-icon></b-col>
       <b-col class="ml-1">{{ item.apiVersion }}</b-col>
-      <b-col>{{ item.createdAt }}</b-col>
-      <b-col>{{ item.lastAnnouncedAt }}</b-col>
-      <b-col>{{ item.verifiedAt }}</b-col>
-      <b-col>{{ item.lastErrorAt }}</b-col>
+      <b-col v-b-tooltip="item.createdAt">{{ distanceDate(item.createdAt) }}</b-col>
+      <b-col v-b-tooltip="item.lastAnnouncedAt">{{ distanceDate(item.lastAnnouncedAt) }}</b-col>
+      <b-col v-b-tooltip="item.verifiedAt">{{ distanceDate(item.verifiedAt) }}</b-col>
+      <b-col v-b-tooltip="item.lastErrorAt">{{ distanceDate(item.lastErrorAt) }}</b-col>
     </b-row>
   </div>
 </template>
 <script>
+import { formatDistanceToNow } from 'date-fns'
+import { de, enUS as en, fr, es, nl } from 'date-fns/locale'
+
+const locales = { en, de, es, fr, nl }
+
 export default {
   name: 'FederationVisualizeItem',
   props: {
@@ -27,5 +32,12 @@ export default {
       return this.verified ? 'success' : 'danger'
     },
   },
+  methods: {
+    distanceDate(dateString) {
+      return dateString
+        ? formatDistanceToNow(new Date(dateString), { locale: locales[this.$i18n.locale] })
+        : ''
+    },
+  },
 }
 </script>

admin/src/graphql/updateHomeCommunity.js

@@ -2,6 +2,8 @@ import gql from 'graphql-tag'
 
 export const updateHomeCommunity = gql`
   mutation ($uuid: String!, $gmsApiKey: String!) {
-    updateHomeCommunity(uuid: $uuid, gmsApiKey: $gmsApiKey)
+    updateHomeCommunity(uuid: $uuid, gmsApiKey: $gmsApiKey) {
+      id
+    }
   }
 `