diff options
Diffstat (limited to 'apps/files_sharing/src/utils/AccountIcon.ts')
-rw-r--r-- | apps/files_sharing/src/utils/AccountIcon.ts | 18 |
1 files changed, 14 insertions, 4 deletions
diff --git a/apps/files_sharing/src/utils/AccountIcon.ts b/apps/files_sharing/src/utils/AccountIcon.ts index ac126fb1b35..504bb43540e 100644 --- a/apps/files_sharing/src/utils/AccountIcon.ts +++ b/apps/files_sharing/src/utils/AccountIcon.ts @@ -4,12 +4,22 @@ */ import { generateUrl } from '@nextcloud/router' -const isDarkMode = window?.matchMedia?.('(prefers-color-scheme: dark)')?.matches === true - || document.querySelector('[data-themes*=dark]') !== null +const isDarkMode = () => { + return window?.matchMedia?.('(prefers-color-scheme: dark)')?.matches === true + || document.querySelector('[data-themes*=dark]') !== null +} export const generateAvatarSvg = (userId: string, isGuest = false) => { - const url = isDarkMode ? '/avatar/{userId}/32/dark' : '/avatar/{userId}/32' - const avatarUrl = generateUrl(isGuest ? url : url + '?guestFallback=true', { userId }) + // normal avatar url: /avatar/{userId}/32?guestFallback=true + // dark avatar url: /avatar/{userId}/32/dark?guestFallback=true + // guest avatar url: /avatar/guest/{userId}/32 + // guest dark avatar url: /avatar/guest/{userId}/32/dark + const basePath = isGuest ? `/avatar/guest/${userId}` : `/avatar/${userId}` + const darkModePath = isDarkMode() ? '/dark' : '' + const guestFallback = isGuest ? '' : '?guestFallback=true' + + const url = `${basePath}/32${darkModePath}${guestFallback}` + const avatarUrl = generateUrl(url, { userId }) return `<svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" class="sharing-status__avatar"> <image href="${avatarUrl}" height="32" width="32" /> |