feat: add scratchpad chat model controls

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

src/main/KopayaAppService.ts

@@ -4,10 +4,22 @@ import { basename } from 'node:path';
 import { dialog } from 'electron';
 
 import type { AgentActivityEvent, TurnDeltaEvent } from '@shared/contracts/sidecar';
-import { buildSessionTitle, validatePatternDefinition, type PatternDefinition } from '@shared/domain/pattern';
+import { findModel } from '@shared/domain/models';
+import {
+  buildSessionTitle,
+  isReasoningEffort,
+  type PatternDefinition,
+  type ReasoningEffort,
+  validatePatternDefinition,
+} from '@shared/domain/pattern';
 import { isScratchpadProject, type ProjectRecord } from '@shared/domain/project';
 import type { SessionEventRecord } from '@shared/domain/event';
-import type { ChatMessageRecord, SessionRecord } from '@shared/domain/session';
+import {
+  applyScratchpadSessionConfig,
+  createScratchpadSessionConfig,
+  type ChatMessageRecord,
+  type SessionRecord,
+} from '@shared/domain/session';
 import type { WorkspaceState } from '@shared/domain/workspace';
 import { createId, nowIso } from '@shared/utils/ids';
 import { mergeStreamingText } from '@shared/utils/streamingText';
@@ -150,6 +162,7 @@ export class KopayaAppService extends EventEmitter<AppServiceEvents> {
       updatedAt: nowIso(),
       status: 'idle',
       messages: [],
+      scratchpadConfig: isScratchpadProject(project) ? createScratchpadSessionConfig(pattern) : undefined,
     };
 
     workspace.sessions.unshift(session);
@@ -164,6 +177,9 @@ export class KopayaAppService extends EventEmitter<AppServiceEvents> {
     const session = this.requireSession(workspace, sessionId);
     const project = this.requireProject(workspace, session.projectId);
     const pattern = this.requirePattern(workspace, session.patternId);
+    const effectivePattern = isScratchpadProject(project)
+      ? applyScratchpadSessionConfig(pattern, session)
+      : pattern;
 
     const trimmed = content.trim();
     if (!trimmed) {
@@ -177,7 +193,7 @@ export class KopayaAppService extends EventEmitter<AppServiceEvents> {
       content: trimmed,
       createdAt: nowIso(),
     });
-    session.title = buildSessionTitle(pattern, session.messages);
+    session.title = buildSessionTitle(effectivePattern, session.messages);
     session.status = 'running';
     session.lastError = undefined;
     session.updatedAt = nowIso();
@@ -200,7 +216,7 @@ export class KopayaAppService extends EventEmitter<AppServiceEvents> {
           sessionId: session.id,
           projectPath: project.path,
           workspaceKind,
-          pattern,
+          pattern: effectivePattern,
           messages: session.messages,
         },
         async (event) => {
@@ -229,6 +245,42 @@ export class KopayaAppService extends EventEmitter<AppServiceEvents> {
     }
   }
 
+  async updateScratchpadSessionConfig(
+    sessionId: string,
+    model: string,
+    reasoningEffort: ReasoningEffort,
+  ): Promise<WorkspaceState> {
+    const workspace = await this.loadWorkspace();
+    const session = this.requireSession(workspace, sessionId);
+    const project = this.requireProject(workspace, session.projectId);
+    const pattern = this.requirePattern(workspace, session.patternId);
+
+    if (!isScratchpadProject(project)) {
+      throw new Error('Only scratchpad sessions can change model settings in chat.');
+    }
+
+    if (session.status === 'running') {
+      throw new Error('Wait for the current scratchpad response to finish before changing model settings.');
+    }
+
+    const normalizedModel = model.trim();
+    if (!normalizedModel || !findModel(normalizedModel)) {
+      throw new Error(`Model "${model}" is not available.`);
+    }
+    if (!isReasoningEffort(reasoningEffort)) {
+      throw new Error(`Reasoning effort "${reasoningEffort}" is not supported.`);
+    }
+
+    session.scratchpadConfig = {
+      ...(createScratchpadSessionConfig(pattern) ?? {}),
+      model: normalizedModel,
+      reasoningEffort,
+    };
+    session.updatedAt = nowIso();
+
+    return this.persistAndBroadcast(workspace);
+  }
+
   async selectProject(projectId?: string): Promise<WorkspaceState> {
     const workspace = await this.loadWorkspace();
     workspace.selectedProjectId = projectId;

src/main/ipc/registerIpcHandlers.ts

@@ -1,7 +1,12 @@
 import { BrowserWindow, ipcMain } from 'electron';
 
 import { ipcChannels } from '@shared/contracts/channels';
-import type { CreateSessionInput, SavePatternInput, SendSessionMessageInput } from '@shared/contracts/ipc';
+import type {
+  CreateSessionInput,
+  SavePatternInput,
+  SendSessionMessageInput,
+  UpdateScratchpadSessionConfigInput,
+} from '@shared/contracts/ipc';
 
 import { KopayaAppService } from '@main/KopayaAppService';
 
@@ -17,6 +22,11 @@ export function registerIpcHandlers(window: BrowserWindow, service: KopayaAppSer
   ipcMain.handle(ipcChannels.sendSessionMessage, (_event, input: SendSessionMessageInput) =>
     service.sendSessionMessage(input.sessionId, input.content),
   );
+  ipcMain.handle(
+    ipcChannels.updateScratchpadSessionConfig,
+    (_event, input: UpdateScratchpadSessionConfigInput) =>
+      service.updateScratchpadSessionConfig(input.sessionId, input.model, input.reasoningEffort),
+  );
   ipcMain.handle(ipcChannels.selectProject, (_event, projectId?: string) => service.selectProject(projectId));
   ipcMain.handle(ipcChannels.selectPattern, (_event, patternId?: string) => service.selectPattern(patternId));
   ipcMain.handle(ipcChannels.selectSession, (_event, sessionId?: string) => service.selectSession(sessionId));

src/preload/index.ts

@@ -11,6 +11,8 @@ const api: ElectronApi = {
   deletePattern: (patternId) => ipcRenderer.invoke(ipcChannels.deletePattern, patternId),
   createSession: (input) => ipcRenderer.invoke(ipcChannels.createSession, input),
   sendSessionMessage: (input) => ipcRenderer.invoke(ipcChannels.sendSessionMessage, input),
+  updateScratchpadSessionConfig: (input) =>
+    ipcRenderer.invoke(ipcChannels.updateScratchpadSessionConfig, input),
   selectProject: (projectId) => ipcRenderer.invoke(ipcChannels.selectProject, projectId),
   selectPattern: (patternId) => ipcRenderer.invoke(ipcChannels.selectPattern, patternId),
   selectSession: (sessionId) => ipcRenderer.invoke(ipcChannels.selectSession, sessionId),

src/renderer/App.tsx

@@ -16,6 +16,7 @@ import { WelcomePane } from '@renderer/components/WelcomePane';
 import { getElectronApi } from '@renderer/lib/electronApi';
 import type { PatternDefinition } from '@shared/domain/pattern';
 import { isScratchpadProject } from '@shared/domain/project';
+import { applyScratchpadSessionConfig } from '@shared/domain/session';
 import type { WorkspaceState } from '@shared/domain/workspace';
 import { createId, nowIso } from '@shared/utils/ids';
 
@@ -89,13 +90,6 @@ export default function App() {
     () => workspace?.sessions.find((s) => s.id === workspace.selectedSessionId),
     [workspace?.selectedSessionId, workspace?.sessions],
   );
-  const patternForSession = useMemo(
-    () =>
-      selectedSession
-        ? workspace?.patterns.find((p) => p.id === selectedSession.patternId)
-        : undefined,
-    [selectedSession, workspace?.patterns],
-  );
   const projectForSession = useMemo(
     () =>
       selectedSession
@@ -103,6 +97,20 @@ export default function App() {
         : undefined,
     [selectedSession, workspace?.projects],
   );
+  const patternForSession = useMemo(() => {
+    if (!selectedSession) {
+      return undefined;
+    }
+
+    const basePattern = workspace?.patterns.find((pattern) => pattern.id === selectedSession.patternId);
+    if (!basePattern) {
+      return undefined;
+    }
+
+    return projectForSession && isScratchpadProject(projectForSession)
+      ? applyScratchpadSessionConfig(basePattern, selectedSession)
+      : basePattern;
+  }, [projectForSession, selectedSession, workspace?.patterns]);
   const activityForSession = useMemo(
     () => (selectedSession ? sessionActivities[selectedSession.id] : undefined),
     [selectedSession, sessionActivities],
@@ -135,12 +143,19 @@ export default function App() {
     );
   } else if (selectedSession && patternForSession && projectForSession) {
     content = (
-      <ChatPane
-        onSend={(c) => api.sendSessionMessage({ sessionId: selectedSession.id, content: c })}
-        pattern={patternForSession}
-        project={projectForSession}
-        session={selectedSession}
-      />
+        <ChatPane
+          onSend={(c) => api.sendSessionMessage({ sessionId: selectedSession.id, content: c })}
+          onUpdateScratchpadConfig={(config) =>
+            api.updateScratchpadSessionConfig({
+              sessionId: selectedSession.id,
+              model: config.model,
+              reasoningEffort: config.reasoningEffort,
+            })
+          }
+          pattern={patternForSession}
+          project={projectForSession}
+          session={selectedSession}
+        />
     );
     detailPanel = (
       <ActivityPanel

src/renderer/components/AgentConfigFields.tsx

@@ -0,0 +1,152 @@
+import { useEffect, useRef, useState } from 'react';
+import { ChevronDown, Sparkles } from 'lucide-react';
+
+import {
+  findModel,
+  inferProvider,
+  modelCatalog,
+  providerMeta,
+  type ModelDefinition,
+} from '@shared/domain/models';
+import { reasoningEffortOptions, type ReasoningEffort } from '@shared/domain/pattern';
+
+import { ProviderIcon } from './ProviderIcons';
+
+function TierBadge({ tier }: { tier: ModelDefinition['tier'] }) {
+  const styles = {
+    premium: 'bg-amber-500/10 text-amber-400',
+    standard: 'bg-zinc-700/50 text-zinc-500',
+    fast: 'bg-emerald-500/10 text-emerald-400',
+  };
+
+  return (
+    <span className={`ml-auto rounded px-1.5 py-0.5 text-[9px] font-medium ${styles[tier]}`}>
+      {tier}
+    </span>
+  );
+}
+
+interface ModelSelectProps {
+  value: string;
+  onChange: (model: string) => void;
+  label?: string;
+  disabled?: boolean;
+}
+
+export function ModelSelect({
+  value,
+  onChange,
+  label = 'Model',
+  disabled = false,
+}: ModelSelectProps) {
+  const [open, setOpen] = useState(false);
+  const containerRef = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    if (!open) {
+      return;
+    }
+
+    function handleClick(event: MouseEvent) {
+      if (containerRef.current && !containerRef.current.contains(event.target as Node)) {
+        setOpen(false);
+      }
+    }
+
+    document.addEventListener('mousedown', handleClick);
+    return () => document.removeEventListener('mousedown', handleClick);
+  }, [open]);
+
+  const selected = findModel(value);
+  const provider = selected?.provider ?? inferProvider(value);
+
+  return (
+    <label className="block space-y-1.5">
+      <span className="text-[12px] font-medium text-zinc-400">{label}</span>
+      <div className="relative" ref={containerRef}>
+        <button
+          className="flex w-full items-center gap-2 rounded-lg border border-zinc-700 bg-zinc-900 px-3 py-2 text-left text-[13px] text-zinc-100 outline-none transition hover:border-zinc-600 focus:border-indigo-500/50 disabled:cursor-not-allowed disabled:opacity-60"
+          disabled={disabled}
+          onClick={() => setOpen((current) => !current)}
+          type="button"
+        >
+          {provider && <ProviderIcon provider={provider} />}
+          <span className="flex-1 truncate">{selected?.name ?? (value || 'Select model')}</span>
+          <ChevronDown
+            className={`size-3.5 text-zinc-500 transition ${open ? 'rotate-180' : ''}`}
+          />
+        </button>
+
+        {open && !disabled && (
+          <div className="absolute z-30 mt-1 max-h-72 w-full overflow-y-auto rounded-lg border border-zinc-700 bg-zinc-900 py-1 shadow-2xl">
+            {providerMeta.map((providerGroup) => {
+              const models = modelCatalog.filter((model) => model.provider === providerGroup.id);
+
+              return (
+                <div key={providerGroup.id}>
+                  <div className="flex items-center gap-2 px-3 pb-1 pt-2.5">
+                    <ProviderIcon provider={providerGroup.id} />
+                    <span className="text-[10px] font-semibold uppercase tracking-wider text-zinc-500">
+                      {providerGroup.label}
+                    </span>
+                  </div>
+                  {models.map((model) => (
+                    <button
+                      className={`flex w-full items-center gap-2 px-3 py-1.5 text-left text-[13px] transition hover:bg-zinc-800 ${
+                        model.id === value ? 'bg-indigo-500/10 text-indigo-200' : 'text-zinc-300'
+                      }`}
+                      key={model.id}
+                      onClick={() => {
+                        onChange(model.id);
+                        setOpen(false);
+                      }}
+                      type="button"
+                    >
+                      <span className="flex-1">{model.name}</span>
+                      <TierBadge tier={model.tier} />
+                    </button>
+                  ))}
+                </div>
+              );
+            })}
+          </div>
+        )}
+      </div>
+    </label>
+  );
+}
+
+interface ReasoningEffortSelectProps {
+  value: ReasoningEffort;
+  onChange: (value: ReasoningEffort) => void;
+  label?: string;
+  disabled?: boolean;
+}
+
+export function ReasoningEffortSelect({
+  value,
+  onChange,
+  label = 'Reasoning',
+  disabled = false,
+}: ReasoningEffortSelectProps) {
+  return (
+    <label className="block space-y-1.5">
+      <span className="text-[12px] font-medium text-zinc-400">{label}</span>
+      <div className="relative">
+        <select
+          className="w-full rounded-lg border border-zinc-700 bg-zinc-900 px-3 py-2 pr-9 text-[13px] text-zinc-100 outline-none transition focus:border-indigo-500/50 disabled:cursor-not-allowed disabled:opacity-60"
+          disabled={disabled}
+          onChange={(event) => onChange(event.target.value as ReasoningEffort)}
+          value={value}
+        >
+          {reasoningEffortOptions.map((option) => (
+            <option key={option.value} value={option.value}>
+              {option.label}
+            </option>
+          ))}
+        </select>
+        <Sparkles className="pointer-events-none absolute right-3 top-1/2 size-3.5 -translate-y-1/2 text-zinc-500" />
+      </div>
+    </label>
+  );
+}

src/renderer/components/ChatPane.tsx

@@ -3,8 +3,9 @@ import { AlertCircle, ArrowUp, Bot, Loader2, User } from 'lucide-react';
 
 import { MarkdownContent } from '@renderer/components/MarkdownContent';
 import { getAssistantMessagePhase } from '@renderer/lib/messagePhase';
+import { ModelSelect, ReasoningEffortSelect } from '@renderer/components/AgentConfigFields';
 
-import type { PatternDefinition } from '@shared/domain/pattern';
+import type { PatternDefinition, ReasoningEffort } from '@shared/domain/pattern';
 import { isScratchpadProject, type ProjectRecord } from '@shared/domain/project';
 import type { SessionRecord } from '@shared/domain/session';
 
@@ -23,30 +24,74 @@ interface ChatPaneProps {
   pattern: PatternDefinition;
   session: SessionRecord;
   onSend: (content: string) => Promise<void>;
+  onUpdateScratchpadConfig: (config: {
+    model: string;
+    reasoningEffort: ReasoningEffort;
+  }) => Promise<unknown>;
 }
 
-export function ChatPane({ project, pattern, session, onSend }: ChatPaneProps) {
+export function ChatPane({
+  project,
+  pattern,
+  session,
+  onSend,
+  onUpdateScratchpadConfig,
+}: ChatPaneProps) {
   const [input, setInput] = useState('');
+  const [configError, setConfigError] = useState<string>();
+  const [isUpdatingScratchpadConfig, setIsUpdatingScratchpadConfig] = useState(false);
   const transcriptRef = useRef<HTMLDivElement>(null);
   const textareaRef = useRef<HTMLTextAreaElement>(null);
 
-  const isBusy = session.status === 'running';
+  const isSessionBusy = session.status === 'running';
   const isScratchpad = isScratchpadProject(project);
+  const primaryAgent = pattern.agents[0];
+  const scratchpadReasoningEffort = primaryAgent?.reasoningEffort ?? 'high';
+  const isComposerDisabled = isSessionBusy || isUpdatingScratchpadConfig;
 
   useEffect(() => {
     transcriptRef.current?.scrollTo({
       top: transcriptRef.current.scrollHeight,
       behavior: 'smooth',
     });
-  }, [session.messages.length, isBusy]);
+  }, [session.messages.length, isSessionBusy]);
+
+  useEffect(() => {
+    setConfigError(undefined);
+    setIsUpdatingScratchpadConfig(false);
+  }, [session.id]);
 
   async function handleSubmit() {
     const text = input.trim();
-    if (!text || isBusy) return;
+    if (!text || isComposerDisabled) return;
     setInput('');
     await onSend(text);
   }
 
+  async function handleScratchpadConfigChange(config: {
+    model: string;
+    reasoningEffort: ReasoningEffort;
+  }) {
+    if (!isScratchpad || !primaryAgent || isComposerDisabled) {
+      return;
+    }
+
+    if (config.model === primaryAgent.model && config.reasoningEffort === scratchpadReasoningEffort) {
+      return;
+    }
+
+    setConfigError(undefined);
+    setIsUpdatingScratchpadConfig(true);
+
+    try {
+      await onUpdateScratchpadConfig(config);
+    } catch (error) {
+      setConfigError(error instanceof Error ? error.message : String(error));
+    } finally {
+      setIsUpdatingScratchpadConfig(false);
+    }
+  }
+
   function handleKeyDown(e: KeyboardEvent<HTMLTextAreaElement>) {
     if (e.key === 'Enter' && !e.shiftKey) {
       e.preventDefault();
@@ -65,7 +110,7 @@ export function ChatPane({ project, pattern, session, onSend }: ChatPaneProps) {
           </p>
         </div>
         <div className="flex items-center gap-2">
-          {session.status === 'running' && (
+          {isSessionBusy && (
             <span className="size-2 animate-pulse rounded-full bg-blue-400" />
           )}
           {session.status === 'error' && (
@@ -178,29 +223,77 @@ export function ChatPane({ project, pattern, session, onSend }: ChatPaneProps) {
           </div>
         )}
 
+        {configError && (
+          <div className="mb-3 flex items-start gap-2 rounded-lg bg-red-500/10 px-3 py-2 text-[13px] text-red-300">
+            <AlertCircle className="mt-0.5 size-4 shrink-0 text-red-400" />
+            <span>{configError}</span>
+          </div>
+        )}
+
         <div className="mx-auto max-w-3xl">
+          {isScratchpad && primaryAgent && (
+            <div className="mb-3 rounded-xl border border-zinc-800 bg-zinc-900/40 p-3">
+              <div className="flex flex-col gap-3 sm:flex-row sm:items-end">
+                <div className="min-w-0 flex-1">
+                  <ModelSelect
+                    disabled={isComposerDisabled}
+                    onChange={(model) =>
+                      void handleScratchpadConfigChange({
+                        model,
+                        reasoningEffort: scratchpadReasoningEffort,
+                      })
+                    }
+                    value={primaryAgent.model}
+                  />
+                </div>
+                <div className="sm:w-44">
+                  <ReasoningEffortSelect
+                    disabled={isComposerDisabled}
+                    label="Thinking"
+                    onChange={(reasoningEffort) =>
+                      void handleScratchpadConfigChange({
+                        model: primaryAgent.model,
+                        reasoningEffort,
+                      })
+                    }
+                    value={scratchpadReasoningEffort}
+                  />
+                </div>
+              </div>
+              <p className="mt-2 text-[11px] text-zinc-500">
+                Applies to future replies in this scratchpad.
+              </p>
+            </div>
+          )}
+
           <div className="relative rounded-xl border border-zinc-700 bg-zinc-900 transition-colors focus-within:border-indigo-500/50">
             <textarea
               className="auto-resize-textarea block w-full resize-none bg-transparent px-4 py-3 pr-12 text-[14px] text-zinc-100 placeholder-zinc-600 outline-none"
-              disabled={isBusy}
+              disabled={isComposerDisabled}
               onChange={(e) => setInput(e.target.value)}
               onKeyDown={handleKeyDown}
-              placeholder={isBusy ? 'Waiting for response...' : 'Message...'}
+              placeholder={
+                isSessionBusy
+                  ? 'Waiting for response...'
+                  : isUpdatingScratchpadConfig
+                    ? 'Saving scratchpad settings...'
+                    : 'Message...'
+              }
               ref={textareaRef}
               rows={1}
               value={input}
             />
             <button
               className={`absolute bottom-2 right-2 flex size-8 items-center justify-center rounded-lg transition ${
-                input.trim() && !isBusy
+                input.trim() && !isComposerDisabled
                   ? 'bg-indigo-600 text-white hover:bg-indigo-500'
                   : 'bg-zinc-800 text-zinc-600'
               }`}
-              disabled={isBusy || !input.trim()}
+              disabled={isComposerDisabled || !input.trim()}
               onClick={() => void handleSubmit()}
               type="button"
             >
-              {isBusy ? (
+              {isSessionBusy ? (
                 <Loader2 className="size-4 animate-spin" />
               ) : (
                 <ArrowUp className="size-4" />

src/renderer/components/PatternEditor.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useRef, useState, type ReactNode } from 'react';
+import { type ReactNode } from 'react';
 import {
   AlertCircle,
   ArrowLeftRight,
@@ -19,16 +19,10 @@ import {
   validatePatternDefinition,
   type OrchestrationMode,
   type PatternDefinition,
-  type ReasoningEffort,
   type PatternAgentDefinition,
 } from '@shared/domain/pattern';
-import {
-  modelCatalog,
-  providerMeta,
-  findModel,
-  inferProvider,
-  type ModelDefinition,
-} from '@shared/domain/models';
+
+import { ModelSelect, ReasoningEffortSelect } from './AgentConfigFields';
 
 interface PatternEditorProps {
   pattern: PatternDefinition;
@@ -39,13 +33,6 @@ interface PatternEditorProps {
   onBack: () => void;
 }
 
-const reasoningEfforts: { value: ReasoningEffort; label: string }[] = [
-  { value: 'low', label: 'Low' },
-  { value: 'medium', label: 'Medium' },
-  { value: 'high', label: 'High' },
-  { value: 'xhigh', label: 'Maximum' },
-];
-
 interface ModeInfo {
   icon: LucideIcon;
   label: string;
@@ -202,95 +189,6 @@ function InputField({
   );
 }
 
-import { ProviderIcon } from './ProviderIcons';
-
-function TierBadge({ tier }: { tier: ModelDefinition['tier'] }) {
-  const styles = {
-    premium: 'bg-amber-500/10 text-amber-400',
-    standard: 'bg-zinc-700/50 text-zinc-500',
-    fast: 'bg-emerald-500/10 text-emerald-400',
-  };
-  return (
-    <span className={`ml-auto rounded px-1.5 py-0.5 text-[9px] font-medium ${styles[tier]}`}>
-      {tier}
-    </span>
-  );
-}
-
-function ModelSelect({ value, onChange }: { value: string; onChange: (model: string) => void }) {
-  const [open, setOpen] = useState(false);
-  const containerRef = useRef<HTMLDivElement>(null);
-
-  useEffect(() => {
-    if (!open) return;
-    function handleClick(e: MouseEvent) {
-      if (containerRef.current && !containerRef.current.contains(e.target as Node)) {
-        setOpen(false);
-      }
-    }
-    document.addEventListener('mousedown', handleClick);
-    return () => document.removeEventListener('mousedown', handleClick);
-  }, [open]);
-
-  const selected = findModel(value);
-  const provider = selected?.provider ?? inferProvider(value);
-
-  return (
-    <label className="block space-y-1.5">
-      <span className="text-[12px] font-medium text-zinc-400">Model</span>
-      <div className="relative" ref={containerRef}>
-        <button
-          className="flex w-full items-center gap-2 rounded-lg border border-zinc-700 bg-zinc-900 px-3 py-2 text-left text-[13px] text-zinc-100 outline-none transition hover:border-zinc-600 focus:border-indigo-500/50"
-          onClick={() => setOpen(!open)}
-          type="button"
-        >
-          {provider && <ProviderIcon provider={provider} />}
-          <span className="flex-1 truncate">{selected?.name ?? (value || 'Select model')}</span>
-          <ChevronDown
-            className={`size-3.5 text-zinc-500 transition ${open ? 'rotate-180' : ''}`}
-          />
-        </button>
-
-        {open && (
-          <div className="absolute z-30 mt-1 max-h-72 w-full overflow-y-auto rounded-lg border border-zinc-700 bg-zinc-900 py-1 shadow-2xl">
-            {providerMeta.map((p) => {
-              const models = modelCatalog.filter((m) => m.provider === p.id);
-              return (
-                <div key={p.id}>
-                  <div className="flex items-center gap-2 px-3 pb-1 pt-2.5">
-                    <ProviderIcon provider={p.id} />
-                    <span className="text-[10px] font-semibold uppercase tracking-wider text-zinc-500">
-                      {p.label}
-                    </span>
-                  </div>
-                  {models.map((model) => (
-                    <button
-                      className={`flex w-full items-center gap-2 px-3 py-1.5 text-left text-[13px] transition hover:bg-zinc-800 ${
-                        model.id === value
-                          ? 'bg-indigo-500/10 text-indigo-200'
-                          : 'text-zinc-300'
-                      }`}
-                      key={model.id}
-                      onClick={() => {
-                        onChange(model.id);
-                        setOpen(false);
-                      }}
-                      type="button"
-                    >
-                      <span className="flex-1">{model.name}</span>
-                      <TierBadge tier={model.tier} />
-                    </button>
-                  ))}
-                </div>
-              );
-            })}
-          </div>
-        )}
-      </div>
-    </label>
-  );
-}
-
 export function PatternEditor({ pattern, isBuiltin, onChange, onDelete, onSave, onBack }: PatternEditorProps) {
   const issues = validatePatternDefinition(pattern);
 
@@ -513,24 +411,11 @@ export function PatternEditor({ pattern, isBuiltin, onChange, onDelete, onSave,
                       onChange={(v) => updateAgent(agent.id, { model: v })}
                       value={agent.model}
                     />
-                    <label className="block space-y-1.5">
-                      <span className="text-[12px] font-medium text-zinc-400">Reasoning</span>
-                      <select
-                        className="w-full rounded-lg border border-zinc-700 bg-zinc-900 px-3 py-2 text-[13px] text-zinc-100 outline-none transition focus:border-indigo-500/50"
-                        onChange={(e) =>
-                          updateAgent(agent.id, {
-                            reasoningEffort: e.target.value as ReasoningEffort,
-                          })
-                        }
-                        value={agent.reasoningEffort ?? 'high'}
-                      >
-                        {reasoningEfforts.map((r) => (
-                          <option key={r.value} value={r.value}>
-                            {r.label}
-                          </option>
-                        ))}
-                      </select>
-                    </label>
+                    <ReasoningEffortSelect
+                      label="Reasoning"
+                      onChange={(value) => updateAgent(agent.id, { reasoningEffort: value })}
+                      value={agent.reasoningEffort ?? 'high'}
+                    />
                   </div>
                   <div className="mt-3">
                     <InputField

src/shared/contracts/channels.ts

@@ -6,6 +6,7 @@ export const ipcChannels = {
   deletePattern: 'patterns:delete',
   createSession: 'sessions:create',
   sendSessionMessage: 'sessions:send-message',
+  updateScratchpadSessionConfig: 'sessions:update-scratchpad-config',
   selectProject: 'selection:project',
   selectPattern: 'selection:pattern',
   selectSession: 'selection:session',

src/shared/contracts/ipc.ts

@@ -1,4 +1,4 @@
-import type { PatternDefinition } from '@shared/domain/pattern';
+import type { PatternDefinition, ReasoningEffort } from '@shared/domain/pattern';
 import type { ProjectRecord } from '@shared/domain/project';
 import type { SessionEventRecord } from '@shared/domain/event';
 import type { WorkspaceState } from '@shared/domain/workspace';
@@ -17,6 +17,12 @@ export interface SendSessionMessageInput {
   content: string;
 }
 
+export interface UpdateScratchpadSessionConfigInput {
+  sessionId: string;
+  model: string;
+  reasoningEffort: ReasoningEffort;
+}
+
 export interface ElectronApi {
   loadWorkspace(): Promise<WorkspaceState>;
   addProject(): Promise<WorkspaceState>;
@@ -25,6 +31,7 @@ export interface ElectronApi {
   deletePattern(patternId: string): Promise<WorkspaceState>;
   createSession(input: CreateSessionInput): Promise<WorkspaceState>;
   sendSessionMessage(input: SendSessionMessageInput): Promise<void>;
+  updateScratchpadSessionConfig(input: UpdateScratchpadSessionConfigInput): Promise<WorkspaceState>;
   selectProject(projectId?: string): Promise<WorkspaceState>;
   selectPattern(patternId?: string): Promise<WorkspaceState>;
   selectSession(sessionId?: string): Promise<WorkspaceState>;

src/shared/domain/pattern.ts

@@ -11,6 +11,13 @@ export type OrchestrationMode =
 export type PatternAvailability = 'available' | 'preview' | 'unavailable';
 export type ReasoningEffort = 'low' | 'medium' | 'high' | 'xhigh';
 
+export const reasoningEffortOptions: ReadonlyArray<{ value: ReasoningEffort; label: string }> = [
+  { value: 'low', label: 'Low' },
+  { value: 'medium', label: 'Medium' },
+  { value: 'high', label: 'High' },
+  { value: 'xhigh', label: 'Maximum' },
+];
+
 export interface PatternAgentDefinition {
   id: string;
   name: string;
@@ -45,6 +52,12 @@ const defaultModels = {
   gpt53: 'gpt-5.3-codex',
 } as const;
 
+const reasoningEffortSet = new Set<ReasoningEffort>(reasoningEffortOptions.map((option) => option.value));
+
+export function isReasoningEffort(value: string | undefined): value is ReasoningEffort {
+  return value !== undefined && reasoningEffortSet.has(value as ReasoningEffort);
+}
+
 export function createBuiltinPatterns(timestamp: string): PatternDefinition[] {
   return [
     {

src/shared/domain/session.ts

@@ -1,6 +1,13 @@
+import type { PatternDefinition, ReasoningEffort } from '@shared/domain/pattern';
+
 export type ChatRole = 'system' | 'user' | 'assistant';
 export type SessionStatus = 'idle' | 'running' | 'error';
 
+export interface ScratchpadSessionConfig {
+  model: string;
+  reasoningEffort?: ReasoningEffort;
+}
+
 export interface ChatMessageRecord {
   id: string;
   role: ChatRole;
@@ -20,4 +27,58 @@ export interface SessionRecord {
   status: SessionStatus;
   messages: ChatMessageRecord[];
   lastError?: string;
+  scratchpadConfig?: ScratchpadSessionConfig;
+}
+
+export function createScratchpadSessionConfig(
+  pattern: PatternDefinition,
+): ScratchpadSessionConfig | undefined {
+  const primaryAgent = pattern.agents[0];
+  if (!primaryAgent) {
+    return undefined;
+  }
+
+  return {
+    model: primaryAgent.model,
+    reasoningEffort: primaryAgent.reasoningEffort,
+  };
+}
+
+export function resolveScratchpadSessionConfig(
+  session: SessionRecord,
+  pattern: PatternDefinition,
+): ScratchpadSessionConfig | undefined {
+  const defaults = createScratchpadSessionConfig(pattern);
+  if (!defaults) {
+    return undefined;
+  }
+
+  const overrideModel = session.scratchpadConfig?.model.trim();
+  return {
+    model: overrideModel || defaults.model,
+    reasoningEffort: session.scratchpadConfig?.reasoningEffort ?? defaults.reasoningEffort,
+  };
+}
+
+export function applyScratchpadSessionConfig(
+  pattern: PatternDefinition,
+  session: SessionRecord,
+): PatternDefinition {
+  const config = resolveScratchpadSessionConfig(session, pattern);
+  const primaryAgent = pattern.agents[0];
+  if (!config || !primaryAgent) {
+    return pattern;
+  }
+
+  return {
+    ...pattern,
+    agents: [
+      {
+        ...primaryAgent,
+        model: config.model,
+        reasoningEffort: config.reasoningEffort,
+      },
+      ...pattern.agents.slice(1),
+    ],
+  };
 }

tests/shared/session.test.ts

@@ -0,0 +1,97 @@
+import { describe, expect, test } from 'bun:test';
+
+import type { PatternDefinition } from '@shared/domain/pattern';
+import {
+  applyScratchpadSessionConfig,
+  createScratchpadSessionConfig,
+  resolveScratchpadSessionConfig,
+  type SessionRecord,
+} from '@shared/domain/session';
+
+function createPattern(): PatternDefinition {
+  return {
+    id: 'pattern-single',
+    name: '1-on-1 Copilot Chat',
+    description: 'Single agent chat',
+    mode: 'single',
+    availability: 'available',
+    maxIterations: 1,
+    agents: [
+      {
+        id: 'agent-primary',
+        name: 'Primary Agent',
+        description: 'Helpful assistant',
+        instructions: 'Help the user.',
+        model: 'gpt-5.4',
+        reasoningEffort: 'high',
+      },
+      {
+        id: 'agent-secondary',
+        name: 'Secondary Agent',
+        description: 'Unused here',
+        instructions: 'Review.',
+        model: 'claude-sonnet-4.5',
+        reasoningEffort: 'medium',
+      },
+    ],
+    createdAt: '2026-03-23T00:00:00.000Z',
+    updatedAt: '2026-03-23T00:00:00.000Z',
+  };
+}
+
+function createSession(overrides?: Partial<SessionRecord>): SessionRecord {
+  return {
+    id: 'session-1',
+    projectId: 'project-scratchpad',
+    patternId: 'pattern-single',
+    title: 'Scratchpad',
+    createdAt: '2026-03-23T00:00:00.000Z',
+    updatedAt: '2026-03-23T00:00:00.000Z',
+    status: 'idle',
+    messages: [],
+    ...overrides,
+  };
+}
+
+describe('scratchpad session config helpers', () => {
+  test('captures the initial scratchpad model settings from the primary agent', () => {
+    expect(createScratchpadSessionConfig(createPattern())).toEqual({
+      model: 'gpt-5.4',
+      reasoningEffort: 'high',
+    });
+  });
+
+  test('resolves persisted scratchpad overrides over the pattern defaults', () => {
+    const config = resolveScratchpadSessionConfig(
+      createSession({
+        scratchpadConfig: {
+          model: 'claude-opus-4.5',
+          reasoningEffort: 'medium',
+        },
+      }),
+      createPattern(),
+    );
+
+    expect(config).toEqual({
+      model: 'claude-opus-4.5',
+      reasoningEffort: 'medium',
+    });
+  });
+
+  test('applies scratchpad settings only to the primary agent', () => {
+    const pattern = createPattern();
+    const updated = applyScratchpadSessionConfig(
+      pattern,
+      createSession({
+        scratchpadConfig: {
+          model: 'gpt-5.4-mini',
+          reasoningEffort: 'low',
+        },
+      }),
+    );
+
+    expect(updated.agents[0].model).toBe('gpt-5.4-mini');
+    expect(updated.agents[0].reasoningEffort).toBe('low');
+    expect(updated.agents[1]).toEqual(pattern.agents[1]);
+  });
+});