1 files changed, 22 insertions, 1 deletions

diff --git a/renderer/src/components/Header.tsx b/renderer/src/components/Header.tsx
index 3a530d3..1d954ec 100644
--- a/renderer/src/components/Header.tsx
+++ b/renderer/src/components/Header.tsx
@@ -1,6 +1,8 @@
-import React, { useState } from "react";
+import React, { useState, useEffect } from "react";
 import type { Project, Session, Phase } from "../types";
 
+const api = window.api;
+
 type Theme = "dark" | "light";
 
 interface HeaderProps {
@@ -86,6 +88,16 @@ export function Header({
     setIsRenamingSession(false);
   };
 
+  // ── Maximize ─────────────────────────────────────────────────
+  const [isMaximized, setIsMaximized] = useState(false);
+
+  useEffect(() => {
+    // Returns the unsubscribe function; React cleanup calls it on unmount.
+    // On macOS, clicking the native green traffic light also fires this,
+    // keeping the glyph accurate when native controls are used.
+    return api.onWindowMaximized(setIsMaximized);
+  }, []);
+
   // ── Branch copy ──────────────────────────────────────────────
   const [copied, setCopied] = useState(false);
 
@@ -225,6 +237,15 @@ export function Header({
           {theme === "dark" ? "[light]" : "[dark]"}
         </button>
 
+        {/* ── Maximize toggle ── */}
+        <button
+          className="maximize-btn"
+          onClick={() => api.toggleMaximize()}
+          title={isMaximized ? "Restore window" : "Maximize window"}
+        >
+          {isMaximized ? '⊡' : '□'}
+        </button>
+
         {/* ── Settings button ── */}
         <button className="settings-btn" onClick={onOpenSettings} title="Settings">
           &#9881;