mirrors/cinny
1
0
Fork 0
mirror of https://github.com/cinnyapp/cinny.git synced 2025-11-14 03:00:29 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add option to view user avatar (#2462)

Browse source
This commit is contained in:
Ajay Bura 2025-08-24 18:06:45 +05:30 • committed by GitHub
parent 4056cbb11c
commit 23aa5c6f94
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 66 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/app/components/user-avatar/UserAvatar.tsx
View file

@ -1,15 +1,17 @@
import { AvatarFallback, AvatarImage, color } from 'folds';
import React, { ReactEventHandler, ReactNode, useState } from 'react';
import classNames from 'classnames';
import * as css from './UserAvatar.css';
import colorMXID from '../../../util/colorMXID';
type UserAvatarProps = {
className?: string;
userId: string;
src?: string;
alt?: string;
renderFallback: () => ReactNode;
};
export function UserAvatar({ userId, src, alt, renderFallback }: UserAvatarProps) {
export function UserAvatar({ className, userId, src, alt, renderFallback }: UserAvatarProps) {
const [error, setError] = useState(false);
const handleLoad: ReactEventHandler<HTMLImageElement> = (evt) => {
@ -20,7 +22,7 @@ export function UserAvatar({ userId, src, alt, renderFallback }: UserAvatarProps
return (
<AvatarFallback
style={{ backgroundColor: colorMXID(userId), color: color.Surface.Container }}
className={css.UserAvatar}
className={classNames(css.UserAvatar, className)}
>
{renderFallback()}
</AvatarFallback>
@ -29,7 +31,7 @@ export function UserAvatar({ userId, src, alt, renderFallback }: UserAvatarProps
return (
<AvatarImage
className={css.UserAvatar}
className={classNames(css.UserAvatar, className)}
src={src}
alt={alt}
onError={() => setError(true)}