courrier multi account restore compose

app/courrier/page.tsx

@@ -920,7 +920,7 @@ export default function CourrierPage() {
                             <div className={`w-3 h-3 rounded-full ${account.color?.startsWith('#') ? 'bg-blue-500' : account.color || 'bg-blue-500'} mr-2`}></div>
                             <span className="truncate text-gray-700">{account.name}</span>
                             {account.id !== 'all-accounts' && (
-                              <button 
+                              <div 
                                 className="ml-auto text-gray-400 hover:text-gray-600"
                                 onClick={(e) => {
                                   e.stopPropagation();
@@ -932,7 +932,7 @@ export default function CourrierPage() {
                                 }}
                               >
                                 {expandedAccounts[account.id] ? <ChevronUp className="h-3 w-3" /> : <ChevronDown className="h-3 w-3" />}
-                              </button>
+                              </div>
                             )}
                           </div>
                         </Button>

components/email/ComposeEmail.tsx

@@ -359,6 +359,56 @@ export default function ComposeEmail(props: ComposeEmailAllProps) {
     }
   }, []);
   
+  // Add missing references and handlers
+  const editorRef = useRef<HTMLDivElement>(null);
+  const attachmentInputRef = useRef<HTMLInputElement>(null);
+  
+  // Handle editor input
+  const handleEditorInput = (e: React.FormEvent<HTMLDivElement>) => {
+    setEmailContent(e.currentTarget.innerHTML);
+  };
+  
+  // Handle attachment click
+  const handleAttachmentClick = () => {
+    attachmentInputRef.current?.click();
+  };
+  
+  // Handle file selection
+  const handleFileSelection = (e: React.ChangeEvent<HTMLInputElement>) => {
+    const files = e.target.files;
+    if (!files || files.length === 0) return;
+    
+    // Process selected files
+    for (const file of files) {
+      const reader = new FileReader();
+      
+      reader.onload = (event) => {
+        const content = event.target?.result as string;
+        
+        setAttachments(current => [
+          ...current,
+          {
+            name: file.name,
+            content: content.split(',')[1], // Remove data:mime/type;base64, prefix
+            type: file.type
+          }
+        ]);
+      };
+      
+      reader.readAsDataURL(file);
+    }
+    
+    // Reset file input
+    if (e.target) {
+      e.target.value = '';
+    }
+  };
+  
+  // Remove attachment
+  const removeAttachment = (index: number) => {
+    setAttachments(current => current.filter((_, i) => i !== index));
+  };
+  
   return (
     <div className="w-full h-full flex flex-col overflow-hidden">
       <div className="border-b py-2 px-4">
@@ -466,7 +516,7 @@ export default function ComposeEmail(props: ComposeEmailAllProps) {
           className="flex-1 overflow-auto p-4 focus:outline-none email-content"
           contentEditable={true}
           onInput={handleEditorInput}
-          dangerouslySetInnerHTML={{ __html: body }}
+          dangerouslySetInnerHTML={{ __html: emailContent }}
           style={{ minHeight: '200px' }}
         />