changed diffs to changes

apps/desktop/src/renderer/screens/main/components/MainContentArea/MainContentArea.tsx

@@ -78,7 +78,7 @@ export function MainContentArea({
         worktreeId: selectedWorktreeId ?? undefined,
         worktreeBranch: selectedWorktree?.branch,
         workspaceName: currentWorkspace?.name,
-        enabled: sidebarMode === "diff" && !!selectedWorktreeId,
+        enabled: sidebarMode === "changes" && !!selectedWorktreeId,
     });
     if (mode === "plan") {
         return (
@@ -131,7 +131,7 @@ export function MainContentArea({
 
             {/* Main content panel */}
             <ResizablePanel defaultSize={80} minSize={30}>
-                {sidebarMode === "diff" ? (
+                {sidebarMode === "changes" ? (
                     diffLoading ? (
                         <PlaceholderState
                             loading={true}

apps/desktop/src/renderer/screens/main/components/Sidebar/Sidebar.tsx

@@ -61,17 +61,17 @@ export function Sidebar({
 		defaultScrollProgress,
 	);
 
-	const modes: SidebarMode[] = ["tabs", "diff"];
+	const modes: SidebarMode[] = ["tabs", "changes"];
 
-	// Fetch diff data when in diff mode
+	// Fetch diff data when in changes mode
 	const { diffData, loading: diffLoading } = useDiffData({
 		workspaceId: currentWorkspace?.id,
 		worktreeId: selectedWorktreeId ?? undefined,
 		worktreeBranch: currentWorkspace?.worktrees?.find(
 			(wt) => wt.id === selectedWorktreeId,
 		)?.branch,
 		workspaceName: currentWorkspace?.name,
-		enabled: currentMode === "diff" && !!selectedWorktreeId,
+		enabled: currentMode === "changes" && !!selectedWorktreeId,
 	});
 
 	// Set initial selected file when diff data loads
@@ -335,8 +335,8 @@ export function Sidebar({
 				isDragging={isDragging}
 			>
 				{(mode, isActive) => {
-					if (mode === "diff") {
-						// Diff mode - show file tree
+					if (mode === "changes") {
+						// Changes mode - show file tree
 						if (diffLoading) {
 							return (
 								<div className="flex-1 flex items-center justify-center text-neutral-500 text-sm">

apps/desktop/src/renderer/screens/main/components/Sidebar/components/ModeCarousel/constants.ts

@@ -3,11 +3,11 @@ import type { SidebarMode } from "./types";
 
 export const modeIcons: Record<SidebarMode, typeof LayoutList> = {
 	tabs: LayoutList,
-	diff: GitBranch,
+	changes: GitBranch,
 };
 
 export const modeLabels: Record<SidebarMode, string> = {
 	tabs: "Tabs",
-	diff: "Diffs",
+	changes: "Changes",
 };
 

apps/desktop/src/renderer/screens/main/components/Sidebar/components/ModeCarousel/types.ts

@@ -1,6 +1,7 @@
-import type { MotionValue, ReactNode } from "react";
+import type { MotionValue } from "framer-motion";
+import type { ReactNode } from "react";
 
-export type SidebarMode = "tabs" | "diff";
+export type SidebarMode = "tabs" | "changes";
 
 export interface ModeCarouselProps {
 	modes: SidebarMode[];

apps/desktop/src/renderer/screens/main/components/Sidebar/components/ModeSwitcher/ModeSwitcher.tsx

@@ -11,7 +11,7 @@ interface ModeSwitcherProps {
 
 const modeLabels: Record<SidebarMode, string> = {
 	tabs: "Tabs",
-	diff: "Diffs",
+	changes: "Changes",
 };
 
 export function ModeSwitcher({
@@ -21,7 +21,7 @@ export function ModeSwitcher({
 	scrollProgress,
 }: ModeSwitcherProps) {
 	// Calculate sliding background position from scroll progress
-	// scrollProgress is 0-1 (0 = tabs, 1 = diff), and we have 2 modes, so each mode is 50% width
+	// scrollProgress is 0-1 (0 = tabs, 1 = changes), and we have 2 modes, so each mode is 50% width
 	// Transform to percentage: 0 -> 0%, 1 -> 50%
 	const backgroundX = useTransform(scrollProgress, (value) => `${value * 50}%`);