feat: add complex user invitation and management features
- Implemented complex member and invitation schemas using Zod for validation. - Created new API endpoints for inviting, accepting, revoking, and canceling complex user invitations. - Developed handlers for managing complex users, including listing, inviting, revoking, and canceling invitations. - Added frontend components for displaying and managing complex users and invitations. - Introduced session storage management for pending invitations. - Integrated Gravatar for user avatars based on email. - Created database migration for complex invitations table.
This commit is contained in:
47
apps/frontend/src/components/user-avatar.tsx
Normal file
47
apps/frontend/src/components/user-avatar.tsx
Normal file
@@ -0,0 +1,47 @@
|
||||
import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
|
||||
import { useEffect, useState } from 'react';
|
||||
|
||||
type UserAvatarProps = {
|
||||
src?: string | null;
|
||||
alt: string;
|
||||
fallbackText: string;
|
||||
size?: 'default' | 'sm' | 'lg';
|
||||
className?: string;
|
||||
};
|
||||
|
||||
function getInitials(text: string) {
|
||||
const words = text.trim().split(/\s+/).filter(Boolean).slice(0, 2);
|
||||
const initials = words.map((word) => word[0]?.toUpperCase() ?? '').join('');
|
||||
return initials || 'U';
|
||||
}
|
||||
|
||||
export function UserAvatar({
|
||||
src,
|
||||
alt,
|
||||
fallbackText,
|
||||
size = 'default',
|
||||
className,
|
||||
}: UserAvatarProps) {
|
||||
const [imageError, setImageError] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
setImageError(false);
|
||||
}, [src]);
|
||||
|
||||
const canShowImage = Boolean(src) && !imageError;
|
||||
|
||||
return (
|
||||
<Avatar size={size} className={className}>
|
||||
{canShowImage && (
|
||||
<AvatarImage
|
||||
src={src ?? undefined}
|
||||
alt={alt}
|
||||
onError={() => {
|
||||
setImageError(true);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
<AvatarFallback>{getInitials(fallbackText)}</AvatarFallback>
|
||||
</Avatar>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user