chore: merge upstream nightly v0.1.1-nightly.20261017.3272

.github/workflows/ci.yml

@@ -268,6 +268,31 @@ jobs:
       - name: Setup Vite+
         uses: ./.github/actions/setup-ci-deps
 
+      # The browser project runs React tests in headless Chromium. Same cache key as
+      # test_server, so both jobs share one downloaded browser.
+      - name: Resolve Playwright version
+        id: playwright_version
+        run: echo "version=$(node -p "require('./apps/web/node_modules/playwright/package.json').version")" >> "$GITHUB_OUTPUT"
+
+      - name: Cache Chromium
+        id: chromium_cache
+        uses: actions/cache@v6
+        with:
+          path: ~/.cache/ms-playwright
+          key: playwright-chromium-shell-${{ runner.os }}-${{ runner.arch }}-${{ steps.playwright_version.outputs.version }}
+
+      - name: Install Chromium for web browser tests
+        if: steps.chromium_cache.outputs.cache-hit != 'true'
+        run: node apps/web/node_modules/playwright/cli.js install --only-shell chromium
+
+      - name: Install missing Chromium system dependencies
+        run: |
+          browser=$(find "$HOME/.cache/ms-playwright" -name chrome-headless-shell -type f -print -quit)
+          test -n "$browser"
+          if ldd "$browser" | grep '=> not found'; then
+            node apps/web/node_modules/playwright/cli.js install-deps chromium
+          fi
+
       - name: Test
         run: vp run --filter @t3tools/web test
 

.github/workflows/release.yml

@@ -297,6 +297,10 @@ jobs:
           sudo sed -i 's|http://|https://|g' /etc/apt/blacksmith-ubuntu-mirrors.txt /etc/apt/sources.list.d/ubuntu.sources
           sudo apt-get update && sudo apt-get install -y libsecret-1-dev pkg-config build-essential
 
+      # The web package's browser project runs React tests in headless Chromium.
+      - name: Install Chromium for web browser tests
+        run: node apps/web/node_modules/playwright/cli.js install --with-deps --only-shell chromium
+
       - name: Test
         run: vp run --parallel --concurrency-limit 4 --filter '!t3' --filter '!@t3tools/monorepo' test
 

apps/mobile/modules/t3-native-controls/ios/T3SegmentedControlView.swift

@@ -15,12 +15,15 @@ final class T3SegmentedControlView: ExpoView {
     }
   }
   var selectedIndex = -1 { didSet { updateSelection() } }
-  var trackColor: UIColor = .secondarySystemBackground { didSet { control.backgroundColor = trackColor } }
-  var selectedColor: UIColor = .secondarySystemFill { didSet { control.selectedSegmentTintColor = selectedColor } }
-  var textColor: UIColor = .label { didSet { updateColors() } }
-  var mutedColor: UIColor = .secondaryLabel { didSet { updateColors() } }
+  var trackColor: UIColor = .secondarySystemBackground { didSet { if trackColor != oldValue { control.backgroundColor = trackColor } } }
+  var selectedColor: UIColor = .secondarySystemFill { didSet { if selectedColor != oldValue { control.selectedSegmentTintColor = selectedColor } } }
+  var textColor: UIColor = .label { didSet { if textColor != oldValue { updateColors() } } }
+  var mutedColor: UIColor = .secondaryLabel { didSet { if mutedColor != oldValue { updateColors() } } }
   var appearance = "light" {
-    didSet { overrideUserInterfaceStyle = appearance == "dark" ? .dark : .light }
+    didSet {
+      guard appearance != oldValue else { return }
+      overrideUserInterfaceStyle = appearance == "dark" ? .dark : .light
+    }
   }
 
   required init(appContext: AppContext? = nil) {
@@ -31,11 +34,20 @@ final class T3SegmentedControlView: ExpoView {
 
   override func layoutSubviews() {
     super.layoutSubviews()
-    control.frame = bounds
+    guard control.frame != bounds else { return }
+    UIView.performWithoutAnimation {
+      control.frame = bounds
+    }
   }
 
   private func updateSelection() {
-    control.selectedSegmentIndex = labels.indices.contains(selectedIndex) ? selectedIndex : UISegmentedControl.noSegment
+    let index = labels.indices.contains(selectedIndex) ? selectedIndex : UISegmentedControl.noSegment
+    // React echoes native selections while UIKit is still settling the glass lens.
+    guard control.selectedSegmentIndex != index else { return }
+    UIView.performWithoutAnimation {
+      control.selectedSegmentIndex = index
+      control.layoutIfNeeded()
+    }
   }
 
   private func updateColors() {

apps/mobile/src/components/ui/MenuPopup.android.tsx

@@ -8,23 +8,31 @@ import {
   Text,
 } from "@expo/ui/jetpack-compose";
 import { defaultMinSize, padding, size, width } from "@expo/ui/jetpack-compose/modifiers";
-import { View } from "react-native";
+import { Pressable } from "react-native";
 import { resolveScaledTextRole } from "../../lib/appearancePreferences";
 
 import { useAndroidControlSizing } from "./useAndroidControlSizing";
 import { useAppearancePreferences } from "../../features/settings/appearance/AppearancePreferencesProvider";
 import type { MenuPopupProps } from "./MenuPopup";
 import { isAppSymbolName, SymbolView, type AppSymbolName } from "./AppSymbol";
 
+// The glyph is a React Native view hosted in the Compose row, and its native host consumes
+// every touch over it, so the row's onClick never sees a tap on the icon. The glyph runs the
+// row's action itself; the row stays the accessible element.
 function MenuIcon(props: {
   readonly name: AppSymbolName;
+  readonly onPress: () => void;
   readonly destructive?: boolean;
   readonly disabled?: boolean;
 }) {
   const { iconSize } = useAndroidControlSizing();
   return (
     <RNHostView matchContents modifiers={[size(iconSize, iconSize)]}>
-      <View
+      <Pressable
+        accessible={false}
+        focusable={false}
+        disabled={props.disabled}
+        onPress={props.onPress}
         style={{ width: iconSize, height: iconSize }}
         importantForAccessibility="no-hide-descendants"
       >
@@ -40,7 +48,7 @@ function MenuIcon(props: {
                 : "accent-foreground"
           }
         />
-      </View>
+      </Pressable>
     </RNHostView>
   );
 }
@@ -60,7 +68,7 @@ export function MenuPopup(props: MenuPopupProps) {
       {props.parent ? (
         <DropdownMenuItem onClick={props.onBack} modifiers={itemModifiers}>
           <DropdownMenuItem.LeadingIcon>
-            <MenuIcon name="arrow.left" />
+            <MenuIcon name="arrow.left" onPress={props.onBack} />
           </DropdownMenuItem.LeadingIcon>
           <DropdownMenuItem.Text>
             <Text color={foreground} style={{ typography: "bodyLarge", ...body }}>
@@ -88,6 +96,7 @@ export function MenuPopup(props: MenuPopupProps) {
             <DropdownMenuItem.LeadingIcon>
               <MenuIcon
                 name={action.image}
+                onPress={() => props.onPress(action)}
                 destructive={action.attributes?.destructive}
                 disabled={action.attributes?.disabled}
               />
@@ -116,11 +125,19 @@ export function MenuPopup(props: MenuPopupProps) {
           </DropdownMenuItem.Text>
           {(action.subactions?.length ?? 0) > 0 ? (
             <DropdownMenuItem.TrailingIcon>
-              <MenuIcon name="chevron.right" disabled={action.attributes?.disabled} />
+              <MenuIcon
+                name="chevron.right"
+                onPress={() => props.onPress(action)}
+                disabled={action.attributes?.disabled}
+              />
             </DropdownMenuItem.TrailingIcon>
           ) : action.state === "on" ? (
             <DropdownMenuItem.TrailingIcon>
-              <MenuIcon name="checkmark" disabled={action.attributes?.disabled} />
+              <MenuIcon
+                name="checkmark"
+                onPress={() => props.onPress(action)}
+                disabled={action.attributes?.disabled}
+              />
             </DropdownMenuItem.TrailingIcon>
           ) : null}
         </DropdownMenuItem>

apps/mobile/src/components/ui/SegmentedControl.ios.tsx

@@ -29,14 +29,14 @@ export function SegmentedControl<Value extends string | number>(
 ) {
   const { colors, colorScheme } = useControlTheme();
   const trackColor = flattenThemeColor(
-    themeColorWithAlpha(colors["--color-primary"], colorScheme === "dark" ? 0.18 : 0.07),
+    themeColorWithAlpha(colors["--color-prominent-action"], colorScheme === "dark" ? 0.18 : 0.07),
     colors["--color-screen"],
   );
   const selectedColor =
-    colorScheme === "dark" ? colors["--color-primary"] : colors["--color-secondary"];
+    colorScheme === "dark" ? colors["--color-prominent-action"] : colors["--color-secondary"];
   const selectedTextColor =
     colorScheme === "dark"
-      ? colors["--color-primary-foreground"]
+      ? colors["--color-prominent-action-foreground"]
       : colors["--color-secondary-foreground"];
   return (
     <View className={props.className}>

apps/mobile/src/features/connection/ConnectionsNewRouteScreen.tsx

@@ -155,7 +155,7 @@ export function ConnectionsNewRouteScreen({
   );
 
   const connectAndClose = useCallback(
-    async (pairingUrl: string, replaceWithHome: boolean) => {
+    async (pairingUrl: string) => {
       setIsSubmitting(true);
       onChangeConnectionPairingUrl(pairingUrl);
       try {
@@ -166,7 +166,9 @@ export function ConnectionsNewRouteScreen({
             : Haptics.NotificationFeedbackType.Error,
         );
         if (AsyncResult.isSuccess(result)) {
-          if (replaceWithHome || !navigation.canGoBack()) {
+          // Return to whatever opened the sheet. Replacing it with Home would
+          // nest Home inside any sheet still below it.
+          if (!navigation.canGoBack()) {
             navigation.dispatch(StackActions.replace("Home"));
           } else {
             navigation.goBack();
@@ -180,7 +182,7 @@ export function ConnectionsNewRouteScreen({
   );
 
   const handleSubmit = useCallback(async () => {
-    await connectAndClose(buildPairingUrl(hostInput, codeInput), false);
+    await connectAndClose(buildPairingUrl(hostInput, codeInput));
   }, [codeInput, connectAndClose, hostInput]);
 
   useEffect(() => {
@@ -189,7 +191,7 @@ export function ConnectionsNewRouteScreen({
     }
 
     attemptedAutoConnectRef.current = routePairingUrl;
-    void connectAndClose(routePairingUrl, true);
+    void connectAndClose(routePairingUrl);
   }, [connectAndClose, routePairingUrl, shouldAutoConnect]);
 
   return (

apps/mobile/src/features/pull-requests/PullRequestRouteScreen.tsx

@@ -685,7 +685,6 @@ export function PullRequestRouteScreen({ route }: StaticScreenProps<PullRequestP
                         >
                           <PullRequestIdentity pr={identity} params={params} />
                           <SegmentedControl
-                            className={Platform.OS === "android" ? undefined : "bg-grouped-card"}
                             options={[
                               { value: "overview", label: "Overview" },
                               ...(guidesEnabled

apps/mobile/src/features/settings/SettingsProviderAccountsRouteScreen.tsx

@@ -5,12 +5,14 @@ import {
   type AtomCommandResult,
 } from "@t3tools/client-runtime/state/runtime";
 import type { ProviderAuthResponse, ServerProvider } from "@t3tools/contracts";
+import { useAtomValue } from "@effect/atom-react";
 import { useRef, useState } from "react";
 import { Linking, Pressable, ScrollView, TextInput, View } from "react-native";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
 
 import { AppText as Text } from "../../components/ui/AppText";
 import { ScreenScrollView } from "../../components/ui/ScreenScrollView";
+import { environmentPresentations } from "../../state/presentation";
 import { useEnvironmentQuery } from "../../state/query";
 import { serverEnvironment } from "../../state/server";
 import { useAtomCommand } from "../../state/use-atom-command";
@@ -25,6 +27,7 @@ import { useSettingsEnvironmentFilter, type SettingsTarget } from "./settings-en
 
 export function SettingsProviderAccountsRouteScreen() {
   const { selectedTargets } = useSettingsEnvironmentFilter();
+  const providersByEnvironment = useAtomValue(environmentPresentations.providersByEnvironmentAtom);
   const insets = useSafeAreaInsets();
   return (
     <>
@@ -41,7 +44,7 @@ export function SettingsProviderAccountsRouteScreen() {
           ) : (
             selectedTargets.map((environment) => (
               <SettingsSection key={environment.environmentId} title={environment.label}>
-                {environment.serverConfig.providers
+                {(providersByEnvironment.get(environment.environmentId) ?? [])
                   .filter(
                     (provider) =>
                       provider.setup?.canAuthenticate ||
@@ -54,7 +57,7 @@ export function SettingsProviderAccountsRouteScreen() {
                       provider={provider}
                     />
                   ))}
-                {!environment.serverConfig.providers.some(
+                {!(providersByEnvironment.get(environment.environmentId) ?? []).some(
                   (provider) =>
                     provider.setup?.canAuthenticate ||
                     (provider.driver === "acpRegistry" && provider.installed),

apps/mobile/src/features/threads/QuestionAttachments.tsx

@@ -6,7 +6,7 @@ import { convertPastedImagesToAttachments } from "../../lib/composerImages";
 import { PROVIDER_SEND_TURN_MAX_ATTACHMENTS, type UserInputQuestion } from "@t3tools/contracts";
 import { useAtomValue } from "@effect/atom-react";
 import { View } from "react-native";
-import { useEffect, useRef, useState } from "react";
+import { useEffect, useEffectEvent, useRef, useState } from "react";
 import { ComposerAttachmentButton } from "./ComposerAttachmentButton";
 import { ComposerAttachmentStrip } from "../../components/ComposerAttachmentStrip";
 import { pickComposerFiles, pickComposerMedia } from "../../lib/composerImages";
@@ -49,6 +49,14 @@ export function QuestionAttachments(props: {
     props.requestId,
     props.question.id,
   ]);
+  // A focused input that unmounts never delivers its onBlur, so release focus here or
+  // the screen would keep treating the keyboard as owned by a removed input.
+  const focusedRef = useRef(false);
+  const onInputFocusChange = props.onInputFocusChange;
+  const releaseFocus = useEffectEvent(() => {
+    if (focusedRef.current) onInputFocusChange?.(false);
+  });
+  useEffect(() => () => releaseFocus(), []);
   const pickerScope = useRef<{ key: string; active: boolean } | null>(null);
   useEffect(() => {
     const scope = { key: scopeKey, active: true };
@@ -197,8 +205,14 @@ export function QuestionAttachments(props: {
           submitBehavior={props.question.initialAnswer !== undefined ? "newline" : undefined}
           editable={!props.disabled}
           onChangeText={props.onChangeText}
-          onFocus={() => props.onInputFocusChange?.(true)}
-          onBlur={() => props.onInputFocusChange?.(false)}
+          onFocus={() => {
+            focusedRef.current = true;
+            onInputFocusChange?.(true);
+          }}
+          onBlur={() => {
+            focusedRef.current = false;
+            onInputFocusChange?.(false);
+          }}
           placeholder="Or type a custom answer"
           className="min-h-[54px] rounded-2xl border border-input-border bg-input px-3.5 py-3 font-sans text-base text-foreground"
         />

apps/mobile/src/features/threads/ThreadDetailScreen.tsx

@@ -360,26 +360,22 @@ export const ThreadDetailScreen = memo(function ThreadDetailScreen(props: Thread
   const insets = useSafeAreaInsets();
   const isKeyboardVisible = useKeyboardState((state) => state.isVisible);
   const liveKeyboardHeight = useKeyboardState((state) => state.height);
-  // Android can swallow the IME hide callbacks when the app is backgrounded
-  // mid keyboard-hide (the reported repro: send — which blurs and starts the
-  // hide — then Home within a second). The keyboard library's height AND
-  // visibility then stay frozen open, so gating the sticky translation on
-  // visibility alone still strands the composer after resume. Quarantine the
-  // translation on every Android resume instead; any sign of a live keyboard
-  // stream — an owned input gaining focus, or any visibility/height movement —
-  // lifts it. A healthy resume sees no visual difference (the translation is
-  // already zero while the keyboard is closed). A composer that stayed focused
-  // keeps its keyboard: the microphone permission check pauses the activity
-  // mid-dictation, and quarantining then dropped the composer under the IME.
+  // Android can swallow the IME hide callbacks when the app is backgrounded mid keyboard-hide
+  // (the reported repro: send — which blurs and starts the hide — then Home within a second). The
+  // keyboard library's height AND visibility then stay frozen open, so gating the sticky
+  // translation on visibility alone still strands the composer after resume. An input that kept
+  // focus through the switch is exempt: Android restores its keyboard unchanged, so no keyboard
+  // or focus event would ever lift the quarantine. Hiding the keyboard with Back keeps focus, so
+  // Back then Home mid-hide takes the exemption and can still strand the composer.
   const [keyboardStateSuspect, setKeyboardStateSuspect] = useState(false);
-  const composerFocusedRef = useRef(false);
+  const ownedInputFocusedRef = useRef(false);
   useEffect(() => {
     if (Platform.OS !== "android") {
       return;
     }
     const subscription = AppState.addEventListener("change", (state) => {
-      if (state === "active" && !composerFocusedRef.current) {
-        setKeyboardStateSuspect(true);
+      if (state === "active") {
+        setKeyboardStateSuspect(!ownedInputFocusedRef.current);
       }
     });
     return () => {
@@ -390,6 +386,7 @@ export const ThreadDetailScreen = memo(function ThreadDetailScreen(props: Thread
     setKeyboardStateSuspect(false);
   }, [isKeyboardVisible, liveKeyboardHeight]);
   const handleOwnedInputFocusChange = useCallback((focused: boolean) => {
+    ownedInputFocusedRef.current = focused;
     if (focused) {
       setKeyboardStateSuspect(false);
     }
@@ -429,7 +426,6 @@ export const ThreadDetailScreen = memo(function ThreadDetailScreen(props: Thread
   const [composerFocused, setComposerFocused] = useState(false);
   const handleComposerFocusChange = useCallback(
     (focused: boolean) => {
-      composerFocusedRef.current = focused;
       setComposerFocused(focused);
       handleOwnedInputFocusChange(focused);
     },

apps/mobile/src/features/usage/ChatGptUsageSummary.tsx

@@ -11,7 +11,7 @@ export function ChatGptUsageSummary({
 }: {
   selectedEnvironmentIds: ReadonlySet<EnvironmentId> | null;
 }) {
-  const presentations = useAtomValue(environmentPresentations.presentationsAtom);
+  const presentations = useAtomValue(environmentPresentations.presentationsWithProvidersAtom);
   const selected =
     selectedEnvironmentIds === null
       ? presentations

apps/mobile/src/features/usage/UsageLimitsPooled.tsx

@@ -222,7 +222,7 @@ export function UsageLimitsSection({
   readonly selectedEnvironmentIds: ReadonlySet<EnvironmentId> | null;
   readonly cursorPrompt?: ReactNode;
 }) {
-  const presentations = useAtomValue(environmentPresentations.presentationsAtom);
+  const presentations = useAtomValue(environmentPresentations.presentationsWithProvidersAtom);
   const selected =
     selectedEnvironmentIds === null
       ? presentations
@@ -345,7 +345,7 @@ type AccountScreenProps = StaticScreenProps<{
 
 export function UsageLimitAccountScreen({ route }: AccountScreenProps) {
   const insets = useSafeAreaInsets();
-  const presentations = useAtomValue(environmentPresentations.presentationsAtom);
+  const presentations = useAtomValue(environmentPresentations.presentationsWithProvidersAtom);
   const { accountKey, windowId, windowKind, environmentIds, now } = route.params;
   const selectedIds =
     environmentIds === null ? null : new Set(environmentIds.map((id) => EnvironmentId.make(id)));