display name when available instead of email in header

web/themes/custom/materiotheme/assets/styles/main.scss

@@ -793,6 +793,9 @@ aside.messages{
 #content-left{
   z-index: 5;
   box-sizing: content-box;
+
+  position:fixed;
+
   max-width:1px;
   overflow-x: hidden;
   transition: all 0.3s ease-in-out;

web/themes/custom/materiotheme/vuejs/components/User/UserTools.vue

@@ -4,7 +4,8 @@
 
     > -->
     <a class="mdi mdi-account" href="/user">
-      <span>{{ mail }}</span>
+      <span v-if="name">{{ name }}</span>
+      <span v-else>{{ mail }}</span>
     </a>
     <!-- </h4> -->
     <a href="/admin/content/materials"
@@ -27,6 +28,8 @@ import { mapState, mapActions } from 'vuex'
 import UserFlags from 'vuejs/components/User/UserFlags'
 
 export default {
+  watch: {
+  },
   components: {
     UserFlags
   },
@@ -38,6 +41,7 @@ export default {
   computed: {
     ...mapState({
       mail: state => state.User.mail,
+      name: state => state.User.name,
       isAdmin: state => state.User.isAdmin,
       isAdherent: state => state.User.isAdherent,
       flags: state => state.User.flags

web/themes/custom/materiotheme/vuejs/store/modules/user.js

@@ -16,6 +16,7 @@ export default {
     uid: null,
     // username: '',
     mail: '',
+    name: null,
     csrf_token: null,
     logout_token: null,
     loginMessage: '',
@@ -92,6 +93,10 @@ export default {
         state.hasDBAccess = true
       }
     },
+    setName (state, name) {
+      console.log('setName', name)
+      state.name = name
+    },
     setLoggedOut (state) {
       console.log('setLoggedOut state', state)
       state.uid = null
@@ -243,6 +248,10 @@ export default {
               if (data.roles) {
                 commit('setRoles', data.roles)
               }
+              console.log('customer_profiles', data.customer_profiles.length)
+              if (data.customer_profiles.length) {
+                dispatch('getUserProfiles', data.customer_profiles[data.customer_profiles.length - 1].target_id)
+              }
               dispatch('getUserFlagColls')
               resolve()
             })
@@ -253,6 +262,20 @@ export default {
         })
       })
     },
+    getUserProfiles ({ dispatch, commit, state }, pid) {
+      const params = {
+        token: state.csrf_token
+      }
+      REST.get(`/profile/${pid}?_format=json`, params).then(({ data }) => {
+        console.log('profile', data)
+        if (data.address.length) {
+          commit('setName', `${data.address[0].given_name} ${data.address[0].family_name} `)
+        }
+      }).catch(error => {
+        console.warn('Issue with getUser', error)
+        Promise.reject(error)
+      })
+    },
     getUserFlagColls ({ dispatch, commit, state }) {
       // flags
       // REST.get('/flagging_collection/1?_format=json')