import React from 'react';

export function MailboxList({ mailboxes, selected, onSelect }:{
  mailboxes:any[]; selected?:number; onSelect:(id:number)=>void;
}) {
  return (
    <div>
      {mailboxes.map(m=>(
        <div key={m.id}
          onClick={()=>onSelect(m.id)}
          style={{ padding:'6px 12px', cursor:'pointer', background:m.id===selected?'#e8f0fe':'transparent' }}>
          {m.name} {m.messageCount? <span style={{ float:'right', opacity:0.6 }}>{m.messageCount}</span>:null}
        </div>
      ))}
    </div>
  );
}