fix(app): browser pane keyboard tweaks

- Refresh icon: use single-arrow RotateCw instead of two-arrow RefreshCw
- URL bar selects all text on focus
- Cmd+R now reloads the active browser pane (tracked via IPC) when
  the URL bar has focus, instead of reloading the Electron window
- Forward Paseo shortcut keys (b, e, w, t, k, /, \, comma, digits,
  enter, arrows) from the embedded webview to the main window so
  sidebar/tab/etc. shortcuts still fire when focus is inside the
  loaded page
This commit is contained in:
Mohamed Boudra
2026-05-02 19:20:33 +07:00
parent e925aa5438
commit 1fcca3b32c
7 changed files with 141 additions and 7 deletions
@@ -8,7 +8,7 @@ import {
createElement,
} from "react";
import { Pressable, Text, TextInput, View } from "react-native";
import { ArrowLeft, ArrowRight, MousePointer2, RefreshCw } from "lucide-react-native";
import { ArrowLeft, ArrowRight, MousePointer2, RotateCw } from "lucide-react-native";
import { StyleSheet, useUnistyles } from "react-native-unistyles";
import {
buildWorkspaceAttachmentScopeKey,
@@ -336,13 +336,27 @@ export function BrowserPane({
const updateBrowserRef = useRef(updateBrowser);
updateBrowserRef.current = updateBrowser;
const focusUrlBar = useCallback(() => {
urlInputRef.current?.focus();
const selectUrlBar = useCallback(() => {
window.setTimeout(() => {
getTextInputNativeElement(urlInputRef.current)?.select();
}, 0);
}, []);
const markActivePane = useCallback(() => {
if (!isElectronRuntime()) return;
void getDesktopHost()?.browser?.setActivePane?.(browserIdRef.current);
}, []);
const handleUrlBarFocus = useCallback(() => {
markActivePane();
selectUrlBar();
}, [markActivePane, selectUrlBar]);
const focusUrlBar = useCallback(() => {
urlInputRef.current?.focus();
selectUrlBar();
}, [selectUrlBar]);
const syncNavigationState = useCallback((input?: { syncUrl?: boolean }) => {
const webview = webviewRef.current;
if (!webview || !domReadyRef.current) {
@@ -466,6 +480,7 @@ export function BrowserPane({
};
const handleWebviewFocus = () => {
onFocusPane?.();
markActivePane();
};
webview.addEventListener("did-start-loading", handleStartLoading);
@@ -937,7 +952,7 @@ export function BrowserPane({
onPress={handleRefresh}
style={baseIconButtonStyle}
>
<RefreshCw size={16} color={theme.colors.foregroundMuted} />
<RotateCw size={16} color={theme.colors.foregroundMuted} />
</Pressable>
</View>
<View style={styles.urlBarWrap}>
@@ -946,6 +961,7 @@ export function BrowserPane({
autoCapitalize="none"
autoCorrect={false}
onChangeText={setDraftUrl}
onFocus={handleUrlBarFocus}
onSubmitEditing={handleNavigateDraftUrl}
placeholder="Enter URL"
placeholderTextColor={theme.colors.foregroundMuted}