Expose content language in HTML

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

js/src/components/Comment/Comment.vue

@@ -63,7 +63,12 @@
             </button>
           </span>
           <br />
-          <div v-if="!comment.deletedAt" v-html="comment.text" dir="auto" />
+          <div
+            v-if="!comment.deletedAt"
+            v-html="comment.text"
+            dir="auto"
+            :lang="comment.language"
+          />
           <div v-else>{{ $t("[This comment has been deleted]") }}</div>
           <div class="load-replies" v-if="comment.totalReplies">
             <p v-if="!showReplies" @click="fetchReplies">

js/src/components/Event/EventCard.vue

@@ -39,7 +39,12 @@
           />
         </div>
         <div class="media-content">
-          <h3 class="event-title" :title="event.title" dir="auto">
+          <h3
+            class="event-title"
+            :title="event.title"
+            dir="auto"
+            :lang="event.language"
+          >
             {{ event.title }}
           </h3>
           <div class="content-end">

js/src/components/Event/EventMinimalistCard.vue

@@ -17,7 +17,7 @@
       </div>
     </div>
     <div class="title-info-wrapper has-text-grey-dark">
-      <h3 class="event-minimalist-title">
+      <h3 class="event-minimalist-title" :lang="event.language" dir="auto">
         <b-tag
           class="mr-2"
           type="is-warning"

js/src/components/Event/EventParticipationCard.vue

@@ -51,7 +51,9 @@
                 params: { uuid: participation.event.uuid },
               }"
             >
-              <h3 class="title">{{ participation.event.title }}</h3>
+              <h3 class="title" :lang="participation.event.language">
+                {{ participation.event.title }}
+              </h3>
             </router-link>
           </div>
           <inline-address

js/src/components/Post/PostListItem.vue

@@ -10,7 +10,9 @@
       style="height: 120px"
     />
     <div class="title-info-wrapper has-text-grey-dark">
-      <h3 class="post-minimalist-title">{{ post.title }}</h3>
+      <h3 class="post-minimalist-title" :lang="post.language">
+        {{ post.title }}
+      </h3>
       <p class="post-publication-date">
         <b-icon icon="clock" />
         <span dir="auto" class="has-text-grey-dark" v-if="isBeforeLastWeek">{{

js/src/graphql/comment.ts

@@ -18,6 +18,7 @@ export const COMMENT_FIELDS_FRAGMENT = gql`
     updatedAt
     deletedAt
     isAnnouncement
+    language
   }
   ${ACTOR_FRAGMENT}
 `;

js/src/graphql/event.ts

@@ -22,6 +22,7 @@ const FULL_EVENT_FRAGMENT = gql`
     visibility
     joinOptions
     draft
+    language
     picture {
       id
       url
@@ -60,6 +61,7 @@ const FULL_EVENT_FRAGMENT = gql`
       uuid
       title
       beginsOn
+      language
       picture {
         id
         url
@@ -153,6 +155,7 @@ export const FETCH_EVENTS = gql`
         status
         visibility
         insertedAt
+        language
         picture {
           id
           url

js/src/graphql/group.ts

@@ -105,6 +105,7 @@ export const GROUP_FIELDS_FRAGMENTS = gql`
         title
         beginsOn
         draft
+        language
         options {
           maximumAttendeeCapacity
         }

js/src/graphql/home.ts

@@ -37,6 +37,7 @@ export const HOME_USER_QUERIES = gql`
             }
             beginsOn
             visibility
+            language
             organizerActor {
               ...ActorFragment
             }
@@ -79,6 +80,7 @@ export const HOME_USER_QUERIES = gql`
             picture {
               url
             }
+            language
             attributedTo {
               ...ActorFragment
             }
@@ -129,6 +131,7 @@ export const CLOSE_CONTENT = gql`
           id
           url
         }
+        language
         tags {
           ...TagFragment
         }

js/src/graphql/post.ts

@@ -21,6 +21,7 @@ export const POST_FRAGMENT = gql`
     publishAt
     draft
     visibility
+    language
     tags {
       ...TagFragment
     }
@@ -56,6 +57,7 @@ export const POST_BASIC_FIELDS = gql`
     publishAt
     draft
     visibility
+    language
     picture {
       id
       url

js/src/types/event.model.ts

@@ -90,6 +90,7 @@ export interface IEvent {
   options: IEventOptions;
   metadata: IEventMetadata[];
   contacts: IActor[];
+  language: string;
 
   toEditJSON(): IEventEditJSON;
 }
@@ -134,6 +135,8 @@ export class EventModel implements IEvent {
 
   publishAt = new Date();
 
+  language = "und";
+
   participantStats = {
     notApproved: 0,
     notConfirmed: 0,
@@ -210,6 +213,7 @@ export class EventModel implements IEvent {
 
     this.tags = hash.tags;
     this.metadata = hash.metadata;
+    this.language = hash.language;
     if (hash.options) this.options = hash.options;
   }
 

js/src/views/Event/Event.vue

@@ -10,7 +10,12 @@
         <section class="intro" dir="auto">
           <div class="columns">
             <div class="column">
-              <h1 class="title" style="margin: 0" dir="auto">
+              <h1
+                class="title"
+                style="margin: 0"
+                dir="auto"
+                :lang="event.language"
+              >
                 {{ event.title }}
               </h1>
               <div class="organizer">
@@ -289,6 +294,7 @@
             </p>
             <div v-else>
               <div
+                :lang="event.language"
                 dir="auto"
                 class="description-content"
                 ref="eventDescriptionElement"

js/src/views/Posts/Post.vue

@@ -15,7 +15,7 @@
                 v-if="post.draft"
                 >{{ $t("Draft") }}</b-tag
               >
-              <h1 class="title">{{ post.title }}</h1>
+              <h1 class="title" :lang="post.language">{{ post.title }}</h1>
             </div>
             <p class="metadata">
               <router-link
@@ -165,7 +165,12 @@
       }}
     </b-message>
 
-    <section v-html="post.body" dir="auto" class="content" />
+    <section
+      v-html="post.body"
+      dir="auto"
+      class="content"
+      :lang="post.language"
+    />
     <section class="tags" dir="auto">
       <router-link
         v-for="tag in post.tags"