Add identity pickers on event creation & join

Also it now saves current actor in localStorage and initalizes it in
Apollo Cache (just like user stuff). This allows not relying on
loggedPerson query anymore.

Signed-off-by: Thomas Citharel <tcit@tcit.fr>

js/src/views/Account/MyAccount.vue

@@ -1,9 +1,9 @@
 <template>
   <section class="container">
-    <div v-if="loggedPerson">
+    <div v-if="currentActor">
       <div class="header">
-        <figure v-if="loggedPerson.banner" class="image is-3by1">
-          <img :src="loggedPerson.banner.url" alt="banner">
+        <figure v-if="currentActor.banner" class="image is-3by1">
+          <img :src="currentActor.banner.url" alt="banner">
         </figure>
       </div>
 
@@ -31,7 +31,7 @@
 </style>
 
 <script lang="ts">
-import { LOGGED_PERSON } from '@/graphql/actor';
+import { CURRENT_ACTOR_CLIENT } from '@/graphql/actor';
 import { Component, Vue, Watch } from 'vue-property-decorator';
 import EventCard from '@/components/Event/EventCard.vue';
 import { IPerson } from '@/types/actor';
@@ -42,17 +42,18 @@ import Identities from '@/components/Account/Identities.vue';
     EventCard,
     Identities,
   },
+  apollo: {
+    currentActor: {
+      query: CURRENT_ACTOR_CLIENT,
+    },
+  },
 })
 export default class MyAccount extends Vue {
-  loggedPerson: IPerson | null = null;
+  currentActor!: IPerson;
   currentIdentityName: string | null = null;
 
   @Watch('$route.params.identityName', { immediate: true })
   async onIdentityParamChanged (val: string) {
-    if (!this.loggedPerson) {
-      this.loggedPerson = await this.loadLoggedPerson();
-    }
-
     await this.redirectIfNoIdentitySelected(val);
 
     this.currentIdentityName = val;
@@ -61,18 +62,10 @@ export default class MyAccount extends Vue {
   private async redirectIfNoIdentitySelected (identityParam?: string) {
     if (!!identityParam) return;
 
-    if (!!this.loggedPerson) {
-      this.$router.push({ params: { identityName: this.loggedPerson.preferredUsername } });
+    if (!!this.currentActor) {
+      await this.$router.push({ params: { identityName: this.currentActor.preferredUsername } });
     }
   }
-
-  private async loadLoggedPerson () {
-    const result = await this.$apollo.query({
-      query: LOGGED_PERSON,
-    });
-
-    return result.data.loggedPerson as IPerson;
-  }
 }
 </script>
 <style lang="scss">