diff --git a/app/projects/[id]/index.tsx b/app/projects/[id]/index.tsx index f7e5485..fbf2fd0 100644 --- a/app/projects/[id]/index.tsx +++ b/app/projects/[id]/index.tsx @@ -63,6 +63,7 @@ export default function WorkspaceScreen() { const pagerRef = useRef(null); const stripRef = useRef(null); const lastSyncedIndexRef = useRef(activeIndex); + const [pagerScrollEnabled, setPagerScrollEnabled] = useState(true); useEffect(() => { if (activeIndex < 0) return; @@ -143,6 +144,7 @@ export default function WorkspaceScreen() { style={styles.body} initialPage={initialPage} offscreenPageLimit={1} + scrollEnabled={pagerScrollEnabled} onPageScroll={(e) => { const { position, offset } = e.nativeEvent; stripRef.current?.scrollToIndex(position + offset, false); @@ -154,7 +156,7 @@ export default function WorkspaceScreen() { {entry.tab.kind === 'terminal' && entry.tab.paneID ? ( isActive ? ( - + ) : ( ) diff --git a/src/components/terminal/Joystick.tsx b/src/components/terminal/Joystick.tsx index e49b793..20d5ad6 100644 --- a/src/components/terminal/Joystick.tsx +++ b/src/components/terminal/Joystick.tsx @@ -1,3 +1,4 @@ +import * as Haptics from 'expo-haptics'; import { useEffect, useRef, useState } from 'react'; import { PanResponder, StyleSheet, View } from 'react-native'; @@ -11,8 +12,8 @@ type Props = { }; const KNOB_RATIO = 0.4; -const DEAD_ZONE_RATIO = 0.2; -const REPEAT_MS = 80; +const DEAD_ZONE_RATIO = 0.45; +const REPEAT_MS = 160; export function Joystick({ size = 56, onDirection }: Props) { const tokens = useTokens(); @@ -39,8 +40,12 @@ export function Joystick({ size = 56, onDirection }: Props) { const startRepeat = (dir: JoystickDirection) => { if (intervalRef.current) clearInterval(intervalRef.current); + Haptics.selectionAsync(); onDirection(dir); - intervalRef.current = setInterval(() => onDirection(dir), REPEAT_MS); + intervalRef.current = setInterval(() => { + Haptics.selectionAsync(); + onDirection(dir); + }, REPEAT_MS); directionRef.current = dir; }; diff --git a/src/components/terminal/KeyBar.tsx b/src/components/terminal/KeyBar.tsx index feea087..7914a43 100644 --- a/src/components/terminal/KeyBar.tsx +++ b/src/components/terminal/KeyBar.tsx @@ -46,7 +46,13 @@ const ARROW_DOWN = new Uint8Array([0x1b, 0x5b, 0x42]); const ARROW_RIGHT = new Uint8Array([0x1b, 0x5b, 0x43]); const ARROW_LEFT = new Uint8Array([0x1b, 0x5b, 0x44]); -export function KeyBar({ onBytes }: { onBytes: (base64: string) => void }) { +export function KeyBar({ + onBytes, + onPagerScrollEnabled, +}: { + onBytes: (base64: string) => void; + onPagerScrollEnabled?: (enabled: boolean) => void; +}) { const tokens = useTokens(); const insets = useSafeAreaInsets(); const { progress } = useReanimatedKeyboardAnimation(); @@ -85,7 +91,11 @@ export function KeyBar({ onBytes }: { onBytes: (base64: string) => void }) { }; return ( - + onPagerScrollEnabled?.(false)} + onTouchEnd={() => onPagerScrollEnabled?.(true)} + onTouchCancel={() => onPagerScrollEnabled?.(true)}> void; }; -export function TerminalView({ paneId }: Props) { +export function TerminalView({ paneId, onPagerScrollEnabled }: Props) { const tokens = useTokens(); const webRef = useRef(null); const inputRef = useRef(null); @@ -254,7 +255,9 @@ export function TerminalView({ paneId }: Props) { ) : null} - {sessionForUs?.kind === 'streaming' ? : null} + {sessionForUs?.kind === 'streaming' ? ( + + ) : null} );