From f60ab9b5b8284461310a655d63e7af991bd3ede2 Mon Sep 17 00:00:00 2001
From: Thomas Citharel <tcit@tcit.fr>
Date: Thu, 3 Oct 2019 11:37:34 +0200
Subject: [PATCH 1/2] Fixes to navbar and edit page

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
---
 js/src/components/Logo.vue   |  2 +-
 js/src/components/NavBar.vue | 11 +++++++----
 js/src/variables.scss        |  2 +-
 js/src/views/Event/Edit.vue  | 20 ++++++++++++++------
 js/src/views/Home.vue        | 27 ++++++++-------------------
 5 files changed, 31 insertions(+), 31 deletions(-)

diff --git a/js/src/components/Logo.vue b/js/src/components/Logo.vue
index 07f52a8b5..d4aff1647 100644
--- a/js/src/components/Logo.vue
+++ b/js/src/components/Logo.vue
@@ -1,5 +1,5 @@
 <template>
-    <img svg-inline src="../assets/mobilizon_logo.svg" alt="Mobilizon" :class="{invert: invert}" height="60px">
+    <img svg-inline src="../assets/mobilizon_logo.svg" alt="Mobilizon" :class="{invert: invert}" height="40px">
 </template>
 
 <script lang="ts">
diff --git a/js/src/components/NavBar.vue b/js/src/components/NavBar.vue
index af9dace51..fb1a14791 100644
--- a/js/src/components/NavBar.vue
+++ b/js/src/components/NavBar.vue
@@ -1,11 +1,14 @@
 <template>
   <b-navbar type="is-secondary" shadow wrapper-class="container">
     <template slot="brand">
-      <b-navbar-item tag="router-link" :to="{ name: 'Home' }"><logo /></b-navbar-item>
+      <b-navbar-item tag="router-link" :to="{ name: RouteName.HOME }"><logo /></b-navbar-item>
     </template>
     <template slot="start">
       <b-navbar-item tag="router-link" :to="{ name: EventRouteName.EXPLORE }">{{ $t('Explore') }}</b-navbar-item>
       <b-navbar-item tag="router-link" :to="{ name: EventRouteName.MY_EVENTS }">{{ $t('Events') }}</b-navbar-item>
+      <b-navbar-item tag="span">
+        <b-button tag="router-link" :to="{ name: RouteName.CREATE_EVENT }" type="is-success">{{ $t('Create') }}</b-button>
+      </b-navbar-item>
     </template>
     <template slot="end">
       <b-navbar-item tag="div">
@@ -56,11 +59,11 @@
 
       <b-navbar-item v-else tag="div">
         <div class="buttons">
-          <router-link class="button is-primary" v-if="config && config.registrationsOpen" :to="{ name: 'Register' }">
+          <router-link class="button is-primary" v-if="config && config.registrationsOpen" :to="{ name: RouteName.REGISTER }">
             <strong>{{ $t('Sign up') }}</strong>
           </router-link>
 
-          <router-link class="button is-light" :to="{ name: 'Login' }">{{ $t('Log in') }}</router-link>
+          <router-link class="button is-light" :to="{ name: RouteName.LOGIN }">{{ $t('Log in') }}</router-link>
         </div>
       </b-navbar-item>
     </template>
@@ -114,7 +117,7 @@ export default class NavBar extends Vue {
   currentUser!: ICurrentUser;
   ICurrentUserRole = ICurrentUserRole;
   identities: IPerson[] = [];
-  showNavbar: boolean = false;
+  RouteName = RouteName;
 
   ActorRouteName = ActorRouteName;
   AdminRouteName = AdminRouteName;
diff --git a/js/src/variables.scss b/js/src/variables.scss
index be3cedd16..3fb70b1d2 100644
--- a/js/src/variables.scss
+++ b/js/src/variables.scss
@@ -16,7 +16,7 @@ $colors: map-merge(
 // Navbar
 $navbar-background-color: $secondary;
 $navbar-item-color: $primary;
-$navbar-height: 7rem;
+$navbar-height: 4rem;
 
 
 // Footer
diff --git a/js/src/views/Event/Edit.vue b/js/src/views/Event/Edit.vue
index 20b91be13..bb997786f 100644
--- a/js/src/views/Event/Edit.vue
+++ b/js/src/views/Event/Edit.vue
@@ -162,7 +162,7 @@
       <div class="container">
         <div class="navbar-menu">
           <div class="navbar-start">
-            <span class="navbar-item" v-if="isUpdate === true && isEventModified">{{ $t('Unsaved changes') }}</span>
+            <span class="navbar-item" v-if="isEventModified">{{ $t('Unsaved changes') }}</span>
           </div>
           <div class="navbar-end">
             <span class="navbar-item">
@@ -293,7 +293,7 @@ export default class EditEvent extends Vue {
 
     if (this.eventId) {
       this.event = await this.getEvent();
-      this.unmodifiedEvent = JSON.parse(JSON.stringify(this.event));
+      this.unmodifiedEvent = JSON.parse(JSON.stringify(this.event.toEditJSON()));
 
       this.pictureFile = await buildFileFromIPicture(this.event.picture);
       this.limitedPlaces = this.event.options.maximumAttendeeCapacity != null;
@@ -301,8 +301,16 @@ export default class EditEvent extends Vue {
   }
 
   created() {
-    const now = new Date();
-    const end = new Date();
+    this.initializeEvent();
+    this.unmodifiedEvent = JSON.parse(JSON.stringify(this.event.toEditJSON()));
+  }
+
+  private initializeEvent() {
+    const roundUpTo = roundTo => x => new Date(Math.ceil(x / roundTo) * roundTo);
+    const roundUpTo15Minutes = roundUpTo(1000 * 60 * 15);
+
+    const now = roundUpTo15Minutes(new Date());
+    const end = roundUpTo15Minutes(new Date());
     end.setUTCHours(now.getUTCHours() + 3);
 
     this.event.beginsOn = now;
@@ -311,7 +319,7 @@ export default class EditEvent extends Vue {
   }
 
   mounted() {
-    this.observer = new IntersectionObserver((entries, observer) => {
+    this.observer = new IntersectionObserver((entries) => {
       for (const entry of entries) {
         if (entry) {
           this.showFixedNavbar = !entry.isIntersecting;
@@ -454,7 +462,7 @@ export default class EditEvent extends Vue {
   }
 
   get isEventModified(): boolean {
-    return JSON.stringify(this.event) !== JSON.stringify(this.unmodifiedEvent);
+    return JSON.stringify(this.event.toEditJSON()) !== JSON.stringify(this.unmodifiedEvent);
   }
 
   // getAddressData(addressData) {
diff --git a/js/src/views/Home.vue b/js/src/views/Home.vue
index a9688c6a4..99dd90494 100644
--- a/js/src/views/Home.vue
+++ b/js/src/views/Home.vue
@@ -1,12 +1,12 @@
 <template>
   <div class="container" v-if="config">
-    <section class="hero is-link" v-if="!currentUser.id || !currentActor">
+    <section class="hero is-info" v-if="!currentUser.id || !currentActor">
       <div class="hero-body">
         <div>
           <h1 class="title">{{ config.name }}</h1>
           <h2 class="subtitle">{{ config.description }}</h2>
           <router-link class="button" :to="{ name: 'Register' }" v-if="config.registrationsOpen">
-            {{ $t('Register') }}
+            {{ $t('Sign up') }}
           </router-link>
           <p v-else>
             {{ $t("This instance isn't opened to registrations, but you can register on other instances.") }}
@@ -14,24 +14,12 @@
         </div>
       </div>
     </section>
-    <section v-else>
-      <h1>
-        {{ $t('Welcome back {username}', {username: `@${currentActor.preferredUsername}`}) }}
-      </h1>
+    <section v-else-if="currentActor">
+      <b-message type="is-info">
+        {{ $t('Welcome back {username}', { username: currentActor.displayName() }) }}
+      </b-message>
     </section>
-    <b-dropdown aria-role="list">
-      <button class="button is-primary" slot="trigger">
-        <span>{{ $t('Create') }}</span>
-        <b-icon icon="menu-down"></b-icon>
-      </button>
-      <b-dropdown-item aria-role="listitem">
-        <router-link :to="{ name: RouteName.CREATE_EVENT }">{{ $t('Event') }}</router-link>
-      </b-dropdown-item>
-      <b-dropdown-item aria-role="listitem">
-        <router-link :to="{ name: RouteName.CREATE_GROUP }">{{ $t('Group') }}</router-link>
-      </b-dropdown-item>
-    </b-dropdown>
-    <section v-if="currentActor && goingToEvents.size > 0" class="container">
+    <section v-else-if="currentActor && goingToEvents.size > 0" class="container">
       <h3 class="title">
         {{ $t("Upcoming") }}
       </h3>
@@ -121,6 +109,7 @@ import { EventRouteName } from '@/router/event';
     },
     currentActor: {
       query: CURRENT_ACTOR_CLIENT,
+      update: data => new Person(data.currentActor),
     },
     currentUser: {
       query: CURRENT_USER_CLIENT,

From 8bfb9ddf1a167c461212c0a731e6cfbbd9a7bc04 Mon Sep 17 00:00:00 2001
From: Thomas Citharel <tcit@tcit.fr>
Date: Thu, 3 Oct 2019 12:32:20 +0200
Subject: [PATCH 2/2] Hide groups and multiple fixes

Closes #169

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
---
 js/src/components/Event/EventListCard.vue |  9 ++--
 js/src/components/NavBar.vue              | 46 +++++---------------
 js/src/components/Report/ReportCard.vue   |  3 --
 js/src/graphql/admin.ts                   |  1 +
 js/src/router/actor.ts                    | 52 +++++++++++------------
 js/src/views/Account/MyAccount.vue        | 10 ++---
 js/src/views/Admin/Dashboard.vue          | 22 +++++-----
 js/src/views/Event/Event.vue              |  3 +-
 js/src/views/Home.vue                     |  6 +--
 js/src/views/Moderation/Logs.vue          | 18 ++++----
 js/src/views/Moderation/Report.vue        | 26 +++++-------
 js/src/views/Moderation/ReportList.vue    | 14 +++---
 js/src/views/Search.vue                   | 36 ++++++++--------
 js/src/views/User/Login.vue               |  6 ++-
 js/src/views/User/PasswordChange.vue      | 10 ++---
 js/src/views/User/Register.vue            |  9 ++--
 js/src/views/User/Validate.vue            |  3 +-
 17 files changed, 117 insertions(+), 157 deletions(-)

diff --git a/js/src/components/Event/EventListCard.vue b/js/src/components/Event/EventListCard.vue
index ee29a9584..4abac1302 100644
--- a/js/src/components/Event/EventListCard.vue
+++ b/js/src/components/Event/EventListCard.vue
@@ -44,7 +44,7 @@
       <div class="actions column is-narrow">
         <ul>
           <li v-if="!([ParticipantRole.PARTICIPANT, ParticipantRole.NOT_APPROVED].includes(participation.role))">
-            <router-link :to="{ name: EventRouteName.EDIT_EVENT, params: { eventId: participation.event.uuid }  }">
+            <router-link :to="{ name: RouteName.EDIT_EVENT, params: { eventId: participation.event.uuid }  }">
               <b-icon icon="pencil" /> {{ $t('Edit') }}
             </router-link>
           </li>
@@ -52,12 +52,12 @@
             <a @click="openDeleteEventModalWrapper"><b-icon icon="delete" /> {{ $t('Delete') }}</a>
           </li>
           <li v-if="!([ParticipantRole.PARTICIPANT, ParticipantRole.NOT_APPROVED].includes(participation.role))">
-            <router-link :to="{ name: EventRouteName.PARTICIPATIONS, params: { eventId: participation.event.uuid } }">
+            <router-link :to="{ name: RouteName.PARTICIPATIONS, params: { eventId: participation.event.uuid } }">
               <b-icon icon="account-multiple-plus" /> {{ $t('Manage participations') }}
             </router-link>
           </li>
           <li>
-            <router-link :to="{ name: EventRouteName.EVENT, params: { uuid: participation.event.uuid } }"><b-icon icon="view-compact" /> {{ $t('View event page') }}</router-link>
+            <router-link :to="{ name: RouteName.EVENT, params: { uuid: participation.event.uuid } }"><b-icon icon="view-compact" /> {{ $t('View event page') }}</router-link>
           </li>
         </ul>
       </div>
@@ -70,7 +70,6 @@ import { IParticipant, ParticipantRole, EventVisibility } from '@/types/event.mo
 import { Component, Prop } from 'vue-property-decorator';
 import DateCalendarIcon from '@/components/Event/DateCalendarIcon.vue';
 import { IActor, IPerson, Person } from '@/types/actor';
-import { EventRouteName } from '@/router/event';
 import { mixins } from 'vue-class-component';
 import ActorMixin from '@/mixins/actor';
 import { CURRENT_ACTOR_CLIENT, LOGGED_USER_PARTICIPATIONS } from '@/graphql/actor';
@@ -100,8 +99,8 @@ export default class EventListCard extends mixins(ActorMixin, EventMixin) {
   currentActor!: IPerson;
 
   ParticipantRole = ParticipantRole;
-  EventRouteName = EventRouteName;
   EventVisibility = EventVisibility;
+  RouteName = RouteName;
 
   defaultOptions: IEventCardOptions = {
     hideDate: true,
diff --git a/js/src/components/NavBar.vue b/js/src/components/NavBar.vue
index fb1a14791..27425aa2d 100644
--- a/js/src/components/NavBar.vue
+++ b/js/src/components/NavBar.vue
@@ -4,8 +4,8 @@
       <b-navbar-item tag="router-link" :to="{ name: RouteName.HOME }"><logo /></b-navbar-item>
     </template>
     <template slot="start">
-      <b-navbar-item tag="router-link" :to="{ name: EventRouteName.EXPLORE }">{{ $t('Explore') }}</b-navbar-item>
-      <b-navbar-item tag="router-link" :to="{ name: EventRouteName.MY_EVENTS }">{{ $t('Events') }}</b-navbar-item>
+      <b-navbar-item tag="router-link" :to="{ name: RouteName.EXPLORE }">{{ $t('Explore') }}</b-navbar-item>
+      <b-navbar-item tag="router-link" :to="{ name: RouteName.MY_EVENTS }">{{ $t('Events') }}</b-navbar-item>
       <b-navbar-item tag="span">
         <b-button tag="router-link" :to="{ name: RouteName.CREATE_EVENT }" type="is-success">{{ $t('Create') }}</b-button>
       </b-navbar-item>
@@ -40,16 +40,16 @@
         </b-navbar-item>
 
 
-          <b-navbar-item>
-            <router-link :to="{ name: 'UpdateIdentity' }">{{ $t('My account') }}</router-link>
+          <b-navbar-item tag="router-link" :to="{ name: RouteName.UPDATE_IDENTITY }">
+            {{ $t('My account') }}
           </b-navbar-item>
 
-          <b-navbar-item>
-            <router-link :to="{ name: ActorRouteName.CREATE_GROUP }">{{ $t('Create group') }}</router-link>
-          </b-navbar-item>
+<!--          <b-navbar-item tag="router-link" :to="{ name: RouteName.CREATE_GROUP }">-->
+<!--            {{ $t('Create group') }}-->
+<!--          </b-navbar-item>-->
 
-          <b-navbar-item v-if="currentUser.role === ICurrentUserRole.ADMINISTRATOR">
-            <router-link :to="{ name: AdminRouteName.DASHBOARD }">{{ $t('Administration') }}</router-link>
+          <b-navbar-item v-if="currentUser.role === ICurrentUserRole.ADMINISTRATOR" tag="router-link" :to="{ name: RouteName.DASHBOARD }">
+            {{ $t('Administration') }}
           </b-navbar-item>
 
           <b-navbar-item tag="span">
@@ -74,17 +74,14 @@
 import { Component, Vue, Watch } from 'vue-property-decorator';
 import { CURRENT_USER_CLIENT } from '@/graphql/user';
 import { changeIdentity, logout } from '@/utils/auth';
-import { CURRENT_ACTOR_CLIENT, IDENTITIES, UPDATE_CURRENT_ACTOR_CLIENT } from '@/graphql/actor';
+import { CURRENT_ACTOR_CLIENT, IDENTITIES } from '@/graphql/actor';
 import { IPerson, Person } from '@/types/actor';
 import { CONFIG } from '@/graphql/config';
 import { IConfig } from '@/types/config.model';
 import { ICurrentUser, ICurrentUserRole } from '@/types/current-user.model';
 import Logo from '@/components/Logo.vue';
 import SearchField from '@/components/SearchField.vue';
-import { ActorRouteName } from '@/router/actor';
-import { AdminRouteName } from '@/router/admin';
 import { RouteName } from '@/router';
-import { EventRouteName } from '@/router/event';
 
 @Component({
   apollo: {
@@ -108,10 +105,6 @@ import { EventRouteName } from '@/router/event';
   },
 })
 export default class NavBar extends Vue {
-  notifications = [
-    { header: 'Coucou' },
-    { title: 'T\'as une notification', subtitle: 'Et elle est cool' },
-  ];
   currentActor!: IPerson;
   config!: IConfig;
   currentUser!: ICurrentUser;
@@ -119,10 +112,6 @@ export default class NavBar extends Vue {
   identities: IPerson[] = [];
   RouteName = RouteName;
 
-  ActorRouteName = ActorRouteName;
-  AdminRouteName = AdminRouteName;
-  EventRouteName = EventRouteName;
-
   @Watch('currentActor')
   async initializeListOfIdentities() {
     const { data } = await this.$apollo.query<{ identities: IPerson[] }>({
@@ -133,21 +122,6 @@ export default class NavBar extends Vue {
     }
   }
 
-  // @Watch('currentUser')
-  // async onCurrentUserChanged() {
-  //   // Refresh logged person object
-  //   if (this.currentUser.isLoggedIn) {
-  //     const result = await this.$apollo.query({
-  //       query: CURRENT_ACTOR_CLIENT,
-  //     });
-  //     console.log(result);
-  //
-  //     this.loggedPerson = result.data.currentActor;
-  //   } else {
-  //     this.loggedPerson = null;
-  //   }
-  // }
-
   async logout() {
     await logout(this.$apollo.provider.defaultClient);
     this.$buefy.notification.open({
diff --git a/js/src/components/Report/ReportCard.vue b/js/src/components/Report/ReportCard.vue
index e0bc9d46d..0a10af3e0 100644
--- a/js/src/components/Report/ReportCard.vue
+++ b/js/src/components/Report/ReportCard.vue
@@ -27,13 +27,10 @@
 <script lang="ts">
 import { Component, Prop, Vue } from 'vue-property-decorator';
 import { IReport } from '@/types/report.model';
-import { EventRouteName } from '@/router/event';
 
 @Component
 export default class ReportCard extends Vue {
   @Prop({ required: true }) report!: IReport;
-
-  EventRouteName = EventRouteName;
 }
 </script>
 <style lang="scss">
diff --git a/js/src/graphql/admin.ts b/js/src/graphql/admin.ts
index d646bb565..ab7de6f41 100644
--- a/js/src/graphql/admin.ts
+++ b/js/src/graphql/admin.ts
@@ -4,6 +4,7 @@ export const DASHBOARD = gql`
     query {
         dashboard {
             lastPublicEventPublished {
+                uuid,
                 title,
                 picture {
                     alt
diff --git a/js/src/router/actor.ts b/js/src/router/actor.ts
index 42f3a4771..51a0d25fa 100644
--- a/js/src/router/actor.ts
+++ b/js/src/router/actor.ts
@@ -19,32 +19,32 @@ export enum MyAccountRouteName {
 }
 
 export const actorRoutes: RouteConfig[] = [
-  {
-    path: '/groups',
-    name: ActorRouteName.GROUP_LIST,
-    component: GroupList,
-    meta: { requiredAuth: false },
-  },
-  {
-    path: '/groups/create',
-    name: ActorRouteName.CREATE_GROUP,
-    component: CreateGroup,
-    meta: { requiredAuth: true },
-  },
-  {
-    path: '/~:preferredUsername',
-    name: ActorRouteName.GROUP,
-    component: Group,
-    props: true,
-    meta: { requiredAuth: false },
-  },
-  {
-    path: '/@:name',
-    name: ActorRouteName.PROFILE,
-    component: Profile,
-    props: true,
-    meta: { requiredAuth: false },
-  },
+  // {
+  //   path: '/groups',
+  //   name: ActorRouteName.GROUP_LIST,
+  //   component: GroupList,
+  //   meta: { requiredAuth: false },
+  // },
+  // {
+  //   path: '/groups/create',
+  //   name: ActorRouteName.CREATE_GROUP,
+  //   component: CreateGroup,
+  //   meta: { requiredAuth: true },
+  // },
+  // {
+  //   path: '/~:preferredUsername',
+  //   name: ActorRouteName.GROUP,
+  //   component: Group,
+  //   props: true,
+  //   meta: { requiredAuth: false },
+  // },
+  // {
+  //   path: '/@:name',
+  //   name: ActorRouteName.PROFILE,
+  //   component: Profile,
+  //   props: true,
+  //   meta: { requiredAuth: false },
+  // },
   {
     path: '/my-account/identity',
     component: MyAccount,
diff --git a/js/src/views/Account/MyAccount.vue b/js/src/views/Account/MyAccount.vue
index c1f6fde27..922c97283 100644
--- a/js/src/views/Account/MyAccount.vue
+++ b/js/src/views/Account/MyAccount.vue
@@ -2,7 +2,7 @@
   <section class="container">
     <nav class="breadcrumb" aria-label="breadcrumbs">
       <ul>
-        <li class="is-active"><router-link :to="{ name: MyAccountRouteName.UPDATE_IDENTITY }" aria-current="page">{{ $t('My account') }}</router-link></li>
+        <li class="is-active"><router-link :to="{ name: RouteName.UPDATE_IDENTITY }" aria-current="page">{{ $t('My account') }}</router-link></li>
       </ul>
     </nav>
     <div v-if="currentActor">
@@ -16,7 +16,7 @@
         <div class="identities column is-4">
           <identities v-bind:currentIdentityName="currentIdentityName"></identities>
           <div class="buttons">
-            <b-button tag="router-link" type="is-secondary" :to="{ name: UserRouteName.PASSWORD_CHANGE }">{{ $t('Change password') }}</b-button>
+            <b-button tag="router-link" type="is-secondary" :to="{ name: RouteName.PASSWORD_CHANGE }">{{ $t('Change password') }}</b-button>
           </div>
         </div>
         <div class="column is-8">
@@ -48,8 +48,7 @@ import { Component, Vue, Watch } from 'vue-property-decorator';
 import EventCard from '@/components/Event/EventCard.vue';
 import { IPerson } from '@/types/actor';
 import Identities from '@/components/Account/Identities.vue';
-import { UserRouteName } from '@/router/user';
-import { MyAccountRouteName } from '@/router/actor';
+import { RouteName } from '@/router';
 
 @Component({
   components: {
@@ -66,8 +65,7 @@ export default class MyAccount extends Vue {
   currentActor!: IPerson;
   currentIdentityName: string | null = null;
 
-  UserRouteName = UserRouteName;
-  MyAccountRouteName = MyAccountRouteName;
+  RouteName = RouteName;
 
   @Watch('$route.params.identityName', { immediate: true })
   async onIdentityParamChanged (val: string) {
diff --git a/js/src/views/Admin/Dashboard.vue b/js/src/views/Admin/Dashboard.vue
index 38e512880..118542bb3 100644
--- a/js/src/views/Admin/Dashboard.vue
+++ b/js/src/views/Admin/Dashboard.vue
@@ -19,7 +19,7 @@
                             <p class="title">{{ dashboard.numberOfUsers }}</p>
                             <p class="subtitle">{{ $t('Users')}}</p>
                         </article>
-                        <router-link :to="{ name: ModerationRouteName.REPORTS}">
+                        <router-link :to="{ name: RouteName.REPORTS}">
                             <article class="tile is-child box">
                                 <p class="title">{{ dashboard.numberOfReports }}</p>
                                 <p class="subtitle">{{ $t('Opened reports')}}</p>
@@ -28,13 +28,15 @@
                     </div>
                 </div>
                 <div class="tile is-parent" v-if="dashboard.lastPublicEventPublished">
-                    <article class="tile is-child box">
-                        <p class="title">{{ $t('Last published event') }}</p>
-                        <p class="subtitle">{{ dashboard.lastPublicEventPublished.title }}</p>
-                        <figure class="image is-4by3" v-if="dashboard.lastPublicEventPublished.picture">
-                            <img :src="dashboard.lastPublicEventPublished.picture.url" />
-                        </figure>
-                    </article>
+                    <router-link :to="{ name: RouteName.EVENT, params: { uuid: dashboard.lastPublicEventPublished.uuid } }">
+                        <article class="tile is-child box">
+                            <p class="title">{{ $t('Last published event') }}</p>
+                            <p class="subtitle">{{ dashboard.lastPublicEventPublished.title }}</p>
+                            <figure class="image is-4by3" v-if="dashboard.lastPublicEventPublished.picture">
+                                <img :src="dashboard.lastPublicEventPublished.picture.url" />
+                            </figure>
+                        </article>
+                    </router-link>
                 </div>
             </div>
             <div class="tile is-parent">
@@ -57,7 +59,7 @@
 import { Component, Vue } from 'vue-property-decorator';
 import { DASHBOARD } from '@/graphql/admin';
 import { IDashboard } from '@/types/admin.model';
-import { ModerationRouteName } from '@/router/moderation';
+import { RouteName } from '@/router';
 
 @Component({
   apollo: {
@@ -68,6 +70,6 @@ import { ModerationRouteName } from '@/router/moderation';
 })
 export default class Dashboard extends Vue {
   dashboard!: IDashboard;
-  ModerationRouteName = ModerationRouteName;
+  RouteName = RouteName;
 }
 </script>
\ No newline at end of file
diff --git a/js/src/views/Event/Event.vue b/js/src/views/Event/Event.vue
index 6e2289726..6c952d0f1 100644
--- a/js/src/views/Event/Event.vue
+++ b/js/src/views/Event/Event.vue
@@ -74,7 +74,7 @@
                 <p class="control" v-if="actorIsOrganizer || event.draft">
                   <router-link
                           class="button"
-                          :to="{ name: 'EditEvent', params: {eventId: event.uuid}}"
+                          :to="{ name: RouteName.EDIT_EVENT, params: {eventId: event.uuid}}"
                   >
                     {{ $t('Edit') }}
                   </router-link>
@@ -277,6 +277,7 @@ export default class Event extends EventMixin {
   isReportModalActive: boolean = false;
   isJoinModalActive: boolean = false;
   EventVisibility = EventVisibility;
+  RouteName = RouteName;
 
   mounted() {
     this.identity = this.currentActor;
diff --git a/js/src/views/Home.vue b/js/src/views/Home.vue
index 99dd90494..4206ba8f5 100644
--- a/js/src/views/Home.vue
+++ b/js/src/views/Home.vue
@@ -5,7 +5,7 @@
         <div>
           <h1 class="title">{{ config.name }}</h1>
           <h2 class="subtitle">{{ config.description }}</h2>
-          <router-link class="button" :to="{ name: 'Register' }" v-if="config.registrationsOpen">
+          <router-link class="button" :to="{ name: RouteName.REGISTER }" v-if="config.registrationsOpen">
             {{ $t('Sign up') }}
           </router-link>
           <p v-else>
@@ -50,7 +50,7 @@
         </div>
       </div>
       <span class="view-all">
-        <router-link :to=" { name: EventRouteName.MY_EVENTS }">{{ $t('View everything')}} >></router-link>
+        <router-link :to=" { name: RouteName.MY_EVENTS }">{{ $t('View everything')}} >></router-link>
       </span>
     </section>
     <section v-if="currentActor && lastWeekEvents.length > 0">
@@ -99,7 +99,6 @@ import { EventModel, IEvent, IParticipant, Participant } from '@/types/event.mod
 import DateComponent from '@/components/Event/DateCalendarIcon.vue';
 import { CONFIG } from '@/graphql/config';
 import { IConfig } from '@/types/config.model';
-import { EventRouteName } from '@/router/event';
 
 @Component({
   apollo: {
@@ -134,7 +133,6 @@ export default class Home extends Vue {
   currentActor!: IPerson;
   config: IConfig = { description: '', name: '', registrationsOpen: false };
   RouteName = RouteName;
-  EventRouteName = EventRouteName;
 
   // get displayed_name() {
   //   return this.loggedPerson && this.loggedPerson.name === null
diff --git a/js/src/views/Moderation/Logs.vue b/js/src/views/Moderation/Logs.vue
index ca8dcecb6..7003443d7 100644
--- a/js/src/views/Moderation/Logs.vue
+++ b/js/src/views/Moderation/Logs.vue
@@ -2,8 +2,8 @@
     <section class="container">
         <nav class="breadcrumb" aria-label="breadcrumbs">
             <ul>
-                <li><router-link :to="{ name: AdminRouteName.DASHBOARD }">Dashboard</router-link></li>
-                <li class="is-active"><router-link :to="{ name: ModerationRouteName.LOGS }" aria-current="page">Logs</router-link></li>
+                <li><router-link :to="{ name: RouteName.DASHBOARD }">Dashboard</router-link></li>
+                <li class="is-active"><router-link :to="{ name: RouteName.LOGS }" aria-current="page">Logs</router-link></li>
             </ul>
         </nav>
         <ul v-if="actionLogs.length > 0">
@@ -12,17 +12,17 @@
                     <img class="image" :src="log.actor.avatar.url" />
                     <span>@{{ log.actor.preferredUsername }}</span>
                     <span v-if="log.action === ActionLogAction.REPORT_UPDATE_CLOSED">
-                        closed <router-link :to="{ name: ModerationRouteName.REPORT, params: { reportId: log.object.id } }">report #{{ log.object.id }}</router-link>
+                        closed <router-link :to="{ name: RouteName.REPORT, params: { reportId: log.object.id } }">report #{{ log.object.id }}</router-link>
                     </span>
                     <span v-else-if="log.action === ActionLogAction.REPORT_UPDATE_OPENED">
-                        reopened <router-link :to="{ name: ModerationRouteName.REPORT, params: { reportId: log.object.id } }">report #{{ log.object.id }}</router-link>
+                        reopened <router-link :to="{ name: RouteName.REPORT, params: { reportId: log.object.id } }">report #{{ log.object.id }}</router-link>
                     </span>
                     <span v-else-if="log.action === ActionLogAction.REPORT_UPDATE_RESOLVED">
-                        marked <router-link :to="{ name: ModerationRouteName.REPORT, params: { reportId: log.object.id } }">report #{{ log.object.id }}</router-link> as resolved
+                        marked <router-link :to="{ name: RouteName.REPORT, params: { reportId: log.object.id } }">report #{{ log.object.id }}</router-link> as resolved
                     </span>
                     <span v-else-if="log.action === ActionLogAction.NOTE_CREATION">
                         added a note on
-                        <router-link v-if="log.object.report" :to="{ name: ModerationRouteName.REPORT, params: { reportId: log.object.report.id } }">report #{{ log.object.report.id }}</router-link>
+                        <router-link v-if="log.object.report" :to="{ name: RouteName.REPORT, params: { reportId: log.object.report.id } }">report #{{ log.object.report.id }}</router-link>
                         <span v-else>a non-existent report</span>
                     </span>
                     <span v-else-if="log.action === ActionLogAction.EVENT_DELETION">
@@ -44,8 +44,7 @@ import { Component, Vue } from 'vue-property-decorator';
 import { IActionLog, ActionLogAction } from '@/types/report.model';
 import { LOGS } from '@/graphql/report';
 import ReportCard from '@/components/Report/ReportCard.vue';
-import { AdminRouteName } from '@/router/admin';
-import { ModerationRouteName } from '@/router/moderation';
+import { RouteName } from '@/router';
 
 @Component({
   components: {
@@ -62,8 +61,7 @@ export default class ReportList extends Vue {
   actionLogs?: IActionLog[] = [];
 
   ActionLogAction = ActionLogAction;
-  AdminRouteName = AdminRouteName;
-  ModerationRouteName = ModerationRouteName;
+  RouteName = RouteName;
 }
 </script>
 <style lang="scss">
diff --git a/js/src/views/Moderation/Report.vue b/js/src/views/Moderation/Report.vue
index ef2869ffd..0b10c3376 100644
--- a/js/src/views/Moderation/Report.vue
+++ b/js/src/views/Moderation/Report.vue
@@ -4,9 +4,9 @@
         <div class="container" v-if="report">
             <nav class="breadcrumb" aria-label="breadcrumbs">
                 <ul>
-                    <li><router-link :to="{ name: AdminRouteName.DASHBOARD }">Dashboard</router-link></li>
-                    <li><router-link :to="{ name: ModerationRouteName.REPORTS }">Reports</router-link></li>
-                    <li class="is-active"><router-link :to="{ name: ModerationRouteName.REPORT, params: { reportId: this.report.id} }" aria-current="page">Report</router-link></li>
+                    <li><router-link :to="{ name: RouteName.DASHBOARD }">Dashboard</router-link></li>
+                    <li><router-link :to="{ name: RouteName.REPORTS }">Reports</router-link></li>
+                    <li class="is-active"><router-link :to="{ name: RouteName.REPORT, params: { reportId: this.report.id} }" aria-current="page">Report</router-link></li>
                 </ul>
             </nav>
             <div class="buttons">
@@ -22,7 +22,7 @@
                                 <tr>
                                     <td>Compte signalé</td>
                                     <td>
-                                        <router-link :to="{ name: ActorRouteName.PROFILE, params: { name: report.reported.preferredUsername } }">
+                                        <router-link :to="{ name: RouteName.PROFILE, params: { name: report.reported.preferredUsername } }">
                                             <img v-if="report.reported.avatar" class="image" :src="report.reported.avatar.url" /> @{{ report.reported.preferredUsername }}
                                         </router-link>
                                     </td>
@@ -30,7 +30,7 @@
                                 <tr>
                                     <td>Signalé par</td>
                                     <td>
-                                        <router-link :to="{ name: ActorRouteName.PROFILE, params: { name: report.reporter.preferredUsername } }">
+                                        <router-link :to="{ name: RouteName.PROFILE, params: { name: report.reporter.preferredUsername } }">
                                             <img v-if="report.reporter.avatar" class="image" :src="report.reporter.avatar.url" /> @{{ report.reporter.preferredUsername }}
                                         </router-link>
                                     </td>
@@ -66,14 +66,14 @@
             </div>
 
             <div class="box" v-if="report.event">
-                <router-link :to="{ name: EventRouteName.EVENT, params: { uuid: report.event.uuid }}">
+                <router-link :to="{ name: RouteName.EVENT, params: { uuid: report.event.uuid }}">
                     <h3 class="title">{{ report.event.title }}</h3>
                     <p v-html="report.event.description"></p>
                 </router-link>
                 <b-button
                         tag="router-link"
                         type="is-primary"
-                        :to="{ name: EventRouteName.EDIT_EVENT, params: {eventId: report.event.uuid } }"
+                        :to="{ name: RouteName.EDIT_EVENT, params: {eventId: report.event.uuid } }"
                         icon-left="pencil"
                         size="is-small">Edit</b-button>
                 <b-button
@@ -86,7 +86,7 @@
             <h2 class="title" v-if="report.notes.length > 0">Notes</h2>
             <div class="box note" v-for="note in report.notes" :id="`note-${note.id}`">
                 <p>{{ note.content }}</p>
-                <router-link :to="{ name: ActorRouteName.PROFILE, params: { name: note.moderator.preferredUsername } }">
+                <router-link :to="{ name: RouteName.PROFILE, params: { name: note.moderator.preferredUsername } }">
                     <img class="image" :src="note.moderator.avatar.url" /> @{{ note.moderator.preferredUsername }}
                 </router-link><br />
                 <small><a :href="`#note-${note.id}`" v-if="note.insertedAt">{{ note.insertedAt | formatDateTimeString }}</a></small>
@@ -105,10 +105,7 @@
 import { Component, Prop, Vue } from 'vue-property-decorator';
 import { CREATE_REPORT_NOTE, REPORT, REPORTS, UPDATE_REPORT } from '@/graphql/report';
 import { IReport, IReportNote, ReportStatusEnum } from '@/types/report.model';
-import { EventRouteName } from '@/router/event';
-import { ActorRouteName } from '@/router/actor';
-import { AdminRouteName } from '@/router/admin';
-import { ModerationRouteName } from '@/router/moderation';
+import { RouteName } from '@/router';
 import { CURRENT_ACTOR_CLIENT } from '@/graphql/actor';
 import { IPerson } from '@/types/actor';
 import { DELETE_EVENT } from '@/graphql/event';
@@ -139,10 +136,7 @@ export default class Report extends Vue {
   errors: string[] = [];
 
   ReportStatusEnum = ReportStatusEnum;
-  EventRouteName = EventRouteName;
-  ActorRouteName = ActorRouteName;
-  AdminRouteName = AdminRouteName;
-  ModerationRouteName = ModerationRouteName;
+  RouteName = RouteName;
 
   noteContent: string = '';
 
diff --git a/js/src/views/Moderation/ReportList.vue b/js/src/views/Moderation/ReportList.vue
index 9b91d920d..82fbcab10 100644
--- a/js/src/views/Moderation/ReportList.vue
+++ b/js/src/views/Moderation/ReportList.vue
@@ -2,8 +2,8 @@
     <section class="container">
         <nav class="breadcrumb" aria-label="breadcrumbs">
             <ul>
-                <li><router-link :to="{ name: AdminRouteName.DASHBOARD }">Dashboard</router-link></li>
-                <li class="is-active"><router-link :to="{ name: ModerationRouteName.REPORTS }" aria-current="page">Reports</router-link></li>
+                <li><router-link :to="{ name: RouteName.DASHBOARD }">Dashboard</router-link></li>
+                <li class="is-active"><router-link :to="{ name: RouteName.REPORTS }" aria-current="page">Reports</router-link></li>
             </ul>
         </nav>
         <b-field>
@@ -22,7 +22,7 @@
         </b-field>
         <ul v-if="reports.length > 0">
             <li v-for="report in reports">
-                <router-link :to="{ name: ModerationRouteName.REPORT, params: { reportId: report.id } }">
+                <router-link :to="{ name: RouteName.REPORT, params: { reportId: report.id } }">
                     <report-card :report="report" />
                 </router-link>
             </li>
@@ -39,8 +39,7 @@ import { Component, Prop, Vue, Watch } from 'vue-property-decorator';
 import { IReport, ReportStatusEnum } from '@/types/report.model';
 import { REPORTS } from '@/graphql/report';
 import ReportCard from '@/components/Report/ReportCard.vue';
-import { AdminRouteName } from '@/router/admin';
-import { ModerationRouteName } from '@/router/moderation';
+import { RouteName } from '@/router';
 
 @Component({
   components: {
@@ -62,8 +61,7 @@ import { ModerationRouteName } from '@/router/moderation';
 export default class ReportList extends Vue {
 
   reports?: IReport[] = [];
-  AdminRouteName = AdminRouteName;
-  ModerationRouteName = ModerationRouteName;
+  RouteName = RouteName;
   ReportStatusEnum = ReportStatusEnum;
   filterReports: ReportStatusEnum = ReportStatusEnum.OPEN;
 
@@ -78,7 +76,7 @@ export default class ReportList extends Vue {
 
   @Watch('filterReports', { immediate: true })
         async onFilterChanged (val: string) {
-    await this.$router.push({ name: ModerationRouteName.REPORTS, params: { filter: val.toLowerCase() } });
+    await this.$router.push({ name: RouteName.REPORTS, params: { filter: val.toLowerCase() } });
   }
 }
 </script>
diff --git a/js/src/views/Search.vue b/js/src/views/Search.vue
index 2c09562f6..98a2bdc44 100644
--- a/js/src/views/Search.vue
+++ b/js/src/views/Search.vue
@@ -25,24 +25,24 @@
                     {{ $t('No events found') }}
                 </b-message>
             </b-tab-item>
-            <b-tab-item>
-                <template slot="header">
-                    <b-icon icon="account-multiple"></b-icon>
-                    <span>
-                        {{ $t('Groups') }} <b-tag rounded>{{ searchGroups.total }}</b-tag>
-                    </span>
-                </template>
-                <div v-if="searchGroups.total > 0" class="columns is-multiline">
-                    <div class="column is-one-quarter-desktop is-half-mobile"
-                         v-for="group in groups"
-                         :key="group.uuid">
-                        <group-card :group="group" />
-                    </div>
-                </div>
-                <b-message v-else-if="$apollo.loading === false" type="is-danger">
-                    {{ $t('No groups found') }}
-                </b-message>
-            </b-tab-item>
+<!--            <b-tab-item>-->
+<!--                <template slot="header">-->
+<!--                    <b-icon icon="account-multiple"></b-icon>-->
+<!--                    <span>-->
+<!--                        {{ $t('Groups') }} <b-tag rounded>{{ searchGroups.total }}</b-tag>-->
+<!--                    </span>-->
+<!--                </template>-->
+<!--                <div v-if="searchGroups.total > 0" class="columns is-multiline">-->
+<!--                    <div class="column is-one-quarter-desktop is-half-mobile"-->
+<!--                         v-for="group in groups"-->
+<!--                         :key="group.uuid">-->
+<!--                        <group-card :group="group" />-->
+<!--                    </div>-->
+<!--                </div>-->
+<!--                <b-message v-else-if="$apollo.loading === false" type="is-danger">-->
+<!--                    {{ $t('No groups found') }}-->
+<!--                </b-message>-->
+<!--            </b-tab-item>-->
         </b-tabs>
     </section>
 </template>
diff --git a/js/src/views/User/Login.vue b/js/src/views/User/Login.vue
index 3b1cbadee..12f2af73a 100644
--- a/js/src/views/User/Login.vue
+++ b/js/src/views/User/Login.vue
@@ -37,7 +37,7 @@
             <div class="control">
               <router-link
                 class="button is-text"
-                :to="{ name: 'SendPasswordReset', params: { email: credentials.email }}"
+                :to="{ name: RouteName.SEND_PASSWORD_RESET, params: { email: credentials.email }}"
               >
                 {{ $t('Forgot your password ?') }}
               </router-link>
@@ -45,7 +45,7 @@
             <div class="control" v-if="config && config.registrationsOpen">
               <router-link
                 class="button is-text"
-                :to="{ name: 'Register', params: { default_email: credentials.email, default_password: credentials.password }}"
+                :to="{ name: RouteName.REGISTER, params: { default_email: credentials.email, default_password: credentials.password }}"
               >
                 {{ $t('Register') }}
               </router-link>
@@ -95,6 +95,8 @@ export default class Login extends Vue {
   config!: IConfig;
   currentUser!: ICurrentUser;
 
+  RouteName = RouteName;
+
   credentials = {
     email: '',
     password: '',
diff --git a/js/src/views/User/PasswordChange.vue b/js/src/views/User/PasswordChange.vue
index 3a426cedb..b629aca54 100644
--- a/js/src/views/User/PasswordChange.vue
+++ b/js/src/views/User/PasswordChange.vue
@@ -2,8 +2,8 @@
     <section class="container">
         <nav class="breadcrumb" aria-label="breadcrumbs">
             <ul>
-                <li><router-link :to="{ name: MyAccountRouteName.UPDATE_IDENTITY }">{{ $t('My account') }}</router-link></li>
-                <li class="is-active"><router-link :to="{ name: UserRouteName.PASSWORD_CHANGE }" aria-current="page">{{ $t('Password change') }}</router-link></li>
+                <li><router-link :to="{ name: RouteName.UPDATE_IDENTITY }">{{ $t('My account') }}</router-link></li>
+                <li class="is-active"><router-link :to="{ name: RouteName.PASSWORD_CHANGE }" aria-current="page">{{ $t('Password change') }}</router-link></li>
             </ul>
         </nav>
         <h1 class="title">{{ $t('Password') }}</h1>
@@ -48,8 +48,7 @@
 <script lang="ts">
 import { Component, Vue } from 'vue-property-decorator';
 import { CHANGE_PASSWORD } from '@/graphql/user';
-import { UserRouteName } from '@/router/user';
-import { MyAccountRouteName } from '@/router/actor';
+import { RouteName } from '@/router';
 
 @Component
 export default class PasswordChange extends Vue {
@@ -57,8 +56,7 @@ export default class PasswordChange extends Vue {
   newPassword: string = '';
   errors: string[] = [];
 
-  MyAccountRouteName = MyAccountRouteName;
-  UserRouteName = UserRouteName;
+  RouteName = RouteName;
 
   async resetAction(e) {
     e.preventDefault();
diff --git a/js/src/views/User/Register.vue b/js/src/views/User/Register.vue
index 852e4d02f..6ac17714b 100644
--- a/js/src/views/User/Register.vue
+++ b/js/src/views/User/Register.vue
@@ -77,7 +77,7 @@
                 <div class="control">
                   <router-link
                     class="button is-text"
-                    :to="{ name: 'ResendConfirmation', params: { email: credentials.email }}"
+                    :to="{ name: RouteName.RESEND_CONFIRMATION, params: { email: credentials.email }}"
                   >
                     {{ $t("Didn't receive the instructions ?") }}
                   </router-link>
@@ -85,7 +85,7 @@
                 <div class="control">
                   <router-link
                     class="button is-text"
-                    :to="{ name: 'Login', params: { email: credentials.email, password: credentials.password }}"
+                    :to="{ name: RouteName.LOGIN, params: { email: credentials.email, password: credentials.password }}"
                     :disabled="sendingValidation"
                   >
                     {{ $t('Login') }}
@@ -107,7 +107,7 @@
 <script lang="ts">
 import { CREATE_USER } from '@/graphql/user';
 import { Component, Prop, Vue } from 'vue-property-decorator';
-import { UserRouteName } from '@/router/user';
+import { RouteName } from '@/router';
 
 @Component
 export default class Register extends Vue {
@@ -121,6 +121,7 @@ export default class Register extends Vue {
   errors: object = {};
   sendingValidation: boolean = false;
   validationSent: boolean = false;
+  RouteName = RouteName;
 
   async submit() {
     try {
@@ -135,7 +136,7 @@ export default class Register extends Vue {
       this.validationSent = true;
 
       this.$router.push({
-        name: UserRouteName.REGISTER_PROFILE,
+        name: RouteName.REGISTER_PROFILE,
         params: { email: this.credentials.email },
       });
     } catch (error) {
diff --git a/js/src/views/User/Validate.vue b/js/src/views/User/Validate.vue
index 0ba2e0b78..c91d76f76 100644
--- a/js/src/views/User/Validate.vue
+++ b/js/src/views/User/Validate.vue
@@ -21,7 +21,6 @@ import { VALIDATE_USER } from '@/graphql/user';
 import { Component, Prop, Vue } from 'vue-property-decorator';
 import { AUTH_USER_ID } from '@/constants';
 import { RouteName } from '@/router';
-import { UserRouteName } from '@/router/user';
 import { saveTokenData } from '@/utils/auth';
 
 @Component
@@ -51,7 +50,7 @@ export default class Validate extends Vue {
       if (user.defaultActor) {
         this.$router.push({ name: RouteName.HOME });
       } else { // If the user didn't register any profile yet, let's create one for them
-        this.$router.push({ name: UserRouteName.REGISTER_PROFILE, params: { email: user.email, userAlreadyActivated: 'true' } });
+        this.$router.push({ name: RouteName.REGISTER_PROFILE, params: { email: user.email, userAlreadyActivated: 'true' } });
       }
     } catch (err) {
       console.error(err);