Add showing and modifying user name (#306)

Make sure to use the user name field everywhere

Add showing and modifying user name

Co-authored-by: kolaente <k@knt.li>
Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/306
Co-Authored-By: konrad <konrad@kola-entertainments.de>
Co-Committed-By: konrad <konrad@kola-entertainments.de>

src/components/home/topNavigation.vue

@@ -45,7 +45,7 @@
 				<div class="dropdown is-right is-active">
 					<div class="dropdown-trigger">
 						<button @click.stop="userMenuActive = !userMenuActive" class="button noshadow">
-							<span class="username">{{ userInfo.username }}</span>
+							<span class="username">{{ userInfo.name !== '' ? userInfo.name : userInfo.username }}</span>
 							<span class="icon is-small">
 									<icon icon="chevron-down"/>
 								</span>

src/components/misc/user.vue

@@ -6,8 +6,8 @@
 			:width="avatarSize"
 			alt=""
 			class="avatar"
-			v-tooltip="user.username"/>
-		<span class="username" v-if="showUsername">{{ user.username }}</span>
+			v-tooltip="user.getDisplayName()"/>
+		<span class="username" v-if="showUsername">{{ user.getDisplayName() }}</span>
 	</div>
 </template>
 

src/components/sharing/linkSharing.vue

@@ -52,7 +52,7 @@
 							</div>
 						</td>
 						<td>
-							{{ s.sharedBy.username }}
+							{{ s.sharedBy.getDisplayName() }}
 						</td>
 						<td class="type">
 							<template v-if="s.right === rights.ADMIN">

src/components/sharing/userTeam.vue

@@ -46,7 +46,7 @@
 				<tbody>
 				<tr :key="s.id" v-for="s in sharables">
 					<template v-if="shareType === 'user'">
-						<td>{{ s.username }}</td>
+						<td>{{ s.getDisplayName() }}</td>
 						<td>
 							<template v-if="s.id === userInfo.id">
 								<b class="is-success">You</b>

src/components/tasks/edit-task.vue

@@ -107,7 +107,7 @@
 			<label class="label" for="">Assignees</label>
 			<ul class="assingees">
 				<li :key="a.id" v-for="(a, index) in taskEditTask.assignees">
-					{{ a.username }}
+					{{ a.getDisplayName() }}
 					<a @click="deleteAssigneeByIndex(index)">
 						<icon icon="times"/>
 					</a>

src/components/tasks/partials/comments.vue

@@ -17,7 +17,7 @@
 				<div class="media-content">
 					<div class="comment-info">
 						<img :src="c.author.getAvatarUrl(20)" alt="" class="image is-avatar" height="20" width="20"/>
-						<strong>{{ c.author.username }}</strong>&nbsp;
+						<strong>{{ c.author.getDisplayName() }}</strong>&nbsp;
 						<span v-tooltip="formatDate(c.created)">{{ formatDateSince(c.created) }}</span>
 						<span v-if="+new Date(c.created) !== +new Date(c.updated)" v-tooltip="formatDate(c.updated)">
 							· edited {{ formatDateSince(c.updated) }}