feat: add smart gmail thread import and search suggestions

JobTrackerApi/Controllers/GmailController.cs

@@ -24,6 +24,10 @@ public sealed class GmailController : ControllerBase
         _cfg = cfg;
     }
 
+    public sealed record GmailImportResultDto(int Imported, int Skipped, string? ThreadId);
+    public sealed record ImportGmailMessageRequest(int JobApplicationId, string MessageId);
+    public sealed record ImportGmailThreadRequest(int JobApplicationId, string ThreadId, string[] MessageIds);
+
     [HttpGet("status")]
     public async Task<IActionResult> Status(CancellationToken cancellationToken)
     {
@@ -93,8 +97,6 @@ public sealed class GmailController : ControllerBase
         return Ok(items);
     }
 
-    public sealed record ImportGmailMessageRequest(int JobApplicationId, string MessageId);
-
     [HttpPost("import")]
     public async Task<IActionResult> Import([FromBody] ImportGmailMessageRequest request, CancellationToken cancellationToken)
     {
@@ -115,47 +117,9 @@ public sealed class GmailController : ControllerBase
                 return Ok(existing);
             }
 
-            var detail = await _gmail.GetMessageAsync(ownerUserId, request.MessageId, cancellationToken);
+            var created = await ImportSingleMessageAsync(ownerUserId, job, request.MessageId, cancellationToken);
-            var me = await _gmail.GetConnectionAsync(ownerUserId, cancellationToken);
-            var gmailAddress = me?.GmailAddress ?? string.Empty;
-            var isMe = detail.From.Contains(gmailAddress, StringComparison.OrdinalIgnoreCase);
-            var messageDate = detail.Date?.LocalDateTime ?? DateTime.Now;
-
-            var message = new Correspondence
-            {
-                JobApplicationId = request.JobApplicationId,
-                From = isMe ? "Me" : "Company",
-                Subject = string.IsNullOrWhiteSpace(detail.Subject) ? null : detail.Subject.Trim(),
-                Channel = "Email",
-                ExternalMessageId = detail.Id,
-                Content = string.IsNullOrWhiteSpace(detail.BodyText) ? detail.Snippet : detail.BodyText,
-                Date = messageDate,
-            };
-
-            _db.Correspondences.Add(message);
-            if (job.Company is not null)
-            {
-                job.Company.LastContactedAt = messageDate;
-            }
-
-            if (!isMe && (!job.ResponseReceived || job.ResponseDate is null || messageDate < job.ResponseDate.Value))
-            {
-                var oldResponse = $"{job.ResponseReceived}:{job.ResponseDate?.ToString("o")}";
-                job.ResponseReceived = true;
-                job.ResponseDate = messageDate;
-                _db.JobEvents.Add(new JobEvent
-                {
-                    JobApplicationId = job.Id,
-                    Type = "ReplyReceived",
-                    OldValue = oldResponse,
-                    NewValue = $"{job.ResponseReceived}:{job.ResponseDate?.ToString("o")}",
-                    Note = detail.Subject,
-                    At = messageDate
-                });
-            }
-
             await _db.SaveChangesAsync(cancellationToken);
-            return Ok(message);
+            return Ok(created);
         }
         catch (Exception ex)
         {
@@ -163,6 +127,80 @@ public sealed class GmailController : ControllerBase
         }
     }
 
+    [HttpPost("import-thread")]
+    public async Task<ActionResult<GmailImportResultDto>> ImportThread([FromBody] ImportGmailThreadRequest request, CancellationToken cancellationToken)
+    {
+        if (request.JobApplicationId <= 0) return BadRequest("Valid jobApplicationId is required.");
+        if (string.IsNullOrWhiteSpace(request.ThreadId)) return BadRequest("ThreadId is required.");
+        if (request.MessageIds is null || request.MessageIds.Length == 0) return BadRequest("At least one messageId is required.");
+
+        var ownerUserId = GetRequiredOwnerUserId();
+        var job = await _db.JobApplications.Include(x => x.Company).FirstOrDefaultAsync(x => x.Id == request.JobApplicationId, cancellationToken);
+        if (job is null) return NotFound("Job application not found.");
+
+        var distinctIds = request.MessageIds.Where(x => !string.IsNullOrWhiteSpace(x)).Select(x => x.Trim()).Distinct(StringComparer.Ordinal).ToList();
+        var existingIds = await _db.Correspondences
+            .Where(x => x.JobApplicationId == request.JobApplicationId && x.ExternalMessageId != null && distinctIds.Contains(x.ExternalMessageId))
+            .Select(x => x.ExternalMessageId!)
+            .ToListAsync(cancellationToken);
+
+        var skipped = existingIds.Count;
+        var imported = 0;
+        foreach (var messageId in distinctIds)
+        {
+            if (existingIds.Contains(messageId, StringComparer.Ordinal)) continue;
+            await ImportSingleMessageAsync(ownerUserId, job, messageId, cancellationToken);
+            imported++;
+        }
+
+        await _db.SaveChangesAsync(cancellationToken);
+        return Ok(new GmailImportResultDto(imported, skipped, request.ThreadId));
+    }
+
+    private async Task<Correspondence> ImportSingleMessageAsync(string ownerUserId, JobApplication job, string messageId, CancellationToken cancellationToken)
+    {
+        var detail = await _gmail.GetMessageAsync(ownerUserId, messageId, cancellationToken);
+        var me = await _gmail.GetConnectionAsync(ownerUserId, cancellationToken);
+        var gmailAddress = me?.GmailAddress ?? string.Empty;
+        var isMe = detail.From.Contains(gmailAddress, StringComparison.OrdinalIgnoreCase);
+        var messageDate = detail.Date?.LocalDateTime ?? DateTime.Now;
+
+        var message = new Correspondence
+        {
+            JobApplicationId = job.Id,
+            From = isMe ? "Me" : "Company",
+            Subject = string.IsNullOrWhiteSpace(detail.Subject) ? null : detail.Subject.Trim(),
+            Channel = "Email",
+            ExternalMessageId = detail.Id,
+            Content = string.IsNullOrWhiteSpace(detail.BodyText) ? detail.Snippet : detail.BodyText,
+            Date = messageDate,
+        };
+
+        _db.Correspondences.Add(message);
+        if (job.Company is not null)
+        {
+            job.Company.LastContactedAt = messageDate;
+        }
+
+        if (!isMe && (!job.ResponseReceived || job.ResponseDate is null || messageDate < job.ResponseDate.Value))
+        {
+            var oldResponse = $"{job.ResponseReceived}:{job.ResponseDate?.ToString("o")}";
+            job.ResponseReceived = true;
+            job.ResponseDate = messageDate;
+            _db.JobEvents.Add(new JobEvent
+            {
+                JobApplicationId = job.Id,
+                Type = "ReplyReceived",
+                OldValue = oldResponse,
+                NewValue = $"{job.ResponseReceived}:{job.ResponseDate?.ToString("o")}",
+                Note = detail.Subject,
+                At = messageDate
+            });
+        }
+
+        return message;
+    }
+
     private string GetRequiredOwnerUserId()
     {
         return User.FindFirstValue(ClaimTypes.NameIdentifier) ?? User.FindFirstValue("sub")

job-tracker-ui/src/components/Correspondence.tsx

@@ -4,7 +4,6 @@ import {
   Box,
   Button,
   Chip,
-  IconButton,
   CircularProgress,
   Dialog,
   DialogActions,
@@ -24,19 +23,16 @@ import {
 } from "@mui/material";
 import { alpha, useTheme } from "@mui/material/styles";
 import DeleteOutlineIcon from "@mui/icons-material/DeleteOutline";
+import AutoAwesomeIcon from "@mui/icons-material/AutoAwesome";
+import MailOutlineIcon from "@mui/icons-material/MailOutline";
+import { IconButton } from "@mui/material";
 
 import { api } from "../api";
 import { useToast } from "../toast";
 import { CorrespondenceMessage, GmailMessageSummary, GmailStatus } from "../types";
 import { useDialogActions } from "../dialogs";
 
-function parseRawEmail(raw: string): {
+function parseRawEmail(raw: string): { subject?: string; date?: string; from?: string; to?: string; body: string } {
-  subject?: string;
-  date?: string;
-  from?: string;
-  to?: string;
-  body: string;
-} {
   const lines = raw.replace(/\r\n/g, "\n").split("\n");
   const headers: Record<string, string> = {};
   let i = 0;
@@ -50,25 +46,35 @@ function parseRawEmail(raw: string): {
 
     const idx = line.indexOf(":");
     if (idx <= 0) continue;
-
     const k = line.slice(0, idx).trim().toLowerCase();
     const v = line.slice(idx + 1).trim();
     headers[k] = headers[k] ? `${headers[k]} ${v}` : v;
   }
 
   const body = lines.slice(i).join("\n").trim();
-  const subject = headers["subject"];
-  const from = headers["from"];
-  const to = headers["to"];
   const dateRaw = headers["date"];
-
   let iso: string | undefined;
   if (dateRaw) {
     const d = new Date(dateRaw);
     if (!Number.isNaN(+d)) iso = d.toISOString();
   }
 
-  return { subject, from, to, date: iso, body };
+  return { subject: headers["subject"], from: headers["from"], to: headers["to"], date: iso, body };
+}
+
+function scoreMessage(message: GmailMessageSummary, query: string, messages: CorrespondenceMessage[]) {
+  const hay = `${message.subject} ${message.from} ${message.to} ${message.snippet}`.toLowerCase();
+  const q = query.toLowerCase();
+  let score = 0;
+  if (q && hay.includes(q)) score += 8;
+  if (/interview|application|recruit|follow up|follow-up|position|role/.test(hay)) score += 2;
+  if (messages.some((m) => m.subject && message.subject && m.subject.toLowerCase() === message.subject.toLowerCase())) score -= 4;
+  if (message.date) {
+    const ageDays = Math.abs((Date.now() - new Date(message.date).getTime()) / 86400000);
+    if (ageDays <= 30) score += 3;
+    else if (ageDays <= 120) score += 1;
+  }
+  return score;
 }
 
 export default function Correspondence({ jobId }: { jobId: number }) {
@@ -90,6 +96,7 @@ export default function Correspondence({ jobId }: { jobId: number }) {
   const [gmailMessages, setGmailMessages] = useState<GmailMessageSummary[]>([]);
   const [gmailMessagesLoading, setGmailMessagesLoading] = useState(false);
   const [importingMessageId, setImportingMessageId] = useState<string | null>(null);
+  const [importingThreadId, setImportingThreadId] = useState<string | null>(null);
 
   const load = useCallback(async () => {
     const res = await api.get<CorrespondenceMessage[]>(`/correspondence/${jobId}`);
@@ -119,10 +126,7 @@ export default function Correspondence({ jobId }: { jobId: number }) {
       });
       setGmailMessages(res.data);
     } catch (error: any) {
-      const message =
+      const message = error?.response?.data && typeof error.response.data === "string" ? error.response.data : "Failed to load Gmail messages.";
-        error?.response?.data && typeof error.response.data === "string"
-          ? error.response.data
-          : "Failed to load Gmail messages.";
       toast(message, "error");
     } finally {
       setGmailMessagesLoading(false);
@@ -169,16 +173,37 @@ export default function Correspondence({ jobId }: { jobId: number }) {
 
   const canSend = useMemo(() => text.trim().length > 0, [text]);
 
+  const suggestedQueries = useMemo(() => {
+    const subjectTerms = messages.map((m) => m.subject).filter(Boolean) as string[];
+    const uniqueSubjects = Array.from(new Set(subjectTerms)).slice(0, 2);
+    const companyTerms = Array.from(new Set(messages.filter((m) => m.from === "Company").map((m) => m.subject).filter(Boolean) as string[])).slice(0, 2);
+
+    return [
+      { label: "Recent recruiting mail", value: "newer_than:180d (interview OR recruiter OR application OR position)" },
+      { label: "Inbox only", value: "label:inbox newer_than:120d" },
+      { label: "Sent follow-ups", value: "in:sent newer_than:180d follow up" },
+      ...uniqueSubjects.map((s) => ({ label: `Subject: ${s}`, value: `subject:"${s}"` })),
+      ...companyTerms.map((s) => ({ label: `Related topic: ${s}`, value: `"${s}" newer_than:180d` })),
+    ].slice(0, 6);
+  }, [messages]);
+
+  const rankedMessages = useMemo(() => {
+    return [...gmailMessages].sort((a, b) => scoreMessage(b, gmailQuery, messages) - scoreMessage(a, gmailQuery, messages));
+  }, [gmailMessages, gmailQuery, messages]);
+
+  const groupedByThread = useMemo(() => {
+    const map = new Map<string, GmailMessageSummary[]>();
+    for (const message of rankedMessages) {
+      const key = message.threadId || message.id;
+      map.set(key, [...(map.get(key) ?? []), message]);
+    }
+    return Array.from(map.entries()).map(([threadId, items]) => ({ threadId, items }));
+  }, [rankedMessages]);
+
   const send = async () => {
     if (!canSend) return;
-
     try {
-      await api.post("/correspondence", {
+      await api.post("/correspondence", { jobApplicationId: jobId, from, content: text });
-        jobApplicationId: jobId,
-        from,
-        content: text,
-      });
-
       setText("");
       await load();
     } catch {
@@ -202,7 +227,6 @@ export default function Correspondence({ jobId }: { jobId: number }) {
         content: parsed.body || rawEmail,
         date: parsed.date ?? null,
       });
-
       setImportOpen(false);
       setRawEmail("");
       await load();
@@ -216,9 +240,7 @@ export default function Correspondence({ jobId }: { jobId: number }) {
     try {
       const res = await api.get<{ url: string }>("/gmail/connect-url");
       const popup = window.open(res.data.url, "jobtracker-gmail-connect", "width=620,height=760,resizable=yes,scrollbars=yes");
-      if (!popup) {
+      if (!popup) toast("Your browser blocked the Gmail popup.", "error");
-        toast("Your browser blocked the Gmail popup.", "error");
-      }
     } catch {
       toast("Failed to start Gmail connection.", "error");
     }
@@ -249,80 +271,49 @@ export default function Correspondence({ jobId }: { jobId: number }) {
   const importGmailMessage = async (messageId: string) => {
     try {
       setImportingMessageId(messageId);
-      await api.post("/gmail/import", {
+      await api.post("/gmail/import", { jobApplicationId: jobId, messageId });
-        jobApplicationId: jobId,
-        messageId,
-      });
       await load();
       toast("Email imported from Gmail.", "success");
     } catch (error: any) {
-      const message =
+      const message = error?.response?.data && typeof error.response.data === "string" ? error.response.data : "Failed to import Gmail message.";
-        error?.response?.data && typeof error.response.data === "string"
-          ? error.response.data
-          : "Failed to import Gmail message.";
       toast(message, "error");
     } finally {
       setImportingMessageId(null);
     }
   };
 
+  const importGmailThread = async (threadId: string, messageIds: string[]) => {
+    try {
+      setImportingThreadId(threadId);
+      const res = await api.post<{ imported: number; skipped: number; threadId?: string }>("/gmail/import-thread", { jobApplicationId: jobId, threadId, messageIds });
+      await load();
+      toast(`Imported ${res.data.imported} messages${res.data.skipped ? `, skipped ${res.data.skipped} duplicates` : ""}.`, "success");
+    } catch (error: any) {
+      const message = error?.response?.data && typeof error.response.data === "string" ? error.response.data : "Failed to import Gmail thread.";
+      toast(message, "error");
+    } finally {
+      setImportingThreadId(null);
+    }
+  };
+
   return (
     <Box>
-      <Paper
+      <Paper ref={scrollRef} sx={{ p: 1.5, maxHeight: 360, overflowY: "auto", background: theme.palette.mode === "dark" ? "rgba(15,23,42,0.45)" : "rgba(255,255,255,0.75)", backdropFilter: "blur(8px)" }}>
-        ref={scrollRef}
-        sx={{
-          p: 1.5,
-          maxHeight: 360,
-          overflowY: "auto",
-          background:
-            theme.palette.mode === "dark"
-              ? "rgba(15,23,42,0.45)"
-              : "rgba(255,255,255,0.75)",
-          backdropFilter: "blur(8px)",
-        }}
-      >
         {messages.length === 0 ? (
-          <Typography sx={{ color: "text.secondary", py: 2, textAlign: "center" }}>
+          <Typography sx={{ color: "text.secondary", py: 2, textAlign: "center" }}>No messages yet.</Typography>
-            No messages yet.
-          </Typography>
         ) : (
           <Box sx={{ display: "flex", flexDirection: "column", gap: 1 }}>
             {messages.map((m) => {
               const isMe = (m.from || "").toLowerCase() === "me";
               const accent = isMe ? theme.palette.primary.main : theme.palette.warning.main;
               return (
-                <Box
+                <Box key={m.id} sx={{ display: "flex", justifyContent: isMe ? "flex-end" : "flex-start" }}>
-                  key={m.id}
+                  <Box sx={{ maxWidth: "80%", borderRadius: 3, p: 1.25, border: `1px solid ${alpha(accent, theme.palette.mode === "dark" ? 0.32 : 0.22)}`, background: alpha(accent, theme.palette.mode === "dark" ? 0.14 : 0.1), color: "text.primary" }}>
-                  sx={{
+                    {m.subject ? <Typography sx={{ fontWeight: 800, mb: 0.5 }}>{m.subject}</Typography> : null}
-                    display: "flex",
+                    <Typography sx={{ whiteSpace: "pre-wrap", lineHeight: 1.35 }}>{m.content}</Typography>
-                    justifyContent: isMe ? "flex-end" : "flex-start",
-                  }}
-                >
-                  <Box
-                    sx={{
-                      maxWidth: "80%",
-                      borderRadius: 3,
-                      p: 1.25,
-                      border: `1px solid ${alpha(accent, theme.palette.mode === "dark" ? 0.32 : 0.22)}`,
-                      background: alpha(accent, theme.palette.mode === "dark" ? 0.14 : 0.1),
-                      color: "text.primary",
-                    }}
-                  >
-                    {m.subject ? (
-                      <Typography sx={{ fontWeight: 800, mb: 0.5 }}>
-                        {m.subject}
-                      </Typography>
-                    ) : null}
-
-                    <Typography sx={{ whiteSpace: "pre-wrap", lineHeight: 1.35 }}>
-                      {m.content}
-                    </Typography>
-
                     <Box sx={{ display: "flex", justifyContent: "space-between", gap: 1, alignItems: "flex-end", mt: 0.75 }}>
                       <Typography variant="caption" sx={{ color: "text.secondary" }}>
-                        {isMe ? "Me" : "Company"}
+                        {isMe ? "Me" : "Company"}{m.channel ? ` - ${m.channel}` : ""}{m.date ? ` - ${new Date(m.date).toLocaleString()}` : ""}
-                        {m.channel ? ` - ${m.channel}` : ""}
-                        {m.date ? ` - ${new Date(m.date).toLocaleString()}` : ""}
                       </Typography>
                       <IconButton size="small" onClick={() => void deleteMessage(m.id)} sx={{ color: "text.secondary" }}>
                         <DeleteOutlineIcon fontSize="small" />
@@ -336,49 +327,17 @@ export default function Correspondence({ jobId }: { jobId: number }) {
         )}
       </Paper>
 
-      <Box sx={{ display: "flex", gap: 1, alignItems: "center", mt: 1.5, flexWrap: "wrap" }}>
+      <Box sx={{ display: "flex", gap: 1, alignItems: "flex-start", mt: 1.5, flexWrap: "wrap" }}>
-        <ToggleButtonGroup
+        <ToggleButtonGroup exclusive value={from} onChange={(_, v) => v && setFrom(v)} size="small">
-          exclusive
-          value={from}
-          onChange={(_, v) => {
-            if (v) setFrom(v);
-          }}
-          size="small"
-        >
           <ToggleButton value="Me">Me</ToggleButton>
           <ToggleButton value="Company">Company</ToggleButton>
         </ToggleButtonGroup>
 
-        <Button variant="outlined" size="small" onClick={() => setImportOpen(true)}>
+        <Button variant="outlined" size="small" onClick={() => setImportOpen(true)}>Import Email</Button>
-          Import Email
-        </Button>
 
-        <Box sx={{ flex: "1 1 280px" }}>
+        <TextField label="Log note or message" value={text} onChange={(e) => setText(e.target.value)} multiline minRows={3} sx={{ flex: "1 1 320px" }} helperText={`${text.length} characters`} />
-          <textarea
-            value={text}
-            onChange={(e) => setText(e.target.value)}
-            placeholder="Log an email/call note..."
-            style={{
-              width: "100%",
-              minHeight: 70,
-              resize: "vertical",
-              padding: 10,
-              borderRadius: 12,
-              border:
-                theme.palette.mode === "dark"
-                  ? "1px solid rgba(148,163,184,0.25)"
-                  : "1px solid rgba(15,23,42,0.12)",
-              background: theme.palette.mode === "dark" ? "rgba(2,6,23,0.25)" : "white",
-              color: theme.palette.text.primary,
-              fontFamily: "inherit",
-              fontSize: 14,
-            }}
-          />
-        </Box>
 
-        <Button variant="contained" onClick={send} disabled={!canSend}>
+        <Button variant="contained" onClick={send} disabled={!canSend}>Add</Button>
-          Add
-        </Button>
       </Box>
 
       <Dialog open={importOpen} onClose={() => setImportOpen(false)} fullWidth maxWidth="md">
@@ -391,17 +350,8 @@ export default function Correspondence({ jobId }: { jobId: number }) {
 
           {importTab === 0 ? (
             <>
-              <Typography sx={{ color: "text.secondary", mb: 1 }}>
+              <Typography sx={{ color: "text.secondary", mb: 1 }}>Paste raw email text (headers optional). We parse Subject and Date when present.</Typography>
-                Paste raw email text (headers optional). We parse Subject and Date when present.
+              <TextField multiline minRows={10} fullWidth value={rawEmail} onChange={(e) => setRawEmail(e.target.value)} placeholder={"Subject: ...\nDate: ...\nFrom: ...\nTo: ...\n\nBody..."} />
-              </Typography>
-              <TextField
-                multiline
-                minRows={10}
-                fullWidth
-                value={rawEmail}
-                onChange={(e) => setRawEmail(e.target.value)}
-                placeholder={"Subject: ...\nDate: ...\nFrom: ...\nTo: ...\n\nBody..."}
-              />
             </>
           ) : (
             <Box sx={{ display: "flex", flexDirection: "column", gap: 2 }}>
@@ -409,91 +359,68 @@ export default function Correspondence({ jobId }: { jobId: number }) {
                 <Box>
                   <Typography sx={{ fontWeight: 800 }}>Google Gmail</Typography>
                   <Typography variant="body2" sx={{ color: "text.secondary" }}>
-                    {gmailLoading
+                    {gmailLoading ? "Checking connection..." : gmailStatus?.connected ? `Connected as ${gmailStatus.gmailAddress}` : "Connect your Gmail account to browse recent emails."}
-                      ? "Checking connection..."
-                      : gmailStatus?.connected
-                        ? `Connected as ${gmailStatus.gmailAddress}`
-                        : "Connect your Gmail account to browse recent emails."}
                   </Typography>
                 </Box>
                 <Box sx={{ display: "flex", gap: 1, flexWrap: "wrap" }}>
                   {gmailStatus?.connected ? (
                     <>
-                      <Button variant="outlined" onClick={() => void loadGmailMessages()} disabled={gmailMessagesLoading}>
+                      <Button variant="outlined" onClick={() => void loadGmailMessages()} disabled={gmailMessagesLoading}>Refresh</Button>
-                        Refresh
+                      <Button variant="outlined" color="error" onClick={() => void disconnectGmail()}>Disconnect</Button>
-                      </Button>
-                      <Button variant="outlined" color="error" onClick={() => void disconnectGmail()}>
-                        Disconnect
-                      </Button>
                     </>
                   ) : (
-                    <Button variant="contained" onClick={() => void connectGmail()}>
+                    <Button variant="contained" onClick={() => void connectGmail()}>Connect Gmail</Button>
-                      Connect Gmail
-                    </Button>
                   )}
                 </Box>
               </Box>
 
               {gmailStatus?.connected ? (
                 <>
-                  <Box sx={{ display: "flex", gap: 1, flexWrap: "wrap", alignItems: "center" }}>
+                  <Box sx={{ display: "flex", gap: 1, flexWrap: "wrap" }}>
-                    <TextField
+                    {suggestedQueries.map((item) => (
-                      label="Search Gmail"
+                      <Chip key={item.label} icon={<AutoAwesomeIcon />} label={item.label} clickable variant="outlined" onClick={() => setGmailQuery(item.value)} />
-                      value={gmailQuery}
+                    ))}
-                      onChange={(e) => setGmailQuery(e.target.value)}
-                      placeholder="from:company@example.com OR interview"
-                      size="small"
-                      fullWidth
-                    />
-                    <Button variant="outlined" onClick={() => void loadGmailMessages()} disabled={gmailMessagesLoading}>
-                      Search
-                    </Button>
                   </Box>
-                  {gmailStatus.lastSyncedAt ? (
+                  <Box sx={{ display: "flex", gap: 1, flexWrap: "wrap", alignItems: "center" }}>
-                    <Chip label={`Last synced ${new Date(gmailStatus.lastSyncedAt).toLocaleString()}`} size="small" />
+                    <TextField label="Search Gmail" value={gmailQuery} onChange={(e) => setGmailQuery(e.target.value)} placeholder="from:company@example.com OR interview" size="small" fullWidth />
-                  ) : null}
+                    <Button variant="outlined" onClick={() => void loadGmailMessages()} disabled={gmailMessagesLoading}>Search</Button>
-                  <Paper variant="outlined" sx={{ maxHeight: 360, overflowY: "auto" }}>
+                  </Box>
+                  {gmailStatus.lastSyncedAt ? <Chip label={`Last synced ${new Date(gmailStatus.lastSyncedAt).toLocaleString()}`} size="small" /> : null}
+                  <Paper variant="outlined" sx={{ maxHeight: 420, overflowY: "auto" }}>
                     {gmailMessagesLoading ? (
-                      <Box sx={{ py: 5, display: "flex", justifyContent: "center" }}>
+                      <Box sx={{ py: 5, display: "flex", justifyContent: "center" }}><CircularProgress size={28} /></Box>
-                        <CircularProgress size={28} />
+                    ) : groupedByThread.length === 0 ? (
-                      </Box>
-                    ) : gmailMessages.length === 0 ? (
                       <Typography sx={{ color: "text.secondary", p: 2 }}>No Gmail messages found.</Typography>
                     ) : (
                       <List disablePadding>
-                        {gmailMessages.map((message, index) => (
+                        {groupedByThread.map(({ threadId, items }, threadIndex) => (
-                          <React.Fragment key={message.id}>
+                          <React.Fragment key={threadId}>
-                            {index > 0 ? <Divider /> : null}
+                            {threadIndex > 0 ? <Divider /> : null}
-                            <ListItemButton sx={{ alignItems: "flex-start", py: 1.5 }}>
+                            <Box sx={{ p: 1.5, backgroundColor: alpha(theme.palette.primary.main, 0.04) }}>
-                              <ListItemText
+                              <Box sx={{ display: "flex", justifyContent: "space-between", gap: 2, flexWrap: "wrap", alignItems: "center", mb: 1 }}>
-                                primary={
+                                <Box>
-                                  <Box sx={{ display: "flex", justifyContent: "space-between", gap: 2, alignItems: "center", flexWrap: "wrap" }}>
+                                  <Typography sx={{ fontWeight: 800 }}>{items[0]?.subject || "(No subject)"}</Typography>
-                                    <Typography sx={{ fontWeight: 800 }}>{message.subject || "(No subject)"}</Typography>
+                                  <Typography variant="body2" sx={{ color: "text.secondary" }}>{items.length} message{items.length === 1 ? "" : "s"} in thread</Typography>
-                                    <Typography variant="caption" sx={{ color: "text.secondary" }}>
+                                </Box>
-                                      {message.date ? new Date(message.date).toLocaleString() : ""}
+                                <Button startIcon={<MailOutlineIcon />} variant="outlined" size="small" disabled={importingThreadId === threadId} onClick={() => void importGmailThread(threadId, items.map((x) => x.id))}>
-                                    </Typography>
+                                  {importingThreadId === threadId ? "Importing..." : "Import thread"}
-                                  </Box>
+                                </Button>
-                                }
+                              </Box>
-                                secondary={
+                              {items.map((message, index) => (
-                                  <Box sx={{ mt: 0.5 }}>
+                                <React.Fragment key={message.id}>
-                                    <Typography variant="body2" sx={{ color: "text.primary" }}>
+                                  {index > 0 ? <Divider sx={{ my: 1 }} /> : null}
-                                      From: {message.from || "Unknown"}
+                                  <ListItemButton sx={{ alignItems: "flex-start", px: 0, py: 1 }}>
-                                    </Typography>
+                                    <ListItemText
-                                    <Typography variant="body2" sx={{ color: "text.secondary", mt: 0.25 }}>
+                                      primary={<Box sx={{ display: "flex", justifyContent: "space-between", gap: 2, alignItems: "center", flexWrap: "wrap" }}><Typography sx={{ fontWeight: 700 }}>{message.subject || "(No subject)"}</Typography><Typography variant="caption" sx={{ color: "text.secondary" }}>{message.date ? new Date(message.date).toLocaleString() : ""}</Typography></Box>}
-                                      {message.snippet}
+                                      secondary={<Box sx={{ mt: 0.5 }}><Typography variant="body2" sx={{ color: "text.primary" }}>From: {message.from || "Unknown"}</Typography><Typography variant="body2" sx={{ color: "text.secondary", mt: 0.25 }}>{message.snippet}</Typography></Box>}
-                                    </Typography>
+                                    />
-                                  </Box>
+                                    <Button variant="contained" size="small" disabled={importingMessageId === message.id} onClick={() => void importGmailMessage(message.id)}>
-                                }
+                                      {importingMessageId === message.id ? "Importing..." : "Import"}
-                              />
+                                    </Button>
-                              <Button
+                                  </ListItemButton>
-                                variant="contained"
+                                </React.Fragment>
-                                size="small"
+                              ))}
-                                disabled={importingMessageId === message.id}
+                            </Box>
-                                onClick={() => void importGmailMessage(message.id)}
-                              >
-                                {importingMessageId === message.id ? "Importing..." : "Import"}
-                              </Button>
-                            </ListItemButton>
                           </React.Fragment>
                         ))}
                       </List>
@@ -506,11 +433,7 @@ export default function Correspondence({ jobId }: { jobId: number }) {
         </DialogContent>
         <DialogActions>
           <Button onClick={() => setImportOpen(false)}>Close</Button>
-          {importTab === 0 ? (
+          {importTab === 0 ? <Button variant="contained" onClick={importEmail}>Log Email</Button> : null}
-            <Button variant="contained" onClick={importEmail}>
-              Log Email
-            </Button>
-          ) : null}
         </DialogActions>
       </Dialog>
     </Box>