feat: Implement identity lock screen for sensitive user actions and introduce avatar generation.

src/app/api/account/password/route.ts

@@ -10,6 +10,7 @@ import { requireAuth, verifyPassword, hashPassword } from '@/lib/auth';
 import { db, users } from '@/db';
 import { eq } from 'drizzle-orm';
 import * as crypto from 'crypto';
+import { requireSignedAction, type SignedAction } from '@/lib/auth/verify-signature';
 
 /**
  * Decrypt the private key using the OLD password
@@ -70,9 +71,17 @@ function encryptPrivateKey(privateKey: string, password: string): { encrypted: s
 
 export async function POST(req: NextRequest) {
     try {
-        const user = await requireAuth();
+        // Parse signed action
-        const body = await req.json();
+        const signedAction: SignedAction = await req.json();
-        const { currentPassword, newPassword } = body;
+
+        // Verify signature and get user
+        const user = await requireSignedAction(signedAction);
+
+        if (signedAction.action !== 'change_password') {
+            return NextResponse.json({ error: 'Invalid action type' }, { status: 400 });
+        }
+
+        const { currentPassword, newPassword } = signedAction.data;
 
         if (!currentPassword || !newPassword) {
             return NextResponse.json({ error: 'Missing required fields' }, { status: 400 });

src/app/api/auth/me/route.ts

@@ -1,8 +1,9 @@
 import { NextResponse } from 'next/server';
-import { getSession, requireAuth } from '@/lib/auth';
+import { getSession } from '@/lib/auth';
 import { db, users } from '@/db';
 import { eq } from 'drizzle-orm';
 import { z } from 'zod';
+import { requireSignedAction, type SignedAction } from '@/lib/auth/verify-signature';
 
 const updateProfileSchema = z.object({
     displayName: z.string().min(1).max(50).optional(),
@@ -52,9 +53,20 @@ export async function PATCH(request: Request) {
             return NextResponse.json({ error: 'Database not available' }, { status: 503 });
         }
 
-        const currentUser = await requireAuth();
+        // Parse signed action
-        const body = await request.json();
+        const signedAction: SignedAction = await request.json();
-        const data = updateProfileSchema.parse(body);
+
+        // Verify signature and get user
+        // This ensures the request was signed by the user's private key
+        const currentUser = await requireSignedAction(signedAction);
+
+        // Ensure the action type is correct for profile updates
+        if (signedAction.action !== 'update_profile') {
+            return NextResponse.json({ error: 'Invalid action type' }, { status: 400 });
+        }
+
+        // Parse inner data
+        const data = updateProfileSchema.parse(signedAction.data);
 
         const updateData: {
             displayName?: string;
@@ -119,8 +131,13 @@ export async function PATCH(request: Request) {
         if (error instanceof z.ZodError) {
             return NextResponse.json({ error: 'Invalid input', details: error.issues }, { status: 400 });
         }
-        if (error instanceof Error && error.message === 'Authentication required') {
+        if (error instanceof Error) {
-            return NextResponse.json({ error: 'Authentication required' }, { status: 401 });
+            if (error.message === 'Authentication required') {
+                return NextResponse.json({ error: 'Authentication required' }, { status: 401 });
+            }
+            if (error.message === 'Invalid signature' || error.message === 'User not found') {
+                return NextResponse.json({ error: 'Invalid signature or identity' }, { status: 403 });
+            }
         }
         console.error('Profile update error:', error);
         return NextResponse.json({ error: 'Failed to update profile' }, { status: 500 });

src/app/api/swarm/chat/conversations/route.ts

@@ -71,8 +71,8 @@ export async function GET(request: NextRequest) {
           }
         }
 
-        // LAZY LOAD: If remote and not cached, try to fetch it now
+        // LAZY LOAD: If remote and (not cached OR missing avatar), try to fetch it now
-        if (!cachedUser && isRemote) {
+        if (isRemote && (!cachedUser || !cachedUser.avatarUrl)) {
           try {
             const [rHandle, rDomain] = participant2Handle.split('@');
             const { fetchSwarmUserProfile } = await import('@/lib/swarm/interactions');

src/app/api/swarm/chat/messages/route.ts

@@ -7,7 +7,7 @@
 
 import { NextRequest, NextResponse } from 'next/server';
 import { db, chatConversations, chatMessages, users } from '@/db';
-import { eq, desc, and, lt, isNull, sql } from 'drizzle-orm';
+import { eq, desc, and, lt, isNull, sql, inArray } from 'drizzle-orm';
 import { getSession } from '@/lib/auth';
 
 
@@ -73,7 +73,7 @@ export async function GET(request: NextRequest) {
 
     if (senderDids.size > 0) {
       const found = await db.query.users.findMany({
-        where: sql`${users.did} IN ${Array.from(senderDids)}`
+        where: inArray(users.did, Array.from(senderDids))
       });
       found.forEach(u => usersByDid[u.did] = u);
     }
@@ -81,7 +81,7 @@ export async function GET(request: NextRequest) {
     // Also fetch local users by handle if needed
     if (senderHandles.size > 0) {
       const found = await db.query.users.findMany({
-        where: sql`${users.handle} IN ${Array.from(senderHandles)}`
+        where: inArray(users.handle, Array.from(senderHandles))
       });
       found.forEach(u => usersByHandle[u.handle] = u);
     }

src/app/settings/layout.tsx

@@ -0,0 +1,34 @@
+'use client';
+
+import { useAuth } from '@/lib/contexts/AuthContext';
+import { IdentityLockScreen } from '@/components/IdentityLockScreen';
+import { Loader2 } from 'lucide-react';
+
+export default function SettingsLayout({ children }: { children: React.ReactNode }) {
+    const { isIdentityUnlocked, loading } = useAuth();
+
+    if (loading) {
+        return (
+            <div style={{
+                minHeight: '60vh',
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center',
+                color: 'var(--foreground-tertiary)'
+            }}>
+                <Loader2 className="animate-spin" size={24} />
+            </div>
+        );
+    }
+
+    if (!isIdentityUnlocked) {
+        return (
+            <IdentityLockScreen
+                title="Settings Locked"
+                description="To view or change your settings, you must unlock your identity. Your private keys are required to sign any changes you make."
+            />
+        );
+    }
+
+    return <>{children}</>;
+}

src/app/settings/privacy/page.tsx

@@ -4,6 +4,7 @@ import { useState, useEffect } from 'react';
 import { useRouter } from 'next/navigation';
 import { ArrowLeftIcon } from '@/components/Icons';
 import { MessageSquare, Check } from 'lucide-react';
+import { useAuth } from '@/lib/contexts/AuthContext';
 
 export default function PrivacySettingsPage() {
     const router = useRouter();
@@ -13,6 +14,8 @@ export default function PrivacySettingsPage() {
     const [dmPrivacy, setDmPrivacy] = useState<'everyone' | 'following' | 'none'>('everyone');
     const [status, setStatus] = useState<{ type: 'success' | 'error', message: string } | null>(null);
 
+    const { isIdentityUnlocked, setShowUnlockPrompt, signUserAction } = useAuth();
+
     useEffect(() => {
         fetch('/api/auth/me')
             .then(res => res.json())
@@ -27,15 +30,23 @@ export default function PrivacySettingsPage() {
     }, []);
 
     const handleSave = async (newValue: 'everyone' | 'following' | 'none') => {
+        // If identity is locked, prompt to unlock and return
+        if (!isIdentityUnlocked) {
+            setShowUnlockPrompt(true);
+            return;
+        }
+
         setDmPrivacy(newValue);
         setSaving(true);
         setStatus(null);
 
         try {
+            const signedPayload = await signUserAction('update_profile', { dmPrivacy: newValue });
+
             const res = await fetch('/api/auth/me', {
                 method: 'PATCH',
                 headers: { 'Content-Type': 'application/json' },
-                body: JSON.stringify({ dmPrivacy: newValue }),
+                body: JSON.stringify(signedPayload),
             });
 
             if (res.ok) {
@@ -44,6 +55,11 @@ export default function PrivacySettingsPage() {
             } else {
                 const data = await res.json();
                 setStatus({ type: 'error', message: data.error || 'Failed to save settings' });
+
+                // If error due to identity lock
+                if (data.error === 'Invalid signature or identity') {
+                    setShowUnlockPrompt(true);
+                }
             }
         } catch (error) {
             setStatus({ type: 'error', message: 'An error occurred' });

src/app/settings/security/page.tsx

@@ -4,6 +4,7 @@ import { useState } from 'react';
 import Link from 'next/link';
 import { ArrowLeftIcon } from '@/components/Icons';
 import { Shield, Lock, Check, AlertCircle } from 'lucide-react';
+import { useAuth } from '@/lib/contexts/AuthContext';
 
 export default function SecuritySettingsPage() {
     const [currentPassword, setCurrentPassword] = useState('');
@@ -12,6 +13,7 @@ export default function SecuritySettingsPage() {
     const [isSubmitting, setIsSubmitting] = useState(false);
     const [error, setError] = useState<string | null>(null);
     const [success, setSuccess] = useState<string | null>(null);
+    const { isIdentityUnlocked, setShowUnlockPrompt, signUserAction } = useAuth();
 
     const handleSubmit = async (e: React.FormEvent) => {
         e.preventDefault();
@@ -34,18 +36,35 @@ export default function SecuritySettingsPage() {
             return;
         }
 
+        // If identity is locked, prompt to unlock and return
+        // Note: It seems redundant since they entered the password,
+        // but this ensures the KEY is loaded in memory.
+        if (!isIdentityUnlocked) {
+            setShowUnlockPrompt(true);
+            return;
+        }
+
         setIsSubmitting(true);
 
         try {
+            // Sign the password change action
+            // This proves we have the key unlocked (which required knowing the password)
+            const signedPayload = await signUserAction('change_password', { currentPassword, newPassword });
+
             const res = await fetch('/api/account/password', {
                 method: 'POST',
                 headers: { 'Content-Type': 'application/json' },
-                body: JSON.stringify({ currentPassword, newPassword }),
+                body: JSON.stringify(signedPayload),
             });
 
             const data = await res.json();
 
             if (!res.ok) {
+                // If error due to identity lock
+                if (data.error === 'Invalid signature or identity' || data.error === 'User not found') {
+                    setShowUnlockPrompt(true);
+                    throw new Error('Identity verification failed. Please unlock your identity.');
+                }
                 throw new Error(data.error || 'Failed to change password');
             }
 

src/app/u/[handle]/page.tsx

@@ -7,9 +7,10 @@ import { ArrowLeftIcon, CalendarIcon } from '@/components/Icons';
 import { PostCard } from '@/components/PostCard';
 import { User, Post } from '@/lib/types';
 import AutoTextarea from '@/components/AutoTextarea';
-import { Rocket, MoreHorizontal, Mail } from 'lucide-react';
+import { Rocket, MoreHorizontal, Mail, Camera } from 'lucide-react';
 import { formatFullHandle } from '@/lib/utils/handle';
 import { Bot } from 'lucide-react';
+import { useAuth } from '@/lib/contexts/AuthContext';
 
 interface BotOwner {
     id: string;
@@ -78,6 +79,7 @@ export default function ProfilePage() {
     const params = useParams();
     const router = useRouter();
     const handle = (params.handle as string)?.replace(/^@/, '') || '';
+    const { isIdentityUnlocked, setShowUnlockPrompt, signUserAction } = useAuth();
 
     const [user, setUser] = useState<User | null>(null);
     const [posts, setPosts] = useState<Post[]>([]);
@@ -111,6 +113,74 @@ export default function ProfilePage() {
     const [isBlocked, setIsBlocked] = useState(false);
     const [showMenu, setShowMenu] = useState(false);
 
+    const avatarInputRef = useRef<HTMLInputElement>(null);
+    const headerInputRef = useRef<HTMLInputElement>(null);
+
+    const handleUpload = async (e: React.ChangeEvent<HTMLInputElement>, field: 'avatarUrl' | 'headerUrl') => {
+        const file = e.target.files?.[0];
+        if (!file) return;
+
+        // Reset inputs so change event fires again for same file
+        e.target.value = '';
+
+        setIsSaving(true);
+        try {
+            // 1. Upload the file
+            const formData = new FormData();
+            formData.append('file', file);
+            const uploadRes = await fetch('/api/uploads', {
+                method: 'POST',
+                body: formData,
+            });
+            const uploadData = await uploadRes.json();
+
+            if (!uploadData.url) throw new Error('Upload failed');
+            const imageUrl = uploadData.url;
+
+            // 2. Update local form state immediately for UI feedback
+            setProfileForm(prev => ({ ...prev, [field]: imageUrl }));
+
+            // 3. Auto-save the profile change
+            if (!isIdentityUnlocked) {
+                setShowUnlockPrompt(true);
+                throw new Error('Please unlock your identity to save the changes.');
+            }
+
+            // Create partial update payload
+            const updatePayload: any = { [field]: imageUrl };
+
+            // Sign the action
+            const signedPayload = await signUserAction('update_profile', updatePayload);
+
+            const saveRes = await fetch('/api/auth/me', {
+                method: 'PATCH',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify(signedPayload),
+            });
+
+            const saveData = await saveRes.json();
+
+            if (!saveRes.ok) {
+                // If error due to identity lock
+                if (saveData.error === 'Invalid signature or identity') {
+                    setShowUnlockPrompt(true);
+                    throw new Error('Identity verification failed. Please try again after unlocking.');
+                }
+                throw new Error(saveData.error || 'Failed to update profile');
+            }
+
+            // Update user state with the returned updated user
+            setUser(saveData.user);
+            // We do NOT exit edit mode automatically, allowing them to edit other fields
+
+        } catch (err) {
+            console.error(err);
+            setSaveError(err instanceof Error ? err.message : 'Upload failed');
+        } finally {
+            setIsSaving(false);
+        }
+    };
+
     useEffect(() => {
         setIsEditing(false);
         setSaveError(null);
@@ -303,6 +373,11 @@ export default function ProfilePage() {
     const handleFollow = async () => {
         if (!currentUser) return;
 
+        if (!isIdentityUnlocked) {
+            setShowUnlockPrompt(true, () => handleFollow());
+            return;
+        }
+
         const method = isFollowing ? 'DELETE' : 'POST';
         const res = await fetch(`/api/users/${handle}/follow`, { method });
 
@@ -318,6 +393,11 @@ export default function ProfilePage() {
     const handleBlock = async () => {
         if (!currentUser) return;
 
+        if (!isIdentityUnlocked) {
+            setShowUnlockPrompt(true, () => handleBlock());
+            return;
+        }
+
         const method = isBlocked ? 'DELETE' : 'POST';
         const res = await fetch(`/api/users/${handle}/block`, { method });
 
@@ -333,14 +413,24 @@ export default function ProfilePage() {
 
     const handleSaveProfile = async () => {
         if (!isOwnProfile) return;
+
+        // If identity is locked, prompt to unlock and return
+        if (!isIdentityUnlocked) {
+            setShowUnlockPrompt(true);
+            return;
+        }
+
         setIsSaving(true);
         setSaveError(null);
 
         try {
+            // Sign the profile update action
+            const signedPayload = await signUserAction('update_profile', profileForm);
+
             const res = await fetch('/api/auth/me', {
                 method: 'PATCH',
                 headers: { 'Content-Type': 'application/json' },
-                body: JSON.stringify(profileForm),
+                body: JSON.stringify(signedPayload),
             });
 
             const data = await res.json();
@@ -353,7 +443,14 @@ export default function ProfilePage() {
             setIsEditing(false);
         } catch (error) {
             console.error('Profile update failed', error);
-            setSaveError('Unable to update profile. Please try again.');
+            setSaveError(error instanceof Error && error.message.includes('Identity locked')
+                ? 'Please unlock your identity to save changes.'
+                : 'Unable to update profile. Please try again.');
+
+            // If the error was due to lock state (race condition), prompt unlock
+            if (error instanceof Error && error.message.includes('Identity locked')) {
+                setShowUnlockPrompt(true);
+            }
         } finally {
             setIsSaving(false);
         }
@@ -465,12 +562,47 @@ export default function ProfilePage() {
             {/* Profile Header */}
             <div style={{ borderBottom: '1px solid var(--border)' }}>
                 {/* Banner */}
-                <div style={{
+                {/* Banner */}
-                    height: '150px',
+                <div
-                    background: user.headerUrl
+                    style={{
-                        ? `url(${user.headerUrl}) center/cover`
+                        height: '150px',
-                        : 'linear-gradient(135deg, var(--accent-muted) 0%, var(--background-tertiary) 100%)',
+                        background: (isEditing ? profileForm.headerUrl : user.headerUrl)
-                }} />
+                            ? `url(${isEditing ? profileForm.headerUrl : user.headerUrl}) center/cover`
+                            : 'linear-gradient(135deg, var(--accent-muted) 0%, var(--background-tertiary) 100%)',
+                        position: 'relative',
+                        cursor: isEditing ? 'pointer' : 'default',
+                    }}
+                    onClick={() => {
+                        if (isEditing) {
+                            if (!isIdentityUnlocked) {
+                                setShowUnlockPrompt(true);
+                            } else {
+                                headerInputRef.current?.click();
+                            }
+                        }
+                    }}
+                >
+                    {isEditing && (
+                        <div style={{
+                            position: 'absolute',
+                            inset: 0,
+                            background: 'rgba(0,0,0,0.3)',
+                            display: 'flex',
+                            alignItems: 'center',
+                            justifyContent: 'center',
+                            color: 'white'
+                        }}>
+                            <Camera size={32} />
+                            <input
+                                ref={headerInputRef}
+                                type="file"
+                                accept="image/*"
+                                onChange={(e) => handleUpload(e, 'headerUrl')}
+                                style={{ display: 'none' }}
+                            />
+                        </div>
+                    )}
+                </div>
 
                 {/* Avatar & Actions */}
                 <div style={{ padding: '0 16px' }}>
@@ -479,18 +611,54 @@ export default function ProfilePage() {
                         justifyContent: 'space-between',
                         alignItems: 'flex-start',
                     }}>
-                        <div className="avatar avatar-lg" style={{
+                        <div
-                            width: '96px',
+                            className="avatar avatar-lg"
-                            height: '96px',
+                            style={{
-                            fontSize: '36px',
+                                width: '96px',
-                            border: '4px solid var(--background)',
+                                height: '96px',
-                            marginTop: '-48px',
+                                fontSize: '36px',
-                        }}>
+                                border: '4px solid var(--background)',
-                            {user.avatarUrl ? (
+                                marginTop: '-48px',
-                                <img src={user.avatarUrl} alt={user.displayName || user.handle} />
+                                position: 'relative',
+                                cursor: isEditing ? 'pointer' : 'default',
+                            }}
+                            onClick={() => {
+                                if (isEditing) {
+                                    if (!isIdentityUnlocked) {
+                                        setShowUnlockPrompt(true);
+                                    } else {
+                                        avatarInputRef.current?.click();
+                                    }
+                                }
+                            }}
+                        >
+                            {(isEditing ? profileForm.avatarUrl : user.avatarUrl) ? (
+                                <img src={(isEditing ? profileForm.avatarUrl : user.avatarUrl) || ''} alt={user.displayName || user.handle} />
                             ) : (
                                 (user.displayName || user.handle).charAt(0).toUpperCase()
                             )}
+
+                            {isEditing && (
+                                <div style={{
+                                    position: 'absolute',
+                                    inset: 0,
+                                    background: 'rgba(0,0,0,0.3)',
+                                    borderRadius: '50%',
+                                    display: 'flex',
+                                    alignItems: 'center',
+                                    justifyContent: 'center',
+                                    color: 'white'
+                                }}>
+                                    <Camera size={24} />
+                                    <input
+                                        ref={avatarInputRef}
+                                        type="file"
+                                        accept="image/*"
+                                        onChange={(e) => handleUpload(e, 'avatarUrl')}
+                                        style={{ display: 'none' }}
+                                    />
+                                </div>
+                            )}
                         </div>
 
                         <div style={{ paddingTop: '12px', display: 'flex', gap: '8px', alignItems: 'center' }}>
@@ -704,88 +872,7 @@ export default function ProfilePage() {
                                         maxLength={100}
                                     />
                                 </div>
-                                <div>
+                                {/* File inputs removed, now click-to-upload on visual elements */}
-                                    <label style={{ fontSize: '12px', color: 'var(--foreground-tertiary)' }}>Avatar</label>
-                                    <div style={{ display: 'flex', gap: '12px', alignItems: 'center' }}>
-                                        <label className="btn btn-ghost btn-sm" style={{ cursor: 'pointer' }}>
-                                            {isSaving ? 'Uploading...' : 'Choose File'}
-                                            <input
-                                                type="file"
-                                                accept="image/*"
-                                                onChange={async (e) => {
-                                                    const file = e.target.files?.[0];
-                                                    if (!file) return;
-                                                    setIsSaving(true);
-                                                    try {
-                                                        const formData = new FormData();
-                                                        formData.append('file', file);
-                                                        const res = await fetch('/api/uploads', {
-                                                            method: 'POST',
-                                                            body: formData,
-                                                        });
-                                                        const data = await res.json();
-                                                        if (data.url) {
-                                                            setProfileForm(prev => ({ ...prev, avatarUrl: data.url }));
-                                                        }
-                                                    } catch (err) {
-                                                        console.error(err);
-                                                        setSaveError('Upload failed');
-                                                    } finally {
-                                                        setIsSaving(false);
-                                                    }
-                                                }}
-                                                disabled={isSaving}
-                                                style={{ display: 'none' }}
-                                            />
-                                        </label>
-                                        {profileForm.avatarUrl && (
-                                            <div style={{ width: '40px', height: '40px', borderRadius: '50%', overflow: 'hidden', border: '1px solid var(--border)' }}>
-                                                <img src={profileForm.avatarUrl} alt="Preview" style={{ width: '100%', height: '100%', objectFit: 'cover' }} />
-                                            </div>
-                                        )}
-                                    </div>
-                                </div>
-                                <div>
-                                    <label style={{ fontSize: '12px', color: 'var(--foreground-tertiary)' }}>Header</label>
-                                    <div style={{ display: 'flex', gap: '12px', alignItems: 'center' }}>
-                                        <label className="btn btn-ghost btn-sm" style={{ cursor: 'pointer' }}>
-                                            {isSaving ? 'Uploading...' : 'Choose File'}
-                                            <input
-                                                type="file"
-                                                accept="image/*"
-                                                onChange={async (e) => {
-                                                    const file = e.target.files?.[0];
-                                                    if (!file) return;
-                                                    setIsSaving(true);
-                                                    try {
-                                                        const formData = new FormData();
-                                                        formData.append('file', file);
-                                                        const res = await fetch('/api/uploads', {
-                                                            method: 'POST',
-                                                            body: formData,
-                                                        });
-                                                        const data = await res.json();
-                                                        if (data.url) {
-                                                            setProfileForm(prev => ({ ...prev, headerUrl: data.url }));
-                                                        }
-                                                    } catch (err) {
-                                                        console.error(err);
-                                                        setSaveError('Upload failed');
-                                                    } finally {
-                                                        setIsSaving(false);
-                                                    }
-                                                }}
-                                                disabled={isSaving}
-                                                style={{ display: 'none' }}
-                                            />
-                                        </label>
-                                        {profileForm.headerUrl && (
-                                            <div style={{ width: '80px', height: '40px', borderRadius: '4px', overflow: 'hidden', border: '1px solid var(--border)' }}>
-                                                <img src={profileForm.headerUrl} alt="Preview" style={{ width: '100%', height: '100%', objectFit: 'cover' }} />
-                                            </div>
-                                        )}
-                                    </div>
-                                </div>
                                 {saveError && (
                                     <div style={{ color: 'var(--error)', fontSize: '13px' }}>{saveError}</div>
                                 )}

src/components/Compose.tsx

@@ -6,6 +6,7 @@ import { Post, Attachment } from '@/lib/types';
 import { ImageIcon, AlertTriangle, Film } from 'lucide-react';
 import { VideoEmbed } from '@/components/VideoEmbed';
 import { formatFullHandle } from '@/lib/utils/handle';
+import { useAuth } from '@/lib/contexts/AuthContext';
 
 interface MediaAttachment extends Attachment {
     mimeType?: string;
@@ -20,6 +21,7 @@ interface ComposeProps {
 }
 
 export function Compose({ onPost, replyingTo, onCancelReply, placeholder = "What's happening?", isReply }: ComposeProps) {
+    const { isIdentityUnlocked, setShowUnlockPrompt } = useAuth();
     const [content, setContent] = useState('');
     const [isPosting, setIsPosting] = useState(false);
     const [attachments, setAttachments] = useState<MediaAttachment[]>([]);
@@ -43,7 +45,7 @@ export function Compose({ onPost, replyingTo, onCancelReply, placeholder = "What
                     setCanPostNsfw(true);
                 }
             })
-            .catch(() => {});
+            .catch(() => { });
 
         fetch('/api/node')
             .then(res => res.ok ? res.json() : null)
@@ -52,7 +54,7 @@ export function Compose({ onPost, replyingTo, onCancelReply, placeholder = "What
                     setIsNsfwNode(true);
                 }
             })
-            .catch(() => {});
+            .catch(() => { });
     }, []);
 
     // Detect URLs in content
@@ -89,6 +91,12 @@ export function Compose({ onPost, replyingTo, onCancelReply, placeholder = "What
 
     const handleSubmit = async () => {
         if (!content.trim() || isPosting || isUploading) return;
+
+        if (!isIdentityUnlocked) {
+            setShowUnlockPrompt(true, () => handleSubmit());
+            return;
+        }
+
         setIsPosting(true);
         await onPost(content, attachments.map((item) => item.id).filter(Boolean), linkPreview, replyingTo?.id, isNsfw);
         setContent('');
@@ -237,7 +245,16 @@ export function Compose({ onPost, replyingTo, onCancelReply, placeholder = "What
                     )}
                 </div>
                 <div className="compose-actions">
-                    <label className="compose-media-button" title="Add media">
+                    <label
+                        className="compose-media-button"
+                        title="Add media"
+                        onClick={(e) => {
+                            if (!isIdentityUnlocked) {
+                                e.preventDefault();
+                                setShowUnlockPrompt(true);
+                            }
+                        }}
+                    >
                         {isUploading ? '...' : <ImageIcon size={20} />}
                         <input
                             type="file"

src/components/IdentityLockScreen.tsx

@@ -0,0 +1,53 @@
+'use client';
+
+import { Lock, Shield } from 'lucide-react';
+import { useAuth } from '@/lib/contexts/AuthContext';
+
+interface IdentityLockScreenProps {
+    title?: string;
+    description?: string;
+    icon?: React.ReactNode;
+}
+
+export function IdentityLockScreen({
+    title = 'Identity Required',
+    description = 'Accessing settings requires your identity to be unlocked. Your private keys are used to sign changes to prove they came from you.',
+    icon
+}: IdentityLockScreenProps) {
+    const { setShowUnlockPrompt } = useAuth();
+
+    return (
+        <div style={{
+            display: 'flex',
+            flexDirection: 'column',
+            height: '100vh',
+            alignItems: 'center',
+            justifyContent: 'center',
+            gap: '16px',
+            padding: '24px'
+        }}>
+            {icon || <Lock size={48} style={{ color: 'var(--accent)' }} />}
+
+            <h2 style={{ fontSize: '20px', fontWeight: 600 }}>
+                {title}
+            </h2>
+
+            <p style={{
+                color: 'var(--foreground-secondary)',
+                maxWidth: '400px',
+                textAlign: 'center'
+            }}>
+                {description}
+            </p>
+
+            <button
+                onClick={() => setShowUnlockPrompt(true)}
+                className="btn btn-primary"
+                style={{ display: 'flex', alignItems: 'center', gap: '8px' }}
+            >
+                <Shield size={16} />
+                Unlock Identity
+            </button>
+        </div>
+    );
+}

src/components/PostCard.tsx

@@ -44,7 +44,7 @@ interface PostCardProps {
 }
 
 export function PostCard({ post, onLike, onRepost, onComment, onDelete, onHide, isDetail, showThread = true, isThreadParent, parentPostAuthorId }: PostCardProps) {
-    const { user: currentUser, did, handle: currentUserHandle } = useAuth();
+    const { user: currentUser, did, handle: currentUserHandle, isIdentityUnlocked, setShowUnlockPrompt } = useAuth();
     const { showToast } = useToast();
     const router = useRouter();
     const [liked, setLiked] = useState(post.isLiked || false);
@@ -89,6 +89,12 @@ export function PostCard({ post, onLike, onRepost, onComment, onDelete, onHide,
     const handleLike = (e: React.MouseEvent) => {
         e.preventDefault();
         e.stopPropagation();
+
+        if (!isIdentityUnlocked) {
+            setShowUnlockPrompt(true, () => handleLike(e));
+            return;
+        }
+
         const currentLiked = liked;
         setLiked(!currentLiked);
         onLike?.(post.id, currentLiked); // Pass current state before toggle
@@ -97,6 +103,12 @@ export function PostCard({ post, onLike, onRepost, onComment, onDelete, onHide,
     const handleRepost = (e: React.MouseEvent) => {
         e.preventDefault();
         e.stopPropagation();
+
+        if (!isIdentityUnlocked) {
+            setShowUnlockPrompt(true, () => handleRepost(e));
+            return;
+        }
+
         const currentReposted = reposted;
         setReposted(!currentReposted);
         onRepost?.(post.id, currentReposted); // Pass current state before toggle

src/components/Sidebar.tsx

@@ -107,17 +107,15 @@ export function Sidebar() {
                 {user && (
                     <Link href="/notifications" className={`nav-item ${pathname?.startsWith('/notifications') ? 'active' : ''}`} title="Notifications">
                         <BellIcon />
-                        <span style={{ display: 'flex', alignItems: 'center', gap: '4px', position: 'relative' }}>
+                        <span style={{ display: 'flex', alignItems: 'center', gap: '6px' }}>
                             <span className="nav-label">Notifications</span>
                             {unreadCount > 0 && (
                                 <span style={{
-                                    position: 'absolute',
-                                    top: '-4px',
-                                    right: '-4px',
                                     width: '8px',
                                     height: '8px',
                                     background: 'var(--error)',
                                     borderRadius: '50%',
+                                    flexShrink: 0
                                 }} className="notification-dot" />
                             )}
                         </span>
@@ -128,17 +126,15 @@ export function Sidebar() {
                         <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
                             <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path>
                         </svg>
-                        <span style={{ display: 'flex', alignItems: 'center', gap: '4px', position: 'relative' }}>
+                        <span style={{ display: 'flex', alignItems: 'center', gap: '6px' }}>
                             <span className="nav-label">Chat</span>
                             {unreadChatCount > 0 && (
                                 <span style={{
-                                    position: 'absolute',
-                                    top: '-4px',
-                                    right: '-4px',
                                     width: '8px',
                                     height: '8px',
                                     background: 'var(--error)',
                                     borderRadius: '50%',
+                                    flexShrink: 0
                                 }} className="notification-dot" />
                             )}
                         </span>

src/lib/auth/avatar.ts

@@ -0,0 +1,63 @@
+import { S3Client, PutObjectCommand } from '@aws-sdk/client-s3';
+import { v4 as uuidv4 } from 'uuid';
+
+export async function generateAndUploadAvatar(handle: string): Promise<string | null> {
+    try {
+        // 1. Fetch the avatar from DiceBear
+        const dicebearUrl = `https://api.dicebear.com/9.x/bottts-neutral/svg?seed=${handle}`;
+        const response = await fetch(dicebearUrl);
+
+        if (!response.ok) {
+            console.error(`Failed to fetch avatar from DiceBear: ${response.statusText}`);
+            return null;
+        }
+
+        const arrayBuffer = await response.arrayBuffer();
+        const buffer = Buffer.from(arrayBuffer);
+
+        // 2. Upload to S3
+        const s3 = new S3Client({
+            region: process.env.STORAGE_REGION || 'us-east-1',
+            endpoint: process.env.STORAGE_ENDPOINT,
+            credentials: {
+                accessKeyId: process.env.STORAGE_ACCESS_KEY || '',
+                secretAccessKey: process.env.STORAGE_SECRET_KEY || '',
+            },
+            forcePathStyle: true,
+        });
+
+        const bucket = process.env.STORAGE_BUCKET || 'synapsis';
+        // Sanitize handle for filename just in case
+        const safeHandle = handle.replace(/[^a-zA-Z0-9]/g, '');
+        const filename = `${uuidv4()}-${safeHandle}-avatar.svg`;
+
+        await s3.send(new PutObjectCommand({
+            Bucket: bucket,
+            Key: filename,
+            Body: buffer,
+            ContentType: 'image/svg+xml',
+            ACL: 'public-read',
+        }));
+
+        // 3. Construct Public URL
+        let url = '';
+        if (process.env.STORAGE_PUBLIC_BASE_URL) {
+            url = `${process.env.STORAGE_PUBLIC_BASE_URL}/${filename}`;
+        } else if (process.env.STORAGE_ENDPOINT) {
+            // Basic fallback construction if base url is not set but endpoint is
+            // This assumes path style access is okay if no custom domain
+            const endpoint = process.env.STORAGE_ENDPOINT.replace(/\/+$/, '');
+            url = `${endpoint}/${bucket}/${filename}`;
+        } else {
+            console.warn('Storage public URL not configured properly');
+            return null;
+        }
+
+        return url;
+
+    } catch (error) {
+        console.error('Error generating/uploading avatar:', error);
+        return null;
+    }
+}
+

src/lib/auth/index.ts

@@ -10,6 +10,7 @@ import { generateKeyPair } from '@/lib/crypto/keys';
 import { encryptPrivateKey, serializeEncryptedKey } from '@/lib/crypto/private-key';
 import { cookies } from 'next/headers';
 import { upsertHandleEntries } from '@/lib/federation/handles';
+import { generateAndUploadAvatar } from '@/lib/auth/avatar';
 
 const SESSION_COOKIE_NAME = 'synapsis_session';
 const SESSION_EXPIRY_DAYS = 30;
@@ -157,17 +158,23 @@ export async function registerUser(
     const did = generateDID();
     const passwordHash = await hashPassword(password);
 
+    const nodeDomain = process.env.NEXT_PUBLIC_NODE_DOMAIN || 'localhost:3000';
+
+    // Generate avatar using full handle (@user@domain) for global uniqueness
+    const fullHandle = `${handle.toLowerCase()}@${nodeDomain}`;
+    const avatarUrl = await generateAndUploadAvatar(fullHandle);
+
     const [user] = await db.insert(users).values({
         did,
         handle: handle.toLowerCase(),
         email: email.toLowerCase(),
         passwordHash,
         displayName: displayName || handle,
+        avatarUrl,
         publicKey,
         privateKeyEncrypted: serializeEncryptedKey(encryptedPrivateKey),
     }).returning();
 
-    const nodeDomain = process.env.NEXT_PUBLIC_NODE_DOMAIN || 'localhost:3000';
     await upsertHandleEntries([{
         handle: user.handle,
         did: user.did,

src/lib/contexts/AuthContext.tsx

@@ -25,7 +25,8 @@ interface AuthContextType {
     login: (user: User) => void;
     logout: () => Promise<void>;
     showUnlockPrompt: boolean;
-    setShowUnlockPrompt: (show: boolean) => void;
+    setShowUnlockPrompt: (show: boolean, onSuccess?: () => void) => void;
+    signUserAction: (action: string, data: any) => Promise<any>;
 }
 
 const AuthContext = createContext<AuthContextType>({
@@ -41,6 +42,7 @@ const AuthContext = createContext<AuthContextType>({
     logout: async () => { },
     showUnlockPrompt: false,
     setShowUnlockPrompt: () => { },
+    signUserAction: async () => Promise.reject('Not initialized'),
 });
 
 export function AuthProvider({ children }: { children: React.ReactNode }) {
@@ -55,6 +57,7 @@ export function AuthProvider({ children }: { children: React.ReactNode }) {
         initializeIdentity,
         unlockIdentity: unlockIdentityHook,
         clearIdentity,
+        signUserAction,
     } = useUserIdentity();
 
     const checkAdmin = async () => {
@@ -67,7 +70,32 @@ export function AuthProvider({ children }: { children: React.ReactNode }) {
         }
     };
 
-    const [showUnlockPrompt, setShowUnlockPrompt] = useState(false);
+    const [showUnlockPrompt, _setShowUnlockPrompt] = useState(false);
+    const [onUnlockCallback, setOnUnlockCallback] = useState<(() => void) | null>(null);
+
+    const setShowUnlockPrompt = (show: boolean, onSuccess?: () => void) => {
+        _setShowUnlockPrompt(show);
+        if (show && onSuccess) {
+            setOnUnlockCallback(() => onSuccess);
+        } else if (!show) {
+            // If hiding without success (cancel), clear callback ??? 
+            // Actually unlockIdentity handles success case. 
+            // If explicit hide (cancel), we should probably clear it.
+            // But unlockIdentity calls setShowUnlockPrompt(false) on success too.
+            // So we handle callback execution in unlockIdentity, 
+            // and clearing in unlockIdentity OR here if it wasn't executed?
+
+            // Let's rely on unlockIdentity to execute and clear.
+            // If just closing dialog (cancel), we clear it.
+            // But we don't know if this call is from cancel or success?
+            // unlockIdentity calls this.
+        }
+    };
+
+    // Clear callback on close if it wasn't executed? 
+    // It's safer to clear it when closing prompt to avoid stale callbacks.
+    // But unlockIdentity calls setShowUnlockPrompt(false) AFTER executing.
+    // So:
 
     /**
      * Unlock the user's identity with their password
@@ -87,6 +115,15 @@ export function AuthProvider({ children }: { children: React.ReactNode }) {
             targetUser.publicKey
         );
 
+        // Execute queued callback if exists
+        if (onUnlockCallback) {
+            try {
+                onUnlockCallback();
+            } catch (e) {
+                console.error('Error executing unlock callback:', e);
+            }
+            setOnUnlockCallback(null);
+        }
 
         setShowUnlockPrompt(false); // Close prompt on success
     };
@@ -111,6 +148,7 @@ export function AuthProvider({ children }: { children: React.ReactNode }) {
             // Clear the user's identity (private key from localStorage)
             clearIdentity();
             setShowUnlockPrompt(false);
+            setOnUnlockCallback(null);
 
             // Clear the user state
             setUser(null);
@@ -172,6 +210,7 @@ export function AuthProvider({ children }: { children: React.ReactNode }) {
             logout,
             showUnlockPrompt,
             setShowUnlockPrompt,
+            signUserAction,
         }}>
             {children}
         </AuthContext.Provider>

src/lib/swarm/user-cache.ts

@@ -23,21 +23,37 @@ export async function upsertRemoteUser(profile: RemoteProfile) {
 
         if (existing) {
             // Update metadata if changed
+            let avatarUrl = profile.avatarUrl || existing.avatarUrl;
+
+            // If still no avatar, generate one and save it "permanently"
+            if (!avatarUrl) {
+                const { generateAndUploadAvatar } = await import('@/lib/auth/avatar');
+                avatarUrl = await generateAndUploadAvatar(profile.handle);
+            }
+
             await db.update(users)
                 .set({
                     displayName: profile.displayName || existing.displayName,
-                    avatarUrl: profile.avatarUrl || existing.avatarUrl,
+                    avatarUrl: avatarUrl,
                     isBot: profile.isBot ?? existing.isBot,
                     updatedAt: new Date(),
                 })
                 .where(eq(users.id, existing.id));
         } else {
+            let avatarUrl = profile.avatarUrl;
+
+            // If no avatar provided, generate one
+            if (!avatarUrl) {
+                const { generateAndUploadAvatar } = await import('@/lib/auth/avatar');
+                avatarUrl = await generateAndUploadAvatar(profile.handle);
+            }
+
             // Create new placeholder user
             await db.insert(users).values({
                 did: profile.did,
                 handle: profile.handle, // user@domain
                 displayName: profile.displayName || profile.handle,
-                avatarUrl: profile.avatarUrl || null,
+                avatarUrl: avatarUrl,
                 isBot: profile.isBot || false,
                 publicKey: '', // We don't necessarily have their public key yet, but DMs often do
                 // Note: nodeId is null for remote placeholders unless we specifically link it