Skip to content

Commit c274a25

Browse files
juliusmarmingeclaude
juliusmarminge
and
claude
authored
fix(mobile): the Git sheet uses the standard list rows (#21785)
Co-authored-by: Claude Opus 5.5 <noreply@anthropic.com>
1 parent 34c5a6d commit c274a25

2 files changed

Lines changed: 56 additions & 124 deletions

File tree

‎apps/mobile/src/features/threads/git/GitOverviewSheet.tsx‎

Lines changed: 56 additions & 69 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,8 @@ import {
2626
AndroidSheetHeader,
2727
} from "../../../components/ui/AndroidScreenHeader";
2828
import { AndroidAnchoredMenu } from "../../../components/ui/AndroidAnchoredMenu";
29+
import { ListRow } from "../../../components/ui/ListRow";
30+
import { ListSection } from "../../../components/ui/ListSection";
2931
import { ScreenContent } from "../../../components/ui/ScreenContent";
3032
import { useAdaptiveWorkspaceLayout } from "../../layout/AdaptiveWorkspaceLayout";
3133
import { AppText as Text } from "../../../components/ui/AppText";
@@ -40,7 +42,7 @@ import { useSelectedThreadGitState } from "../../../state/use-selected-thread-gi
4042
import { useSelectedThreadWorktree } from "../../../state/use-selected-thread-worktree";
4143
import { vcsEnvironment } from "../../../state/vcs";
4244
import { resolveGitOverviewReviewNavigationAction } from "./git-overview-navigation";
43-
import { MetaCard, SheetListRow, menuItemIconName, statusSummary } from "./gitSheetComponents";
45+
import { menuItemIconName, statusSummary } from "./gitSheetComponents";
4446
import {
4547
LinkedPullRequestRow,
4648
linkedPullRequestKey,
@@ -245,46 +247,34 @@ function GitOverviewSheetContent(props: GitOverviewSheetProps) {
245247
) : undefined
246248
}
247249
>
248-
<View
249-
className={`overflow-hidden bg-card android:rounded-[20px] ios:border ios:border-border ${
250-
isInspector ? "ios:rounded-2xl ios:px-3 ios:py-1" : "ios:rounded-[22px] ios:px-4 ios:py-1"
251-
}`}
252-
>
253-
{sheetMenuItems.map(({ item, disabledReason }, index) => (
254-
<View key={`${item.id}-${item.label}`}>
255-
{index > 0 && Platform.OS !== "android" ? (
256-
<View className="ml-12 h-px bg-border" />
257-
) : null}
258-
<SheetListRow
259-
icon={menuItemIconName(item.icon)}
260-
title={item.label}
261-
subtitle={disabledReason ?? rowStatusDetail(item)}
262-
disabled={item.disabled}
263-
onPress={() => void onPressMenuItem(item)}
264-
/>
265-
</View>
250+
<ListSection>
251+
{sheetMenuItems.map(({ item, disabledReason }) => (
252+
<ListRow
253+
key={`${item.id}-${item.label}`}
254+
icon={menuItemIconName(item.icon)}
255+
label={item.label}
256+
description={disabledReason ?? rowStatusDetail(item)}
257+
disabled={item.disabled}
258+
onPress={() => void onPressMenuItem(item)}
259+
/>
266260
))}
267261
{behindCount > 0 ? (
268-
<>
269-
{Platform.OS !== "android" ? <View className="ml-12 h-px bg-border" /> : null}
270-
<SheetListRow
271-
icon="arrow.down.circle"
272-
title="Pull latest"
273-
subtitle={
274-
canWriteSourceControl
275-
? `${behindCount} commit${behindCount === 1 ? "" : "s"} behind upstream`
276-
: "This connection cannot change source control."
277-
}
278-
disabled={!canWriteSourceControl || busy || !isRepo}
279-
onPress={() => void gitActions.onPullSelectedThreadBranch()}
280-
/>
281-
</>
262+
<ListRow
263+
icon="arrow.down.circle"
264+
label="Pull latest"
265+
description={
266+
canWriteSourceControl
267+
? `${behindCount} commit${behindCount === 1 ? "" : "s"} behind upstream`
268+
: "This connection cannot change source control."
269+
}
270+
disabled={!canWriteSourceControl || busy || !isRepo}
271+
onPress={() => void gitActions.onPullSelectedThreadBranch()}
272+
/>
282273
) : null}
283-
{Platform.OS !== "android" ? <View className="ml-12 h-px bg-border" /> : null}
284-
<SheetListRow
274+
<ListRow
285275
icon="text.bubble"
286-
title="Review changes"
287-
subtitle="Inspect changes, uncommitted edits, and turn diffs"
276+
label="Review changes"
277+
description="Inspect changes, uncommitted edits, and turn diffs"
288278
disabled={busy || !isRepo}
289279
onPress={() => {
290280
const params = { environmentId, threadId };
@@ -295,11 +285,10 @@ function GitOverviewSheetContent(props: GitOverviewSheetProps) {
295285
);
296286
}}
297287
/>
298-
{Platform.OS !== "android" ? <View className="ml-12 h-px bg-border" /> : null}
299-
<SheetListRow
288+
<ListRow
300289
icon="point.topleft.down.curvedto.point.bottomright.up"
301-
title="Branches & worktrees"
302-
subtitle={
290+
label="Branches & worktrees"
291+
description={
303292
canChangeThreadBranch
304293
? "Switch branch, create branch, or move to a worktree"
305294
: "View branches and worktrees"
@@ -313,39 +302,37 @@ function GitOverviewSheetContent(props: GitOverviewSheetProps) {
313302
}
314303
/>
315304
{linkedPrActions.canLink ? (
316-
<>
317-
{Platform.OS !== "android" ? <View className="ml-12 h-px bg-border" /> : null}
318-
<SheetListRow
319-
icon="link"
320-
title="Link pull request"
321-
subtitle="Attach a pull request by URL or number"
322-
onPress={linkedPrActions.promptLink}
323-
/>
324-
</>
305+
<ListRow
306+
icon="link"
307+
label="Link pull request"
308+
description="Attach a pull request by URL or number"
309+
onPress={linkedPrActions.promptLink}
310+
/>
325311
) : null}
326-
</View>
312+
</ListSection>
327313

328314
{linkedPrLines.length > 0 ? (
329-
<View className="gap-2">
330-
<Text className="px-1 text-xs font-t3-bold text-foreground-muted">
331-
Linked pull requests
332-
</Text>
333-
<View className="overflow-hidden bg-card android:rounded-[20px] ios:rounded-2xl ios:border ios:border-border">
334-
{linkedPrLines.map((line, index) => (
335-
<LinkedPullRequestRow
336-
key={linkedPullRequestKey(line)}
337-
line={line}
338-
separator={index < linkedPrLines.length - 1}
339-
surfaceClassName="text-card"
340-
openPullRequest={openPullRequest}
341-
actions={linkedPrActions}
342-
/>
343-
))}
344-
</View>
345-
</View>
315+
<ListSection title="Linked pull requests">
316+
{linkedPrLines.map((line, index) => (
317+
<LinkedPullRequestRow
318+
key={linkedPullRequestKey(line)}
319+
line={line}
320+
separator={index < linkedPrLines.length - 1}
321+
surfaceClassName="text-grouped-card"
322+
openPullRequest={openPullRequest}
323+
actions={linkedPrActions}
324+
/>
325+
))}
326+
</ListSection>
346327
) : null}
347328

348-
{currentWorktreePath ? <MetaCard label="Worktree" value={currentWorktreePath} /> : null}
329+
{currentWorktreePath ? (
330+
<ListSection title="Worktree">
331+
<Text selectable textRole="footnote" className="p-4 text-foreground-muted">
332+
{currentWorktreePath}
333+
</Text>
334+
</ListSection>
335+
) : null}
349336
</ScrollView>
350337
);
351338

‎apps/mobile/src/features/threads/git/gitSheetComponents.tsx‎

Lines changed: 0 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -69,61 +69,6 @@ export function SheetActionButton(props: {
6969
);
7070
}
7171

72-
export function MetaCard(props: { readonly label: string; readonly value: string }) {
73-
return (
74-
<View className="bg-card px-4 py-3 android:rounded-[20px] ios:rounded-[18px] ios:border ios:border-border">
75-
<Text className="text-foreground-muted text-2xs font-t3-bold tracking-[0.9px] uppercase">
76-
{props.label}
77-
</Text>
78-
<Text selectable className="text-foreground text-sm font-medium" numberOfLines={1}>
79-
{props.value}
80-
</Text>
81-
</View>
82-
);
83-
}
84-
85-
export function SheetListRow(props: {
86-
readonly icon: ComponentProps<typeof SymbolView>["name"];
87-
readonly iconTintClassName?: string | undefined;
88-
readonly title: string;
89-
readonly subtitle?: string | null;
90-
readonly disabled?: boolean;
91-
readonly onPress: () => void;
92-
}) {
93-
return (
94-
<Pressable
95-
className="flex-row items-center py-3 disabled:opacity-[0.45] android:min-h-16 android:gap-4 android:px-4 android:active:bg-subtle ios:gap-3 ios:px-1"
96-
disabled={props.disabled}
97-
onPress={props.onPress}
98-
>
99-
<View className="items-center justify-center android:size-6 ios:bg-subtle ios:h-9 ios:w-9 ios:rounded-full">
100-
<SymbolView
101-
name={props.icon}
102-
size={Platform.OS === "android" ? 24 : 16}
103-
tintColorClassName={props.iconTintClassName ?? "accent-icon"}
104-
type="monochrome"
105-
/>
106-
</View>
107-
<View className="flex-1 gap-0.5">
108-
<Text className="text-foreground text-base android:font-t3-medium ios:font-t3-bold">
109-
{props.title}
110-
</Text>
111-
{props.subtitle ? (
112-
<Text className="text-foreground-muted text-xs leading-snug">{props.subtitle}</Text>
113-
) : null}
114-
</View>
115-
{Platform.OS !== "android" ? (
116-
<SymbolView
117-
name="chevron.right"
118-
size={13}
119-
tintColorClassName="accent-icon-subtle"
120-
type="monochrome"
121-
/>
122-
) : null}
123-
</Pressable>
124-
);
125-
}
126-
12772
export function menuItemIconName(
12873
icon: "commit" | "push" | "pr",
12974
): ComponentProps<typeof SymbolView>["name"] {

0 commit comments

Comments
 (0)