From f5355b1be9eae7039524b5102630409e4ec4319d Mon Sep 17 00:00:00 2001
From: Thomas Citharel <tcit@tcit.fr>
Date: Fri, 9 Aug 2019 11:32:14 +0200
Subject: [PATCH] Fix link to direct profile on event page when external

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
---
 js/src/components/Account/ActorLink.vue | 21 +++++++++++++++++++++
 js/src/graphql/event.ts                 |  1 +
 js/src/views/Event/Create.vue           |  2 +-
 js/src/views/Event/Event.vue            | 14 +++++++-------
 4 files changed, 30 insertions(+), 8 deletions(-)
 create mode 100644 js/src/components/Account/ActorLink.vue

diff --git a/js/src/components/Account/ActorLink.vue b/js/src/components/Account/ActorLink.vue
new file mode 100644
index 000000000..94ca6839a
--- /dev/null
+++ b/js/src/components/Account/ActorLink.vue
@@ -0,0 +1,21 @@
+<template>
+    <span>
+        <router-link v-if="actor.domain === null"
+                     :to="{name: 'Profile', params: { name: actor.preferredUsername } }"
+        >
+            <slot></slot>
+        </router-link>
+        <a v-else :href="actor.url">
+            <slot></slot>
+        </a>
+    </span>
+</template>
+<script lang="ts">
+import { Component, Prop, Vue } from 'vue-property-decorator';
+import { IActor } from '@/types/actor';
+
+@Component
+export default class ActorLink extends Vue {
+  @Prop() actor!: IActor;
+}
+</script>
\ No newline at end of file
diff --git a/js/src/graphql/event.ts b/js/src/graphql/event.ts
index 7fce45d7f..3779894bd 100644
--- a/js/src/graphql/event.ts
+++ b/js/src/graphql/event.ts
@@ -51,6 +51,7 @@ export const FETCH_EVENT = gql`
         preferredUsername,
         domain,
         name,
+        url,
       },
       # attributedTo {
       #     avatar {
diff --git a/js/src/views/Event/Create.vue b/js/src/views/Event/Create.vue
index e83a6b79e..2a0954ed7 100644
--- a/js/src/views/Event/Create.vue
+++ b/js/src/views/Event/Create.vue
@@ -76,6 +76,7 @@ import {
       Category,
       IEvent,
       EventModel,
+      EventVisibility,
     } from '@/types/event.model';
 import { LOGGED_PERSON } from '@/graphql/actor';
 import { IPerson, Person } from '@/types/actor';
@@ -86,7 +87,6 @@ import TagInput from '@/components/Event/TagInput.vue';
 import { TAGS } from '@/graphql/tags';
 import { ITag } from '@/types/tag.model';
 import AddressAutoComplete from '@/components/Event/AddressAutoComplete.vue';
-import { EventVisibility } from '@/types/event.model';
 
 @Component({
   components: { AddressAutoComplete, TagInput, DateTimePicker, PictureUpload, Editor },
diff --git a/js/src/views/Event/Event.vue b/js/src/views/Event/Event.vue
index 74b638250..7fb7f6f33 100644
--- a/js/src/views/Event/Event.vue
+++ b/js/src/views/Event/Event.vue
@@ -92,19 +92,17 @@
                 </b-modal>
               </div>
               <div class="organizer">
-                <router-link
-                        :to="{name: 'Profile', params: { name: event.organizerActor.preferredUsername } }"
-                >
-                <translate
-                        :translate-params="{name: event.organizerActor.name ? event.organizerActor.name : event.organizerActor.preferredUsername}"
-                        v-if="event.organizerActor">By %{ name }</translate>
+                <actor-link :actor="event.organizerActor">
+                  <translate
+                          :translate-params="{name: event.organizerActor.name ? event.organizerActor.name : event.organizerActor.preferredUsername}"
+                          v-if="event.organizerActor">By %{ name }</translate>
                   <figure v-if="event.organizerActor.avatar" class="image is-48x48">
                     <img
                             class="is-rounded"
                             :src="event.organizerActor.avatar.url"
                             :alt="$gettextInterpolate('%{actor}\'s avatar', {actor: event.organizerActor.preferredUsername})" />
                   </figure>
-                </router-link>
+                </actor-link>
               </div>
             </div>
           </div>
@@ -242,9 +240,11 @@ import DateCalendarIcon from '@/components/Event/DateCalendarIcon.vue';
 import BIcon from 'buefy/src/components/icon/Icon.vue';
 import EventCard from '@/components/Event/EventCard.vue';
 import EventFullDate from '@/components/Event/EventFullDate.vue';
+import ActorLink from '@/components/Account/ActorLink.vue';
 
 @Component({
   components: {
+    ActorLink,
     EventFullDate,
     EventCard,
     BIcon,