Always show the cancelled status of an event

Closes #959

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

js/src/components/Event/EventMinimalistCard.vue

@@ -18,6 +18,20 @@
     </div>
     <div class="title-info-wrapper has-text-grey-dark">
       <h3 class="event-minimalist-title" :lang="event.language" dir="auto">
+        <b-tag
+          type="is-info"
+          class="mr-1"
+          v-if="event.status === EventStatus.TENTATIVE"
+        >
+          {{ $t("Tentative") }}
+        </b-tag>
+        <b-tag
+          type="is-danger"
+          class="mr-1"
+          v-if="event.status === EventStatus.CANCELLED"
+        >
+          {{ $t("Cancelled") }}
+        </b-tag>
         <b-tag
           class="mr-2"
           type="is-warning"
@@ -105,7 +119,7 @@
 import { Component, Prop, Vue } from "vue-property-decorator";
 import { IEvent, organizer, organizerDisplayName } from "@/types/event.model";
 import DateCalendarIcon from "@/components/Event/DateCalendarIcon.vue";
-import { ParticipantRole } from "@/types/enums";
+import { EventStatus, ParticipantRole } from "@/types/enums";
 import RouteName from "../../router/name";
 import LazyImageWrapper from "@/components/Image/LazyImageWrapper.vue";
 import InlineAddress from "@/components/Address/InlineAddress.vue";
@@ -129,6 +143,8 @@ export default class EventMinimalistCard extends Vue {
   organizerDisplayName = organizerDisplayName;
 
   organizer = organizer;
+
+  EventStatus = EventStatus;
 }
 </script>
 <style lang="scss" scoped>

js/src/components/Event/EventParticipationCard.vue

@@ -45,6 +45,22 @@
         </div>
         <div class="list-card-content">
           <div class="title-wrapper" dir="auto">
+            <b-tag
+              type="is-info"
+              class="mr-1 mb-1"
+              size="is-medium"
+              v-if="participation.event.status === EventStatus.TENTATIVE"
+            >
+              {{ $t("Tentative") }}
+            </b-tag>
+            <b-tag
+              type="is-danger"
+              class="mr-1 mb-1"
+              size="is-medium"
+              v-if="participation.event.status === EventStatus.CANCELLED"
+            >
+              {{ $t("Cancelled") }}
+            </b-tag>
             <router-link
               :to="{
                 name: RouteName.EVENT,
@@ -257,7 +273,7 @@ import { Component, Prop } from "vue-property-decorator";
 import DateCalendarIcon from "@/components/Event/DateCalendarIcon.vue";
 import { mixins } from "vue-class-component";
 import { RawLocation, Route } from "vue-router";
-import { EventVisibility, ParticipantRole } from "@/types/enums";
+import { EventStatus, EventVisibility, ParticipantRole } from "@/types/enums";
 import { IParticipant } from "../../types/participant.model";
 import {
   IEventCardOptions,
@@ -326,6 +342,8 @@ export default class EventParticipationCard extends mixins(
 
   RouteName = RouteName;
 
+  EventStatus = EventStatus;
+
   get mergedOptions(): IEventCardOptions {
     return { ...defaultOptions, ...this.options };
   }

js/src/graphql/actor.ts

@@ -41,6 +41,7 @@ export const FETCH_PERSON = gql`
           uuid
           title
           beginsOn
+          status
         }
       }
     }
@@ -84,6 +85,7 @@ export const GET_PERSON = gql`
           uuid
           title
           beginsOn
+          status
         }
       }
       participations(page: $participationPage, limit: $participationLimit) {
@@ -95,6 +97,7 @@ export const GET_PERSON = gql`
             uuid
             title
             beginsOn
+            status
           }
         }
       }
@@ -213,6 +216,7 @@ export const LOGGED_USER_DRAFTS = gql`
           alt
         }
         beginsOn
+        status
         visibility
         attributedTo {
           ...ActorFragment

js/src/graphql/event.ts

@@ -61,6 +61,7 @@ const FULL_EVENT_FRAGMENT = gql`
       uuid
       title
       beginsOn
+      status
       language
       picture {
         id
@@ -438,6 +439,7 @@ export const FETCH_GROUP_EVENTS = gql`
           uuid
           title
           beginsOn
+          status
           draft
           options {
             ...EventOptions

js/src/graphql/group.ts

@@ -42,6 +42,7 @@ export const LIST_GROUPS = gql`
             id
             uuid
             title
+            status
             beginsOn
           }
           total
@@ -104,6 +105,7 @@ export const GROUP_FIELDS_FRAGMENTS = gql`
         uuid
         title
         beginsOn
+        status
         draft
         language
         options {

js/src/graphql/home.ts

@@ -36,6 +36,7 @@ export const HOME_USER_QUERIES = gql`
               alt
             }
             beginsOn
+            status
             visibility
             language
             organizerActor {
@@ -77,6 +78,7 @@ export const HOME_USER_QUERIES = gql`
             uuid
             title
             beginsOn
+            status
             picture {
               url
             }
@@ -127,6 +129,7 @@ export const CLOSE_CONTENT = gql`
         title
         uuid
         beginsOn
+        status
         picture {
           id
           url

js/src/graphql/participant.ts

@@ -32,6 +32,7 @@ export const LOGGED_USER_PARTICIPATIONS = gql`
               alt
             }
             beginsOn
+            status
             visibility
             organizerActor {
               ...ActorFragment
@@ -98,6 +99,7 @@ export const LOGGED_USER_UPCOMING_EVENTS = gql`
               alt
             }
             beginsOn
+            status
             visibility
             organizerActor {
               ...ActorFragment
@@ -144,6 +146,7 @@ export const LOGGED_USER_UPCOMING_EVENTS = gql`
             uuid
             title
             beginsOn
+            status
             picture {
               url
             }

js/src/graphql/search.ts

@@ -38,6 +38,7 @@ export const SEARCH_EVENTS_AND_GROUPS = gql`
           id
           url
         }
+        status
         tags {
           ...TagFragment
         }
@@ -108,6 +109,7 @@ export const INTERACT = gql`
         title
         uuid
         beginsOn
+        status
         picture {
           id
           url