Even out chat footer spacing and show the Changes base only on worktrees (#8934)

* fix(app): space the turn footer like the rest of the timeline

The footer sat 13px under the last line of text while the text sat about
21px under a tool or thinking row, so the footer looked glued to the
message. The message drops its bottom padding when a footer follows, so the
footer's top margin alone sets that gap; 20 makes the centre-to-centre
distance match the tool-to-text gap.

* fix(app): show the Changes base only on Paseo worktrees

The header rendered "branch -> base" whenever checkout status carried a
baseRef, and the daemon sends one for every git checkout, so plain
checkouts showed "-> main" with no way to change it. Only Paseo worktrees
store a base, so only they show it. The arrow is extra muted so it reads as
a separator, and the base no longer shrinks, so a long branch name truncates
instead of the base.

* fix(app): let a long Changes base truncate instead of overflowing

packages/app/src/git/diff-pane.tsx

@@ -667,15 +667,14 @@ function ChangesRepositoryToolbar({
           isGitCheckout
           testID="changes-branch-switcher"
         />
-        {model.baseRef ? (
+        {model.baseRef && model.isWorktree ? (
           <>
-            <ThemedArrowRight size={14} uniProps={foregroundMutedIconColorMapping} />
+            <ThemedArrowRight size={14} uniProps={extraMutedIconColorMapping} />
             <WorkspaceBaseBranchPicker
               serverId={model.serverId}
               workspaceId={model.workspaceId}
               cwd={model.cwd}
               baseRef={model.baseRef}
-              isWorktree={model.isWorktree}
             />
           </>
         ) : null}

packages/app/src/git/workspace-base-branch-picker.tsx

@@ -20,7 +20,6 @@ interface Props {
   workspaceId?: string | null;
   cwd: string;
   baseRef: string;
-  isWorktree: boolean;
 }
 
 const ThemedLoadingSpinner = withUnistyles(LoadingSpinner);
@@ -31,13 +30,7 @@ function refLabel(ref: string): string {
   return ref.replace(/^refs\/(heads|remotes)\//, "");
 }
 
-export function WorkspaceBaseBranchPicker({
-  serverId,
-  workspaceId,
-  cwd,
-  baseRef,
-  isWorktree,
-}: Props) {
+export function WorkspaceBaseBranchPicker({ serverId, workspaceId, cwd, baseRef }: Props) {
   const { t } = useTranslation();
   const client = useHostRuntimeClient(serverId);
   const connected = useHostRuntimeIsConnected(serverId);
@@ -135,7 +128,7 @@ export function WorkspaceBaseBranchPicker({
     [t, isPending, error, isError, handleRetry],
   );
 
-  if (!supported || !isWorktree || !workspaceId) return <Text style={styles.text}>{label}</Text>;
+  if (!supported || !workspaceId) return <Text style={styles.text}>{label}</Text>;
 
   return (
     <View ref={anchorRef} collapsable={false} style={styles.anchor}>
@@ -172,7 +165,9 @@ export function WorkspaceBaseBranchPicker({
 }
 
 const styles = StyleSheet.create((theme) => ({
-  anchor: { flexShrink: 1, minWidth: 0 },
+  // The branch name truncates first so a short base like "main" stays readable; the cap lets
+  // a long base still truncate instead of overflowing the header.
+  anchor: { flexShrink: 0, minWidth: 0, maxWidth: "40%" },
   footer: { padding: theme.spacing[3], gap: theme.spacing[2] },
   text: { color: theme.colors.foregroundMuted, fontSize: theme.fontSize.sm },
   error: { color: theme.colors.destructive, fontSize: theme.fontSize.sm },