lael-labs/t3code

.coderabbit.yaml+2−0

@@ -1,2 +1,4 @@
1	reviews:	1	reviews:
2	review_status: false	2	review_status: false
		3	auto_review:
		4	enabled: false

apps/mobile/app.config.ts+1−0

@@ -206,6 +206,7 @@ const config: ExpoConfig = { · 205 unmodified lines
206	},	206	},
207	NSLocalNetworkUsageDescription:	207	NSLocalNetworkUsageDescription:
208	"Allow T3 Code to connect to T3 Code servers on your local network or tailnet.",	208	"Allow T3 Code to connect to T3 Code servers on your local network or tailnet.",
		209	NSPhotoLibraryAddUsageDescription: "Allow T3 Code to save images to your photo library.",
209	ITSAppUsesNonExemptEncryption: false,	210	ITSAppUsesNonExemptEncryption: false,
210	// The App Store screenshot harness rotates the iPad interface from	211	// The App Store screenshot harness rotates the iPad interface from
211	// inside the app (CI denies osascript the Accessibility access that	212	// inside the app (CI denies osascript the Accessibility access that

apps/mobile/modules/t3-native-controls/ios/T3NativeControlsModule.swift+34−2

@@ -5,6 +5,7 @@ import UIKit · 4 unmodified lines
5	public final class T3NativeControlsModule: Module {	5	public final class T3NativeControlsModule: Module {
6	private let presentationSources = T3PresentationSources()	6	private let presentationSources = T3PresentationSources()
7	private var videoPresentation: T3NativeVideoPresentation?	7	private var videoPresentation: T3NativeVideoPresentation?
		8	private var filePresentation: T3NativeFilePresentation?
8		9
9	public func definition() -> ModuleDefinition {	10	public func definition() -> ModuleDefinition {
10	Name("T3NativeControls")	11	Name("T3NativeControls")
@@ -23,9 +24,22 @@ public final class T3NativeControlsModule: Module { · 12 unmodified lines
23	self.dismissVideo(identifier: identifier)	24	self.dismissVideo(identifier: identifier)
24	}.runOnQueue(.main)	25	}.runOnQueue(.main)
25		26
		27	AsyncFunction("presentFile") { (url: URL, title: String, sourceIdentifier: String, identifier: String, promise: Promise) in
		28	try self.presentFile(url: url, title: title, sourceIdentifier: sourceIdentifier,
		29	identifier: identifier, promise: promise)
		30	}.runOnQueue(.main)
		31
		32	AsyncFunction("dismissFile") { (identifier: String) in
		33	self.dismissFile(identifier: identifier)
		34	}.runOnQueue(.main)
		35
26	OnDestroy {	36	OnDestroy {
27	let presentation = self.videoPresentation	37	let presentation = self.videoPresentation
28	DispatchQueue.main.async { presentation?.dismiss() }	38	let file = self.filePresentation
		39	DispatchQueue.main.async {
		40	presentation?.dismiss()
		41	file?.dismiss()
		42	}
29	}	43	}
30		44
31	View(T3PresentationSourceView.self) {	45	View(T3PresentationSourceView.self) {
@@ -140,7 +154,7 @@ public final class T3NativeControlsModule: Module { · 108 unmodified lines
140	let isPlayableURL = url.isFileURL	154	let isPlayableURL = url.isFileURL
141	? FileManager.default.isReadableFile(atPath: url.path)	155	? FileManager.default.isReadableFile(atPath: url.path)
142	: (["https", "http"].contains(url.scheme?.lowercased() ?? "") && url.host != nil)	156	: (["https", "http"].contains(url.scheme?.lowercased() ?? "") && url.host != nil)
143	guard videoPresentation == nil,	157	guard videoPresentation == nil, filePresentation == nil,
144	let presenter = appContext?.utilities?.currentViewController(),	158	let presenter = appContext?.utilities?.currentViewController(),
145	isPlayableURL	159	isPlayableURL
146	else {	160	else {
@@ -162,6 +176,24 @@ public final class T3NativeControlsModule: Module { · 15 unmodified lines
162	if videoPresentation?.identifier == identifier { videoPresentation?.dismiss() }	176	if videoPresentation?.identifier == identifier { videoPresentation?.dismiss() }
163	}	177	}
164		178
		179	private func presentFile(url: URL, title: String, sourceIdentifier: String,
		180	identifier: String, promise: Promise) throws {
		181	guard filePresentation == nil, videoPresentation == nil,
		182	let presenter = appContext?.utilities?.currentViewController()
		183	else { throw URLError(.cannotLoadFromNetwork) }
		184	let file = T3NativeFilePresentation(identifier: identifier, sources: presentationSources,
		185	sourceIdentifier: sourceIdentifier) { [weak self] error in
		186	self?.filePresentation = nil
		187	if let error { promise.reject(error) } else { promise.resolve(nil) }
		188	}
		189	filePresentation = file
		190	file.present(url: url, title: title, from: presenter)
		191	}
		192
		193	private func dismissFile(identifier: String) {
		194	if filePresentation?.identifier == identifier { filePresentation?.dismiss() }
		195	}
		196
165	private func shareFile(url: URL, title: String, sourceIdentifier: String, promise: Promise) throws {	197	private func shareFile(url: URL, title: String, sourceIdentifier: String, promise: Promise) throws {
166	guard let presenter = appContext?.utilities?.currentViewController() else {	198	guard let presenter = appContext?.utilities?.currentViewController() else {
167	throw NSError(	199	throw NSError(

apps/mobile/modules/t3-native-controls/ios/T3NativeFilePresentation.swift+165−0

@@ -0,0 +1,165 @@
	1	import ImageIO
	2	import QuickLook
	3	import UIKit
	4	import UniformTypeIdentifiers
	5
	6	private final class FilePreviewItem: NSObject, QLPreviewItem {
	7	var previewItemURL: URL?
	8	var previewItemTitle: String?
	9	}
	10
	11	private final class FilePreviewController: QLPreviewController {
	12	var onAppear: (() -> Void)?
	13
	14	override func viewDidAppear(_ animated: Bool) {
	15	super.viewDidAppear(animated)
	16	onAppear?()
	17	}
	18	}
	19
	20	/// Quick Look owns image and document controls, zooming, and source-view transitions.
	21	final class T3NativeFilePresentation: NSObject, QLPreviewControllerDataSource,
	22	QLPreviewControllerDelegate, UIAdaptivePresentationControllerDelegate {
	23	let identifier: String
	24	private var controller: UIViewController?
	25	private let completion: (Error?) -> Void
	26	private weak var sources: T3PresentationSources?
	27	private let sourceIdentifier: String
	28	private let item = FilePreviewItem()
	29	private var loading: Task<Void, Never>?
	30	private var dismissRequested = false
	31	private var finished = false
	32
	33	init(identifier: String, sources: T3PresentationSources, sourceIdentifier: String, completion: @escaping (Error?) -> Void) {
	34	self.identifier = identifier
	35	self.sources = sources
	36	self.sourceIdentifier = sourceIdentifier
	37	self.completion = completion
	38	super.init()
	39	}
	40
	41	func present(url: URL, title: String, from presenter: UIViewController) {
	42	loading = Task { @MainActor [self] in
	43	do {
	44	let file = try await Self.prepareFile(url: url, title: title)
	45	guard !finished, !Task.isCancelled else {
	46	try? FileManager.default.removeItem(at: file.deletingLastPathComponent())
	47	return
	48	}
	49	item.previewItemURL = file
	50	item.previewItemTitle = title
	51	let preview = FilePreviewController()
	52	preview.delegate = self
	53	preview.dataSource = self
	54	preview.onAppear = { [weak self] in self?.resumePendingDismissal() }
	55	controller = preview
	56	presenter.present(preview, animated: !UIAccessibility.isReduceMotionEnabled) { [self] in
	57	resumePendingDismissal()
	58	}
	59	preview.presentationController?.delegate = self
	60	} catch {
	61	finish(error: error)
	62	}
	63	}
	64	}
	65
	66	func dismiss() {
	67	dismissRequested = true
	68	loading?.cancel()
	69	guard !finished else { return }
	70	guard let controller else { finish(); return }
	71	// Drain Close from viewDidAppear after opening or cancelling an interactive dismissal.
	72	// Starting a second modal transition while UIKit is settling the first can strand it.
	73	guard !controller.isBeingPresented, !controller.isBeingDismissed else { return }
	74	controller.dismiss(animated: !UIAccessibility.isReduceMotionEnabled) { [self] in finish() }
	75	}
	76
	77	private func resumePendingDismissal() {
	78	// Appearance callbacks run before UIKit has cleared the current transition.
	79	DispatchQueue.main.async { [weak self] in
	80	if self?.dismissRequested == true { self?.dismiss() }
	81	}
	82	}
	83
	84	func numberOfPreviewItems(in controller: QLPreviewController) -> Int { item.previewItemURL == nil ? 0 : 1 }
	85
	86	func previewController(_ controller: QLPreviewController, previewItemAt index: Int) -> QLPreviewItem {
	87	item
	88	}
	89
	90	func previewController(_ controller: QLPreviewController, transitionViewFor item: QLPreviewItem) -> UIView? {
	91	guard !UIAccessibility.isReduceMotionEnabled else { return nil }
	92	return sources?.view(for: sourceIdentifier)
	93	}
	94
	95	func previewController(_ controller: QLPreviewController, frameFor item: QLPreviewItem,
	96	inSourceView view: AutoreleasingUnsafeMutablePointer<UIView?>) -> CGRect {
	97	guard !UIAccessibility.isReduceMotionEnabled, let source = sources?.view(for: sourceIdentifier) else { return .zero }
	98	view.pointee = source
	99	return source.bounds
	100	}
	101
	102	func previewControllerDidDismiss(_ controller: QLPreviewController) { finish() }
	103
	104	func presentationControllerDidDismiss(_ presentationController: UIPresentationController) { finish() }
	105
	106	private func finish(error: Error? = nil) {
	107	guard !finished else { return }
	108	finished = true
	109	loading?.cancel()
	110	loading = nil
	111	if let file = item.previewItemURL {
	112	try? FileManager.default.removeItem(at: file.deletingLastPathComponent())
	113	}
	114	item.previewItemURL = nil
	115	DispatchQueue.main.async { [completion] in completion(error) }
	116	}
	117
	118	/// Copy original bytes so preview and sharing do not mutate a draft or workspace file.
	119	nonisolated private static func prepareFile(url: URL, title: String) async throws -> URL {
	120	try Task.checkCancellation()
	121	let directory = FileManager.default.temporaryDirectory.appendingPathComponent("t3-preview-\(UUID().uuidString)")
	122	try FileManager.default.createDirectory(at: directory, withIntermediateDirectories: true)
	123	do {
	124	let download = directory.appendingPathComponent("original")
	125	if url.isFileURL {
	126	try FileManager.default.copyItem(at: url, to: download)
	127	} else if url.scheme == "data" {
	128	try Data(contentsOf: url).write(to: download, options: .atomic)
	129	} else {
	130	guard ["https", "http"].contains(url.scheme?.lowercased() ?? "") else {
	131	throw URLError(.unsupportedURL)
	132	}
	133	let (temporaryFile, response) = try await URLSession.shared.download(from: url)
	134	guard let response = response as? HTTPURLResponse, (200..<300).contains(response.statusCode) else {
	135	throw URLError(.badServerResponse)
	136	}
	137	try FileManager.default.moveItem(at: temporaryFile, to: download)
	138	}
	139	try Task.checkCancellation()
	140	let type: UTType
	141	if let image = CGImageSourceCreateWithURL(download as CFURL, nil),
	142	CGImageSourceGetCount(image) > 0, let imageType = CGImageSourceGetType(image),
	143	let detectedType = UTType(imageType as String) {
	144	type = detectedType
	145	} else if CGPDFDocument(download as CFURL) != nil {
	146	type = .pdf
	147	} else {
	148	throw URLError(.cannotDecodeContentData)
	149	}
	150	let filename = URL(fileURLWithPath: title).lastPathComponent as NSString
	151	let originalExtension = filename.pathExtension
	152	let fileExtension = UTType(filenameExtension: originalExtension) == type
	153	? originalExtension : type.preferredFilenameExtension ?? "png"
	154	let stem = filename.deletingPathExtension
	155	var name = String(stem.prefix(60)).components(separatedBy: .controlCharacters).joined(separator: "_")
	156	while name.utf8.count > 200 { name.removeLast() }
	157	let file = directory.appendingPathComponent("\(name.isEmpty ? "Preview" : name).\(fileExtension)")
	158	try FileManager.default.moveItem(at: download, to: file)
	159	return file
	160	} catch {
	161	try? FileManager.default.removeItem(at: directory)
	162	throw error
	163	}
	164	}
	165	}

apps/mobile/src/components/ComposerAttachmentStrip.tsx+67−36

 import { AppText as Text } from "./AppText";
 import type { DraftComposerAttachment, DraftComposerFileAttachment } from "../lib/composerImages";
 import { VideoAttachmentTile } from "./VideoAttachmentTile";
-import { loadLocalVideoPreview } from "../lib/localVideoPreview";
+import { loadLocalAttachmentPreview } from "../lib/localAttachmentPreview";
+import { PresentationSource } from "./NativePresentation";
+import type { FilePreviewSource } from "./FilePreviewModal";
+import { isPdfFile } from "../lib/filePreview";
 export interface ComposerAttachmentStripProps {
   /** Attachments to display. */
   readonly attachments: ReadonlyArray<DraftComposerAttachment>;
   /** Called when the user removes an attachment. */
   readonly onRemove: (imageId: string) => void;
-  /** Called when the user taps on an image thumbnail to preview it. */
+  /** Called when the user taps an image or PDF to preview it. */
-  readonly onPressImage?: (previewUri: string) => void;
+  readonly onPressPreview?: (source: FilePreviewSource) => void;
   readonly onPressVideo?: (
     attachment: DraftComposerFileAttachment,
     sourceIdentifier: string,
   readonly size: number;
   readonly borderRadius: number;
   readonly compact?: boolean;
-  readonly onPressImage?: (previewUri: string) => void;
+  readonly onPressPreview?: (source: FilePreviewSource) => void;
   readonly onPressVideo?: (
     attachment: DraftComposerFileAttachment,
     sourceIdentifier: string,
   const { attachment } = props;
   const style = { width: props.size, height: props.size, borderRadius: props.borderRadius };
   if (attachment.type === "image") {
+    const sourceIdentifier = `draft-image:${attachment.id}`;
     return (
-      <Pressable
+      <PresentationSource identifier={sourceIdentifier}>
-        onPress={props.onPressImage ? () => props.onPressImage?.(attachment.previewUri) : undefined}
+        <Pressable
-      >
+          accessibilityRole="imagebutton"
-        <Image
+          accessibilityLabel={`Open ${attachment.name}`}
-          source={{ uri: attachment.previewUri }}
+          disabled={!props.onPressPreview}
-          style={style}
+          onPress={() =>
-          className="bg-subtle"
+            props.onPressPreview?.({
-          resizeMode="cover"
+              kind: "image",
-        />
+              uri: attachment.dataUrl,
-      </Pressable>
+              name: attachment.name,
+              sourceIdentifier,
+            })
+          }
+        >
+          <Image
+            source={{ uri: attachment.previewUri }}
+            style={style}
+            className="bg-subtle"
+            resizeMode="cover"
+          />
+        </Pressable>
+      </PresentationSource>
     );
   }
   const onPressVideo = props.onPressVideo;
       <ComposerVideoAttachment {...props} attachment={attachment} onPressVideo={onPressVideo} />
     );
   }
+  const canPreview = isPdfFile(attachment) && props.onPressPreview !== undefined;
+  const sourceIdentifier = `draft-file:${attachment.id}`;
   return (
-    <View
+    <PresentationSource identifier={sourceIdentifier}>
-      className={
+      <Pressable
-        props.compact
+        accessibilityRole="button"
-          ? "items-center justify-center bg-subtle"
+        accessibilityLabel={`Open ${attachment.name}`}
-          : "items-center justify-center gap-1 bg-subtle px-2"
+        disabled={!canPreview}
-      }
+        onPress={() =>
-      style={style}
+          props.onPressPreview?.({
-    >
+            kind: "pdf",
-      <SymbolView
+            name: attachment.name,
-        name="doc.text"
+            attachment,
-        size={props.compact ? 15 : 22}
+            sourceIdentifier,
-        tintColor="#a3a3a3"
+          })
-        type="monochrome"
+        }
-      />
+        className={
-      {!props.compact ? (
+          props.compact
-        <Text className="w-full text-center text-2xs text-foreground" numberOfLines={1}>
+            ? "items-center justify-center bg-subtle"
-          {attachment.name}
+            : "items-center justify-center gap-1 bg-subtle px-2"
-        </Text>
+        }
-      ) : null}
+        style={style}
-    </View>
+      >
+        <SymbolView
+          name="doc.text"
+          size={props.compact ? 15 : 22}
+          tintColor="#a3a3a3"
+          type="monochrome"
+        />
+        {!props.compact ? (
+          <Text className="w-full text-center text-2xs text-foreground" numberOfLines={1}>
+            {attachment.name}
+          </Text>
+        ) : null}
+      </Pressable>
+    </PresentationSource>
   );
 }
     shareRef.current = controller;
     setSharing(true);
     void (async () => {
-      const preview = await loadLocalVideoPreview(attachment, controller.signal);
+      const preview = await loadLocalAttachmentPreview(attachment, controller.signal);
       if (!preview) return;
       try {
         await preview.share(controller.signal, sourceIdentifier);
               attachment={attachment}
               size={size}
               borderRadius={radius}
-              onPressImage={props.onPressImage}
+              onPressPreview={props.onPressPreview}
               onPressVideo={props.onPressVideo}
             />
             <Pressable

apps/mobile/src/components/FilePreview.ios.tsx+43−0

@@ -0,0 +1,43 @@
	1	import { requireNativeModule } from "expo";
	2	import { useEffect, useEffectEvent, useId } from "react";
	3	import { Alert } from "react-native";
	4
	5	import type { ResolvedFilePreviewSource } from "./FilePreviewModal";
	6
	7	const NativeControls = requireNativeModule<{
	8	presentFile(
	9	uri: string,
	10	name: string,
	11	sourceIdentifier: string,
	12	identifier: string,
	13	): Promise<void>;
	14	dismissFile(identifier: string): Promise<void>;
	15	}>("T3NativeControls");
	16
	17	export function FilePreview(props: {
	18	readonly source: ResolvedFilePreviewSource;
	19	readonly onRequestClose: () => void;
	20	}) {
	21	const { uri, name, sourceIdentifier } = props.source;
	22	const identifier = useId();
	23	const onRequestClose = useEffectEvent(props.onRequestClose);
	24
	25	useEffect(() => {
	26	let canceled = false;
	27	void NativeControls.presentFile(uri, name ?? "Preview", sourceIdentifier ?? "", identifier)
	28	.catch(() => {
	29	if (!canceled) {
	30	Alert.alert("Could not open preview", "The file could not be loaded. Please try again.");
	31	}
	32	})
	33	.finally(() => {
	34	if (!canceled) onRequestClose();
	35	});
	36	return () => {
	37	canceled = true;
	38	void NativeControls.dismissFile(identifier).catch(() => undefined);
	39	};
	40	}, [uri, name, sourceIdentifier, identifier]);
	41
	42	return null;
	43	}

apps/mobile/src/components/FilePreview.tsx+52−0

@@ -0,0 +1,52 @@
	1	import { useEffect, useEffectEvent } from "react";
	2	import { Alert } from "react-native";
	3	import ImageViewing from "react-native-image-viewing";
	4
	5	import { downloadAndShareAttachment, shareLocalAttachment } from "../lib/attachmentDownload";
	6	import type { ResolvedFilePreviewSource } from "./FilePreviewModal";
	7
	8	function PdfPreview(props: {
	9	readonly source: ResolvedFilePreviewSource;
	10	readonly onRequestClose: () => void;
	11	}) {
	12	const { uri, name } = props.source;
	13	const onRequestClose = useEffectEvent(props.onRequestClose);
	14	useEffect(() => {
	15	const controller = new AbortController();
	16	const input = {
	17	attachment: { name: name ?? "Document.pdf", mimeType: "application/pdf" },
	18	signal: controller.signal,
	19	};
	20	// Android's system chooser supplies the installed PDF apps.
	21	const opened =
	22	uri.startsWith("file:") \|\| uri.startsWith("content:")
	23	? shareLocalAttachment({ ...input, uri })
	24	: downloadAndShareAttachment({ ...input, url: uri });
	25	void opened
	26	.catch(() => {
	27	if (!controller.signal.aborted) Alert.alert("Could not open PDF", "Please try again.");
	28	})
	29	.finally(() => {
	30	if (!controller.signal.aborted) onRequestClose();
	31	});
	32	return () => controller.abort();
	33	}, [uri, name]);
	34	return null;
	35	}
	36
	37	export function FilePreview(props: {
	38	readonly source: ResolvedFilePreviewSource;
	39	readonly onRequestClose: () => void;
	40	}) {
	41	if (props.source.kind === "pdf") return <PdfPreview {...props} />;
	42	return (
	43	<ImageViewing
	44	images={[{ uri: props.source.uri }]}
	45	imageIndex={0}
	46	visible
	47	onRequestClose={props.onRequestClose}
	48	swipeToCloseEnabled
	49	doubleTapToZoomEnabled
	50	/>
	51	);
	52	}

apps/mobile/src/components/FilePreviewModal.tsx+93−0

@@ -0,0 +1,93 @@
	1	import { useIsFocused } from "@react-navigation/native";
	2	import type { AssetResource, EnvironmentId } from "@t3tools/contracts";
	3	import { useEffect, useEffectEvent, useState } from "react";
	4	import { Alert, Keyboard } from "react-native";
	5
	6	import type { DraftComposerFileAttachment } from "../lib/composerImages";
	7	import { loadLocalAttachmentPreview } from "../lib/localAttachmentPreview";
	8	import { useAssetUrlState } from "../state/assets";
	9	import { usePreparedConnection } from "../state/session";
	10	import { FilePreview } from "./FilePreview";
	11
	12	export interface ResolvedFilePreviewSource {
	13	readonly kind: "image" \| "pdf";
	14	readonly uri: string;
	15	readonly name?: string;
	16	readonly sourceIdentifier?: string;
	17	}
	18
	19	export type FilePreviewSource = Omit<ResolvedFilePreviewSource, "uri"> &
	20	(
	21	\| { readonly uri: string }
	22	\| { readonly attachment: DraftComposerFileAttachment }
	23	\| { readonly environmentId: EnvironmentId; readonly resource: AssetResource }
	24	);
	25
	26	function ResolvedFilePreview(props: {
	27	readonly source: FilePreviewSource;
	28	readonly onRequestClose: () => void;
	29	}) {
	30	const { source } = props;
	31	const environmentId = "environmentId" in source ? source.environmentId : null;
	32	const connection = usePreparedConnection(environmentId);
	33	const asset = useAssetUrlState(environmentId, "resource" in source ? source.resource : null);
	34	// Keep the original URL through dismissal; a refreshed signature must not reopen the viewer.
	35	const [uri, setUri] = useState<string \| null>("uri" in source ? source.uri : null);
	36	const onRequestClose = useEffectEvent(props.onRequestClose);
	37	const failed =
	38	environmentId !== null &&
	39	uri === null &&
	40	(connection._tag === "None" \|\| asset._tag === "Failure");
	41	useEffect(() => Keyboard.dismiss(), []);
	42	useEffect(() => {
	43	if (uri === null && asset._tag === "Success") setUri(asset.url);
	44	}, [uri, asset]);
	45	useEffect(() => {
	46	if (!failed) return;
	47	Alert.alert("Could not open preview", "Reconnect to this environment and try again.");
	48	onRequestClose();
	49	}, [failed]);
	50	useEffect(() => {
	51	if (!("attachment" in source)) return;
	52	const controller = new AbortController();
	53	let release: (() => void) \| undefined;
	54	void loadLocalAttachmentPreview(source.attachment, controller.signal)
	55	.then((file) => {
	56	if (!file) return;
	57	if (controller.signal.aborted) {
	58	file.dispose();
	59	return;
	60	}
	61	release = file.dispose;
	62	setUri(file.uri);
	63	})
	64	.catch(() => {
	65	if (controller.signal.aborted) return;
	66	Alert.alert("Could not open preview", "Attach the file again and retry.");
	67	onRequestClose();
	68	});
	69	return () => {
	70	controller.abort();
	71	release?.();
	72	};
	73	}, [source]);
	74
	75	return uri === null ? null : (
	76	<FilePreview source={{ ...source, uri }} onRequestClose={props.onRequestClose} />
	77	);
	78	}
	79
	80	export function FilePreviewModal(props: {
	81	readonly source: FilePreviewSource \| null;
	82	readonly onRequestClose: () => void;
	83	}) {
	84	const isFocused = useIsFocused();
	85	const hasSource = props.source !== null;
	86	const onRequestClose = useEffectEvent(props.onRequestClose);
	87	useEffect(() => {
	88	if (!isFocused && hasSource) onRequestClose();
	89	}, [isFocused, hasSource]);
	90
	91	if (!props.source \|\| !isFocused) return null;
	92	return <ResolvedFilePreview source={props.source} onRequestClose={props.onRequestClose} />;
	93	}

apps/mobile/src/components/VideoPreviewModal.ios.tsx+2−2

@@ -4,7 +4,7 @@ import { requireNativeModule } from "expo"; · 3 unmodified lines
4	import { useEffect, useEffectEvent, useId, useState } from "react";	4	import { useEffect, useEffectEvent, useId, useState } from "react";
5	import { Alert, Keyboard } from "react-native";	5	import { Alert, Keyboard } from "react-native";
6		6
7	import { loadLocalVideoPreview } from "../lib/localVideoPreview";	7	import { loadLocalAttachmentPreview } from "../lib/localAttachmentPreview";
8	import { useAssetUrlState } from "../state/assets";	8	import { useAssetUrlState } from "../state/assets";
9	import { usePreparedConnection } from "../state/session";	9	import { usePreparedConnection } from "../state/session";
10	import type { VideoPreviewSource } from "./VideoPreviewModal";	10	import type { VideoPreviewSource } from "./VideoPreviewModal";
@@ -67,7 +67,7 @@ function NativeVideoPreview(props: { · 56 unmodified lines
67	void (async () => {	67	void (async () => {
68	const file =	68	const file =
69	source.type === "local"	69	source.type === "local"
70	? await loadLocalVideoPreview(source.attachment, controller.signal)	70	? await loadLocalAttachmentPreview(source.attachment, controller.signal)
71	: null;	71	: null;
72	if (source.type === "local" && !file) return;	72	if (source.type === "local" && !file) return;
73	try {	73	try {

apps/mobile/src/components/VideoPreviewModal.tsx+2−2

@@ -20,7 +20,7 @@ import { · 19 unmodified lines
20	type AttachmentPreviewFile,	20	type AttachmentPreviewFile,
21	} from "../lib/attachmentDownload";	21	} from "../lib/attachmentDownload";
22	import type { DraftComposerFileAttachment } from "../lib/composerImages";	22	import type { DraftComposerFileAttachment } from "../lib/composerImages";
23	import { loadLocalVideoPreview } from "../lib/localVideoPreview";	23	import { loadLocalAttachmentPreview } from "../lib/localAttachmentPreview";
24	import { useAssetUrlState } from "../state/assets";	24	import { useAssetUrlState } from "../state/assets";
25	import { usePreparedConnection } from "../state/session";	25	import { usePreparedConnection } from "../state/session";
26	import { SymbolView } from "./AppSymbol";	26	import { SymbolView } from "./AppSymbol";
@@ -155,7 +155,7 @@ function OpenVideoPreviewModal(props: { · 128 unmodified lines
155	setFailure(null);	155	setFailure(null);
156	const loading =	156	const loading =
157	source.type === "local"	157	source.type === "local"
158	? loadLocalVideoPreview(source.attachment, controller.signal)	158	? loadLocalAttachmentPreview(source.attachment, controller.signal)
159	: downloadAttachmentForPreview({	159	: downloadAttachmentForPreview({
160	url: downloadUrl!,	160	url: downloadUrl!,
161	attachment: { name: attachment.name, mimeType },	161	attachment: { name: attachment.name, mimeType },

apps/mobile/src/components/VideoThumbnailImage.tsx+2−2

@@ -5,7 +5,7 @@ import { useEffect, useState } from "react"; · 4 unmodified lines
5	import { StyleSheet } from "react-native";	5	import { StyleSheet } from "react-native";
6		6
7	import type { DraftComposerFileAttachment } from "../lib/composerImages";	7	import type { DraftComposerFileAttachment } from "../lib/composerImages";
8	import { loadLocalVideoPreview } from "../lib/localVideoPreview";	8	import { loadLocalAttachmentPreview } from "../lib/localAttachmentPreview";
9	import { cachedVideoThumbnail, loadVideoThumbnail } from "../lib/videoThumbnails";	9	import { cachedVideoThumbnail, loadVideoThumbnail } from "../lib/videoThumbnails";
10		10
11	export function VideoThumbnailImage(props: {	11	export function VideoThumbnailImage(props: {
@@ -25,7 +25,7 @@ export function VideoThumbnailImage(props: { · 13 unmodified lines
25	async (signal) =>	25	async (signal) =>
26	typeof source === "string"	26	typeof source === "string"
27	? { uri: source, dispose: () => undefined }	27	? { uri: source, dispose: () => undefined }
28	: loadLocalVideoPreview(source, signal),	28	: loadLocalAttachmentPreview(source, signal),
29	controller.signal,	29	controller.signal,
30	).then((thumbnail) => {	30	).then((thumbnail) => {
31	if (thumbnail && !controller.signal.aborted) setLoaded({ key: cacheKey, thumbnail });	31	if (thumbnail && !controller.signal.aborted) setLoaded({ key: cacheKey, thumbnail });

apps/mobile/src/features/files/ThreadFilesRouteScreen.tsx+30−1

 import { AppText as Text, AppTextInput as TextInput } from "../../components/AppText";
 import { ControlPillMenu } from "../../components/ControlPill";
 import { EmptyState } from "../../components/EmptyState";
+import { FilePreviewModal, type FilePreviewSource } from "../../components/FilePreviewModal";
 import { LoadingScreen } from "../../components/LoadingScreen";
 import { resolveFileSelectionNavigationAction } from "../../lib/adaptive-navigation";
 import { copyTextWithHaptic } from "../../lib/copyTextWithHaptic";
+import { isPdfFile } from "../../lib/filePreview";
 import { tryOpenExternalUrl } from "../../lib/openExternalUrl";
 import { useUniwindTheme } from "../../lib/useUniwindTheme";
 import { useThreadSelection } from "../../state/use-thread-selection";
     readonly mode: FileViewMode;
   } | null>(null);
   const [previewRevision, setPreviewRevision] = useState(0);
+  const [fullScreenPreview, setFullScreenPreview] = useState<FilePreviewSource | null>(null);
   const isBrowserFile = relativePath !== null && isBrowserPreviewFile(relativePath);
   const isImageFile = relativePath !== null && isImagePreviewFile(relativePath);
   const canPreview =
         inline: false,
         onPress: () => copyTextWithHaptic(relativePath),
       } as const,
+      isPdfFile({ name: relativePath }) && previewUri !== null
+        ? ({
+            id: "open-pdf",
+            title: "Open PDF",
+            icon: "arrow.up.left.and.arrow.down.right",
+            inline: false,
+            onPress: () =>
+              setFullScreenPreview({
+                kind: "pdf",
+                uri: previewUri,
+                name: basename(relativePath),
+              }),
+          } as const)
+        : null,
       isBrowserFile && typeof assetPreviewUri === "string"
         ? ({
             id: "open-browser",
           } as const)
         : null,
     ].filter((action) => action !== null);
-  }, [assetPreviewUri, canPreview, isBrowserFile, isImageFile, relativePath, resolvedActiveMode]);
+  }, [
+    assetPreviewUri,
+    previewUri,
+    canPreview,
+    isBrowserFile,
+    isImageFile,
+    relativePath,
+    resolvedActiveMode,
+  ]);
   const androidFileMenuActions = useMemo<MenuAction[]>(
     () =>
           truncated={fileData?.truncated ?? false}
           onRefresh={() => fileQuery.refresh()}
         />
+        <FilePreviewModal
+          source={fullScreenPreview}
+          onRequestClose={() => setFullScreenPreview(null)}
+        />
       </View>
     </ReviewHighlighterProvider>
   );

apps/mobile/src/features/files/WorkspaceFileImagePreview.tsx+26−23

 import { useAtomValue } from "@effect/atom-react";
-import { useMemo, useState } from "react";
+import { useId, useMemo, useState } from "react";
 import { ActivityIndicator, Image, Pressable, View } from "react-native";
-import ImageViewing from "react-native-image-viewing";
 import { AsyncResult } from "effect/unstable/reactivity";
 import { AppText as Text } from "../../components/AppText";
 import { EmptyState } from "../../components/EmptyState";
 import { workspaceFileImageAtom } from "./workspace-file-image-cache";
+import { FilePreviewModal, type FilePreviewSource } from "../../components/FilePreviewModal";
+import { PresentationSource } from "../../components/NativePresentation";
 function ResolvedWorkspaceFileImagePreview(props: {
   readonly accessibilityLabel: string;
   readonly uri: string;
 }) {
   const [loadError, setLoadError] = useState<string | null>(null);
-  const [fullScreenVisible, setFullScreenVisible] = useState(false);
+  const [preview, setPreview] = useState<FilePreviewSource | null>(null);
+  const sourceIdentifier = useId();
   const imageSource = useMemo(
     () => ({ uri: props.uri, cache: "force-cache" as const }),
     [props.uri],
   );
-  const fullScreenImages = useMemo(() => [imageSource], [imageSource]);
   return (
     <View className="relative flex-1 bg-subtle">
         accessibilityLabel={`Open full-screen preview of ${props.accessibilityLabel}`}
         disabled={loadError !== null}
         className="flex-1 p-4 active:bg-subtle-strong"
-        onPress={() => setFullScreenVisible(true)}
+        onPress={() =>
+          setPreview({
+            kind: "image",
+            uri: props.uri,
+            name: props.accessibilityLabel,
+            sourceIdentifier,
+          })
+        }
       >
-        <Image
+        <PresentationSource identifier={sourceIdentifier} style={{ flex: 1 }}>
-          accessible={false}
+          <Image
-          source={imageSource}
+            accessible={false}
-          className="h-full w-full"
+            source={imageSource}
-          resizeMode="contain"
+            className="h-full w-full"
-          onLoadStart={() => setLoadError(null)}
+            resizeMode="contain"
-          onError={(event) => {
+            onLoadStart={() => setLoadError(null)}
-            setLoadError(event.nativeEvent.error || "The image could not be rendered.");
+            onError={(event) => {
-          }}
+              setLoadError(event.nativeEvent.error || "The image could not be rendered.");
-        />
+            }}
+          />
+        </PresentationSource>
       </Pressable>
       {loadError !== null ? (
         </View>
       ) : null}
-      <ImageViewing
+      <FilePreviewModal source={preview} onRequestClose={() => setPreview(null)} />
-        images={fullScreenImages}
-        imageIndex={0}
-        visible={fullScreenVisible}
-        onRequestClose={() => setFullScreenVisible(false)}
-        swipeToCloseEnabled
-        doubleTapToZoomEnabled
-      />
     </View>
   );
 }

apps/mobile/src/features/review/ReviewCommentComposerSheet.tsx+4−11

 import { Platform, Pressable, ScrollView, View, useWindowDimensions } from "react-native";
 import { KeyboardAvoidingView, KeyboardStickyView } from "react-native-keyboard-controller";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
-import ImageViewing from "react-native-image-viewing";
+import { FilePreviewModal, type FilePreviewSource } from "../../components/FilePreviewModal";
 import { AppText as Text, AppTextInput as TextInput } from "../../components/AppText";
 import { SymbolView } from "../../components/AppSymbol";
     Record<string, ReadonlyArray<ReviewHighlightedToken>>
   >({});
   const [attachments, setAttachments] = useState<ReadonlyArray<DraftComposerImageAttachment>>([]);
-  const [previewImageUri, setPreviewImageUri] = useState<string | null>(null);
+  const [previewFile, setPreviewFile] = useState<FilePreviewSource | null>(null);
   const selectedLines = useMemo(
     () => (target ? getSelectedReviewCommentLines(target) : []),
                         attachments={attachments}
                         imageBorderRadius={16}
                         imageSize={60}
-                        onPressImage={setPreviewImageUri}
+                        onPressPreview={setPreviewFile}
                         removeButtonPlacement="gutter"
                         onRemove={(imageId) => {
                           setAttachments((current) =>
           </View>
         </KeyboardStickyView>
       ) : null}
-      <ImageViewing
+      <FilePreviewModal source={previewFile} onRequestClose={() => setPreviewFile(null)} />
-        images={previewImageUri ? [{ uri: previewImageUri }] : []}
-        imageIndex={0}
-        visible={previewImageUri !== null}
-        onRequestClose={() => setPreviewImageUri(null)}
-        swipeToCloseEnabled
-        doubleTapToZoomEnabled
-      />
     </View>
   );
 }

apps/mobile/src/features/threads/NewTaskDraftScreen.tsx+21−5

 import { AndroidScreenHeader } from "../../components/AndroidScreenHeader";
 import { ComposerAttachmentButton } from "../../components/ComposerAttachmentButton";
 import { ComposerAttachmentStrip } from "../../components/ComposerAttachmentStrip";
+import { FilePreviewModal, type FilePreviewSource } from "../../components/FilePreviewModal";
 import { VideoPreviewModal, type VideoPreviewSource } from "../../components/VideoPreviewModal";
 import { ProviderIcon } from "../../components/ProviderIcon";
 import { SymbolView } from "../../components/AppSymbol";
   const loadedBranchesProjectKeyRef = useRef<string | null>(null);
   const [isComposerFocused, setIsComposerFocused] = useState(false);
   const [previewVideo, setPreviewVideo] = useState<VideoPreviewSource | null>(null);
-  const wasFocusedBeforeVideoRef = useRef(false);
+  const [previewFile, setPreviewFile] = useState<FilePreviewSource | null>(null);
+  const wasFocusedBeforePreviewRef = useRef(false);
   const openVideoPreview = useCallback(
     (attachment: DraftComposerFileAttachment, sourceIdentifier: string) => {
-      wasFocusedBeforeVideoRef.current = isComposerFocused;
+      wasFocusedBeforePreviewRef.current = isComposerFocused;
+      setPreviewFile(null);
       setPreviewVideo((current) => current ?? { type: "local", attachment, sourceIdentifier });
     },
     [isComposerFocused],
   );
-  const closeVideoPreview = useCallback(() => {
+  const openFilePreview = useCallback(
+    (source: FilePreviewSource) => {
+      wasFocusedBeforePreviewRef.current = isComposerFocused;
+      setPreviewVideo(null);
+      setPreviewFile((current) => current ?? source);
+    },
+    [isComposerFocused],
+  );
+  const closeMediaPreview = useCallback(() => {
     setPreviewVideo(null);
-    if (wasFocusedBeforeVideoRef.current) {
+    setPreviewFile(null);
+    if (wasFocusedBeforePreviewRef.current) {
       setTimeout(() => {
         if (navigation.isFocused()) promptInputRef.current?.focus();
       }, 100);
                   ? () => undefined
                   : flow.removeAttachment
               }
+              onPressPreview={
+                isComposerInteractionLocked || voiceInput.isBusy ? undefined : openFilePreview
+              }
               onPressVideo={
                 isComposerInteractionLocked || voiceInput.isBusy ? undefined : openVideoPreview
               }
           </ComposerDictationToolbar>
         </Animated.View>
       </ComposerSurface>
-      <VideoPreviewModal source={previewVideo} onRequestClose={closeVideoPreview} />
+      <VideoPreviewModal source={previewVideo} onRequestClose={closeMediaPreview} />
+      <FilePreviewModal source={previewFile} onRequestClose={closeMediaPreview} />
     </View>
   );

apps/mobile/src/features/threads/ThreadComposer.tsx+10−17

   type RefObject,
 } from "react";
 import { ActivityIndicator, Platform, Pressable, View, type ViewStyle } from "react-native";
-import ImageViewing from "react-native-image-viewing";
+import { FilePreviewModal, type FilePreviewSource } from "../../components/FilePreviewModal";
 import Animated, {
   FadeIn,
   FadeInDown,
   const inFlightThreadIdsRef = useRef(new Set<string>());
   const { onExpandedChange } = props;
-  const [previewImageUri, setPreviewImageUri] = useState<string | null>(null);
+  const [previewFile, setPreviewFile] = useState<FilePreviewSource | null>(null);
   const [previewVideo, setPreviewVideo] = useState<VideoPreviewSource | null>(null);
   const hasContent = props.draftMessage.trim().length > 0 || props.draftAttachments.length > 0;
   const showStopAction =
     onExpandedChange?.(isExpanded);
   }, [isExpanded, onExpandedChange]);
-  const onPressImage = useCallback(
+  const onPressPreview = useCallback(
-    (uri: string) => {
+    (source: FilePreviewSource) => {
       wasExpandedBeforePreviewRef.current = isFocused;
       setPreviewVideo(null);
-      setPreviewImageUri(uri);
+      setPreviewFile((current) => current ?? source);
     },
     [isFocused],
   );
   const closePreview = useCallback(() => {
-    setPreviewImageUri(null);
+    setPreviewFile(null);
     setPreviewVideo(null);
     if (wasExpandedBeforePreviewRef.current) {
       setTimeout(() => {
   const onPressVideo = useCallback(
     (attachment: DraftComposerFileAttachment, sourceIdentifier: string) => {
       wasExpandedBeforePreviewRef.current = isFocused;
-      setPreviewImageUri(null);
+      setPreviewFile(null);
       setPreviewVideo((current) => current ?? { type: "local", attachment, sourceIdentifier });
     },
     [isFocused],
                 <ComposerAttachmentStrip
                   attachments={props.draftAttachments}
                   onRemove={voiceInput.isBusy ? () => undefined : props.onRemoveDraftImage}
-                  onPressImage={voiceInput.isBusy ? undefined : onPressImage}
+                  onPressPreview={voiceInput.isBusy ? undefined : onPressPreview}
                   onPressVideo={voiceInput.isBusy ? undefined : onPressVideo}
                 />
               </Animated.View>
                     size={30}
                     borderRadius={8}
                     compact
-                    onPressImage={onPressImage}
+                    onPressPreview={onPressPreview}
                     onPressVideo={onPressVideo}
                   />
                 ))}
       </Animated.View>
       <VideoPreviewModal source={previewVideo} onRequestClose={closePreview} />
-      <ImageViewing
+      <FilePreviewModal source={previewFile} onRequestClose={closePreview} />
-        images={previewImageUri ? [{ uri: previewImageUri }] : []}
-        imageIndex={0}
-        visible={previewImageUri !== null}
-        onRequestClose={closePreview}
-        swipeToCloseEnabled
-        doubleTapToZoomEnabled
-      />
     </Animated.View>
   );
 });

apps/mobile/src/features/threads/ThreadFeed.tsx+152−79

   useMemo,
   useRef,
   useState,
+  useId,
   type ReactNode,
   type RefObject,
 } from "react";
   View,
   type ViewStyle,
 } from "react-native";
-import { TouchableOpacity } from "react-native-gesture-handler";
+import { FilePreviewModal, type FilePreviewSource } from "../../components/FilePreviewModal";
-import ImageViewing from "react-native-image-viewing";
+import { isPdfFile } from "../../lib/filePreview";
+import { PresentationSource } from "../../components/NativePresentation";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
 import Animated, {
   FadeIn,
 function MessageAttachmentImage(props: {
   readonly environmentId: EnvironmentId;
   readonly attachmentId: string;
+  readonly name: string;
   readonly className: string;
-  readonly onPressImage: (uri: string, headers?: Record<string, string>) => void;
+  readonly onPressPreview: (source: FilePreviewSource) => void;
 }) {
+  const sourceIdentifier = useId();
   const uri = useAssetUrl(props.environmentId, {
     _tag: "attachment",
     attachmentId: props.attachmentId,
   }
   return (
-    <TouchableOpacity activeOpacity={0.7} onPress={() => props.onPressImage(uri)}>
+    <PresentationSource identifier={sourceIdentifier}>
-      <Image source={{ uri }} className={props.className} resizeMode="cover" />
+      <Pressable
-    </TouchableOpacity>
+        accessibilityRole="imagebutton"
+        accessibilityLabel={`Open ${props.name}`}
+        onPress={() =>
+          props.onPressPreview({ kind: "image", uri, name: props.name, sourceIdentifier })
+        }
+      >
+        <Image source={{ uri }} className={props.className} resizeMode="cover" />
+      </Pressable>
+    </PresentationSource>
   );
 }
 function MessageAttachmentFile(props: {
   readonly environmentId: EnvironmentId;
   readonly attachment: ChatFileAttachment;
+  readonly onPressPreview: (source: FilePreviewSource) => void;
   readonly onPressVideo: (attachment: ChatFileAttachment, sourceIdentifier: string) => void;
 }) {
+  const sourceIdentifier = useId();
   const createAssetUrl = useAtomQueryRunner(assetEnvironment.createUrl, {
     reportFailure: false,
   });
   const preparedConnection = usePreparedConnection(props.environmentId);
   const { attachment } = props;
   const videoType = videoMimeType(attachment);
+  const isPdf = isPdfFile(attachment);
+  const fileTypeLabel = isPdf
+    ? "PDF"
+    : (attachment.name.match(/\.([a-z0-9]{1,8})$/i)?.[1]?.toUpperCase() ?? "File");
+  const sizeLabel = formatAttachmentSize(attachment.sizeBytes);
   const thumbnailUrl = useAssetUrl(
     props.environmentId,
     videoType === null
   }
   return (
-    <Pressable
+    <PresentationSource
-      accessibilityRole="button"
+      identifier={sourceIdentifier}
-      accessibilityLabel={`Open ${attachment.name}`}
+      className="my-1"
-      accessibilityState={{ disabled: opening || httpBaseUrl === null, busy: opening }}
+      style={{ width: 280, maxWidth: "100%" }}
-      disabled={opening || httpBaseUrl === null}
-      className="flex-row items-center gap-2 py-1"
-      onPress={() => shareFile()}
     >
-      {opening ? (
+      <Pressable
-        <ActivityIndicator size="small" />
+        accessibilityRole="button"
-      ) : (
+        accessibilityLabel={`Open ${attachment.name}`}
-        <SymbolView name="doc.text" size={16} tintColor="#a3a3a3" type="monochrome" />
+        accessibilityValue={{ text: `${fileTypeLabel}, ${sizeLabel}` }}
-      )}
+        accessibilityState={{ disabled: opening || httpBaseUrl === null, busy: opening }}
-      <Text className="min-w-0 flex-1 text-sm text-foreground" numberOfLines={1}>
+        disabled={opening || httpBaseUrl === null}
-        {attachment.name}
+        className="min-w-0 flex-row items-center gap-3 rounded-xl border border-border bg-card p-3 active:bg-subtle"
-      </Text>
+        onPress={() =>
-      <Text className="text-xs text-foreground-muted">
+          isPdf
-        {formatAttachmentSize(attachment.sizeBytes)}
+            ? props.onPressPreview({
-      </Text>
+                kind: "pdf",
-    </Pressable>
+                name: attachment.name,
+                environmentId: props.environmentId,
+                resource: {
+                  _tag: "attachment",
+                  attachmentId: attachment.id,
+                  fileName: attachment.name,
+                  mimeType: "application/pdf",
+                },
+                sourceIdentifier,
+              })
+            : shareFile(sourceIdentifier)
+        }
+      >
+        <View className="h-12 w-10 shrink-0 items-center justify-center rounded-lg bg-subtle">
+          {opening ? (
+            <ActivityIndicator size="small" />
+          ) : (
+            <SymbolView
+              name="doc.text"
+              size={26}
+              tintColorClassName={isPdf ? "accent-red-500" : "accent-foreground-muted"}
+              type="monochrome"
+            />
+          )}
+        </View>
+        <View className="min-w-0 flex-1 gap-1">
+          <Text className="font-t3-medium text-sm text-foreground" numberOfLines={2}>
+            {attachment.name}
+          </Text>
+          <Text className="text-xs text-foreground-muted" numberOfLines={1}>
+            {fileTypeLabel} · {sizeLabel}
+          </Text>
+        </View>
+        <SymbolView
+          name="chevron.right"
+          size={12}
+          tintColorClassName="accent-foreground-muted"
+          type="monochrome"
+        />
+      </Pressable>
+    </PresentationSource>
   );
 }
   readonly sourceKey: string;
   readonly unavailable: boolean;
   readonly alt: string | null;
-  readonly onPressImage: (uri: string) => void;
+  readonly onPressPreview: (source: FilePreviewSource) => void;
 }) {
+  const sourceIdentifier = useId();
   const [availableWidth, setAvailableWidth] = useState(0);
   const [sourceSize, setSourceSize] = useState<{ width: number; height: number } | null>(null);
   const [failedUri, setFailedUri] = useState<string | null>(null);
           )}
         </View>
       ) : (
-        <TouchableOpacity
+        <PresentationSource identifier={sourceIdentifier} style={{ alignSelf: "flex-start" }}>
-          accessibilityRole="imagebutton"
+          <Pressable
-          accessibilityLabel={props.alt ?? "Markdown image"}
+            accessibilityRole="imagebutton"
-          activeOpacity={0.7}
+            accessibilityLabel={props.alt ?? "Markdown image"}
-          onPress={() => props.onPressImage(props.uri!)}
+            onPress={() =>
-          style={{ alignSelf: "flex-start" }}
+              props.onPressPreview({
-        >
+                kind: "image",
-          <View
+                uri: props.uri!,
-            className="items-center justify-center overflow-hidden rounded-[10px] bg-md-code-bg"
+                name: props.alt ?? "Image",
-            style={{
+                sourceIdentifier,
-              ...frameStyle,
+              })
-            }}
+            }
+            style={{ alignSelf: "flex-start" }}
           >
-            <ThreadMarkdownImageRequest
+            <View
-              key={props.uri}
+              className="items-center justify-center overflow-hidden rounded-[10px] bg-md-code-bg"
-              uri={props.uri}
+              style={{
-              onLoad={setSourceSize}
+                ...frameStyle,
-              onError={() => setFailedUri(props.uri)}
+              }}
-            />
+            >
-          </View>
+              <ThreadMarkdownImageRequest
-        </TouchableOpacity>
+                key={props.uri}
+                uri={props.uri}
+                onLoad={setSourceSize}
+                onError={() => setFailedUri(props.uri)}
+              />
+            </View>
+          </Pressable>
+        </PresentationSource>
       )}
       {props.alt ? (
         <Text selectable className="text-xs text-foreground-muted">
   readonly threadId: ThreadId;
   readonly path: string;
   readonly alt: string | null;
-  readonly onPressImage: (uri: string) => void;
+  readonly onPressPreview: (source: FilePreviewSource) => void;
 }) {
   const assetUrl = useAssetUrlState(props.environmentId, {
     _tag: "workspace-file",
       sourceKey={props.path}
       unavailable={assetUrl._tag === "Failure"}
       alt={props.alt}
-      onPressImage={props.onPressImage}
+      onPressPreview={props.onPressPreview}
     />
   );
 }
       sourceKey="unavailable"
       unavailable
       alt={props.alt}
-      onPressImage={() => undefined}
+      onPressPreview={() => undefined}
     />
   );
 }
     readonly onToggleWorkGroup: (groupId: string) => void;
     readonly onToggleWorkRow: (rowId: string) => void;
     readonly onToggleTurnFold: (turnId: TurnId) => void;
-    readonly onPressImage: (uri: string, headers?: Record<string, string>) => void;
+    readonly onPressPreview: (source: FilePreviewSource) => void;
     readonly onPressVideo: (attachment: ChatFileAttachment, sourceIdentifier: string) => void;
     readonly onMarkdownLinkPress: (href: string) => void;
     readonly renderMarkdownImage: MarkdownImageRenderer;
                   key={attachment.id}
                   environmentId={props.environmentId}
                   attachmentId={attachment.id}
+                  name={attachment.name}
                   className="aspect-[1.3] w-full rounded-[14px] bg-white/15"
-                  onPressImage={props.onPressImage}
+                  onPressPreview={props.onPressPreview}
                 />
               ) : isFileAttachment(attachment) ? (
                 <MessageAttachmentFile
                   key={attachment.id}
                   environmentId={props.environmentId}
                   attachment={attachment}
+                  onPressPreview={props.onPressPreview}
                   onPressVideo={props.onPressVideo}
                 />
               ) : (
               key={attachment.id}
               environmentId={props.environmentId}
               attachmentId={attachment.id}
+              name={attachment.name}
               className="mt-1.5 aspect-[1.3] w-full rounded-[18px] bg-adaptive-neutral-200-800"
-              onPressImage={props.onPressImage}
+              onPressPreview={props.onPressPreview}
             />
           ) : isFileAttachment(attachment) ? (
             <MessageAttachmentFile
               key={attachment.id}
               environmentId={props.environmentId}
               attachment={attachment}
+              onPressPreview={props.onPressPreview}
               onPressVideo={props.onPressVideo}
             />
           ) : (
     expandedTurnIds: new Set(),
   });
   const { copiedRowId, expandedWorkGroups, expandedWorkRows, expandedTurnIds } = interactionState;
-  const [expandedImage, setExpandedImage] = useState<{
+  const [expandedFile, setExpandedFile] = useState<FilePreviewSource | null>(null);
-    uri: string;
-    headers?: Record<string, string>;
-  } | null>(null);
   const [expandedVideo, setExpandedVideo] = useState<VideoPreviewSource | null>(null);
   useEffect(() => {
     setExpandedVideo(null);
+    setExpandedFile(null);
   }, [props.environmentId, props.threadId, props.contentPresentation.kind]);
   const horizontalPadding = props.layoutVariant === "split" ? 20 : 16;
   const contentHorizontalPadding = deriveCenteredContentHorizontalPadding({
         );
         if (relativePath) {
           void Haptics.selectionAsync();
+          if (isPdfFile({ name: relativePath })) {
+            setExpandedFile(
+              (current) =>
+                current ?? {
+                  kind: "pdf",
+                  name: relativePath.split("/").at(-1),
+                  environmentId: props.environmentId,
+                  resource: {
+                    _tag: "workspace-file",
+                    threadId: props.threadId,
+                    path: relativePath,
+                  },
+                },
+            );
+            return;
+          }
           navigation.navigate("ThreadFile", {
             environmentId: String(props.environmentId),
             threadId: String(props.threadId),
       }
       if (presentation.href) {
+        if (/^https?:\/\//i.test(presentation.href) && isPdfFile({ name: presentation.href })) {
+          setExpandedFile(
+            (current) => current ?? { kind: "pdf", uri: presentation.href!, name: "Document.pdf" },
+          );
+          return;
+        }
         void tryOpenExternalUrl(presentation.href, "markdown-link");
       }
     },
             sourceKey={imageSource.uri}
             unavailable={false}
             alt={image.alt}
-            onPressImage={(uri) => setExpandedImage({ uri })}
+            onPressPreview={(source) => setExpandedFile((current) => current ?? source)}
           />
         );
       }
           threadId={props.threadId}
           path={imageSource.path}
           alt={image.alt}
-          onPressImage={(uri) => setExpandedImage({ uri })}
+          onPressPreview={(source) => setExpandedFile((current) => current ?? source)}
         />
       );
     },
     [suspendEndScrollMaintenanceForDisclosure],
   );
-  const onPressImage = useCallback((uri: string, headers?: Record<string, string>) => {
+  const onPressPreview = useCallback((source: FilePreviewSource) => {
-    setExpandedImage({ uri, headers });
+    setExpandedFile((current) => current ?? source);
   }, []);
   const onPressVideo = useCallback(
     (attachment: ChatFileAttachment, sourceIdentifier: string) => {
           onToggleWorkGroup,
           onToggleWorkRow,
           onToggleTurnFold,
-          onPressImage,
+          onPressPreview,
           onPressVideo,
           onMarkdownLinkPress,
           renderMarkdownImage,
       userBubbleMaxWidth,
       onCopyWorkRow,
       onMarkdownLinkPress,
-      onPressImage,
+      onPressPreview,
       onPressVideo,
       onToggleTurnFold,
       onToggleWorkGroup,
       </View>
       <VideoPreviewModal source={expandedVideo} onRequestClose={() => setExpandedVideo(null)} />
-      <ImageViewing
+      <FilePreviewModal source={expandedFile} onRequestClose={() => setExpandedFile(null)} />
-        images={
-          expandedImage
-            ? [
-                {
-                  uri: expandedImage.uri,
-                  headers: expandedImage.headers,
-                },
-              ]
-            : []
-        }
-        imageIndex={0}
-        visible={expandedImage !== null}
-        onRequestClose={() => setExpandedImage(null)}
-        swipeToCloseEnabled
-        doubleTapToZoomEnabled
-      />
     </>
   );
 });

apps/mobile/src/lib/composerFiles.test.ts+112−0

@@ -1,4 +1,5 @@
1	import { beforeEach, describe, expect, it, vi } from "vite-plus/test";	1	import { beforeEach, describe, expect, it, vi } from "vite-plus/test";
		2	import { PROVIDER_SEND_TURN_MAX_IMAGE_BYTES } from "@t3tools/contracts";
2	import type { ImagePickerAsset } from "expo-image-picker";	3	import type { ImagePickerAsset } from "expo-image-picker";
3		4
4	const mocks = vi.hoisted(() => ({	5	const mocks = vi.hoisted(() => ({
@@ -9,6 +10,7 @@ const mocks = vi.hoisted(() => ({ · 4 unmodified lines
9	delete: vi.fn(),	10	delete: vi.fn(),
10	open: vi.fn(),	11	open: vi.fn(),
11	size: vi.fn(),	12	size: vi.fn(),
		13	readBase64: vi.fn(),
12	}));	14	}));
13		15
14	vi.mock("expo-file-system", () => {	16	vi.mock("expo-file-system", () => {
@@ -55,6 +57,10 @@ vi.mock("expo-file-system", () => { · 40 unmodified lines
55	mocks.copy(this.uri, destination.uri);	57	mocks.copy(this.uri, destination.uri);
56	}	58	}
57		59
		60	async base64(): Promise<string> {
		61	return mocks.readBase64(this.uri);
		62	}
		63
58	delete(): void {	64	delete(): void {
59	mocks.delete(this.uri);	65	mocks.delete(this.uri);
60	}	66	}
@@ -95,9 +101,115 @@ describe("composer file attachments", () => { · 34 unmodified lines
95	mocks.delete.mockReset();	101	mocks.delete.mockReset();
96	mocks.open.mockReset();	102	mocks.open.mockReset();
97	mocks.size.mockReset();	103	mocks.size.mockReset();
		104	mocks.readBase64.mockReset();
98	mocks.size.mockImplementation((uri: string) => (uri.startsWith("content:") ? null : 42));	105	mocks.size.mockImplementation((uri: string) => (uri.startsWith("content:") ? null : 42));
99	});	106	});
100		107
		108	describe("photo library image conversion", () => {
		109	const jpeg = "/9j/2Q==";
		110	const photo: ImagePickerAsset = {
		111	uri: "file:///picker/photo.heic",
		112	type: "image",
		113	fileName: "photo.HEIC",
		114	mimeType: "image/heic",
		115	fileSize: 20 * 1024 * 1024,
		116	base64: jpeg,
		117	width: 1,
		118	height: 1,
		119	};
		120
		121	it.each(["image/heic", "image/heif", undefined])(
		122	"attaches the native JPEG conversion with matching metadata when the source MIME is %s",
		123	async (mimeType) => {
		124	mocks.pickMedia.mockResolvedValue({
		125	canceled: false,
		126	assets: [{ ...photo, mimeType }],
		127	});
		128
		129	const result = await pickComposerImages({ existingCount: 0 });
		130
		131	expect(result).toEqual({
		132	images: [
		133	{
		134	id: "attachment-id",
		135	type: "image",
		136	name: "photo.jpg",
		137	mimeType: "image/jpeg",
		138	sizeBytes: 4,
		139	dataUrl: `data:image/jpeg;base64,${jpeg}`,
		140	previewUri: `data:image/jpeg;base64,${jpeg}`,
		141	},
		142	],
		143	error: null,
		144	});
		145	},
		146	);
		147
		148	it.each([
		149	{ extension: "png", mimeType: "image/png", base64: "iVBORw0KGgo=" },
		150	{ extension: "gif", mimeType: "image/gif", base64: "R0lGODlh" },
		151	{ extension: "webp", mimeType: "image/webp", base64: "UklGRgQAAABXRUJQ" },
		152	])("preserves original $extension bytes instead of the picker's JPEG", async (original) => {
		153	const name = `photo.${original.extension}`;
		154	mocks.pickMedia.mockResolvedValue({
		155	canceled: false,
		156	assets: [{ ...photo, fileName: name, mimeType: original.mimeType }],
		157	});
		158	mocks.readBase64.mockResolvedValue(original.base64);
		159
		160	const result = await pickComposerImages({ existingCount: 0 });
		161
		162	expect(result.error).toBeNull();
		163	expect(result.images).toEqual([
		164	expect.objectContaining({
		165	name,
		166	mimeType: original.mimeType,
		167	dataUrl: `data:${original.mimeType};base64,${original.base64}`,
		168	sizeBytes: Buffer.from(original.base64, "base64").byteLength,
		169	}),
		170	]);
		171	});
		172
		173	it("checks the converted JPEG size even when the HEIC source was smaller", async () => {
		174	const oversized =
		175	jpeg.slice(0, 4) + "A".repeat(Math.ceil(PROVIDER_SEND_TURN_MAX_IMAGE_BYTES / 3) * 4);
		176	mocks.pickMedia.mockResolvedValue({
		177	canceled: false,
		178	assets: [{ ...photo, fileSize: 42, base64: oversized }],
		179	});
		180
		181	await expect(pickComposerImages({ existingCount: 0 })).resolves.toEqual({
		182	images: [],
		183	error: "'photo.HEIC' exceeds the 10 MB attachment limit.",
		184	});
		185	});
		186
		187	it("does not relabel unconverted HEIC bytes as JPEG", async () => {
		188	mocks.pickMedia.mockResolvedValue({
		189	canceled: false,
		190	assets: [{ ...photo, base64: "AAAAGGZ0eXBoZWlj" }],
		191	});
		192
		193	const result = await pickComposerImages({ existingCount: 0 });
		194
		195	expect(result.images).toEqual([]);
		196	expect(result.error).toContain("not a supported image type");
		197	});
		198
		199	it("retains a converted photo when another original cannot be read", async () => {
		200	mocks.pickMedia.mockResolvedValue({
		201	canceled: false,
		202	assets: [{ ...photo, fileName: "missing.gif", mimeType: "image/gif" }, photo],
		203	});
		204	mocks.readBase64.mockRejectedValue(new Error("missing file"));
		205
		206	const result = await pickComposerImages({ existingCount: 0 });
		207
		208	expect(result.images).toEqual([expect.objectContaining({ name: "photo.jpg" })]);
		209	expect(result.error).toBe("Failed to read 'missing.gif'.");
		210	});
		211	});
		212
101	describe("photo library videos", () => {	213	describe("photo library videos", () => {
102	const image: ImagePickerAsset = {	214	const image: ImagePickerAsset = {
103	uri: "file:///picker/photo.png",	215	uri: "file:///picker/photo.png",

apps/mobile/src/lib/composerImages.ts+37−11

       error = `You can attach up to ${PROVIDER_SEND_TURN_MAX_ATTACHMENTS} attachments per message.`;
       break;
     }
-    const mimeType = asset.mimeType?.toLowerCase();
+    let mimeType = asset.mimeType?.toLowerCase();
     if (asset.type === "video" || mimeType?.startsWith("video/")) {
       if (input.maxVideoBytes === undefined) {
         error = "Video attachments are unavailable here.";
       }
       continue;
     }
-    if (!mimeType?.startsWith("image/")) {
+    if (asset.type !== "image" && !mimeType?.startsWith("image/")) {
       error = `Unsupported file type for '${asset.fileName ?? "image"}'.`;
       continue;
     }
-    if (!isProviderSendTurnSupportedImageMimeType(mimeType)) {
-      error = `'${asset.fileName ?? "image"}' is not a supported image type. Attach GIF, JPEG, PNG, or WebP images.`;
-      continue;
-    }
-    const base64 = asset.base64;
+    let base64 = asset.base64;
     if (!base64) {
       error = `Failed to read '${asset.fileName ?? "image"}'.`;
       continue;
     }
-    const sizeBytes = asset.fileSize ?? estimateBase64ByteSize(base64);
+    let name = asset.fileName?.trim() || "image";
+    // The iOS picker returns JPEG base64 even when its metadata describes HEIC,
+    // PNG, or GIF. Keep supported originals so transparency and animation survive;
+    // use the native JPEG conversion for formats providers cannot accept.
+    if (base64.startsWith("/9j/")) {
+      if (
+        mimeType &&
+        mimeType !== "image/jpeg" &&
+        isProviderSendTurnSupportedImageMimeType(mimeType)
+      ) {
+        try {
+          const { File } = await import("expo-file-system");
+          base64 = await new File(asset.uri).base64();
+        } catch {
+          error = `Failed to read '${name}'.`;
+          continue;
+        }
+      } else {
+        mimeType = "image/jpeg";
+        if (!/\.jpe?g$/i.test(name)) {
+          name = `${name.replace(/\.[^.]+$/, "")}.jpg`;
+        }
+      }
+    }
+    if (!mimeType || !isProviderSendTurnSupportedImageMimeType(mimeType)) {
+      error = `'${name}' is not a supported image type. Attach GIF, JPEG, PNG, or WebP images.`;
+      continue;
+    }
+    const sizeBytes = estimateBase64ByteSize(base64);
     if (sizeBytes <= 0 || sizeBytes > PROVIDER_SEND_TURN_MAX_IMAGE_BYTES) {
       error = `'${asset.fileName ?? "image"}' exceeds the 10 MB attachment limit.`;
       continue;
     }
+    const dataUrl = `data:${mimeType};base64,${base64}`;
     attachments.push({
       id: uuidv4(),
       type: "image",
-      name: asset.fileName ?? "image",
+      name,
       mimeType,
       sizeBytes,
-      dataUrl: `data:${mimeType};base64,${base64}`,
+      dataUrl,
-      previewUri: asset.uri,
+      previewUri: mimeType === asset.mimeType?.toLowerCase() ? asset.uri : dataUrl,
     });
   }

apps/mobile/src/lib/filePreview.test.ts+17−0

@@ -0,0 +1,17 @@
	1	import { describe, expect, it } from "vite-plus/test";
	2
	3	import { isPdfFile } from "./filePreview";
	4
	5	describe("PDF preview detection", () => {
	6	it.each([
	7	[{ name: "download", mimeType: "application/pdf" }, true],
	8	[{ name: "download", mimeType: "APPLICATION/PDF; charset=binary" }, true],
	9	[{ name: "Report.PDF", mimeType: "application/octet-stream" }, true],
	10	[{ name: "https://example.com/report.pdf?signature=abc#page=2" }, true],
	11	[{ name: "report.pdf", mimeType: "text/plain" }, false],
	12	[{ name: "report.pdf.exe" }, false],
	13	[{ name: "https://example.com/page?download=report.pdf" }, false],
	14	])("classifies %j as %s", (file, expected) => {
	15	expect(isPdfFile(file)).toBe(expected);
	16	});
	17	});

apps/mobile/src/lib/filePreview.ts+6−0

@@ -0,0 +1,6 @@
	1	/** MIME metadata wins; use the extension for files reported without a specific type. */
	2	export function isPdfFile(file: { readonly name: string; readonly mimeType?: string }): boolean {
	3	const mimeType = file.mimeType?.split(";", 1)[0]?.trim().toLowerCase();
	4	if (mimeType && mimeType !== "application/octet-stream") return mimeType === "application/pdf";
	5	return /\.pdf$/i.test(file.name.split(/[?#]/, 1)[0] ?? "");
	6	}

apps/mobile/src/lib/localAttachmentPreview.test.tsrenamed from apps/mobile/src/lib/localVideoPreview.test.ts+23−10

   },
 }));
-import { loadLocalVideoPreview } from "./localVideoPreview";
+import { loadLocalAttachmentPreview } from "./localAttachmentPreview";
 const attachment = {
   type: "file" as const,
   mocks.share.mockResolvedValue(undefined);
 });
-describe("loadLocalVideoPreview", () => {
+describe("loadLocalAttachmentPreview", () => {
+  it("retains and shares a PDF with its original filename and type", async () => {
+    const pdf = { ...attachment, name: "report.pdf", mimeType: "application/pdf" };
+    const preview = await loadLocalAttachmentPreview(pdf, new AbortController().signal);
+    await preview!.share(new AbortController().signal);
+    expect(mocks.share).toHaveBeenCalledWith(
+      expect.objectContaining({
+        attachment: { name: "report.pdf", mimeType: "application/pdf" },
+      }),
+    );
+    expect(mocks.retain.mock.results[0]!.value).not.toHaveBeenCalled();
+    preview!.dispose();
+    expect(mocks.retain.mock.results[0]!.value).toHaveBeenCalledTimes(1);
+  });
   it("resolves the current iOS container and releases its playback lease once", async () => {
-    const preview = await loadLocalVideoPreview(attachment, new AbortController().signal);
+    const preview = await loadLocalAttachmentPreview(attachment, new AbortController().signal);
     expect(preview?.uri).toContain("/22222222-2222-4222-8222-222222222222/Documents/");
     expect(mocks.retain).toHaveBeenCalledWith(attachment);
     const release = mocks.retain.mock.results[0]!.value;
     async (sourceIdentifier) => {
       const shared = Promise.withResolvers<void>();
       mocks.share.mockReturnValue(shared.promise);
-      const preview = await loadLocalVideoPreview(attachment, new AbortController().signal);
+      const preview = await loadLocalAttachmentPreview(attachment, new AbortController().signal);
       const share = preview!.share(new AbortController().signal, sourceIdentifier);
       expect(mocks.retain).toHaveBeenCalledTimes(2);
       const releasePlayback = mocks.retain.mock.results[0]!.value;
   it("releases a failed share while keeping playback retained", async () => {
     mocks.share.mockRejectedValue(new Error("Sharing unavailable"));
-    const preview = await loadLocalVideoPreview(attachment, new AbortController().signal);
+    const preview = await loadLocalAttachmentPreview(attachment, new AbortController().signal);
     await expect(preview!.share(new AbortController().signal)).rejects.toThrow(
       "Sharing unavailable",
     );
   it("releases a load canceled during native module loading", async () => {
     const controller = new AbortController();
-    const loading = loadLocalVideoPreview(attachment, controller.signal);
+    const loading = loadLocalAttachmentPreview(attachment, controller.signal);
     controller.abort();
     await expect(loading).resolves.toBeNull();
     expect(mocks.retain.mock.results[0]!.value).toHaveBeenCalledTimes(1);
   it("reports missing files and releases their lease", async () => {
     mocks.exists.mockReturnValue(false);
-    await expect(loadLocalVideoPreview(attachment, new AbortController().signal)).rejects.toThrow(
+    await expect(
-      "This video is no longer available. Attach the file again.",
+      loadLocalAttachmentPreview(attachment, new AbortController().signal),
-    );
+    ).rejects.toThrow("This attachment is no longer available. Attach the file again.");
     expect(mocks.retain.mock.results[0]!.value).toHaveBeenCalledTimes(1);
   });
   it("does not start sharing a disposed preview", async () => {
-    const preview = await loadLocalVideoPreview(attachment, new AbortController().signal);
+    const preview = await loadLocalAttachmentPreview(attachment, new AbortController().signal);
     preview!.dispose();
     await preview!.share(new AbortController().signal);
     expect(mocks.share).not.toHaveBeenCalled();

apps/mobile/src/lib/localAttachmentPreview.tsrenamed from apps/mobile/src/lib/localVideoPreview.ts+3−3

@@ -5,8 +5,8 @@ import { resolveOwnedComposerAttachmentFileUri } from "./composerAttachmentFiles · 4 unmodified lines
5	import { shareLocalAttachment, type AttachmentPreviewFile } from "./attachmentDownload";	5	import { shareLocalAttachment, type AttachmentPreviewFile } from "./attachmentDownload";
6	import { retainComposerAttachmentFileForPreview } from "../state/use-composer-drafts";	6	import { retainComposerAttachmentFileForPreview } from "../state/use-composer-drafts";
7		7
8	/** Retains the draft original for playback and gives each outgoing share its own lease. */	8	/** Retains the draft original for preview and gives each outgoing share its own lease. */
9	export async function loadLocalVideoPreview(	9	export async function loadLocalAttachmentPreview(
10	attachment: DraftComposerFileAttachment,	10	attachment: DraftComposerFileAttachment,
11	signal: AbortSignal,	11	signal: AbortSignal,
12	): Promise<AttachmentPreviewFile \| null> {	12	): Promise<AttachmentPreviewFile \| null> {
@@ -54,6 +54,6 @@ export async function loadLocalVideoPreview( · 41 unmodified lines
54	} catch (cause) {	54	} catch (cause) {
55	release();	55	release();
56	if (signal.aborted) return null;	56	if (signal.aborted) return null;
57	throw new Error("This video is no longer available. Attach the file again.", { cause });	57	throw new Error("This attachment is no longer available. Attach the file again.", { cause });
58	}	58	}
59	}	59	}

apps/server/src/server.test.ts+37−1

@@ -103,7 +103,7 @@ const collectQueueUntil = Effect.fn("TransferBudget.collectQueueUntil")(function · 102 unmodified lines
103		103
104	import * as BackgroundPolicy from "./background/BackgroundPolicy.ts";	104	import * as BackgroundPolicy from "./background/BackgroundPolicy.ts";
105	import * as ServerConfig from "./config.ts";	105	import * as ServerConfig from "./config.ts";
106	import { makeRoutesLayer } from "./server.ts";	106	import { HTTP_ROUTER_CONFIG, makeRoutesLayer } from "./server.ts";
107	import {	107	import {
108	isThreadDetailEvent,	108	isThreadDetailEvent,
109	resolveAvailableEditorsForConfig,	109	resolveAvailableEditorsForConfig,
@@ -629,6 +629,7 @@ const buildAppUnderTest = (options?: { · 519 unmodified lines
629	{	629	{
630	disableListenLog: true,	630	disableListenLog: true,
631	disableLogger: true,	631	disableLogger: true,
		632	routerConfig: HTTP_ROUTER_CONFIG,
632	},	633	},
633	).pipe(	634	).pipe(
634	Layer.provide(	635	Layer.provide(
@@ -1527,6 +1528,41 @@ it.layer(NodeServices.layer)("server router seam", (it) => { · 892 unmodified lines
1527	}).pipe(Effect.provide(NodeHttpServer.layerTest)),	1528	}).pipe(Effect.provide(NodeHttpServer.layerTest)),
1528	);	1529	);
1529		1530
		1531	it.effect("serves snapshots for MCP handoff thread IDs above the router default", () =>
		1532	Effect.gen(function* () {
		1533	const threadId = ThreadId.make(
		1534	"thread:mcp:abfba0d2-b591-4b7e-aad1-e943d89811fa:handoff%3A0ae5edf4-2ea3-4ee3-ba7c-48de3ac92896%3A2026-08-24T17%3A08%3A52.138Z:0",
		1535	);
		1536	const thread = {
		1537	...makeDefaultOrchestrationReadModel().threads[0]!,
		1538	id: threadId,
		1539	};
		1540	yield* buildAppUnderTest({
		1541	layers: {
		1542	projectionSnapshotQuery: {
		1543	getThreadDetailSnapshot: (requestedThreadId) =>
		1544	Effect.succeed(
		1545	requestedThreadId === threadId
		1546	? Option.some({ snapshotSequence: 1, thread })
		1547	: Option.none(),
		1548	),
		1549	},
		1550	},
		1551	});
		1552
		1553	const response = yield* fetchEffect(
		1554	yield* getHttpServerUrl(`/api/orchestration/threads/${encodeURIComponent(threadId)}`),
		1555	{ headers: { cookie: yield* getAuthenticatedSessionCookieHeader() } },
		1556	);
		1557	const snapshot = yield* responseJsonEffect<{
		1558	readonly thread: { readonly id: ThreadId };
		1559	}>(response);
		1560
		1561	assert.equal(response.status, 200);
		1562	assert.equal(snapshot.thread.id, threadId);
		1563	}).pipe(Effect.provide(NodeHttpServer.layerTest)),
		1564	);
		1565
1530	it.effect("compresses large JSON responses through the composed routes", () =>	1566	it.effect("compresses large JSON responses through the composed routes", () =>
1531	Effect.gen(function* () {	1567	Effect.gen(function* () {
1532	const descriptor = {	1568	const descriptor = {

apps/server/src/server.ts+7−0

 import { disableTailscaleServe, ensureTailscaleServe } from "@t3tools/tailscale";
 import { forkParked, ServerActivation } from "./serverActivation.ts";
+// MCP handoff thread IDs include escaped provenance and can exceed find-my-way's
+// 100-character default for one path segment.
+export const HTTP_ROUTER_CONFIG = {
+  maxParamLength: 512,
+} as const;
 // Effect's default preemptive shutdown waits 20s before finalizing request scopes.
 // T3's primary transport is long-lived WebSocket RPC, whose Effect scope finalizer
 // already closes the websocket gracefully. Do not add an artificial drain before
     const routesLayer = HttpRouter.serve(makeRoutesLayer.pipe(Layer.provide(launcherLayer)), {
       disableLogger: !config.logWebSocketEvents,
+      routerConfig: HTTP_ROUTER_CONFIG,
     }).pipe(Layer.tap(() => Deferred.succeed(routesReady, undefined).pipe(Effect.orDie)));
     const serverApplicationLayer = Layer.mergeAll(
       routesLayer,

apps/server/src/usage/usageScanCache.test.ts+14−0

@@ -193,6 +193,20 @@ describe("pruneScanCache with an unwalked root", () => { · 192 unmodified lines
193	expect(removed).toBe(0);	193	expect(removed).toBe(0);
194	expect(cache.size).toBe(1);	194	expect(cache.size).toBe(1);
195	});	195	});
		196
		197	it("keeps entries under a sibling path that only shares the walked root prefix", () => {
		198	const cache = cacheWith([["/claude/projects-copy/a.jsonl", 5000, [record()]]]);
		199
		200	const removed = pruneScanCache(cache, {
		201	livePaths: new Set(),
		202	walkedRoots: ["/claude/projects"],
		203	windowStartMs: 4000,
		204	retentionCutoffMs: 1000,
		205	});
		206
		207	expect(removed).toBe(0);
		208	expect(cache.size).toBe(1);
		209	});
196	});	210	});
197		211
198	describe("dedupeWithinFile", () => {	212	describe("dedupeWithinFile", () => {

apps/server/src/usage/usageScanCache.ts+12−1

  *
  * @module usageScanCache
  */
+// @effect-diagnostics nodeBuiltinImport:off
+import * as NodePath from "node:path";
 import type { UsageProviderKind } from "@t3tools/contracts";
 import type { UsageRecord } from "./usageTranscripts.ts";
   let removed = 0;
   for (const [path, entry] of cache) {
     const agedOut = entry.mtimeMs < options.retentionCutoffMs;
-    const underWalkedRoot = options.walkedRoots.some((root) => path.startsWith(root));
+    const underWalkedRoot = options.walkedRoots.some((root) => {
+      const relative = NodePath.relative(root, path);
+      return (
+        relative === "" ||
+        (relative !== ".." &&
+          !relative.startsWith(`..${NodePath.sep}`) &&
+          !NodePath.isAbsolute(relative))
+      );
+    });
     const deleted =
       underWalkedRoot && entry.mtimeMs >= options.windowStartMs && !options.livePaths.has(path);
     if (agedOut || deleted) {

apps/web/src/components/BranchToolbar.tsx+7−5

     let needed = 0;
     let groups = 0;
     for (const child of current.children) {
-      if (!(child instanceof HTMLElement) || child.offsetWidth <= 1) continue;
+      if (!(child instanceof HTMLElement)) continue;
-      needed += contentWidth(child);
+      const width = contentWidth(child);
+      if (width <= 1) continue;
+      needed += width;
       groups += 1;
     }
     needed += stripGap * Math.max(0, groups - 1);
   // Label widths can change without the strip box moving (font family or
   // size preferences), so re-measure on every render as well as on resize
   // and font loads.
-  useEffect(() => {
+  useLayoutEffect(() => {
     measure();
   });
           onUsePreviousWorktree={onUsePreviousWorktree}
         />
       ) : (
-        <div className="flex min-w-0 flex-1 items-center gap-1">
+        <div className="flex min-w-10 flex-1 items-center gap-1">
           {showEnvironmentIndicator && availableEnvironments && (
             <>
               <BranchToolbarEnvironmentSelector
       {showGitControls ? (
         <BranchToolbarBranchSelector
-          className="min-w-0 flex-1 justify-end md:ml-auto md:flex-none"
+          className="min-w-0 flex-1 justify-end md:ml-auto md:flex-initial"
           environmentId={environmentId}
           threadId={threadId}
           {...(draftId ? { draftId } : {})}

apps/web/src/components/BranchToolbarEnvModeSelector.tsx+14−9

   if (envLocked) {
     return (
       <span
-        className="inline-flex h-7 shrink-0 items-center gap-1 border border-transparent px-[calc(--spacing(3)-1px)] text-sm font-medium text-muted-foreground/70 sm:h-6 sm:text-xs"
+        className="inline-flex h-7 min-w-0 items-center gap-1 border border-transparent px-[calc(--spacing(3)-1px)] text-sm font-medium text-muted-foreground/70 sm:h-6 sm:text-xs"
         data-composer-context-control
       >
         {activeWorktreePath ? (
-          <>
+          <FolderGitIcon className="size-3 shrink-0" />
-            <FolderGitIcon className="size-3" />
-            {resolveLockedWorkspaceLabel(activeWorktreePath)}
-          </>
         ) : (
-          <>
+          <FolderIcon className="size-3 shrink-0" />
-            <FolderIcon className="size-3" />
-            {resolveLockedWorkspaceLabel(activeWorktreePath)}
-          </>
         )}
+        <span
+          data-composer-label
+          className="min-w-0 max-w-[240px] group-data-[compact]/composer-context:max-w-0"
+        >
+          <span
+            data-composer-label-motion
+            className="block w-full min-w-0 max-w-[240px] origin-left truncate transition-[opacity,transform] duration-180 ease-[cubic-bezier(0.32,0.72,0,1)] group-data-[compact]/composer-context:[transform:translateX(-0.25rem)_scaleX(0.95)] group-data-[compact]/composer-context:opacity-0 motion-reduce:transform-none motion-reduce:transition-opacity"
+          >
+            {resolveLockedWorkspaceLabel(activeWorktreePath)}
+          </span>
+        </span>
       </span>
     );
   }

apps/web/src/components/chat/ChatHeader.tsx+7−4

       className="@container/header-actions flex min-w-0 flex-1 items-center gap-2 sm:gap-3"
       onContextMenu={handleHeaderContextMenu}
     >
-      <WorkspaceBreadcrumb ariaLabel="Thread breadcrumb" className="flex-1">
+      <WorkspaceBreadcrumb
+        ariaLabel="Thread breadcrumb"
+        className="flex-1 overflow-clip [overflow-clip-margin:2px]"
+      >
         {/* The project always leads the header: knowing which project a
             thread lives in is priority zero, and the thread title alone
             doesn't answer it. */}
         {activeProjectName ? (
           <>
-            <WorkspaceBreadcrumbItem>
+            <WorkspaceBreadcrumbItem className="shrink">
               <Tooltip>
                 <TooltipTrigger
                   render={
                       type="button"
                       aria-label={`New thread in ${activeProjectName}`}
                       onClick={onNewThreadInProject}
-                      className="inline-flex min-w-0 cursor-pointer items-center gap-1.5 rounded-sm text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring"
+                      className="inline-flex min-w-0 max-w-full cursor-pointer items-center gap-1.5 rounded-sm text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring"
                     />
                   }
                 >
             <WorkspaceBreadcrumbSeparator />
           </>
         ) : null}
-        <WorkspaceBreadcrumbItem current className="flex-1">
+        <WorkspaceBreadcrumbItem current className="min-w-10 flex-1">
           {renamingTitle !== null ? (
             <input
               autoFocus

apps/web/src/components/files/FileBrowserPanel.tsx+39−2

@@ -3,9 +3,9 @@ import type { · 2 unmodified lines
3	ContextMenuOpenContext as TreeContextMenuOpenContext,	3	ContextMenuOpenContext as TreeContextMenuOpenContext,
4	} from "@pierre/trees";	4	} from "@pierre/trees";
5	import type { EnvironmentId, ProjectEntry } from "@t3tools/contracts";	5	import type { EnvironmentId, ProjectEntry } from "@t3tools/contracts";
6	import { FileTree, useFileTree, useFileTreeSearch } from "@pierre/trees/react";	6	import { FileTree, useFileTree, useFileTreeSearch, useFileTreeSelector } from "@pierre/trees/react";
7	import { serializeComposerFileLink } from "@t3tools/shared/composerTrigger";	7	import { serializeComposerFileLink } from "@t3tools/shared/composerTrigger";
8	import { RotateCw } from "lucide-react";	8	import { ChevronsDownUpIcon, ChevronsUpDownIcon, RotateCw } from "lucide-react";
9	import { useEffect, useMemo, useRef } from "react";	9	import { useEffect, useMemo, useRef } from "react";
10		10
11	import { Button } from "~/components/ui/button";	11	import { Button } from "~/components/ui/button";
@@ -21,6 +21,7 @@ import { readLocalApi } from "~/localApi"; · 9 unmodified lines
21	import { T3_PIERRE_ICONS } from "~/pierre-icons";	21	import { T3_PIERRE_ICONS } from "~/pierre-icons";
22		22
23	import { createFileTreeDragMentionController } from "./fileTreeDragMention";	23	import { createFileTreeDragMentionController } from "./fileTreeDragMention";
		24	import { areAllDirectoriesExpanded, setAllDirectoriesExpanded } from "./fileTreeExpansion";
24	import { useProjectEntriesQuery } from "./projectFilesQueryState";	25	import { useProjectEntriesQuery } from "./projectFilesQueryState";
25		26
26	interface FileBrowserPanelProps {	27	interface FileBrowserPanelProps {
@@ -121,6 +122,10 @@ export default function FileBrowserPanel({ · 94 unmodified lines
121	);	122	);
122	const entryKindsRef = useRef<ReadonlyMap<string, ProjectEntry["kind"]>>(entryKinds);	123	const entryKindsRef = useRef<ReadonlyMap<string, ProjectEntry["kind"]>>(entryKinds);
123	const treePaths = useMemo(() => entries.map(treePath), [entries]);	124	const treePaths = useMemo(() => entries.map(treePath), [entries]);
		125	const directoryPaths = useMemo(
		126	() => entries.filter((entry) => entry.kind === "directory").map(treePath),
		127	[entries],
		128	);
124	const previousTreePathsRef = useRef<readonly string[]>([]);	129	const previousTreePathsRef = useRef<readonly string[]>([]);
125	const syncingSelectionRef = useRef(false);	130	const syncingSelectionRef = useRef(false);
126	const treeSelectionPathRef = useRef<string \| null>(null);	131	const treeSelectionPathRef = useRef<string \| null>(null);
@@ -252,6 +257,12 @@ export default function FileBrowserPanel({ · 125 unmodified lines
252	unsafeCSS: TREE_UNSAFE_CSS,	257	unsafeCSS: TREE_UNSAFE_CSS,
253	});	258	});
254	const search = useFileTreeSearch(model);	259	const search = useFileTreeSearch(model);
		260	const allDirectoriesExpanded = useFileTreeSelector(model, (currentModel) =>
		261	areAllDirectoriesExpanded(currentModel, directoryPaths),
		262	);
		263	const toggleAllDirectories = () => {
		264	setAllDirectoriesExpanded(model, directoryPaths, !allDirectoriesExpanded);
		265	};
255	const handleSearchValueChange = (value: string) => {	266	const handleSearchValueChange = (value: string) => {
256	if (value.trim().length === 0) {	267	if (value.trim().length === 0) {
257	search.close();	268	search.close();
@@ -376,6 +387,32 @@ export default function FileBrowserPanel({ · 118 unmodified lines
376	onValueChange={handleSearchValueChange}	387	onValueChange={handleSearchValueChange}
377	onClose={search.close}	388	onClose={search.close}
378	/>	389	/>
		390	{directoryPaths.length > 0 ? (
		391	<Tooltip>
		392	<TooltipTrigger
		393	render={
		394	<Button
		395	type="button"
		396	size="icon-xs"
		397	variant="ghost"
		398	aria-label={
		399	allDirectoriesExpanded ? "Collapse all folders" : "Expand all folders"
		400	}
		401	onClick={toggleAllDirectories}
		402	/>
		403	}
		404	>
		405	{allDirectoriesExpanded ? (
		406	<ChevronsDownUpIcon className="size-3.5" />
		407	) : (
		408	<ChevronsUpDownIcon className="size-3.5" />
		409	)}
		410	</TooltipTrigger>
		411	<TooltipPopup>
		412	{allDirectoriesExpanded ? "Collapse all folders" : "Expand all folders"}
		413	</TooltipPopup>
		414	</Tooltip>
		415	) : null}
379	</div>	416	</div>
380	{entriesQuery.error && entriesQuery.data === null ? (	417	{entriesQuery.error && entriesQuery.data === null ? (
381	<div className="p-4 text-xs leading-relaxed text-destructive">{entriesQuery.error}</div>	418	<div className="p-4 text-xs leading-relaxed text-destructive">{entriesQuery.error}</div>

apps/web/src/components/files/fileTreeExpansion.test.ts+60−0

@@ -0,0 +1,60 @@
	1	import { describe, expect, it, vi } from "@effect/vitest";
	2
	3	import { areAllDirectoriesExpanded, setAllDirectoriesExpanded } from "./fileTreeExpansion";
	4
	5	type FakeDirectoryItem = {
	6	isDirectory: () => true;
	7	isExpanded: () => boolean;
	8	expand: () => void;
	9	collapse: () => void;
	10	};
	11
	12	function makeModel(expanded: Record<string, boolean>) {
	13	const items = new Map<string, FakeDirectoryItem>();
	14	return {
	15	getItem: (path: string) => {
	16	const existing = items.get(path);
	17	if (existing !== undefined) return existing;
	18	const item: FakeDirectoryItem = {
	19	isDirectory: () => true,
	20	isExpanded: () => expanded[path] ?? false,
	21	expand: () => {
	22	expanded[path] = true;
	23	},
	24	collapse: () => {
	25	expanded[path] = false;
	26	},
	27	};
	28	items.set(path, item);
	29	return item;
	30	},
	31	};
	32	}
	33
	34	describe("file tree expansion", () => {
	35	it("requires at least one directory and detects whether all are expanded", () => {
	36	const model = makeModel({ "src/": true, "test/": true });
	37	expect(areAllDirectoriesExpanded(model, [])).toBe(false);
	38	expect(areAllDirectoriesExpanded(model, ["src/", "test/"])).toBe(true);
	39	expect(
	40	areAllDirectoriesExpanded(makeModel({ "src/": true, "test/": false }), ["src/", "test/"]),
	41	).toBe(false);
	42	});
	43
	44	it("expands and collapses every directory", () => {
	45	const expanded = { "src/": true, "test/": false };
	46	const model = makeModel(expanded);
	47	setAllDirectoriesExpanded(model, ["src/", "test/"], true);
	48	expect(expanded).toEqual({ "src/": true, "test/": true });
	49	setAllDirectoriesExpanded(model, ["src/", "test/"], false);
	50	expect(expanded).toEqual({ "src/": false, "test/": false });
	51	});
	52
	53	it("skips directories already at the requested state", () => {
	54	const model = makeModel({ "src/": true });
	55	const item = model.getItem("src/");
	56	const collapse = vi.spyOn(item, "collapse");
	57	setAllDirectoriesExpanded(model, ["src/"], true);
	58	expect(collapse).not.toHaveBeenCalled();
	59	});
	60	});

apps/web/src/components/files/fileTreeExpansion.ts+55−0

@@ -0,0 +1,55 @@
	1	export interface FileTreeExpansionModel {
	2	getItem(path: string): unknown;
	3	}
	4
	5	type DirectoryHandle = {
	6	isDirectory(): boolean;
	7	isExpanded(): boolean;
	8	expand(): void;
	9	collapse(): void;
	10	};
	11
	12	function asDirectoryHandle(item: unknown): DirectoryHandle \| null {
	13	if (
	14	typeof item !== "object" \|\|
	15	item === null \|\|
	16	!("isDirectory" in item) \|\|
	17	typeof item.isDirectory !== "function" \|\|
	18	!item.isDirectory() \|\|
	19	!("isExpanded" in item) \|\|
	20	typeof item.isExpanded !== "function" \|\|
	21	!("expand" in item) \|\|
	22	typeof item.expand !== "function" \|\|
	23	!("collapse" in item) \|\|
	24	typeof item.collapse !== "function"
	25	) {
	26	return null;
	27	}
	28	return item as DirectoryHandle;
	29	}
	30
	31	export function areAllDirectoriesExpanded(
	32	model: FileTreeExpansionModel,
	33	directoryPaths: readonly string[],
	34	): boolean {
	35	return (
	36	directoryPaths.length > 0 &&
	37	directoryPaths.every((path) => {
	38	const item = asDirectoryHandle(model.getItem(path));
	39	return item !== null && item.isExpanded();
	40	})
	41	);
	42	}
	43
	44	export function setAllDirectoriesExpanded(
	45	model: FileTreeExpansionModel,
	46	directoryPaths: readonly string[],
	47	expanded: boolean,
	48	): void {
	49	for (const path of directoryPaths) {
	50	const item = asDirectoryHandle(model.getItem(path));
	51	if (item === null \|\| item.isExpanded() === expanded) continue;
	52	if (expanded) item.expand();
	53	else item.collapse();
	54	}
	55	}

apps/web/src/components/settings/ConnectionsSettings.logic.test.ts+20−0

@@ -3,6 +3,7 @@ import { describe, expect, it, vi } from "vite-plus/test"; · 2 unmodified lines
3	import {	3	import {
4	applyWslEnableSelection,	4	applyWslEnableSelection,
5	isQrShareableEndpoint,	5	isQrShareableEndpoint,
		6	isWslSettingsRowVisible,
6	selectQrEndpointOption,	7	selectQrEndpointOption,
7	} from "./ConnectionsSettings.logic";	8	} from "./ConnectionsSettings.logic";
8		9
@@ -15,6 +16,25 @@ const baseWslState: DesktopWslState = { · 6 unmodified lines
15	preflightError: null,	16	preflightError: null,
16	};	17	};
17		18
		19	describe("isWslSettingsRowVisible", () => {
		20	it("shows the retry row when the WSL state failed to load", () => {
		21	expect(isWslSettingsRowVisible({ state: null, error: "load failed" })).toBe(true);
		22	});
		23
		24	it("hides an unavailable and unused WSL snapshot", () => {
		25	expect(
		26	isWslSettingsRowVisible({
		27	state: { ...baseWslState, available: false, wslOnly: false },
		28	error: null,
		29	}),
		30	).toBe(false);
		31	});
		32
		33	it("shows an available WSL snapshot", () => {
		34	expect(isWslSettingsRowVisible({ state: baseWslState, error: null })).toBe(true);
		35	});
		36	});
		37
18	describe("applyWslEnableSelection", () => {	38	describe("applyWslEnableSelection", () => {
19	it("clears WSL-only and updates the distro before enabling both backends", async () => {	39	it("clears WSL-only and updates the distro before enabling both backends", async () => {
20	const calls: Array<string> = [];	40	const calls: Array<string> = [];

apps/web/src/components/settings/ConnectionsSettings.logic.ts+8−0

@@ -11,6 +11,14 @@ export function isQrShareableEndpoint(endpoint: AdvertisedEndpoint): boolean { · 10 unmodified lines
11	return endpoint.status !== "unavailable" && endpoint.reachability !== "loopback";	11	return endpoint.status !== "unavailable" && endpoint.reachability !== "loopback";
12	}	12	}
13		13
		14	export function isWslSettingsRowVisible(input: {
		15	readonly state: DesktopWslState \| null;
		16	readonly error: string \| null;
		17	}): boolean {
		18	const { state, error } = input;
		19	return state ? state.available \|\| state.enabled \|\| state.wslOnly : error !== null;
		20	}
		21
14	export type QrEndpointOption = {	22	export type QrEndpointOption = {
15	/** Unique per endpoint instance (AdvertisedEndpoint.id); safe as a React key. */	23	/** Unique per endpoint instance (AdvertisedEndpoint.id); safe as a React key. */
16	readonly id: string;	24	readonly id: string;

apps/web/src/components/settings/ConnectionsSettings.tsx+11−5

 import {
   applyWslEnableSelection,
   isQrShareableEndpoint,
+  isWslSettingsRowVisible,
   selectQrEndpointOption,
 } from "./ConnectionsSettings.logic";
 import {
       // retry so the row doesn't flicker away, and the button reflects the
       // loading state. With no error we simply haven't loaded yet (or WSL
       // management isn't available), so render nothing.
-      if (desktopWslError && canManageLocalBackend) {
+      if (
+        isWslSettingsRowVisible({ state: null, error: desktopWslError }) &&
+        canManageLocalBackend
+      ) {
         return (
           <SettingsRow
-            title="WSL backend"
+            {...searchableSetting("wsl-backend")}
             description="Couldn't load the WSL backend state."
             status={<span className="block text-destructive">{desktopWslError}</span>}
             control={
     // be stranded on a WSL preference they can't clear, so render a recovery
     // row that switches back to Windows. When WSL is unavailable AND unused,
     // there's nothing to recover — keep the section hidden as before.
+    if (!isWslSettingsRowVisible({ state: desktopWslState, error: desktopWslError })) {
+      return null;
+    }
     if (!desktopWslState.available) {
-      if (!desktopWslState.enabled && !desktopWslState.wslOnly) return null;
       return (
         <SettingsRow
-          title="WSL backend"
+          {...searchableSetting("wsl-backend")}
           description="WSL is no longer available, so the Windows backend is running instead. Switch off the WSL backend to clear this preference."
           status={
             desktopWslError ? (
     return (
       <>
         <SettingsRow
-          title="WSL backend"
+          {...searchableSetting("wsl-backend")}
           description="Run a second backend inside a WSL distro alongside the Windows one. Pick a distro to start it; pick Off to stop it. Projects opened against the WSL backend live on the Linux side; Windows projects stay where they are."
           status={
             desktopWslError ? (

apps/web/src/components/settings/SettingsSidebarNav.tsx+22−1

   type ComponentType,
   type KeyboardEvent,
 } from "react";
+import { useEnvironmentQuery } from "~/state/query";
+import { desktopWslStateAtom } from "~/state/desktopWslState";
 import {
   ArchiveIcon,
   BlocksIcon,
 } from "lucide-react";
 import { useLocation, useNavigate } from "@tanstack/react-router";
+import { isElectron } from "~/env";
+import { isWslSettingsRowVisible } from "./ConnectionsSettings.logic";
 import { Button } from "../ui/button";
 import { Input } from "../ui/input";
 import { Kbd } from "../ui/kbd";
 import { scrollToSettingsTarget } from "./settingsLayout";
 import {
   searchSettings,
+  SETTINGS_SEARCH_ITEMS,
   SETTINGS_SECTION_LABELS,
   type SettingsPath,
   type SettingsSearchItem,
   const searchInputRef = useRef<HTMLInputElement>(null);
   const [query, setQuery] = useState("");
   const [activeResultIndex, setActiveResultIndex] = useState(0);
-  const results = useMemo(() => searchSettings(query), [query]);
+  const desktopWsl = useEnvironmentQuery(isElectron ? desktopWslStateAtom : null);
+  const searchableItems = useMemo(() => {
+    const wslState = desktopWsl.data;
+    const rowRenders = isWslSettingsRowVisible({
+      state: wslState,
+      error: desktopWsl.error,
+    });
+    if (rowRenders) {
+      return SETTINGS_SEARCH_ITEMS;
+    }
+    return SETTINGS_SEARCH_ITEMS.filter((item) => item.id !== "wsl-backend");
+  }, [desktopWsl.data, desktopWsl.error]);
+  const results = useMemo(() => searchSettings(query, searchableItems), [query, searchableItems]);
   const isSearching = query.trim().length > 0;
   const hasResults = results.length > 0;
+  useEffect(() => {
+    setActiveResultIndex((index) => Math.min(index, Math.max(results.length - 1, 0)));
+  }, [results.length]);
   useEffect(() => {
     const result = results[activeResultIndex];
     if (!result) return;

apps/web/src/components/settings/settingsSearch.test.ts+11−0

@@ -71,6 +71,17 @@ describe("searchSettings", () => { · 70 unmodified lines
71	it("hides desktop-only settings from browser search", () => {	71	it("hides desktop-only settings from browser search", () => {
72	expect(SETTINGS_SEARCH_ITEMS.some((item) => item.id === "quit-confirmation")).toBe(true);	72	expect(SETTINGS_SEARCH_ITEMS.some((item) => item.id === "quit-confirmation")).toBe(true);
73	expect(searchSettings("quit confirmation")).toEqual([]);	73	expect(searchSettings("quit confirmation")).toEqual([]);
		74	expect(searchSettings("wsl")).toEqual([]);
		75	});
		76
		77	it("registers the WSL backend as a desktop-only setting", () => {
		78	expect(SETTINGS_SEARCH_ITEMS).toContainEqual({
		79	id: "wsl-backend",
		80	title: "WSL backend",
		81	to: "/settings/connections",
		82	desktopOnly: true,
		83	windowsOnly: true,
		84	});
74	});	85	});
75		86
76	it("keeps catalog result ids unique", () => {	87	it("keeps catalog result ids unique", () => {

apps/web/src/components/settings/settingsSearch.ts+13−0

 import { isElectron } from "~/env";
+import { isWindowsPlatform } from "~/lib/utils";
 export type SettingsPath =
   | "/settings/general"
   // Its row only renders in the desktop app, so a browser result would land on
   // an anchor that isn't there.
   readonly desktopOnly?: boolean;
+  // Its row only renders on Windows desktop, so other desktop platforms must
+  // not expose a result that points to a missing anchor.
+  readonly windowsOnly?: boolean;
 }
 /**
     title: "Remote environments",
     to: "/settings/connections",
   },
+  {
+    id: "wsl-backend",
+    title: "WSL backend",
+    to: "/settings/connections",
+    desktopOnly: true,
+    windowsOnly: true,
+  },
   {
     id: "archive",
     title: "Archived threads",
   return items.filter(
     (item) =>
       (isElectron || item.desktopOnly !== true) &&
+      (!item.windowsOnly ||
+        isWindowsPlatform(typeof navigator === "undefined" ? "" : navigator.platform)) &&
       normalizeSearchText(item.title).includes(normalizedQuery),
   );
 }

docs/internals/mobile-navigation.md+22−5

@@ -51,13 +51,12 @@ use a separate implementation and do not need this workaround. · 50 unmodified lines
51		51
52	## Native media presentations	52	## Native media presentations
53		53
54	`PresentationSource` in `NativePresentation` registers a thumbnail for AVKit's	54	`PresentationSource` in `NativePresentation` registers a thumbnail for AVKit,
55	full-screen entry and UIKit's share sheet. Wrap the thumbnail as its single child	55	image zoom transitions, and UIKit's share sheet. Wrap the thumbnail as its single child
56	and pass the stable identifier to the presentation. The registry keeps weak	56	and pass the stable identifier to the presentation. The registry keeps weak
57	references to source views; recycled or compact composer thumbnails can register	57	references to source views; recycled or compact composer thumbnails can register
58	the same identifier. Identifiers must distinguish simultaneously visible attachments.	58	the same identifier. Identifiers must distinguish simultaneously visible attachments.
59	This source registration does not own playback and can be reused by a future image	59	The source registration does not own the preview. Android uses a regular view.
60	viewer. Android uses a regular view.
61		60
62	On iOS, video previews mount `AVPlayerViewController` temporarily inside the	61	On iOS, video previews mount `AVPlayerViewController` temporarily inside the
63	registered source and enter full screen through AVKit. AVKit	62	registered source and enter full screen through AVKit. AVKit
@@ -67,7 +66,25 @@ simulator, that leaves native Close unable to exit full screen. When the source · 3 unmodified lines
67	the player uses a standard modal presentation. Programmatic entry uses the same	66	the player uses a standard modal presentation. Programmatic entry uses the same
68	guarded `enterFullScreenAnimated:completionHandler:` selector as Expo Video;	67	guarded `enterFullScreenAnimated:completionHandler:` selector as Expo Video;
69	if that selector is unavailable, the player also falls back to a standard modal.	68	if that selector is unavailable, the player also falls back to a standard modal.
70	Images retain their existing viewer.	69
		70	`FilePreviewModal` resolves image and PDF sources from a URI, a signed environment asset,
		71	or a retained composer file. On iOS, Quick Look owns image and document layout, controls,
		72	zooming, sharing, and interactive dismissal. Its delegate supplies the registered thumbnail
		73	and its bounds for Quick Look's source-view zoom. Do not layer `preferredTransition` or
		74	another image scroll view over that presentation: Quick Look coordinates its image gestures
		75	with the return to the thumbnail. Missing sources use the standard transition, and Reduce
		76	Motion disables animation. A pending programmatic Close waits until the current presentation
		77	or cancelled dismissal has settled before starting another transition.
		78
		79	The shared native presenter copies original bytes into its own temporary directory and
		80	removes that copy after dismissal. Network downloads write to disk, and sharing never edits
		81	the source attachment. Draft images use their stored upload data rather than a potentially
		82	expired picker URI. No React Navigation route or custom transition animator is needed.
		83
		84	The same viewer handles message images, markdown images, PDF attachments and links,
		85	composer thumbnails, and workspace image previews. The workspace PDF web preview has an
		86	Open PDF action for the native viewer. Android retains its image viewer and uses the
		87	system chooser for PDFs. Saving images on iOS uses the add-only photo-library permission.
71		88
72	Received videos open directly from their signed asset URL. AVKit handles buffering;	89	Received videos open directly from their signed asset URL. AVKit handles buffering;
73	the client does not download the entire file or show a separate opening overlay before	90	the client does not download the entire file or show a separate opening overlay before

docs/user/composer.md+9−2

@@ -20,7 +20,13 @@ file uploads, + opens a menu beside the button with Photo Library and ** · 19 unmodified lines
20	Videos use the server's file upload limit. You can also share photos, videos, and files into	20	Videos use the server's file upload limit. You can also share photos, videos, and files into
21	T3 Code from other apps through the system share sheet. Mobile uploads happen when the message	21	T3 Code from other apps through the system share sheet. Mobile uploads happen when the message
22	sends, so queued messages keep their files until they deliver. Select a received file on mobile	22	sends, so queued messages keep their files until they deliver. Select a received file on mobile
23	to save it or open it in another app through the system share sheet.	23	to preview it or open the system share options.
		24
		25	Tap an image or PDF before or after sending to open it. On iOS, images zoom from their thumbnail
		26	into the native viewer. Pinch or double-tap to zoom, and swipe down or tap Close to return.
		27	Use Share to save a copy or send it to another app. PDFs support page navigation and search.
		28	PDF links in assistant responses open the same preview. On Android, images open in the image
		29	viewer and PDFs open the system chooser.
24		30
25	Select a video attachment before or after sending to play it. Web and desktop use the browser's	31	Select a video attachment before or after sending to play it. Web and desktop use the browser's
26	built-in controls. On mobile, videos open in a full-screen player with native playback controls.	32	built-in controls. On mobile, videos open in a full-screen player with native playback controls.
@@ -36,7 +42,8 @@ On web and desktop, if you reload before a file finishes uploading, the draft ke · 9 unmodified lines
36	and shows Attach again next to it. Attach the file again or remove it, then send.	42	and shows Attach again next to it. Attach the file again or remove it, then send.
37		43
38	On web and desktop, HEIC and HEIF photos are automatically converted to JPEG when you drag them into	44	On web and desktop, HEIC and HEIF photos are automatically converted to JPEG when you drag them into
39	the composer or paste them into a message.	45	the composer or paste them into a message. On iOS, selecting them from Photo Library also
		46	converts them to JPEG. The 10 MB image limit applies to the converted photo.
40		47
41	On mobile, the model picker shows each OpenCode model's upstream provider, such as Anthropic,	48	On mobile, the model picker shows each OpenCode model's upstream provider, such as Anthropic,
42	GitHub Copilot, or OpenCode Zen, beneath its name. Search by that provider name to narrow the list	49	GitHub Copilot, or OpenCode Zen, beneath its name. Search by that provider name to narrow the list

packages/shared/src/shell.test.ts+5−5

 });
 effectIt.layer(NodeServices.layer)("resolveWindowsEnvironment", (it) => {
-  it.effect("returns the baseline no-profile PATH patch when node is already available", () =>
+  it.effect("uses known CLI directories as a fallback without changing shell PATH priority", () =>
     Effect.gen(function* () {
       const readEnvironment = vi.fn(
         (_names: ReadonlyArray<string>, options?: { loadProfile?: boolean }) =>
         ),
       ).toEqual({
         PATH: [
+          "C:\\Shell\\Bin",
+          "C:\\Windows\\System32",
           "C:\\Users\\testuser\\AppData\\Roaming\\npm",
           "C:\\Users\\testuser\\AppData\\Local\\Programs\\nodejs",
           "C:\\Users\\testuser\\AppData\\Local\\Volta\\bin",
           "C:\\Users\\testuser\\.local\\bin",
           "C:\\Users\\testuser\\.bun\\bin",
           "C:\\Users\\testuser\\scoop\\shims",
-          "C:\\Shell\\Bin",
-          "C:\\Windows\\System32",
         ].join(";"),
       });
       expect(readEnvironment).toHaveBeenCalledTimes(1);
         PATH: [
           "C:\\Profile\\Node",
           "C:\\Windows\\System32",
+          "C:\\Shell\\Bin",
           "C:\\Users\\testuser\\AppData\\Roaming\\npm",
           "C:\\Users\\testuser\\AppData\\Local\\Programs\\nodejs",
           "C:\\Users\\testuser\\AppData\\Local\\Volta\\bin",
           "C:\\Users\\testuser\\.local\\bin",
           "C:\\Users\\testuser\\.bun\\bin",
           "C:\\Users\\testuser\\scoop\\shims",
-          "C:\\Shell\\Bin",
         ].join(";"),
         FNM_DIR: "C:\\Users\\testuser\\AppData\\Roaming\\fnm",
         FNM_MULTISHELL_PATH: "C:\\Users\\testuser\\AppData\\Local\\fnm_multishells\\123",
         ),
       ).toEqual({
         PATH: [
+          "C:\\Windows\\System32",
           "C:\\Users\\testuser\\AppData\\Roaming\\npm",
           "C:\\Users\\testuser\\.local\\bin",
           "C:\\Users\\testuser\\.bun\\bin",
           "C:\\Users\\testuser\\scoop\\shims",
-          "C:\\Windows\\System32",
         ].join(";"),
         FNM_DIR: "C:\\Users\\testuser\\AppData\\Roaming\\fnm",
       });

packages/shared/src/shell.ts+3−1

   }).PATH;
   const mergedPath = mergePathValues(shellPath, inheritedPath, "win32");
   const knownCliPath = resolveKnownWindowsCliDirs(env).join(WINDOWS_PATH_DELIMITER);
-  const baselinePath = mergePathValues(knownCliPath, mergedPath, "win32");
+  // Preserve the order a user's shell uses. These directories fill gaps when
+  // desktop apps launch without the full interactive-shell PATH.
+  const baselinePath = mergePathValues(mergedPath, knownCliPath, "win32");
   const baselinePatch: Partial<NodeJS.ProcessEnv> = baselinePath ? { PATH: baselinePath } : {};
   const baselineEnv = mergeWindowsEnv(env, baselinePatch);

Merge branch 'main' into feat/open-source-licenses

Keyboard shortcuts

General

Issues and pull requests

Issues, pull requests and Inbox

Repository code