From 1c7bffb3d77c0f0799e8f727d9988dcb8a7ecf1f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Daniel=20G=C3=B6bel?= <dgoebel@techfak.uni-bielefeld.de>
Date: Tue, 18 Jun 2024 13:48:33 +0000
Subject: [PATCH] Fix profile picture when missing gravatar url
#128
---
src/components/AppHeader.vue | 7 +++++++
src/views/admin/AdminUsersView.vue | 11 +++++++++--
2 files changed, 16 insertions(+), 2 deletions(-)
diff --git a/src/components/AppHeader.vue b/src/components/AppHeader.vue
index 331c790..97d73da 100644
--- a/src/components/AppHeader.vue
+++ b/src/components/AppHeader.vue
@@ -3,6 +3,7 @@ import { useUserStore } from "@/stores/users";
import { useRoute, useRouter } from "vue-router";
import { watch, ref, computed } from "vue";
import { OpenAPI } from "@/client";
+import FontAwesomeIcon from "@/components/FontAwesomeIcon.vue";
const userRepository = useUserStore();
const route = useRoute();
@@ -265,12 +266,18 @@ watch(
>
<strong class="me-2">{{ userRepository.user.display_name }}</strong>
<img
+ v-if="userRepository.user.gravatar_url"
:src="userRepository.user.gravatar_url + '?d=mp&s=32'"
class="rounded-circle"
height="32"
width="32"
alt="profile picture"
/>
+ <font-awesome-icon
+ v-else
+ icon="fa-solid fa-circle-user"
+ class="text-secondary fs-4"
+ />
</a>
<ul
class="dropdown-menu text-small shadow"
diff --git a/src/views/admin/AdminUsersView.vue b/src/views/admin/AdminUsersView.vue
index 693fed2..69fa6ea 100644
--- a/src/views/admin/AdminUsersView.vue
+++ b/src/views/admin/AdminUsersView.vue
@@ -213,12 +213,19 @@ onMounted(() => {
<tr v-for="(user, index) in userState.users" :key="user.uid">
<th scope="row">
<img
+ v-if="user.gravatar_url"
:src="user.gravatar_url + '?d=mp&s=32'"
- class="rounded-circle me-2"
+ class="rounded-circle"
height="32"
width="32"
alt="profile picture"
- />{{ user.display_name }}
+ />
+ <font-awesome-icon
+ v-else
+ icon="fa-solid fa-circle-user"
+ class="text-secondary fs-4"
+ />
+ <span class="ms-2">{{ user.display_name }}</span>
</th>
<td>{{ user.uid }}</td>
<td
--
GitLab