| author |  Julius Marminge <julius0216@outlook.com> 2026-09-10 13:31:45-07:00 |
| committer |  GitHub <noreply@github.com> 2026-09-10 13:31:45-07:00 |
| log | 47dbb06c3b171c40ebdfbd5b38cd954127949bc0 |
| tree | 4ccc929d397ba844f70f6dd511eacb345cff9177 |
| parent | 32b690934039ea31c8bf8079aea8e9c088e97d9f |
| signature | Signed by PGP key B5690EEEBB952194 |
fix(mobile): add close controls to tablet files and terminal (#11115)
2 files changed, 42 insertions(+), 2 deletions(-)
apps
mobile
src
features
terminal
apps/mobile/src/features/files/thread-file-navigator-pane.tsx+22-1
| ... | ... | @@ -18,6 +18,7 @@ import { useEnvironmentQuery } from "../../state/query"; |
| 18 | 18 | import { useAppearancePreferences } from "../settings/appearance/AppearancePreferencesProvider"; |
| 19 | 19 | import { FileTreeBrowser } from "./FileTreeBrowser"; |
| 20 | 20 | import { preloadWorkspaceFileContents } from "./preload-workspace-file"; |
| 21 | import { useAdaptiveWorkspaceLayout } from "../layout/AdaptiveWorkspaceLayout"; | |
| 21 | 22 | |
| 22 | 23 | export function ThreadFileNavigatorPane(props: { |
| 23 | 24 | readonly cwd: string; |
| ... | ... | @@ -28,6 +29,7 @@ export function ThreadFileNavigatorPane(props: { |
| 28 | 29 | readonly onSelectFile: (path: string) => void; |
| 29 | 30 | }) { |
| 30 | 31 | const [searchQuery, setSearchQuery] = useState(""); |
| 32 | const { toggleAuxiliaryPane } = useAdaptiveWorkspaceLayout(); | |
| 31 | 33 | const { themeAppearance: highlightTheme } = useAppearancePreferences(); |
| 32 | 34 | const theme = useUniwindTheme(); |
| 33 | 35 | const foregroundColor = theme["--color-foreground"]; |
| ... | ... | @@ -64,8 +66,18 @@ export function ThreadFileNavigatorPane(props: { |
| 64 | 66 | type: "button" as const, |
| 65 | 67 | width: 44, |
| 66 | 68 | }, |
| 69 | { | |
| 70 | accessibilityLabel: "Close files", | |
| 71 | icon: { name: "xmark", type: "sfSymbol" as const }, | |
| 72 | identifier: "thread-file-navigator-close", | |
| 73 | onPress: toggleAuxiliaryPane, | |
| 74 | sharesBackground: false, | |
| 75 | tintColor: foregroundColor, | |
| 76 | type: "button" as const, | |
| 77 | width: 44, | |
| 78 | }, | |
| 67 | 79 | ] as ComponentProps<typeof ScreenStackHeaderConfig>["headerRightBarButtonItems"], |
| 68 | [entriesQuery.refresh, foregroundColor], | |
| 80 | [entriesQuery.refresh, foregroundColor, toggleAuxiliaryPane], | |
| 69 | 81 | ); |
| 70 | 82 | |
| 71 | 83 | const fileTree = ( |
| ... | ... | @@ -159,6 +171,15 @@ export function ThreadFileNavigatorPane(props: { |
| 159 | 171 | type="monochrome" |
| 160 | 172 | /> |
| 161 | 173 | </Pressable> |
| 174 | <Pressable | |
| 175 | accessibilityRole="button" | |
| 176 | accessibilityLabel="Close files" | |
| 177 | hitSlop={8} | |
| 178 | className="h-8 w-8 items-center justify-center rounded-full active:bg-subtle" | |
| 179 | onPress={toggleAuxiliaryPane} | |
| 180 | > | |
| 181 | <SymbolView name="xmark" size={14} tintColorClassName="accent-icon-muted" /> | |
| 182 | </Pressable> | |
| 162 | 183 | </View> |
| 163 | 184 | <View className="flex-row items-center gap-2 border-t border-border px-3 py-2"> |
| 164 | 185 | <SymbolView |
apps/mobile/src/features/terminal/ThreadTerminalRouteScreen.tsx+20-1
| ... | ... | @@ -850,6 +850,19 @@ export function ThreadTerminalRouteScreen(props: ThreadTerminalRouteScreenProps) |
| 850 | 850 | [navigation, selectedThread, terminalId], |
| 851 | 851 | ); |
| 852 | 852 | |
| 853 | const handleCloseTerminal = useCallback(() => { | |
| 854 | if (navigation.canGoBack()) { | |
| 855 | navigation.goBack(); | |
| 856 | return; | |
| 857 | } | |
| 858 | navigation.dispatch( | |
| 859 | StackActions.replace("Thread", { | |
| 860 | environmentId: params.environmentId, | |
| 861 | threadId: params.threadId, | |
| 862 | }), | |
| 863 | ); | |
| 864 | }, [navigation, params.environmentId, params.threadId]); | |
| 865 | ||
| 853 | 866 | const navigateAwayAfterExit = useCallback(() => { |
| 854 | 867 | // With other shells still live, fall through to the previous one instead |
| 855 | 868 | // of dropping the user back on the thread. |
| ... | ... | @@ -1143,7 +1156,7 @@ export function ThreadTerminalRouteScreen(props: ThreadTerminalRouteScreenProps) |
| 1143 | 1156 | <AndroidScreenHeader |
| 1144 | 1157 | title="Terminal" |
| 1145 | 1158 | subtitle={headerSubtitle} |
| 1146 | onBack={navigation.canGoBack() ? () => navigation.goBack() : undefined} | |
| 1159 | onBack={handleCloseTerminal} | |
| 1147 | 1160 | trailing={ |
| 1148 | 1161 | <> |
| 1149 | 1162 | {layout.usesSplitView ? ( |
| ... | ... | @@ -1179,6 +1192,12 @@ export function ThreadTerminalRouteScreen(props: ThreadTerminalRouteScreenProps) |
| 1179 | 1192 | |
| 1180 | 1193 | {layout.usesSplitView ? ( |
| 1181 | 1194 | <NativeHeaderToolbar placement="left"> |
| 1195 | <NativeHeaderToolbar.Button | |
| 1196 | accessibilityLabel="Close terminal" | |
| 1197 | icon="xmark" | |
| 1198 | onPress={handleCloseTerminal} | |
| 1199 | separateBackground | |
| 1200 | /> | |
| 1182 | 1201 | <NativeHeaderToolbar.Button |
| 1183 | 1202 | accessibilityLabel={panes.primarySidebarVisible ? "Maximize terminal" : "Show threads"} |
| 1184 | 1203 | icon={ |