Bug fix: avatar of account owner not displayed (#690)

* Begin - fix account owner not displayed

* Finish - profile pic of account owner not displayed

front/src/modules/companies/components/CompanyAccountOwnerCell.tsx

@@ -7,7 +7,7 @@ import { Company, User } from '~/generated/graphql';
 import { CompanyAccountOwnerPicker } from './CompanyAccountOwnerPicker';
 
 export type CompanyAccountOnwer = Pick<Company, 'id'> & {
-  accountOwner?: Pick<User, 'id' | 'displayName'> | null;
+  accountOwner?: Pick<User, 'id' | 'displayName' | 'avatarUrl'> | null;
 };
 
 export type OwnProps = {
@@ -40,6 +40,7 @@ export function CompanyAccountOwnerCell({ company }: OwnProps) {
           <PersonChip
             id={company.accountOwner.id}
             name={company.accountOwner?.displayName ?? ''}
+            picture={company.accountOwner?.avatarUrl ?? ''}
           />
         ) : (
           <></>

front/src/modules/companies/components/CompanyAccountOwnerPicker.tsx

@@ -42,6 +42,7 @@ export function CompanyAccountOwnerPicker({
       id: user.id,
       name: user.displayName,
       avatarType: 'rounded',
+      avatarUrl: user.avatarUrl ?? '',
     }),
     orderByField: 'firstName',
     searchOnFields: ['firstName', 'lastName'],

front/src/modules/companies/fields/components/CompanyAccountOwnerEditableField.tsx

@@ -12,7 +12,7 @@ import { CompanyAccountOwnerPickerFieldEditMode } from './CompanyAccountOwnerPic
 
 type OwnProps = {
   company: Pick<Company, 'id' | 'accountOwnerId'> & {
-    accountOwner?: Pick<User, 'id' | 'displayName'> | null;
+    accountOwner?: Pick<User, 'id' | 'displayName' | 'avatarUrl'> | null;
   };
 };
 
@@ -41,6 +41,7 @@ export function CompanyAccountOwnerEditableField({ company }: OwnProps) {
               <PersonChip
                 id={company.accountOwner.id}
                 name={company.accountOwner?.displayName ?? ''}
+                picture={company.accountOwner?.avatarUrl ?? ''}
               />
             ) : (
               <></>

front/src/modules/companies/queries/select.ts

@@ -34,6 +34,7 @@ export const GET_COMPANIES = gql`
         displayName
         firstName
         lastName
+        avatarUrl
       }
     }
   }

front/src/modules/companies/queries/show.ts

@@ -16,6 +16,7 @@ export const GET_COMPANY = gql`
         id
         email
         displayName
+        avatarUrl
       }
     }
   }

front/src/modules/companies/table/components/EditableCompanyAccountOwnerCell.tsx

@@ -16,6 +16,7 @@ export function EditableCompanyAccountOwnerCell() {
       company={{
         id: currentRowEntityId ?? '',
         accountOwner: {
+          avatarUrl: accountOwner?.avatarUrl ?? '',
           displayName: accountOwner?.displayName ?? '',
           id: accountOwner?.id ?? '',
         },

front/src/modules/search/services/search.ts

@@ -38,6 +38,7 @@ export const SEARCH_USER_QUERY = gql`
       displayName
       firstName
       lastName
+      avatarUrl
     }
   }
 `;

front/src/modules/users/components/Avatar.tsx

@@ -3,6 +3,8 @@ import styled from '@emotion/styled';
 import { stringToHslColor } from '@/utils/string-to-hsl';
 import { isNonEmptyString } from '@/utils/type-guards/isNonEmptyString';
 
+import { getImageAbsoluteURIOrBase64 } from '../utils/getProfilePictureAbsoluteURI';
+
 export type AvatarType = 'squared' | 'rounded';
 
 type OwnProps = {
@@ -44,7 +46,7 @@ export function Avatar({
 
   return (
     <StyledAvatar
-      avatarUrl={avatarUrl}
+      avatarUrl={getImageAbsoluteURIOrBase64(avatarUrl)}
       placeholder={placeholder}
       size={size}
       type={type}

front/src/modules/users/utils/getProfilePictureAbsoluteURI.ts

@@ -7,5 +7,9 @@ export function getImageAbsoluteURIOrBase64(imageUrl?: string | null) {
     return imageUrl;
   }
 
+  if (imageUrl?.startsWith('https:')) {
+    return imageUrl;
+  }
+
   return `${process.env.REACT_APP_FILES_URL}/${imageUrl}`;
 }