Initial release: JMAP Webmail Client

A modern, privacy-focused webmail client built with Next.js and the JMAP protocol.
Designed for Stalwart Mail Server.

Features:
- Full email operations (compose, reply, forward, threading)
- Real-time push notifications
- Dark/light theme support
- Mobile responsive design
- Keyboard shortcuts
- Drag-and-drop organization
- i18n (English/French)
- Security-first (external content blocked, HTML sanitization)

components/ui/avatar.tsx

@@ -0,0 +1,54 @@
+import { cn } from "@/lib/utils";
+
+interface AvatarProps {
+  name?: string;
+  email?: string;
+  size?: "sm" | "md" | "lg";
+  className?: string;
+}
+
+export function Avatar({ name, email, size = "md", className }: AvatarProps) {
+  const getInitials = () => {
+    if (name) {
+      const parts = name.trim().split(/\s+/);
+      if (parts.length >= 2) {
+        return `${parts[0][0]}${parts[parts.length - 1][0]}`.toUpperCase();
+      }
+      return name.slice(0, 2).toUpperCase();
+    }
+    if (email) {
+      return email[0].toUpperCase();
+    }
+    return "?";
+  };
+
+  const getBackgroundColor = () => {
+    const str = name || email || "";
+    let hash = 0;
+    for (let i = 0; i < str.length; i++) {
+      hash = str.charCodeAt(i) + ((hash << 5) - hash);
+    }
+    const hue = Math.abs(hash) % 360;
+    return `hsl(${hue}, 70%, 50%)`;
+  };
+
+  const sizeClasses = {
+    sm: "w-8 h-8 text-xs",
+    md: "w-10 h-10 text-sm",
+    lg: "w-12 h-12 text-base",
+  };
+
+  return (
+    <div
+      className={cn(
+        "rounded-full flex items-center justify-center font-semibold text-white",
+        sizeClasses[size],
+        className
+      )}
+      style={{ backgroundColor: getBackgroundColor() }}
+      title={name || email}
+    >
+      {getInitials()}
+    </div>
+  );
+}