diff --git a/app/containers/Avatar/Avatar.tsx b/app/containers/Avatar/Avatar.tsx index a06c12608..57ab49b29 100644 --- a/app/containers/Avatar/Avatar.tsx +++ b/app/containers/Avatar/Avatar.tsx @@ -28,7 +28,8 @@ const Avatar = React.memo( text, size = 25, borderRadius = 4, - type = SubscriptionType.DIRECT + type = SubscriptionType.DIRECT, + externalProviderUrl }: IAvatar) => { const { theme } = useTheme(); @@ -67,7 +68,8 @@ const Avatar = React.memo( avatarETag, serverVersion, rid, - blockUnauthenticatedAccess + blockUnauthenticatedAccess, + externalProviderUrl }); } diff --git a/app/containers/Avatar/index.tsx b/app/containers/Avatar/index.tsx index 8467e45c0..13e78b443 100644 --- a/app/containers/Avatar/index.tsx +++ b/app/containers/Avatar/index.tsx @@ -32,7 +32,10 @@ class AvatarContainer extends React.Component { shouldComponentUpdate(nextProps: IAvatar, nextState: { avatarETag: string }) { const { avatarETag } = this.state; - const { text, type } = this.props; + const { text, type, externalProviderUrl } = this.props; + if (nextProps.externalProviderUrl !== externalProviderUrl) { + return true; + } if (nextState.avatarETag !== avatarETag) { return true; } @@ -100,6 +103,7 @@ const mapStateToProps = (state: IApplicationState) => ({ blockUnauthenticatedAccess: (state.share.settings?.Accounts_AvatarBlockUnauthenticatedAccess as boolean) ?? state.settings.Accounts_AvatarBlockUnauthenticatedAccess ?? - true + true, + externalProviderUrl: state.settings.Accounts_AvatarExternalProviderUrl as string }); export default connect(mapStateToProps)(AvatarContainer); diff --git a/app/containers/Avatar/interfaces.ts b/app/containers/Avatar/interfaces.ts index c455da0a5..c4be26f7b 100644 --- a/app/containers/Avatar/interfaces.ts +++ b/app/containers/Avatar/interfaces.ts @@ -23,4 +23,5 @@ export interface IAvatar { rid?: string; blockUnauthenticatedAccess?: boolean; serverVersion: string | null; + externalProviderUrl?: string; } diff --git a/app/lib/constants/defaultSettings.ts b/app/lib/constants/defaultSettings.ts index 8b1eed2a6..b140e89ff 100644 --- a/app/lib/constants/defaultSettings.ts +++ b/app/lib/constants/defaultSettings.ts @@ -205,5 +205,8 @@ export const defaultSettings = { }, Canned_Responses_Enable: { type: 'valueAsBoolean' + }, + Accounts_AvatarExternalProviderUrl: { + type: 'valueAsString' } } as const; diff --git a/app/utils/avatar.ts b/app/utils/avatar.ts index 459e04295..2569e8d02 100644 --- a/app/utils/avatar.ts +++ b/app/utils/avatar.ts @@ -2,7 +2,7 @@ import { SubscriptionType } from '../definitions/ISubscription'; import { IAvatar } from '../containers/Avatar/interfaces'; import { compareServerVersion } from '../lib/methods/helpers/compareServerVersion'; -const formatUrl = (url: string, size: number, query: string) => `${url}?format=png&size=${size}${query}`; +const formatUrl = (url: string, size: number, query?: string) => `${url}?format=png&size=${size}${query}`; export const avatarURL = ({ type, @@ -14,11 +14,16 @@ export const avatarURL = ({ avatarETag, rid, blockUnauthenticatedAccess, - serverVersion + serverVersion, + externalProviderUrl }: IAvatar): string => { let room; if (type === SubscriptionType.DIRECT) { room = text; + if (externalProviderUrl) { + const externalUri = externalProviderUrl.trim().replace(/\/+$/, '').replace('{username}', room); + return formatUrl(`${externalUri}`, size); + } } else if (rid && !compareServerVersion(serverVersion, 'lowerThan', '3.6.0')) { room = `room/${rid}`; } else {