authorgravatar for paul.trinko95@gmail.comPavlo Trinko <paul.trinko95@gmail.com> 2026-08-14 10:29:09+02:00
committergravatar for noreply@github.comGitHub <noreply@github.com> 2026-08-14 08:29:09+00:00
log6ae44b418a24dc021cf042cbb1e60ebeb47e160f
tree7a67bc947abca4ef3af6becd996fb4b29c036489
parent4a2f8b04bbce916be166fec96f33a7e1f0df4a9f
signature Signed by PGP key B5690EEEBB952194

refactor(mobile): name the iOS nav bar height fallback (#6589)

Co-authored-by: Claude Fable 5 <noreply@anthropic.com> Co-authored-by: Julius Marminge <julius0216@outlook.com>

5 files changed, 18 insertions(+), 7 deletions(-)

apps/mobile/src/features/files/FileTreeBrowser.tsx+2-1
......@@ -8,6 +8,7 @@ import { AppText as Text } from "../../components/AppText";
88import { PierreEntryIcon } from "../../components/PierreEntryIcon";
99import { cn } from "../../lib/cn";
1010import { useThemeColor } from "../../lib/useThemeColor";
11import { IOS_NAV_BAR_HEIGHT } from "../../lib/layoutMetrics";
1112import { NATIVE_LIQUID_GLASS_SUPPORTED } from "../../native/native-glass";
1213import {
1314 buildFileTree,
......@@ -123,7 +124,7 @@ export function FileTreeBrowser(props: {
123124 const insets = useSafeAreaInsets();
124125 // Native transparent-header height ≈ safe-area top + nav bar (~44). Matches the
125126 // observed adjustedContentInset bottom (~102) seen in the native trace.
126 const headerInset = NATIVE_LIQUID_GLASS_SUPPORTED ? insets.top + 44 : 0;
127 const headerInset = NATIVE_LIQUID_GLASS_SUPPORTED ? insets.top + IOS_NAV_BAR_HEIGHT : 0;
127128 const iconColor = String(useThemeColor("--color-icon-muted"));
128129 const { onPreviewFile, onSelectFile, selectedPath: controlledSelectedPath } = props;
129130 const controlledSelectedPathRef = useRef(controlledSelectedPath);
apps/mobile/src/features/review/ReviewSheet.tsx+5-2
......@@ -39,6 +39,7 @@ import { environmentCatalog } from "../../connection/catalog";
3939import { useEnvironmentPresentation } from "../../state/presentation";
4040import { useAtomCommand } from "../../state/use-atom-command";
4141import { useThemeColor } from "../../lib/useThemeColor";
42import { IOS_NAV_BAR_HEIGHT } from "../../lib/layoutMetrics";
4243import { useThreadDraftForThread } from "../../state/use-thread-composer-state";
4344import { EnvironmentConnectionNotice } from "../connection/EnvironmentConnectionNotice";
4445import {
......@@ -277,9 +278,11 @@ function ReviewFileNavigator({
277278 // The nested native header is translucent; start the list below it so
278279 // the scroll-edge effect can sample the content (same treatment as
279280 // FileTreeBrowser in the Files pane).
280 paddingTop: Platform.OS === "ios" ? insets.top + 44 + 8 : 8,
281 paddingTop: Platform.OS === "ios" ? insets.top + IOS_NAV_BAR_HEIGHT + 8 : 8,
281282 }}
282 scrollIndicatorInsets={Platform.OS === "ios" ? { top: insets.top + 44 } : undefined}
283 scrollIndicatorInsets={
284 Platform.OS === "ios" ? { top: insets.top + IOS_NAV_BAR_HEIGHT } : undefined
285 }
283286 renderItem={renderFile}
284287 />
285288 );
apps/mobile/src/features/threads/ThreadDetailScreen.tsx+2-1
......@@ -57,6 +57,7 @@ import type { ComposerEditorHandle } from "../../components/ComposerEditor";
5757import type { StatusTone } from "../../components/StatusPill";
5858import type { DraftComposerImageAttachment } from "../../lib/composerImages";
5959import { CHAT_CONTENT_MAX_WIDTH, type LayoutVariant } from "../../lib/layout";
60import { IOS_NAV_BAR_HEIGHT } from "../../lib/layoutMetrics";
6061import { scopedThreadKey } from "../../lib/scopedEntities";
6162import type {
6263 PendingApproval,
......@@ -249,7 +250,7 @@ export const ThreadDetailScreen = memo(function ThreadDetailScreen(props: Thread
249250 }
250251 }, []);
251252 const windowHeight = useWindowDimensions().height;
252 const navigationHeaderHeight = useContext(HeaderHeightContext) || insets.top + 44;
253 const navigationHeaderHeight = useContext(HeaderHeightContext) || insets.top + IOS_NAV_BAR_HEIGHT;
253254 const agentLabel = `${props.selectedThread.modelSelection.instanceId} agent`;
254255 const selectedThreadKey = scopedThreadKey(props.environmentId, props.selectedThread.id);
255256 const composerEditorRef = useRef<ComposerEditorHandle>(null);
apps/mobile/src/features/threads/ThreadFeed.tsx+3-2
......@@ -47,6 +47,7 @@ import ImageViewing from "react-native-image-viewing";
4747import { useSafeAreaInsets } from "react-native-safe-area-context";
4848import Animated, { FadeIn, FadeInUp, type SharedValue } from "react-native-reanimated";
4949import { useThemeColor } from "../../lib/useThemeColor";
50import { IOS_NAV_BAR_HEIGHT } from "../../lib/layoutMetrics";
5051import { useFontFamily } from "../../lib/useFontFamily";
5152import { scopedThreadKey } from "../../lib/scopedEntities";
5253import { copyTextWithHaptic } from "../../lib/copyTextWithHaptic";
......@@ -1396,7 +1397,7 @@ export const ThreadFeed = memo(function ThreadFeed(props: ThreadFeedProps) {
13961397 const userBubbleMaxWidth = contentWidth * 0.85;
13971398 const reviewCommentBubbleWidth = Math.min(Math.max(280, contentWidth * 0.85), contentWidth);
13981399 const insets = useSafeAreaInsets();
1399 const topContentInset = props.contentTopInset ?? insets.top + 44;
1400 const topContentInset = props.contentTopInset ?? insets.top + IOS_NAV_BAR_HEIGHT;
14001401 const bottomContentInset = props.contentBottomInset ?? 18;
14011402 const usesNativeAutomaticInsets =
14021403 props.usesAutomaticContentInsets === true && Platform.OS === "ios";
......@@ -1409,7 +1410,7 @@ export const ThreadFeed = memo(function ThreadFeed(props: ThreadFeedProps) {
14091410 // header-providing screen) and fall back to the standard iOS bar height.
14101411 const navigationHeaderHeight = useContext(HeaderHeightContext);
14111412 const anchorTopInset = usesNativeAutomaticInsets
1412 ? navigationHeaderHeight || insets.top + 44
1413 ? navigationHeaderHeight || insets.top + IOS_NAV_BAR_HEIGHT
14131414 : topContentInset;
14141415
14151416 const iconSubtleColor = useThemeColor("--color-icon-subtle");
apps/mobile/src/lib/layoutMetrics.ts+6-1
......@@ -5,7 +5,12 @@ export const HOME_HORIZONTAL_INSET = 20;
55export const IPAD_HOME_TITLE_OFFSET = 10;
66
77/**
8 * Height of the app's own header chrome below the safe-area inset, on every
8 * Height of the native iOS navigation bar below the safe-area inset, used as
9 * a fallback when the measured HeaderHeightContext is unavailable.
10 */
11export const IOS_NAV_BAR_HEIGHT = 44;
12
13/* Height of the app's own header chrome below the safe-area inset, on every
914 * platform (matches the `min-h-12` AndroidScreenHeader). Distinct from the
1015 * 44pt native iOS navigation bar.
1116 */