authorgravatar for me@pixp.ccAlex <me@pixp.cc> 2026-07-18 11:14:59+00:00
committergravatar for noreply@github.comGitHub <noreply@github.com> 2026-07-18 13:14:59+02:00
log03e20c875ccd39e4cedba8f6b713195290ec4652
treea707f2ff4c117875eb80815e44232b6fdbca2bb2
parent2318e00270203780b72efbbcffce92e907312027
signature Signed by PGP key B5690EEEBB952194

fix(mobile): restore iOS home screen branding (#4025)

Co-authored-by: Julius Marminge <julius0216@outlook.com>

4 files changed, 70 insertions(+), 3 deletions(-)

apps/mobile/src/Stack.tsx+3-1
...@@ -15,6 +15,7 @@ import { DynamicColorIOS, Platform, Pressable, ScrollView, StyleSheet } from "re...@@ -15,6 +15,7 @@ import { DynamicColorIOS, Platform, Pressable, ScrollView, StyleSheet } from "re
15import { useResolveClassNames } from "uniwind";15import { useResolveClassNames } from "uniwind";
1616
17import { AppText as Text } from "./components/AppText";17import { AppText as Text } from "./components/AppText";
18import { renderCompactBrandTitle } from "./components/CompactBrandTitle";
18import { ArchivedThreadsRouteScreen } from "./features/archive/ArchivedThreadsRouteScreen";19import { ArchivedThreadsRouteScreen } from "./features/archive/ArchivedThreadsRouteScreen";
19import { useAgentNotificationNavigation } from "./features/agent-awareness/notificationNavigation";20import { useAgentNotificationNavigation } from "./features/agent-awareness/notificationNavigation";
20import { ClerkSettingsSheetDetentProvider } from "./features/cloud/ClerkSettingsSheetDetent";21import { ClerkSettingsSheetDetentProvider } from "./features/cloud/ClerkSettingsSheetDetent";
...@@ -377,7 +378,8 @@ export const RootStack = createNativeStackNavigator({...@@ -377,7 +378,8 @@ export const RootStack = createNativeStackNavigator({
377 ...GLASS_HEADER_OPTIONS,378 ...GLASS_HEADER_OPTIONS,
378 contentStyle: { backgroundColor: "transparent" },379 contentStyle: { backgroundColor: "transparent" },
379 headerBackVisible: false,380 headerBackVisible: false,
380 title: "Threads",381 headerTitle: renderCompactBrandTitle,
382 title: "T3 Code",
381 },383 },
382 }),384 }),
383 Thread: createNativeStackScreen({385 Thread: createNativeStackScreen({
apps/mobile/src/components/CompactBrandTitle.tsx created+60
...@@ -0,0 +1,60 @@
1import { View } from "react-native";
2
3import { AppText as Text } from "./AppText";
4import { T3Wordmark } from "./T3Wordmark";
5import { useThemeColor } from "../lib/useThemeColor";
6
7/**
8 * Compact brand lockup sized for native navigation bars.
9 */
10export function CompactBrandTitle() {
11 const iconColor = useThemeColor("--color-icon");
12 const mutedColor = useThemeColor("--color-foreground-muted");
13 const subtleColor = useThemeColor("--color-subtle");
14
15 return (
16 <View
17 aria-level={1}
18 accessibilityLabel="T3 Code"
19 accessible
20 role="heading"
21 style={{ alignItems: "center", flexDirection: "row", gap: 6 }}
22 >
23 <T3Wordmark color={iconColor} height={11} />
24 <Text
25 style={{
26 color: mutedColor,
27 fontFamily: "DMSans-Medium",
28 fontSize: 14,
29 letterSpacing: -0.35,
30 }}
31 >
32 Code
33 </Text>
34 <View
35 style={{
36 backgroundColor: subtleColor,
37 borderRadius: 999,
38 paddingHorizontal: 6,
39 paddingVertical: 2,
40 }}
41 >
42 <Text
43 style={{
44 color: mutedColor,
45 fontFamily: "DMSans-Bold",
46 fontSize: 9,
47 letterSpacing: 0.9,
48 textTransform: "uppercase",
49 }}
50 >
51 Alpha
52 </Text>
53 </View>
54 </View>
55 );
56}
57
58export function renderCompactBrandTitle() {
59 return <CompactBrandTitle />;
60}
apps/mobile/src/features/home/HomeRouteScreen.tsx+4-1
...@@ -4,6 +4,7 @@ import { useNavigation } from "@react-navigation/native";...@@ -4,6 +4,7 @@ import { useNavigation } from "@react-navigation/native";
4import { useMemo, useState } from "react";4import { useMemo, useState } from "react";
55
6import { NativeHeaderToolbar, NativeStackScreenOptions } from "../../native/StackHeader";6import { NativeHeaderToolbar, NativeStackScreenOptions } from "../../native/StackHeader";
7import { renderCompactBrandTitle } from "../../components/CompactBrandTitle";
7import { useProjects, useThreadShells } from "../../state/entities";8import { useProjects, useThreadShells } from "../../state/entities";
8import { usePendingNewTasks } from "../../state/use-pending-new-tasks";9import { usePendingNewTasks } from "../../state/use-pending-new-tasks";
9import { useWorkspaceState } from "../../state/workspace";10import { useWorkspaceState } from "../../state/workspace";
...@@ -86,7 +87,9 @@ export function HomeRouteScreen() {...@@ -86,7 +87,9 @@ export function HomeRouteScreen() {
86 >87 >
87 <>88 <>
88 {/* Restore the compact title in case the split branch blanked it. */}89 {/* Restore the compact title in case the split branch blanked it. */}
89 <NativeStackScreenOptions options={{ title: "Threads", headerTitle: "Threads" }} />90 <NativeStackScreenOptions
91 options={{ title: "T3 Code", headerTitle: renderCompactBrandTitle }}
92 />
90 <HomeHeader93 <HomeHeader
91 environments={environments}94 environments={environments}
92 searchQuery={searchQuery}95 searchQuery={searchQuery}
apps/mobile/src/features/threads/sidebar-navigation-shell.tsx+3-1
...@@ -11,6 +11,7 @@ import {...@@ -11,6 +11,7 @@ import {
11import type { ReactNode } from "react";11import type { ReactNode } from "react";
12import { Platform, useColorScheme } from "react-native";12import { Platform, useColorScheme } from "react-native";
1313
14import { renderCompactBrandTitle } from "../../components/CompactBrandTitle";
14import { nativeHeaderScrollEdgeEffects } from "../../native/StackHeader";15import { nativeHeaderScrollEdgeEffects } from "../../native/StackHeader";
1516
16const SCROLL_EDGE_EFFECTS = nativeHeaderScrollEdgeEffects(Platform.OS, Platform.Version);17const SCROLL_EDGE_EFFECTS = nativeHeaderScrollEdgeEffects(Platform.OS, Platform.Version);
...@@ -34,10 +35,11 @@ const SIDEBAR_SCREEN_OPTIONS: SidebarScreenOptions = {...@@ -34,10 +35,11 @@ const SIDEBAR_SCREEN_OPTIONS: SidebarScreenOptions = {
34 headerShadowVisible: false,35 headerShadowVisible: false,
35 headerShown: true,36 headerShown: true,
36 headerStyle: { backgroundColor: "transparent" },37 headerStyle: { backgroundColor: "transparent" },
38 headerTitle: renderCompactBrandTitle,
37 headerTitleStyle: { fontSize: 18, fontWeight: "800" },39 headerTitleStyle: { fontSize: 18, fontWeight: "800" },
38 headerTransparent: true,40 headerTransparent: true,
39 scrollEdgeEffects: SCROLL_EDGE_EFFECTS,41 scrollEdgeEffects: SCROLL_EDGE_EFFECTS,
40 title: "Threads",42 title: "T3 Code",
41 unstable_navigationItemStyle: "editor",43 unstable_navigationItemStyle: "editor",
42};44};
4345