diff --git a/apps/mobile/src/features/files/thread-file-navigator-pane.tsx b/apps/mobile/src/features/files/thread-file-navigator-pane.tsx index 33b99dd8e8ce..50c92ed1f590 100644 --- a/apps/mobile/src/features/files/thread-file-navigator-pane.tsx +++ b/apps/mobile/src/features/files/thread-file-navigator-pane.tsx @@ -18,6 +18,7 @@ import { useEnvironmentQuery } from "../../state/query"; import { useAppearancePreferences } from "../settings/appearance/AppearancePreferencesProvider"; import { FileTreeBrowser } from "./FileTreeBrowser"; import { preloadWorkspaceFileContents } from "./preload-workspace-file"; +import { useAdaptiveWorkspaceLayout } from "../layout/AdaptiveWorkspaceLayout"; export function ThreadFileNavigatorPane(props: { readonly cwd: string; @@ -28,6 +29,7 @@ export function ThreadFileNavigatorPane(props: { readonly onSelectFile: (path: string) => void; }) { const [searchQuery, setSearchQuery] = useState(""); + const { toggleAuxiliaryPane } = useAdaptiveWorkspaceLayout(); const { themeAppearance: highlightTheme } = useAppearancePreferences(); const theme = useUniwindTheme(); const foregroundColor = theme["--color-foreground"]; @@ -64,8 +66,18 @@ export function ThreadFileNavigatorPane(props: { type: "button" as const, width: 44, }, + { + accessibilityLabel: "Close files", + icon: { name: "xmark", type: "sfSymbol" as const }, + identifier: "thread-file-navigator-close", + onPress: toggleAuxiliaryPane, + sharesBackground: false, + tintColor: foregroundColor, + type: "button" as const, + width: 44, + }, ] as ComponentProps["headerRightBarButtonItems"], - [entriesQuery.refresh, foregroundColor], + [entriesQuery.refresh, foregroundColor, toggleAuxiliaryPane], ); const fileTree = ( @@ -159,6 +171,15 @@ export function ThreadFileNavigatorPane(props: { type="monochrome" /> + + + { + if (navigation.canGoBack()) { + navigation.goBack(); + return; + } + navigation.dispatch( + StackActions.replace("Thread", { + environmentId: params.environmentId, + threadId: params.threadId, + }), + ); + }, [navigation, params.environmentId, params.threadId]); + const navigateAwayAfterExit = useCallback(() => { // With other shells still live, fall through to the previous one instead // of dropping the user back on the thread. @@ -1143,7 +1156,7 @@ export function ThreadTerminalRouteScreen(props: ThreadTerminalRouteScreenProps) navigation.goBack() : undefined} + onBack={handleCloseTerminal} trailing={ <> {layout.usesSplitView ? ( @@ -1179,6 +1192,12 @@ export function ThreadTerminalRouteScreen(props: ThreadTerminalRouteScreenProps) {layout.usesSplitView ? ( +