Always show the cancelled status of an event

Closes #959

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

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 };
   }