test/optimizer

.gitignore

@@ -24,3 +24,5 @@ skills-lock.json
 
 .docs
 .scripts
+
+.logs

next.config.js

@@ -3,6 +3,11 @@ import "./src/env.js";
 /** @type {import("next").NextConfig} */
 const config = {
   output: "standalone",
+  experimental: {
+    serverActions: {
+      bodySizeLimit: "25mb",
+    },
+  },
   images: {
     remotePatterns: [
       {

src/app/dashboard/resumes/[resumeId]/_components/EditorSidebar.tsx

@@ -20,6 +20,8 @@ interface EditorSidebarProps {
   content: ResumeContent;
   onSave: (patch: Partial<ResumeContent>) => void;
   isSaving: boolean;
+  onTabChange?: (tabId: EditorTabId) => void;
+  onTemplatesOpenChange?: (open: boolean) => void;
 }
 
 export function EditorSidebar({
@@ -28,6 +30,8 @@ export function EditorSidebar({
   content,
   onSave,
   isSaving,
+  onTabChange,
+  onTemplatesOpenChange,
 }: EditorSidebarProps) {
   const meta = EDITOR_TAB_META[activeTab];
 
@@ -52,7 +56,9 @@ export function EditorSidebar({
       </header>
 
       <div className="min-h-0 flex-1 overflow-y-auto px-5 py-4">
-        {activeTab === "job-tailoring" && <JobTailoringTab />}
+        {activeTab === "job-tailoring" && (
+          <JobTailoringTab resumeId={resumeId} />
+        )}
         {activeTab === "sections" && (
           <SectionsTab content={content} onSave={onSave} />
         )}
@@ -81,7 +87,12 @@ export function EditorSidebar({
           <ProjectsTab content={content} onSave={onSave} />
         )}
         {activeTab === "finish" && (
-          <FinishTab content={content} resumeId={resumeId} />
+          <FinishTab
+            content={content}
+            resumeId={resumeId}
+            onTabChange={onTabChange}
+            onBrowseTemplates={() => onTemplatesOpenChange?.(true)}
+          />
         )}
       </div>
     </div>

src/app/dashboard/resumes/[resumeId]/_components/PdfPreview.tsx

@@ -10,9 +10,16 @@ import { TemplatesPopover } from "./TemplatesPopover";
 interface PdfPreviewProps {
   content: ResumeContent;
   onStyleChange: (style: "professional" | "technical" | "minimal") => void;
+  isTemplatesOpen?: boolean;
+  onTemplatesOpenChange?: (open: boolean) => void;
 }
 
-export function PdfPreview({ content, onStyleChange }: PdfPreviewProps) {
+export function PdfPreview({
+  content,
+  onStyleChange,
+  isTemplatesOpen,
+  onTemplatesOpenChange,
+}: PdfPreviewProps) {
   const [blobUrl, setBlobUrl] = useState<string | null>(null);
   const [isCompiling, setIsCompiling] = useState(false);
   const [error, setError] = useState<string | null>(null);
@@ -110,7 +117,12 @@ export function PdfPreview({ content, onStyleChange }: PdfPreviewProps) {
     <div className="flex min-h-0 flex-1 flex-col overflow-hidden">
       <div className="flex shrink-0 items-center justify-between gap-2 border-b border-white/8 px-3 py-2">
         <div className="flex items-center gap-2">
-          <TemplatesPopover content={content} onStyleChange={onStyleChange} />
+          <TemplatesPopover
+            content={content}
+            onStyleChange={onStyleChange}
+            open={isTemplatesOpen}
+            onOpenChange={onTemplatesOpenChange}
+          />
           <button
             type="button"
             onClick={() => void handleDownload()}

src/app/dashboard/resumes/[resumeId]/_components/ResumeEditorClient.tsx

@@ -23,6 +23,7 @@ export function ResumeEditorClient({
   const [activeTab, setActiveTab] = useState<EditorTabId>(
     initialTab ?? "job-tailoring",
   );
+  const [isTemplatesOpen, setIsTemplatesOpen] = useState(false);
   const [isSaving, startSave] = useTransition();
   const saveDebounceRef = useRef<ReturnType<typeof setTimeout> | null>(null);
   const latestContentRef = useRef<ResumeContent>(initialContent);
@@ -81,11 +82,18 @@ export function ResumeEditorClient({
             content={content}
             onSave={handleSave}
             isSaving={isSaving}
+            onTabChange={setActiveTab}
+            onTemplatesOpenChange={setIsTemplatesOpen}
           />
         </div>
 
         <div className="card-surface flex min-h-[min(55vh,32rem)] shrink-0 flex-col overflow-hidden md:min-h-0">
-          <PdfPreview content={content} onStyleChange={handleStyleChange} />
+          <PdfPreview
+            content={content}
+            onStyleChange={handleStyleChange}
+            isTemplatesOpen={isTemplatesOpen}
+            onTemplatesOpenChange={setIsTemplatesOpen}
+          />
         </div>
       </div>
     </div>

src/app/dashboard/resumes/[resumeId]/_components/TemplatesPopover.tsx

@@ -20,13 +20,19 @@ const TEMPLATES: Array<{ value: StyleValue; label: string }> = [
 interface TemplatesPopoverProps {
   content: ResumeContent;
   onStyleChange: (style: StyleValue) => void;
+  open?: boolean;
+  onOpenChange?: (open: boolean) => void;
 }
 
 export function TemplatesPopover({
   content,
   onStyleChange,
+  open: controlledOpen,
+  onOpenChange: controlledOnOpenChange,
 }: TemplatesPopoverProps) {
-  const [open, setOpen] = useState(false);
+  const [localOpen, setLocalOpen] = useState(false);
+  const open = controlledOpen ?? localOpen;
+  const setOpen = controlledOnOpenChange ?? setLocalOpen;
   const current = content.style ?? "professional";
 
   return (

src/app/dashboard/resumes/[resumeId]/_components/tabs/FinishTab.tsx

@@ -1,18 +1,60 @@
 "use client";
 
-import { Download, Sparkles, FileText, Target, ArrowRight } from "lucide-react";
+import { useState, useTransition } from "react";
+import { Download, FileText, Target, ArrowRight, Layers, Sliders } from "lucide-react";
+
+import {
+  testCoverLetterAction,
+  type TestCoverLetterResult,
+} from "~/server/actions/optimizer/test/cover-letter";
 import type { ResumeContent } from "../resume-content-types";
 import { buildPdfPayload } from "../resume-content-types";
-import { useState } from "react";
+import type { EditorTabId } from "../editor-tabs";
+import { cn } from "~/lib/utils";
 
 interface FinishTabProps {
   content: ResumeContent;
   resumeId: string;
+  onTabChange?: (tab: EditorTabId) => void;
+  onBrowseTemplates?: () => void;
+}
+
+function appendLogPath(parts: string[], logPath?: string | null): string {
+  if (logPath) {
+    parts.push(`Log: ${logPath}`);
+  }
+  return parts.join("\n\n");
+}
+
+function formatCoverLetterResult(result: TestCoverLetterResult): string {
+  if (result.ok && result.outcome === "no_optimisation_in_db") {
+    return appendLogPath(
+      [`OK (expected): ${result.message}`],
+      result.logPath,
+    );
+  }
+  if (result.ok) {
+    return appendLogPath(
+      [
+        `OK: cover letter for optimisation ${result.optimisationId}`,
+        result.coverLetterPreview,
+      ],
+      result.logPath,
+    );
+  }
+  return appendLogPath([`[${result.kind}] ${result.error}`], result.logPath);
 }
 
-export function FinishTab({ content, resumeId: _resumeId }: FinishTabProps) {
+export function FinishTab({
+  content,
+  resumeId,
+  onTabChange,
+  onBrowseTemplates,
+}: FinishTabProps) {
   const [isDownloading, setIsDownloading] = useState(false);
   const [downloadError, setDownloadError] = useState<string | null>(null);
+  const [testStatus, setTestStatus] = useState<string | null>(null);
+  const [isCoverLetterPending, startCoverLetter] = useTransition();
 
   const handleDownload = async () => {
     setIsDownloading(true);
@@ -42,23 +84,67 @@ export function FinishTab({ content, resumeId: _resumeId }: FinishTabProps) {
     }
   };
 
-  const comingSoon = [
+  // Dedicated cover letter generation and download (kept intact in code, but button is disabled in UI)
+  const handleCoverLetterTest = () => {
+    setTestStatus(null);
+    startCoverLetter(async () => {
+      const result = await testCoverLetterAction(resumeId);
+      setTestStatus(formatCoverLetterResult(result));
+
+      if (result.ok && result.outcome === "cover_letter_generated" && result.coverLetterText) {
+        try {
+          const blob = new Blob([result.coverLetterText], { type: "text/plain;charset=utf-8" });
+          const url = URL.createObjectURL(blob);
+          const a = document.createElement("a");
+          a.href = url;
+          a.download = "cover-letter.txt";
+          a.click();
+          URL.revokeObjectURL(url);
+        } catch (e) {
+          console.error("Failed to download cover letter:", e);
+        }
+      }
+    });
+  };
+
+  const actions = [
     {
       icon: <Target className="size-4" />,
       label: "Tailor to a specific role",
       description: "Optimise your resume for a target job",
+      onClick: () => onTabChange?.("job-tailoring"),
+      disabled: false,
     },
     {
       icon: <FileText className="size-4" />,
-      label: "Write cover letter",
+      label: (
+        <span className="flex items-center gap-1.5 font-medium text-neutral-200">
+          Write cover letter
+          <span className="rounded-full border border-neutral-700 bg-neutral-800/50 px-1.5 py-0.5 text-[9px] font-semibold text-neutral-400">
+            soon
+          </span>
+        </span>
+      ),
       description: "Generate a cover letter with this resume linked",
+      onClick: handleCoverLetterTest,
+      disabled: true,
+      pending: isCoverLetterPending,
+    },
+    {
+      icon: <Layers className="size-4" />,
+      label: "Browse our templates",
+      description: "Choose a different design or layout template",
+      onClick: onBrowseTemplates,
+      disabled: false,
     },
     {
-      icon: <Sparkles className="size-4" />,
-      label: "Refine with AI",
-      description: "Chat with an AI assistant to improve your resume",
+      icon: <Sliders className="size-4" />,
+      label: "Adjust sections",
+      description: "Show or hide sections and customize PDF section headings",
+      onClick: () => onTabChange?.("sections"),
+      disabled: false,
     },
-  ];
+  ] as const;
 
   return (
     <div className="flex flex-col gap-4">
@@ -90,30 +176,43 @@ export function FinishTab({ content, resumeId: _resumeId }: FinishTabProps) {
         Continue editing
       </p>
 
-      {comingSoon.map((item) => (
+      {actions.map((item, idx) => (
         <button
-          key={item.label}
+          key={idx}
           type="button"
-          disabled
-          className="flex w-full items-center justify-between rounded-xl border border-white/6 bg-white/2 px-4 py-3.5 text-left opacity-50"
-          title="Coming soon"
+          disabled={item.disabled}
+          onClick={"onClick" in item ? item.onClick : undefined}
+          className={cn(
+            "flex w-full items-center justify-between rounded-xl border px-4 py-3.5 text-left transition-all",
+            item.disabled
+              ? "cursor-default border-white/6 bg-white/2 opacity-50 pointer-events-none"
+              : "cursor-pointer border-white/6 bg-white/2 hover:border-white/12 hover:bg-white/4"
+          )}
         >
           <div className="flex items-center gap-3">
-            <span className="flex size-8 items-center justify-center rounded-lg bg-white/5 text-neutral-500">
+            <span className="flex size-8 items-center justify-center rounded-lg bg-white/5 text-neutral-400">
               {item.icon}
             </span>
             <div>
-              <p className="text-sm font-medium text-neutral-300">
+              <div className="text-sm font-medium text-neutral-200">
                 {item.label}
+              </div>
+              <p className="text-xs text-neutral-500">
+                {"pending" in item && item.pending
+                  ? "Running test…"
+                  : item.description}
               </p>
-              <p className="text-xs text-neutral-600">{item.description}</p>
             </div>
           </div>
-          <span className="rounded-full border border-neutral-700 px-1.5 py-0.5 text-[10px] text-neutral-600">
-            soon
-          </span>
+          <ArrowRight className="size-4 text-neutral-500" />
         </button>
       ))}
+
+      {testStatus ? (
+        <pre className="whitespace-pre-wrap rounded-lg border border-white/8 bg-black/30 p-3 text-xs text-neutral-300">
+          {testStatus}
+        </pre>
+      ) : null}
     </div>
   );
 }