arul28 · arul28 · Apr 20, 2026 · Apr 18, 2026 · Apr 19, 2026 · Apr 19, 2026
@@ -306,6 +306,7 @@ describe("prService.getMobileSnapshot", () => {
     const eligibleEntry = snapshot.createCapabilities.lanes.find((lane) => lane.laneId === "lane-feat")!;
     expect(eligibleEntry.canCreate).toBe(true);
     expect(eligibleEntry.blockedReason).toBeNull();
+    expect(eligibleEntry.commitsAheadOfBase).toBe(0);
   });
 
   it("includes queue and rebase workflow cards and skips completed queues", async () => {

@@ -5510,6 +5510,7 @@ export function createPrService({
         primaryBranchRef: primaryLane?.branchRef ?? null,
       });
       const dirty = lane.status?.dirty === true;
+      const commitsAheadOfBase = Math.max(0, Number(lane.status?.ahead ?? 0) || 0);
       const hasExistingPr = existingPr !== null && (existingPr.state === "open" || existingPr.state === "draft");
       const canCreate = !hasExistingPr;
       const blockedReason = hasExistingPr
@@ -5524,6 +5525,7 @@ export function createPrService({
         defaultBaseBranch,
         defaultTitle: lane.name,
         dirty,
+        commitsAheadOfBase,
         hasExistingPr,
         canCreate,
         blockedReason,

@@ -332,6 +332,44 @@ describe("AppShell", () => {
       expect(
         screen.getByText(/No AI provider is configured yet/i),
       ).toBeTruthy();
+
+      fireEvent.click(screen.getByTestId("dismiss-missing-ai-banner"));
+
+      expect(
+        screen.queryByText(/No AI provider is configured yet/i),
+      ).toBeNull();
+    } finally {
+      vi.useRealTimers();
+    }
+  });
+
+  it("dismisses the GitHub not connected banner for the current session", async () => {
+    vi.useFakeTimers();
+    try {
+      globalThis.window.ade.github.getStatus = vi.fn(async () => ({ tokenStored: false })) as any;
+
+      render(
+        <MemoryRouter initialEntries={["/work"]}>
+          <AppShell>
+            <div>child</div>
+          </AppShell>
+        </MemoryRouter>,
+      );
+
+      await act(async () => {
+        vi.advanceTimersByTime(1_000);
+        await Promise.resolve();
+      });
+
+      expect(
+        screen.getByText(/GitHub is not connected for this ADE app yet/i),
+      ).toBeTruthy();
+
+      fireEvent.click(screen.getByTestId("dismiss-github-banner"));
+
+      expect(
+        screen.queryByText(/GitHub is not connected for this ADE app yet/i),
+      ).toBeNull();
     } finally {
       vi.useRealTimers();
     }

@@ -182,6 +182,12 @@ export function AppShell({ children }: { children: React.ReactNode }) {
   );
   const [dismissedContextBannerRoots, setDismissedContextBannerRoots] =
     useState<Record<string, true>>({});
+  /** Session dismiss for the “no AI provider” banner (per project root). */
+  const [dismissedMissingAiBannerRoots, setDismissedMissingAiBannerRoots] =
+    useState<Record<string, true>>({});
+  /** Session dismiss for the “GitHub not connected” banner (per project root). */
+  const [dismissedGithubBannerRoots, setDismissedGithubBannerRoots] =
+    useState<Record<string, true>>({});
   const [projectMissing, setProjectMissing] = useState(false);
   const [feedbackGenerating, setFeedbackGenerating] = useState(false);
   const previousProjectRootRef = useRef<string | null | undefined>(undefined);
@@ -480,6 +486,11 @@ export function AppShell({ children }: { children: React.ReactNode }) {
     setProjectMissing(false);
   }, [project?.rootPath]);
 
+  useEffect(() => {
+    setDismissedMissingAiBannerRoots({});
+    setDismissedGithubBannerRoots({});
+  }, [project?.rootPath]);
+
   useEffect(() => {
     const previousProjectRoot = previousProjectRootRef.current;
     const nextProjectRoot = project?.rootPath ?? null;
@@ -603,6 +614,12 @@ export function AppShell({ children }: { children: React.ReactNode }) {
     [missingContextDocs],
   );
   const currentProjectRoot = project?.rootPath ?? null;
+  const missingAiBannerDismissed = Boolean(
+    currentProjectRoot && dismissedMissingAiBannerRoots[currentProjectRoot],
+  );
+  const githubBannerDismissed = Boolean(
+    currentProjectRoot && dismissedGithubBannerRoots[currentProjectRoot],
+  );
   const contextBannerDismissed = Boolean(
     currentProjectRoot && dismissedContextBannerRoots[currentProjectRoot],
   );
@@ -791,12 +808,30 @@ export function AppShell({ children }: { children: React.ReactNode }) {
       !showWelcome &&
       aiStatusLoaded &&
       aiStatus !== null &&
-      !hasAnyAiProvider ? (
+      !hasAnyAiProvider &&
+      !missingAiBannerDismissed ? (
         <div className="shrink-0 mx-2 mt-1 rounded bg-amber-500/6 px-3 py-1.5 text-[11px] font-mono text-amber-800">
-          No AI provider is configured yet.{" "}
-          <Link to="/settings?tab=ai" className="underline">
-            Set up AI
-          </Link>
+          <span>
+            No AI provider is configured yet.{" "}
+            <Link to="/settings?tab=ai" className="underline">
+              Set up AI
+            </Link>
+          </span>
+          <button
+            type="button"
+            data-testid="dismiss-missing-ai-banner"
+            className="ml-2 text-amber-900/70 hover:text-amber-900"
+            onClick={() => {
+              if (!currentProjectRoot) return;
+              setDismissedMissingAiBannerRoots((prev) => ({
+                ...prev,
+                [currentProjectRoot]: true,
+              }));
+            }}
+            title="Dismiss for this session"
+          >
+            ×
+          </button>
         </div>
       ) : null}
 
@@ -805,12 +840,30 @@ export function AppShell({ children }: { children: React.ReactNode }) {
       !showWelcome &&
       !isOnboardingRoute &&
       githubStatus !== null &&
-      !githubStatus.tokenStored ? (
+      !githubStatus.tokenStored &&
+      !githubBannerDismissed ? (
         <div className="shrink-0 mx-3 mt-1.5 rounded bg-amber-500/6 px-3 py-1.5 text-[11px] font-mono text-amber-800">
-          GitHub is not connected for this ADE app yet.{" "}
-          <Link to="/settings?tab=integrations" className="underline">
-            Connect GitHub
-          </Link>
+          <span>
+            GitHub is not connected for this ADE app yet.{" "}
+            <Link to="/settings?tab=integrations" className="underline">
+              Connect GitHub
+            </Link>
+          </span>
+          <button
+            type="button"
+            data-testid="dismiss-github-banner"
+            className="ml-2 text-amber-900/70 hover:text-amber-900"
+            onClick={() => {
+              if (!currentProjectRoot) return;
+              setDismissedGithubBannerRoots((prev) => ({
+                ...prev,
+                [currentProjectRoot]: true,
+              }));
+            }}
+            title="Dismiss for this session"
+          >
+            ×
+          </button>
         </div>
       ) : null}
 

@@ -206,7 +206,8 @@ export function CommandPalette({
       { id: "go-missions", title: "Go to Missions", shortcut: "G M", group: "Navigation", run: () => navigate("/missions") },
       { id: "go-automations", title: "Go to Automations", hint: "Automation rules and agent workflows", group: "Navigation", run: () => navigate("/automations") },
       { id: "go-settings", title: "Go to Settings", shortcut: "G S", group: "Navigation", run: () => navigate("/settings") },
-      { id: "go-settings-general", title: "Go to General Settings", hint: "Theme, setup reminder, app info", group: "Settings", run: () => navigate("/settings?tab=general") },
+      { id: "go-settings-general", title: "Go to General Settings", hint: "Setup reminder, app info", group: "Settings", run: () => navigate("/settings?tab=general") },
+      { id: "go-settings-appearance", title: "Go to Appearance", hint: "Theme, chat font size, chat notifications", group: "Settings", run: () => navigate("/settings?tab=appearance") },
       { id: "go-settings-ai", title: "Go to AI Settings", hint: "Providers, models, AI defaults", group: "Settings", run: () => navigate("/settings?tab=ai") },
       { id: "go-settings-integrations", title: "Go to Integrations", hint: "GitHub, Linear, managed MCP, computer use", group: "Settings", run: () => navigate("/settings?tab=integrations") },
       { id: "go-settings-workspace", title: "Go to Workspace Settings", hint: "Project health and docs generation", group: "Settings", run: () => navigate("/settings?tab=workspace") },

@@ -1,7 +1,8 @@
 import React, { useState, useCallback, useEffect } from "react";
 import { useSearchParams, useLocation } from "react-router-dom";
-import { Brain, GearSix, Lightning, Stack, Database, FolderSimple, Plus, X, Plugs, DesktopTower } from "@phosphor-icons/react";
+import { Brain, GearSix, Lightning, Stack, Database, FolderSimple, Plus, X, Plugs, DesktopTower, Palette } from "@phosphor-icons/react";
 import { GeneralSection } from "../settings/GeneralSection";
+import { AppearanceSection } from "../settings/AppearanceSection";
 import { LaneTemplatesSection } from "../settings/LaneTemplatesSection";
 import { LaneBehaviorSection } from "../settings/LaneBehaviorSection";
 import { MemoryHealthTab } from "../settings/MemoryHealthTab";
@@ -17,6 +18,7 @@ import { PhaseCardEditor } from "../missions/PhaseCardEditor";
 
 const SECTIONS = [
   { id: "general", label: "General", icon: GearSix },
+  { id: "appearance", label: "Appearance", icon: Palette },
   { id: "workspace", label: "Workspace", icon: FolderSimple },
   { id: "ai", label: "AI", icon: Brain },
   { id: "sync", label: "Sync", icon: DesktopTower },
@@ -556,6 +558,7 @@ export function SettingsPage() {
         }}
       >
         {section === "general" && <GeneralSection />}
+        {section === "appearance" && <AppearanceSection />}
         {section === "workspace" && <WorkspaceSettingsSection />}
         {section === "ai" && <AiSettingsSection />}
         {section === "sync" && <SyncDevicesSection />}

@@ -71,11 +71,12 @@ import { deriveChatSubagentSnapshots, deriveTodoItems, deriveTurnDiffSummaries }
 import { derivePendingInputRequests, type DerivedPendingInput } from "./pendingInput";
 import { ProviderModelSelector } from "../shared/ProviderModelSelector";
 import { useClickOutside } from "../../hooks/useClickOutside";
-import { useAppStore } from "../../state/appStore";
+import { DEFAULT_CHAT_FONT_SIZE_PX, useAppStore } from "../../state/appStore";
 import { ClaudeCacheTtlBadge } from "../shared/ClaudeCacheTtlBadge";
 import { shouldShowClaudeCacheTtl } from "../../lib/claudeCacheTtl";
 import { getAgentChatModelsCached, getAiStatusCached } from "../../lib/aiDiscoveryCache";
 import { invalidateSessionListCache } from "../../lib/sessionListCache";
+import { playAgentTurnCompletionSound } from "../../lib/agentTurnCompletionSound";
 
 const LAST_MODEL_ID_KEY = "ade.chat.lastModelId";
 const LAST_REASONING_KEY_PREFIX = "ade.chat.lastReasoningEffort";
@@ -710,6 +711,10 @@ export function AgentChatPane({
   onLaneChange?: (laneId: string) => void;
 }) {
   const projectRoot = useAppStore((s) => s.project?.rootPath ?? null);
+  const agentTurnCompletionSound = useAppStore((s) => s.agentTurnCompletionSound);
+  const chatFontSizePx = useAppStore((s) => s.chatFontSizePx);
+  const chatUiScale = chatFontSizePx / DEFAULT_CHAT_FONT_SIZE_PX;
+  const chatSurfaceZoomStyle = { zoom: chatUiScale } as const;
   const navigate = useNavigate();
   const openAiProvidersSettings = useCallback(() => {
     navigate("/settings?tab=ai#ai-providers");
@@ -777,6 +782,8 @@ export function AgentChatPane({
   const shellRef = useRef<HTMLElement | null>(null);
   const composerMaxHeightPx = layoutVariant === "grid-tile" ? 144 : null;
   const sessionsRef = useRef<AgentChatSessionSummary[]>(sessions);
+  const completionSoundPrevTurnActiveRef = useRef(false);
+  const completionSoundArmedRef = useRef(true);
 
   const appliedInitialSessionIdRef = useRef<string | null>(initialSessionId ?? null);
   const loadedHistoryRef = useRef<Set<string>>(new Set());
@@ -824,6 +831,40 @@ export function AgentChatPane({
   const pendingInput = selectedSessionId ? (pendingInputsBySession[selectedSessionId]?.[0] ?? null) : null;
   const selectedSessionAwaitingInput = Boolean(pendingInput) || selectedSession?.awaitingInput === true;
   const turnActive = selectedSessionId ? (turnActiveBySession[selectedSessionId] ?? false) : false;
+
+  useEffect(() => {
+    completionSoundPrevTurnActiveRef.current = false;
+    completionSoundArmedRef.current = true;
+  }, [selectedSessionId]);
+
+  useEffect(() => {
+    if (agentTurnCompletionSound === "off") {
+      completionSoundPrevTurnActiveRef.current = turnActive;
+      return;
+    }
+    if (turnActive) {
+      completionSoundArmedRef.current = true;
+    }
+    const sessionEnded = selectedSession?.status === "ended";
+    const settled =
+      Boolean(selectedSessionId)
+      && !selectedSessionAwaitingInput
+      && !sessionEnded;
+    const prevTurn = completionSoundPrevTurnActiveRef.current;
+    const becameIdle = settled && prevTurn && !turnActive;
+    completionSoundPrevTurnActiveRef.current = turnActive;
+    if (becameIdle && completionSoundArmedRef.current) {
+      completionSoundArmedRef.current = false;
+      playAgentTurnCompletionSound(agentTurnCompletionSound);
+    }
+  }, [
+    agentTurnCompletionSound,
+    selectedSessionId,
+    selectedSession?.status,
+    selectedSessionAwaitingInput,
+    turnActive,
+  ]);
+
   const activeProviderConnection = selectedSession?.provider === "claude"
     ? (providerConnections?.claude ?? null)
     : selectedSession?.provider === "codex"
@@ -2497,7 +2538,7 @@ export function AgentChatPane({
 
   if (!laneId) {
     return (
-      <ChatSurfaceShell mode={surfaceMode} accentColor={presentation?.accentColor}>
+      <ChatSurfaceShell mode={surfaceMode} accentColor={presentation?.accentColor} extraSurfaceStyle={chatSurfaceZoomStyle}>
         <div className="flex h-full items-center justify-center">
           <span className="font-sans text-[12px] text-muted-fg/30">Select a lane to start chatting</span>
         </div>
@@ -2923,6 +2964,7 @@ export function AgentChatPane({
         containerRef={shellRef}
         mode={surfaceMode}
         accentColor={presentation?.accentColor ?? draftAccent}
+        extraSurfaceStyle={chatSurfaceZoomStyle}
         className={compactShell ? cn("border-0 shadow-none rounded-none bg-transparent") : undefined}
         header={compactShell ? undefined : shellHeader}
         footer={isEmptyState ? undefined : composerElement}

@@ -1,4 +1,4 @@
-import type { ReactNode, Ref } from "react";
+import type { CSSProperties, ReactNode, Ref } from "react";
 import type { ChatSurfaceMode } from "../../../shared/types";
 import { cn } from "../ui/cn";
 import { chatSurfaceVars } from "./chatSurfaceTheme";
@@ -16,6 +16,7 @@ export function ChatSurfaceShell({
   bodyClassName,
   footerClassName,
   containerRef,
+  extraSurfaceStyle,
 }: {
   mode: ChatSurfaceMode;
   accentColor?: string | null;
@@ -27,6 +28,8 @@ export function ChatSurfaceShell({
   bodyClassName?: string;
   footerClassName?: string;
   containerRef?: Ref<HTMLElement>;
+  /** Merged into the outer section (e.g. chat font size + zoom from settings). */
+  extraSurfaceStyle?: CSSProperties;
 }) {
   const mobileChrome = layoutVariant === "mobile";
 
@@ -38,7 +41,11 @@ export function ChatSurfaceShell({
         "relative flex h-full min-h-0 flex-col overflow-hidden",
         className,
       )}
-      style={{ ...chatSurfaceVars(mode, accentColor), background: "var(--color-bg)" }}
+      style={{
+        ...chatSurfaceVars(mode, accentColor),
+        background: "var(--color-bg)",
+        ...extraSurfaceStyle,
+      }}
     >
       {header ? (
         <div