From 9eed88b430ab3d51ca2d945bd33610eafe8e932e Mon Sep 17 00:00:00 2001
From: Matthew Penner <me@matthewp.io>
Date: Thu, 7 Jan 2021 09:55:04 -0700
Subject: [PATCH] admin(ui): actually get avatar for users

---
 app/Transformers/Api/Application/UserTransformer.php        | 4 +++-
 resources/scripts/api/admin/users/getUsers.ts               | 4 +++-
 resources/scripts/components/admin/users/UsersContainer.tsx | 4 ++--
 3 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/app/Transformers/Api/Application/UserTransformer.php b/app/Transformers/Api/Application/UserTransformer.php
index 70d74f452..e48c406cc 100644
--- a/app/Transformers/Api/Application/UserTransformer.php
+++ b/app/Transformers/Api/Application/UserTransformer.php
@@ -43,9 +43,11 @@ class UserTransformer extends BaseTransformer
             'language' => $model->language,
             'root_admin' => (bool) $model->root_admin,
             '2fa' => (bool) $model->use_totp,
-            'role_name' => $model->root_admin ? 'Super Administrator' : 'None',
+            'avatar_url' => 'https://www.gravatar.com/avatar/' . md5($model->email) . '.jpg?s=40',
+            'role_name' => $model->root_admin ? 'Super Administrator' : null,
             'created_at' => $this->formatTimestamp($model->created_at),
             'updated_at' => $this->formatTimestamp($model->updated_at),
+            'avatar'
         ];
     }
 
diff --git a/resources/scripts/api/admin/users/getUsers.ts b/resources/scripts/api/admin/users/getUsers.ts
index 5b5138cde..dfa0c9bee 100644
--- a/resources/scripts/api/admin/users/getUsers.ts
+++ b/resources/scripts/api/admin/users/getUsers.ts
@@ -13,7 +13,8 @@ export interface User {
     language: string;
     rootAdmin: boolean;
     tfa: boolean;
-    roleName: string;
+    avatarURL: string;
+    roleName: string | null;
     createdAt: Date;
     updatedAt: Date;
 }
@@ -29,6 +30,7 @@ export const rawDataToUser = ({ attributes }: FractalResponseData): User => ({
     language: attributes.language,
     rootAdmin: attributes.root_admin,
     tfa: attributes['2fa'],
+    avatarURL: attributes.avatar_url,
     roleName: attributes.role_name,
     createdAt: new Date(attributes.created_at),
     updatedAt: new Date(attributes.updated_at),
diff --git a/resources/scripts/components/admin/users/UsersContainer.tsx b/resources/scripts/components/admin/users/UsersContainer.tsx
index 3b9a590b5..f677a28ac 100644
--- a/resources/scripts/components/admin/users/UsersContainer.tsx
+++ b/resources/scripts/components/admin/users/UsersContainer.tsx
@@ -117,7 +117,7 @@ const UsersContainer = () => {
                                                             <NavLink to={`${match.url}/${user.id}`}>
                                                                 <div css={tw`flex items-center`}>
                                                                     <div css={tw`flex-shrink-0 h-10 w-10`}>
-                                                                        <img css={tw`h-10 w-10 rounded-full`} alt="" src="https://www.gravatar.com/avatar/92623b66155f7e475250b549226a5023"/>
+                                                                        <img css={tw`h-10 w-10 rounded-full`} alt="" src={user.avatarURL}/>
                                                                     </div>
 
                                                                     <div css={tw`ml-4`}>
@@ -141,7 +141,7 @@ const UsersContainer = () => {
                                                             </span>
                                                         </td>
 
-                                                        <td css={tw`px-6 text-sm text-neutral-200 text-left whitespace-nowrap`}>{user.roleName}</td>
+                                                        <td css={tw`px-6 text-sm text-neutral-200 text-left whitespace-nowrap`}>{user.roleName || 'None'}</td>
                                                     </tr>
                                                 ))
                                             }