@phenx-inc/ctlsurf 0.2.0 → 0.3.1

package/src/main/orchestrator.ts

@@ -7,6 +7,7 @@ import { AgentConfig, isCodingAgent } from './agents'
 import { CtlsurfApi } from './ctlsurfApi'
 import { ConversationBridge } from './bridge'
 import { WorkerWsClient, type WorkerWsStatus, type IncomingMessage } from './workerWs'
+import { TimeTracker } from './timeTracker'
 
 function log(...args: unknown[]): void {
   try { console.log(...args) } catch { /* EPIPE safe */ }
@@ -19,8 +20,12 @@ export interface Profile {
   apiKey: string
   baseUrl: string
   dataspacePageId: string
+  trackTime?: boolean
+  idleTimeoutMin?: number
 }
 
+const DEFAULT_IDLE_TIMEOUT_MIN = 15
+
 export interface SettingsData {
   activeProfile: string
   profiles: Record<string, Profile>
@@ -54,6 +59,8 @@ const DEFAULT_PROFILES: Record<string, Profile> = {
     apiKey: '',
     baseUrl: 'https://app.ctlsurf.com',
     dataspacePageId: '',
+    trackTime: true,
+    idleTimeoutMin: 15,
   },
 }
 
@@ -67,6 +74,7 @@ export class Orchestrator {
   readonly ctlsurfApi = new CtlsurfApi()
   readonly bridge = new ConversationBridge()
   readonly workerWs: WorkerWsClient
+  readonly timeTracker = new TimeTracker(this.ctlsurfApi)
 
   // State
   private tabs = new Map<string, TabState>()
@@ -222,6 +230,8 @@ export class Orchestrator {
         baseUrl: p.baseUrl,
         hasApiKey: !!p.apiKey,
         dataspacePageId: p.dataspacePageId || null,
+        trackTime: p.trackTime !== false,
+        idleTimeoutMin: p.idleTimeoutMin ?? DEFAULT_IDLE_TIMEOUT_MIN,
       })),
     }
   }
@@ -235,16 +245,27 @@ export class Orchestrator {
       baseUrl: p.baseUrl,
       hasApiKey: !!p.apiKey,
       dataspacePageId: p.dataspacePageId || '',
+      trackTime: p.trackTime !== false,
+      idleTimeoutMin: p.idleTimeoutMin ?? DEFAULT_IDLE_TIMEOUT_MIN,
     }
   }
 
-  saveProfile(profileId: string, data: { name: string; apiKey?: string; baseUrl: string; dataspacePageId: string }) {
+  saveProfile(profileId: string, data: {
+    name: string
+    apiKey?: string
+    baseUrl: string
+    dataspacePageId: string
+    trackTime?: boolean
+    idleTimeoutMin?: number
+  }) {
     const existing = this.settings.profiles[profileId]
     this.settings.profiles[profileId] = {
       name: data.name,
       apiKey: data.apiKey !== undefined ? data.apiKey : (existing?.apiKey || ''),
       baseUrl: data.baseUrl || 'https://app.ctlsurf.com',
       dataspacePageId: data.dataspacePageId || '',
+      trackTime: data.trackTime !== undefined ? data.trackTime : (existing?.trackTime !== false),
+      idleTimeoutMin: data.idleTimeoutMin !== undefined ? data.idleTimeoutMin : (existing?.idleTimeoutMin ?? DEFAULT_IDLE_TIMEOUT_MIN),
     }
     this.saveSettings()
 
@@ -289,7 +310,7 @@ export class Orchestrator {
 
   // ─── PTY & Agent (multi-tab) ─────────────────────
 
-  async spawnAgent(tabId: string, agent: AgentConfig, cwd: string): Promise<void> {
+  async spawnAgent(tabId: string, agent: AgentConfig, cwd: string, opts?: { trackTime?: boolean }): Promise<void> {
     // Kill existing PTY on this tab if any
     const existing = this.tabs.get(tabId)
     if (existing) {
@@ -312,6 +333,7 @@ export class Orchestrator {
 
     ptyManager.onData((data: string) => {
       this.events.onPtyData(tabId, data)
+      this.timeTracker.recordActivity(tabId)
       if (tabId === this.activeTabId) {
         this.bridge.feedOutput(data)
         this.streamTerminalData(tabId, data)
@@ -320,6 +342,7 @@ export class Orchestrator {
 
     ptyManager.onExit(async (exitCode: number) => {
       this.events.onPtyExit(tabId, exitCode)
+      await this.timeTracker.endSession(tabId)
       if (tabId === this.activeTabId) {
         this.bridge.endSession()
         if (this.currentAgent && isCodingAgent(this.currentAgent)) {
@@ -333,6 +356,17 @@ export class Orchestrator {
 
     this.bridge.startSession()
 
+    const profile = this.getActiveProfile()
+    const shouldTrack = opts?.trackTime !== undefined ? opts.trackTime : (profile.trackTime !== false)
+    if (shouldTrack) {
+      void this.timeTracker.startSession(
+        tabId,
+        cwd,
+        agent.name,
+        profile.idleTimeoutMin ?? DEFAULT_IDLE_TIMEOUT_MIN,
+      )
+    }
+
     if (isCodingAgent(agent)) {
       this.connectWorkerWs(agent, cwd)
     } else {
@@ -360,6 +394,7 @@ export class Orchestrator {
     const tab = this.tabs.get(tabId)
     if (!tab) return
     if (tab.termStreamTimer) clearTimeout(tab.termStreamTimer)
+    await this.timeTracker.endSession(tabId)
     tab.ptyManager.kill()
     this.tabs.delete(tabId)
     if (tabId === this.activeTabId) {
@@ -386,6 +421,31 @@ export class Orchestrator {
     return [...this.tabs.keys()]
   }
 
+  // ─── Tracking control (active tab) ──────────────
+
+  isActiveTabTracking(): boolean {
+    if (!this.activeTabId) return false
+    return this.timeTracker.isTracking(this.activeTabId)
+  }
+
+  async setActiveTabTracking(enabled: boolean): Promise<void> {
+    if (!this.activeTabId) return
+    const tab = this.tabs.get(this.activeTabId)
+    if (!tab) return
+    if (enabled) {
+      if (this.timeTracker.isTracking(this.activeTabId)) return
+      const profile = this.getActiveProfile()
+      await this.timeTracker.startSession(
+        this.activeTabId,
+        tab.cwd,
+        tab.agent.name,
+        profile.idleTimeoutMin ?? DEFAULT_IDLE_TIMEOUT_MIN,
+      )
+    } else {
+      await this.timeTracker.endSession(this.activeTabId)
+    }
+  }
+
   // ─── Worker WebSocket ───────────────────────────
 
   connectWorkerWs(agent: AgentConfig, cwd: string): void {
@@ -437,6 +497,7 @@ export class Orchestrator {
 
   async shutdown(): Promise<void> {
     this.bridge.endSession()
+    await this.timeTracker.endAll()
     for (const [, tab] of this.tabs) {
       if (tab.termStreamTimer) clearTimeout(tab.termStreamTimer)
       tab.ptyManager.kill()

package/src/main/timeTracker.ts

@@ -0,0 +1,223 @@
+import os from 'os'
+import { randomUUID } from 'crypto'
+import type { CtlsurfApi } from './ctlsurfApi'
+
+const DATASTORE_TITLE = 'Time Tracking'
+const AGENT_DATASTORE_PAGE_TITLE = 'Agent Datastore'
+const FIRST_CHECKPOINT_DELAY_MS = 30 * 1000
+const CHECKPOINT_INTERVAL_MS = 5 * 60 * 1000
+
+const COLUMNS: Array<{ name: string; type: string }> = [
+  { name: 'Started', type: 'date' },
+  { name: 'Active Time', type: 'number' },
+  { name: 'Agent', type: 'text' },
+  { name: 'Worker', type: 'text' },
+  { name: 'Session', type: 'text' },
+  { name: 'Notes', type: 'text' },
+]
+
+interface SessionState {
+  blockId: string
+  rowId: string
+  cwd: string
+  startedAt: number
+  lastActivity: number
+  activeMs: number
+  idleTimeoutMs: number
+  firstCheckpointTimer: ReturnType<typeof setTimeout> | null
+  checkpointTimer: ReturnType<typeof setInterval> | null
+  ended: boolean
+}
+
+function log(...args: unknown[]): void {
+  try { console.log('[time-tracker]', ...args) } catch { /* EPIPE safe */ }
+}
+
+function findPageByTitle(pages: any[], title: string): any | null {
+  for (const p of pages) {
+    if (p?.title === title) return p
+    if (p?.children?.length) {
+      const c = findPageByTitle(p.children, title)
+      if (c) return c
+    }
+  }
+  return null
+}
+
+export class TimeTracker {
+  private api: CtlsurfApi
+  private sessions = new Map<string, SessionState>()
+  private blockCache = new Map<string, string>()
+
+  constructor(api: CtlsurfApi) {
+    this.api = api
+  }
+
+  async startSession(tabId: string, cwd: string, agentName: string, idleTimeoutMin: number): Promise<void> {
+    if (this.sessions.has(tabId)) {
+      await this.endSession(tabId)
+    }
+    try {
+      const blockId = await this.ensureDatastore(cwd)
+      if (!blockId) {
+        log(`No "${AGENT_DATASTORE_PAGE_TITLE}" page found for ${cwd} — tracking disabled for this session`)
+        return
+      }
+      const startedAt = Date.now()
+      const startedIso = new Date(startedAt).toISOString()
+      const sessionUuid = randomUUID()
+      const row = await this.api.addRow(blockId, {
+        Started: startedIso,
+        'Active Time': 0,
+        Agent: agentName,
+        Worker: os.hostname(),
+        Session: sessionUuid,
+        Notes: '',
+      })
+      const rowId = row?.id
+      if (!rowId) {
+        log('addRow returned no id; aborting tracking', row)
+        return
+      }
+      const state: SessionState = {
+        blockId,
+        rowId,
+        cwd,
+        startedAt,
+        lastActivity: startedAt,
+        activeMs: 0,
+        idleTimeoutMs: Math.max(1, idleTimeoutMin) * 60 * 1000,
+        firstCheckpointTimer: null,
+        checkpointTimer: null,
+        ended: false,
+      }
+      state.firstCheckpointTimer = setTimeout(() => {
+        void this.checkpoint(tabId)
+        const live = this.sessions.get(tabId)
+        if (live && !live.ended) {
+          live.checkpointTimer = setInterval(() => {
+            void this.checkpoint(tabId)
+          }, CHECKPOINT_INTERVAL_MS)
+        }
+      }, FIRST_CHECKPOINT_DELAY_MS)
+      this.sessions.set(tabId, state)
+      log(`Started tracking tab=${tabId} agent="${agentName}" cwd=${cwd}`)
+    } catch (err: any) {
+      log(`startSession failed: ${err?.message || err}`)
+    }
+  }
+
+  isTracking(tabId: string): boolean {
+    const s = this.sessions.get(tabId)
+    return !!s && !s.ended
+  }
+
+  recordActivity(tabId: string): void {
+    const s = this.sessions.get(tabId)
+    if (!s || s.ended) return
+    const now = Date.now()
+    const delta = now - s.lastActivity
+    if (delta < s.idleTimeoutMs) {
+      s.activeMs += delta
+    }
+    s.lastActivity = now
+  }
+
+  async endSession(tabId: string): Promise<void> {
+    const s = this.sessions.get(tabId)
+    if (!s || s.ended) return
+    s.ended = true
+    if (s.firstCheckpointTimer) clearTimeout(s.firstCheckpointTimer)
+    if (s.checkpointTimer) clearInterval(s.checkpointTimer)
+    try {
+      await this.writeRow(s, Date.now())
+    } catch (err: any) {
+      log(`endSession write failed: ${err?.message || err}`)
+    }
+    this.sessions.delete(tabId)
+  }
+
+  async endAll(): Promise<void> {
+    const ids = [...this.sessions.keys()]
+    await Promise.all(ids.map(id => this.endSession(id)))
+  }
+
+  private async checkpoint(tabId: string): Promise<void> {
+    const s = this.sessions.get(tabId)
+    if (!s || s.ended) return
+    try {
+      await this.writeRow(s, Date.now())
+    } catch (err: any) {
+      log(`checkpoint failed: ${err?.message || err}`)
+    }
+  }
+
+  private async writeRow(s: SessionState, _endTimeMs: number): Promise<void> {
+    const activeMin = Math.round(s.activeMs / 60000)
+    await this.api.updateRow(s.blockId, s.rowId, {
+      'Active Time': activeMin,
+    })
+  }
+
+  private async ensureDatastore(cwd: string): Promise<string | null> {
+    const cached = this.blockCache.get(cwd)
+    if (cached) return cached
+
+    let folder: any = null
+    try {
+      folder = await this.api.findFolderByPath(cwd)
+    } catch {
+      return null
+    }
+    if (!folder?.id) return null
+
+    const folderDetail = await this.api.getFolder(folder.id)
+    const agentPage = findPageByTitle(folderDetail?.pages || [], AGENT_DATASTORE_PAGE_TITLE)
+    if (!agentPage?.id) return null
+
+    const summaries = await this.api.getPageBlockSummaries(agentPage.id)
+    const existing = (summaries || []).find((b: any) => b?.type === 'datastore' && b?.title === DATASTORE_TITLE)
+    if (existing?.id) {
+      await this.ensureColumns(existing.id)
+      this.blockCache.set(cwd, existing.id)
+      return existing.id
+    }
+
+    const columns = COLUMNS.map((c, i) => ({ id: `col_${i}`, name: c.name, type: c.type }))
+    const created = await this.api.createBlock(agentPage.id, {
+      type: 'datastore',
+      title: DATASTORE_TITLE,
+      props: { columns },
+    })
+    if (created?.id) {
+      log(`Created "${DATASTORE_TITLE}" datastore on Agent Datastore page for ${cwd}`)
+      this.blockCache.set(cwd, created.id)
+      return created.id
+    }
+    return null
+  }
+
+  private async ensureColumns(blockId: string): Promise<void> {
+    try {
+      const schema = await this.api.getDatastoreSchema(blockId)
+      const existingCols = schema.columns || []
+      const existingNames = new Set(existingCols.map(c => c.name))
+      const missing = COLUMNS.filter(c => !existingNames.has(c.name))
+      if (missing.length === 0) return
+
+      const usedIds = new Set(existingCols.map(c => c.id))
+      let nextIdx = existingCols.length
+      const appended = missing.map(c => {
+        let id = `col_${nextIdx++}`
+        while (usedIds.has(id)) id = `col_${nextIdx++}`
+        usedIds.add(id)
+        return { id, name: c.name, type: c.type }
+      })
+      const merged = [...existingCols, ...appended]
+      await this.api.updateDatastoreSchema(blockId, merged)
+      log(`Added ${missing.length} missing column(s) to existing Time Tracking datastore: ${missing.map(c => c.name).join(', ')}`)
+    } catch (err: any) {
+      log(`ensureColumns failed: ${err?.message || err}`)
+    }
+  }
+}

package/src/main/tui.ts

@@ -132,11 +132,16 @@ export class Tui {
    * Show an interactive agent picker modal.
    * Uses alternate screen just for the picker, then exits back to normal.
    */
-  showAgentPicker(agents: { name: string; description: string }[]): Promise<number> {
+  showAgentPicker(
+    agents: { name: string; description: string }[],
+    options: { initialTrackTime: boolean },
+  ): Promise<{ agentIdx: number; trackTime: boolean }> {
     return new Promise((resolve) => {
       let selected = 0
+      let trackTime = options.initialTrackTime
       const modalWidth = 44
-      const modalHeight = agents.length + 4
+      // +4 for borders/title/sep, +2 for track-time separator + row
+      const modalHeight = agents.length + 4 + 2
       const startCol = Math.max(1, Math.floor((this.cols - modalWidth) / 2))
       const startRow = Math.max(1, Math.floor((this.rows - modalHeight) / 2))
 
@@ -180,10 +185,22 @@ export class Tui {
           this.write(`${CSI}${row};${startCol}H${bg}${FG_DIM}\u2502${RESET}${bg}${content}${pad}${RESET}${BG_MODAL}${FG_DIM}\u2502${RESET}`)
         }
 
-        const botRow = startRow + 3 + agents.length
+        const innerSep = '\u251c' + '\u2500'.repeat(modalWidth - 2) + '┤'
+        const sepRow = startRow + 3 + agents.length
+        this.write(`${CSI}${sepRow};${startCol}H${BG_MODAL}${FG_DIM}${innerSep}${RESET}`)
+
+        const trackRow = sepRow + 1
+        const checkbox = trackTime ? `${FG_GREEN}[✓]${RESET}${BG_MODAL}` : `${FG_DIM}[ ]${RESET}${BG_MODAL}`
+        const trackLabelFg = trackTime ? FG_WHITE : FG_DIM
+        const trackContent = `  ${checkbox} ${trackLabelFg}Track time${RESET}${BG_MODAL}`
+        const trackContentLen = 2 + 3 + 1 + 'Track time'.length
+        const trackPad = ' '.repeat(Math.max(0, modalWidth - 2 - trackContentLen))
+        this.write(`${CSI}${trackRow};${startCol}H${BG_MODAL}${FG_DIM}│${RESET}${BG_MODAL}${trackContent}${trackPad}${FG_DIM}│${RESET}`)
+
+        const botRow = trackRow + 1
         this.write(`${CSI}${botRow};${startCol}H${BG_MODAL}${FG_DIM}${botBorder}${RESET}`)
 
-        const hint = '\u2191\u2193 navigate \u00B7 Enter select \u00B7 q quit'
+        const hint = '\u2191\u2193 navigate \u00B7 Enter select \u00B7 t track \u00B7 q quit'
         const hintCol = Math.max(1, Math.floor((this.cols - hint.length) / 2))
         this.write(`${CSI}${botRow + 2};${hintCol}H${FG_DIM}${hint}${RESET}`)
       }
@@ -204,9 +221,12 @@ export class Tui {
         } else if (key === '\x1b[B' || key === 'j') {
           selected = (selected + 1) % agents.length
           drawModal()
+        } else if (key === 't' || key === 'T' || key === ' ') {
+          trackTime = !trackTime
+          drawModal()
         } else if (key === '\r' || key === '\n') {
           cleanup()
-          resolve(selected)
+          resolve({ agentIdx: selected, trackTime })
         } else if (key === 'q' || key === '\x1b' || key === '\x03') {
           cleanup()
           this.write(`${CSI}?25h`)

package/src/preload/index.ts

@@ -60,13 +60,19 @@ const api = {
     ipcRenderer.invoke('profiles:list'),
   getProfile: (profileId: string) =>
     ipcRenderer.invoke('profiles:get', profileId),
-  saveProfile: (profileId: string, data: { name: string; apiKey?: string; baseUrl: string; dataspacePageId: string }) =>
+  saveProfile: (profileId: string, data: { name: string; apiKey?: string; baseUrl: string; dataspacePageId: string; trackTime?: boolean; idleTimeoutMin?: number }) =>
     ipcRenderer.invoke('profiles:save', profileId, data),
   switchProfile: (profileId: string) =>
     ipcRenderer.invoke('profiles:switch', profileId),
   deleteProfile: (profileId: string) =>
     ipcRenderer.invoke('profiles:delete', profileId),
 
+  // Tracking (active tab)
+  getTracking: (): Promise<{ active: boolean }> =>
+    ipcRenderer.invoke('tracking:get'),
+  setTracking: (enabled: boolean): Promise<{ active: boolean }> =>
+    ipcRenderer.invoke('tracking:set', enabled),
+
   // Filesystem
   readDir: (dirPath: string): Promise<Array<{ name: string; path: string; isDirectory: boolean }>> =>
     ipcRenderer.invoke('fs:readDir', dirPath),

package/src/renderer/App.tsx

@@ -44,6 +44,8 @@ declare global {
       saveProfile: (profileId: string, data: { name: string; apiKey?: string; baseUrl: string; dataspacePageId: string }) => Promise<{ ok: boolean }>
       switchProfile: (profileId: string) => Promise<{ ok: boolean }>
       deleteProfile: (profileId: string) => Promise<{ ok: boolean }>
+      getTracking: () => Promise<{ active: boolean }>
+      setTracking: (enabled: boolean) => Promise<{ active: boolean }>
       createProject: () => Promise<{ ok: boolean; folder_id?: string; error?: string }>
       getWebviewInfo: () => Promise<{
         frontendUrl: string; pageUrl?: string; authenticated: boolean;
@@ -100,6 +102,7 @@ export default function App() {
     return [{ id, label: 'Terminal 1', agent: null, agentStatus: 'idle' }]
   })
   const [activeTabId, setActiveTabId] = useState<string>(tabs[0].id)
+  const [trackingActive, setTrackingActive] = useState(false)
 
   // Agent picker state: which tab is being configured (null = initial picker for first tab)
   const [pickerTargetTabId, setPickerTargetTabId] = useState<string | null>(tabs[0].id)
@@ -134,6 +137,30 @@ export default function App() {
     return unsub
   }, [])
 
+  // Reflect tracking state for the active tab; refresh on tab switch and poll
+  // periodically so the UI catches changes (e.g. a session ending naturally).
+  useEffect(() => {
+    let cancelled = false
+    const refresh = async () => {
+      try {
+        const r = await window.worker.getTracking()
+        if (!cancelled) setTrackingActive(!!r?.active)
+      } catch { /* ignore */ }
+    }
+    refresh()
+    const id = setInterval(refresh, 4000)
+    return () => { cancelled = true; clearInterval(id) }
+  }, [activeTabId])
+
+  const handleToggleTracking = useCallback(async () => {
+    try {
+      const r = await window.worker.setTracking(!trackingActive)
+      setTrackingActive(!!r?.active)
+    } catch (err) {
+      console.error('[tracking] toggle failed', err)
+    }
+  }, [trackingActive])
+
   const cwdRef = useRef<string | null>(null)
 
   const handleSpawn = useCallback(async (tabId: string, agent: AgentConfig) => {
@@ -354,6 +381,15 @@ export default function App() {
           <button className="titlebar-btn" onClick={() => setShowSettings(true)} title="Settings">
             Settings
           </button>
+          <button
+            className={`titlebar-btn titlebar-icon-btn ${trackingActive ? 'active' : ''}`}
+            onClick={handleToggleTracking}
+            title={trackingActive ? 'Time tracking on — click to stop' : 'Time tracking off — click to start'}
+            aria-label="Time tracking"
+          >
+            <span className="tracking-icon">⏱</span>
+            <span className={`tracking-dot ${trackingActive ? 'on' : 'off'}`} />
+          </button>
           <span className="titlebar-separator" />
           {agents.map(a => {
             const activeTab = tabs.find(t => t.id === activeTabId)

package/src/renderer/components/SettingsDialog.tsx

@@ -6,6 +6,8 @@ interface ProfileSummary {
   baseUrl: string
   hasApiKey: boolean
   dataspacePageId: string | null
+  trackTime?: boolean
+  idleTimeoutMin?: number
 }
 
 interface ProfileListResponse {
@@ -28,6 +30,8 @@ export function SettingsDialog({ open, onClose }: SettingsDialogProps) {
   const [apiKey, setApiKey] = useState('')
   const [baseUrl, setBaseUrl] = useState('')
   const [dataspacePageId, setDataspacePageId] = useState('')
+  const [trackTime, setTrackTime] = useState(false)
+  const [idleTimeoutMin, setIdleTimeoutMin] = useState(15)
   const [saved, setSaved] = useState(false)
 
   const loadProfiles = async () => {
@@ -50,6 +54,8 @@ export function SettingsDialog({ open, onClose }: SettingsDialogProps) {
     setApiKey('')
     setBaseUrl(profile.baseUrl)
     setDataspacePageId(profile.dataspacePageId || '')
+    setTrackTime(!!profile.trackTime)
+    setIdleTimeoutMin(profile.idleTimeoutMin ?? 15)
     setSaved(false)
   }
 
@@ -60,16 +66,20 @@ export function SettingsDialog({ open, onClose }: SettingsDialogProps) {
     setApiKey('')
     setBaseUrl('http://localhost:8000')
     setDataspacePageId('')
+    setTrackTime(true)
+    setIdleTimeoutMin(15)
     setSaved(false)
   }
 
   const handleSave = async () => {
     if (!editingId || !name.trim()) return
 
-    const data: { name: string; apiKey?: string; baseUrl: string; dataspacePageId: string } = {
+    const data: { name: string; apiKey?: string; baseUrl: string; dataspacePageId: string; trackTime?: boolean; idleTimeoutMin?: number } = {
       name: name.trim(),
       baseUrl: baseUrl.trim() || 'https://app.ctlsurf.com',
       dataspacePageId: dataspacePageId.trim(),
+      trackTime,
+      idleTimeoutMin: Math.max(1, Math.floor(idleTimeoutMin)) || 15,
     }
     // Only send apiKey if user typed something new
     if (apiKey.trim()) {
@@ -154,6 +164,33 @@ export function SettingsDialog({ open, onClose }: SettingsDialogProps) {
               />
             </label>
 
+            <label className="settings-checkbox">
+              <input
+                type="checkbox"
+                checked={trackTime}
+                onChange={e => setTrackTime(e.target.checked)}
+              />
+              <span>Track time per project</span>
+              <span className="settings-hint">
+                Logs each session to a "Time Tracking" datastore on the project's Agent Datastore page.
+              </span>
+            </label>
+
+            {trackTime && (
+              <label>
+                Idle timeout (min)
+                <input
+                  type="number"
+                  min={1}
+                  value={idleTimeoutMin}
+                  onChange={e => setIdleTimeoutMin(parseInt(e.target.value, 10) || 15)}
+                />
+                <span className="settings-hint">
+                  Gaps longer than this without terminal activity are counted as idle, not work.
+                </span>
+              </label>
+            )}
+
             <div className="settings-actions">
               <button className="btn-secondary" onClick={() => setEditingId(null)}>Back</button>
               <button className="btn-primary" onClick={handleSave}>

package/src/renderer/components/TerminalPanel.tsx

@@ -158,18 +158,22 @@ export function TerminalPanel({ tabId, agent, onSpawn, onExit, isActive }: Termi
     fitAddon.fit()
     scrollIfPinned(tabId, terminal)
 
-    // Resize handling
+    // Resize handling — skip when the container is hidden (display:none → 0x0),
+    // otherwise fit() reports a tiny size and the PTY gets stuck at ~4 cols
+    // until the user switches back.
     let resizeTimeout: ReturnType<typeof setTimeout>
     const handleResize = () => {
       clearTimeout(resizeTimeout)
       resizeTimeout = setTimeout(() => {
+        const el = containerRef.current
+        if (!el || el.offsetWidth === 0 || el.offsetHeight === 0) return
         const state = _terminals.get(tabId)
-        if (state) {
-          state.fitAddon.fit()
-          scrollIfPinned(tabId, state.terminal)
-          const { cols, rows } = state.terminal
-          window.worker.resizePty(tabId, cols, rows)
-        }
+        if (!state) return
+        state.fitAddon.fit()
+        const { cols, rows } = state.terminal
+        if (cols < 10 || rows < 5) return
+        scrollIfPinned(tabId, state.terminal)
+        window.worker.resizePty(tabId, cols, rows)
       }, 150)
     }
 
@@ -208,15 +212,23 @@ export function TerminalPanel({ tabId, agent, onSpawn, onExit, isActive }: Termi
     })
   }, [tabId, agent, onSpawn])
 
-  // Focus terminal when tab becomes active
+  // Focus terminal when tab becomes active — delay fit to let the container get its layout dimensions
   useEffect(() => {
     if (isActive) {
-      const state = _terminals.get(tabId)
-      if (state) {
-        state.fitAddon.fit()
-        state.terminal.focus()
-      }
       window.worker.setActiveTab(tabId)
+      // Wait for the browser to layout the now-visible container before fitting
+      requestAnimationFrame(() => {
+        setTimeout(() => {
+          const state = _terminals.get(tabId)
+          if (state) {
+            state.fitAddon.fit()
+            state.terminal.focus()
+            scrollIfPinned(tabId, state.terminal)
+            const { cols, rows } = state.terminal
+            window.worker.resizePty(tabId, cols, rows)
+          }
+        }, 50)
+      })
     }
   }, [isActive, tabId])