feat: add Cmd+B sidebar toggle and horizontal scroll for diff

- Add global Cmd+B (Ctrl+B on non-Mac) keyboard shortcut to toggle
  sidebar on web
- Re-enable horizontal scrolling for git diff pane with
  nestedScrollEnabled for gesture compatibility

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Mohamed Boudra
2026-01-06 16:28:01 +07:00
parent ed25db4e22
commit 351735a71b
2 changed files with 38 additions and 9 deletions

View File

@@ -11,7 +11,8 @@ import { DaemonRegistryProvider, useDaemonRegistry } from "@/contexts/daemon-reg
import { DaemonConnectionsProvider } from "@/contexts/daemon-connections-context";
import { MultiDaemonSessionHost } from "@/components/multi-daemon-session-host";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { useState, type ReactNode, useMemo } from "react";
import { useState, useEffect, type ReactNode, useMemo } from "react";
import { Platform } from "react-native";
import { SlidingSidebar } from "@/components/sliding-sidebar";
import { useSidebarStore } from "@/stores/sidebar-store";
import { runOnJS, interpolate, Extrapolation } from "react-native-reanimated";
@@ -46,7 +47,20 @@ interface AppContainerProps {
function AppContainer({ children, selectedAgentId }: AppContainerProps) {
const { theme } = useUnistyles();
const { isOpen, open } = useSidebarStore();
const { isOpen, open, toggle } = useSidebarStore();
// Cmd+B to toggle sidebar (web only)
useEffect(() => {
if (Platform.OS !== "web") return;
function handleKeyDown(event: KeyboardEvent) {
if ((event.metaKey || event.ctrlKey) && event.key === "b") {
event.preventDefault();
toggle();
}
}
window.addEventListener("keydown", handleKeyDown);
return () => window.removeEventListener("keydown", handleKeyDown);
}, [toggle]);
const {
translateX,
backdropOpacity,

View File

@@ -150,13 +150,21 @@ function DiffFileSection({ file, defaultExpanded = true }: DiffFileSectionProps)
</View>
</Pressable>
{isExpanded && (
<View style={styles.diffContent}>
{file.hunks.map((hunk, hunkIndex) =>
hunk.lines.map((line, lineIndex) => (
<DiffLineView key={`${hunkIndex}-${lineIndex}`} line={line} />
))
)}
</View>
<ScrollView
horizontal
nestedScrollEnabled
showsHorizontalScrollIndicator
style={styles.diffContent}
contentContainerStyle={styles.diffContentInner}
>
<View style={styles.linesContainer}>
{file.hunks.map((hunk, hunkIndex) =>
hunk.lines.map((line, lineIndex) => (
<DiffLineView key={`${hunkIndex}-${lineIndex}`} line={line} />
))
)}
</View>
</ScrollView>
)}
</View>
);
@@ -340,6 +348,13 @@ const styles = StyleSheet.create((theme) => ({
borderTopColor: theme.colors.border,
backgroundColor: "#0d1117", // GitHub dark background
},
diffContentInner: {
flexDirection: "column",
},
linesContainer: {
alignSelf: "flex-start",
minWidth: "100%",
},
diffLineContainer: {
paddingHorizontal: theme.spacing[3],
paddingVertical: theme.spacing[1],