Commit 272d6d747ef214f50dbd9d0051120de12ffa3591 | the-knife

apps/mobile/modules/t3-markdown-text/assets/link-icons/github.png created

Binary files /dev/null and b/apps/mobile/modules/t3-markdown-text/assets/link-icons/github.png differ

apps/mobile/modules/t3-markdown-text/ios/T3MarkdownText.mm+19-10

 @@ -60,14 +60,16 @@ static void T3MarkdownTextApplyAttachments(
     NSString *imageUri = [NSString stringWithUTF8String:attachmentRange.imageUri.c_str()];
     NSTextAttachment *attachment = [[NSTextAttachment alloc] init];
     UIImage *image = images[imageUri];
-    if ([imageUri hasPrefix:@"sf:"]) {
+    const BOOL isSymbol = [imageUri hasPrefix:@"sf:"];
-      NSString *symbolName = [imageUri substringFromIndex:3];
+    if (isSymbol) {
-      UIColor *foregroundColor =
+      image = [UIImage systemImageNamed:[imageUri substringFromIndex:3]];
-          [attributedString attribute:NSForegroundColorAttributeName
+    }
-                              atIndex:attachmentRange.location
+    UIColor *foregroundColor = [attributedString attribute:NSForegroundColorAttributeName
-                       effectiveRange:nil] ?: UIColor.labelColor;
+                                                   atIndex:attachmentRange.location
-      image = [[UIImage systemImageNamed:symbolName] imageWithTintColor:foregroundColor
+                                            effectiveRange:nil];
-                                                          renderingMode:UIImageRenderingModeAlwaysOriginal];
+    if (image != nil && (isSymbol || attachmentRange.tintWithForeground)) {
+      image = [image imageWithTintColor:foregroundColor ?: UIColor.labelColor
+                          renderingMode:UIImageRenderingModeAlwaysOriginal];
     }
     attachment.image = image ?: [[UIImage alloc] init];
     const CGFloat attachmentSize = T3MarkdownTextAttachmentSize(attachmentRange);
 @@ -79,8 +81,15 @@ static void T3MarkdownTextApplyAttachments(
     const NSRange range = NSMakeRange(
         attachmentRange.location,
         MIN(attachmentRange.length, attributedString.length - attachmentRange.location));
-    NSAttributedString *attachmentString =
+    NSMutableAttributedString *attachmentString =
-        [NSAttributedString attributedStringWithAttachment:attachment];
+        [[NSAttributedString attributedStringWithAttachment:attachment] mutableCopy];
+    // Keep the run color on the attachment so a later re-apply (after the image
+    // loads asynchronously) still tints with the link color, not labelColor.
+    if (foregroundColor != nil) {
+      [attachmentString addAttribute:NSForegroundColorAttributeName
+                               value:foregroundColor
+                               range:NSMakeRange(0, attachmentString.length)];
+    }
     [attributedString replaceCharactersInRange:range withAttributedString:attachmentString];
   }
 }

apps/mobile/modules/t3-markdown-text/ios/T3MarkdownTextShadowNode.h+2

...	@@ -26,6 +26,8 @@ struct T3MarkdownTextAttachmentRange {	...	@@ -26,6 +26,8 @@ struct T3MarkdownTextAttachmentRange {
26	size_t location;	26	size_t location;
27	size_t length;	27	size_t length;
28	std::string imageUri;	28	std::string imageUri;
		29	/// Recolor the loaded image with the run's foreground color, like `sf:` symbols.
		30	bool tintWithForeground;
29	};	31	};
30		32
31	inline Float T3MarkdownTextAttachmentSize(const T3MarkdownTextAttachmentRange &) {	33	inline Float T3MarkdownTextAttachmentSize(const T3MarkdownTextAttachmentRange &) {

apps/mobile/modules/t3-markdown-text/ios/T3MarkdownTextShadowNode.mm+11

 @@ -11,6 +11,7 @@ namespace facebook::react {
 static constexpr Float ParagraphStyleEncodingOffset = 1000;
 static constexpr auto FileAttachmentNativeIdPrefix = "t3-file:";
 static constexpr auto SkillAttachmentNativeIdPrefix = "t3-skill:";
+static constexpr auto LinkAttachmentNativeIdPrefix = "t3-link:";
 static void applyParagraphStyles(
     NSMutableAttributedString *attributedString,
 @@ -192,6 +193,7 @@ Size T3MarkdownTextShadowNode::measureContent(
               utf16Offset,
               1,
               props.nativeId.substr(std::char_traits<char>::length(FileAttachmentNativeIdPrefix)),
+              false,
           });
         } else if (
             props.nativeId.rfind(SkillAttachmentNativeIdPrefix, 0) == 0 && fragmentLength > 0) {
 @@ -200,6 +202,15 @@ Size T3MarkdownTextShadowNode::measureContent(
               1,
               props.nativeId.substr(
                   std::char_traits<char>::length(SkillAttachmentNativeIdPrefix)),
+              false,
+          });
+        } else if (
+            props.nativeId.rfind(LinkAttachmentNativeIdPrefix, 0) == 0 && fragmentLength > 0) {
+          attachmentRanges.push_back(T3MarkdownTextAttachmentRange{
+              utf16Offset,
+              1,
+              props.nativeId.substr(std::char_traits<char>::length(LinkAttachmentNativeIdPrefix)),
+              true,
           });
         }
         utf16Offset += fragmentLength;

apps/mobile/modules/t3-markdown-text/package.json+1

...	@@ -21,6 +21,7 @@	...	@@ -21,6 +21,7 @@
21	"exports": {	21	"exports": {
22	".": "./index.ts",	22	".": "./index.ts",
23	"./file-icons": "./src/markdownFileIcons.ts",	23	"./file-icons": "./src/markdownFileIcons.ts",
		24	"./link-icons": "./src/markdownLinkIcons.ts",
24	"./links": "./src/markdownLinks.ts",	25	"./links": "./src/markdownLinks.ts",
25	"./markdown": "./src/nativeMarkdownText.ts",	26	"./markdown": "./src/nativeMarkdownText.ts",
26	"./primitive": "./src/MarkdownTextPrimitive.tsx",	27	"./primitive": "./src/MarkdownTextPrimitive.tsx",

apps/mobile/modules/t3-markdown-text/src/NativeMarkdownSelectableText.ios.tsx+27-7

 @@ -12,6 +12,8 @@ import {
 import { MarkdownTextPrimitive } from "./MarkdownTextPrimitive";
 import { markdownFileIconSource } from "./markdownFileIcons";
+import { markdownLinkIconSource } from "./markdownLinkIcons";
+import { resolveMarkdownLinkIcon } from "./markdownLinks";
 import type { NativeMarkdownTextRun } from "./nativeMarkdownText";
 import type {
   MarkdownFileContextMenu,
 @@ -177,10 +179,14 @@ export function NativeMarkdownSelectableText(props: {
 }) {
   const colorScheme = useColorScheme();
   const menu = useContext(MarkdownFileContextMenuContext);
-  const containsInlineFileIcon = props.runs.some((run) => run.fileIcon != null);
+  const containsInlineIcon = props.runs.some(
+    (run) =>
+      run.fileIcon != null ||
+      (run.externalHost != null && resolveMarkdownLinkIcon(run.externalHost) !== null),
+  );
   const attachAndroidText = useCallback(
     (textView: RNText | null) => {
-      if (Platform.OS !== "android" || !containsInlineFileIcon || textView === null) {
+      if (Platform.OS !== "android" || !containsInlineIcon || textView === null) {
         return;
       }
       const reactTag = findNodeHandle(textView);
 @@ -188,7 +194,7 @@ export function NativeMarkdownSelectableText(props: {
         installMarkdownCopySanitizer(reactTag);
       }
     },
-    [containsInlineFileIcon],
+    [containsInlineIcon],
   );
   const occurrences = new Map<string, number>();
   const prefixedExternalLinks = new Set<string>();
 @@ -198,6 +204,7 @@ export function NativeMarkdownSelectableText(props: {
     occurrences.set(signature, occurrence + 1);
     let text = run.text;
+    let linkIcon = null;
     if (run.fileIcon && Platform.OS === "ios") {
       text = `${INLINE_ATTACHMENT_PREFIX}${text}`;
     } else if (run.skillName && run.skillLabel) {
 @@ -207,10 +214,15 @@ export function NativeMarkdownSelectableText(props: {
           : `$${run.skillName}`;
     } else if (run.externalHost && run.href && !prefixedExternalLinks.has(run.href)) {
       prefixedExternalLinks.add(run.href);
-      text = `${EXTERNAL_LINK_PREFIX}${text}`;
+      linkIcon = resolveMarkdownLinkIcon(run.externalHost);
+      if (linkIcon === null) {
+        text = `${EXTERNAL_LINK_PREFIX}${text}`;
+      } else if (Platform.OS === "ios") {
+        text = `${INLINE_ATTACHMENT_PREFIX}${text}`;
+      }
     }
-    return { key: `${signature}:${occurrence}`, run, text };
+    return { key: `${signature}:${occurrence}`, run, text, linkIcon };
   });
   // T3MarkdownText only rebuilds its attributed string during native layout. A
   // color-only child update can otherwise leave the previous appearance cached.
 @@ -248,7 +260,7 @@ export function NativeMarkdownSelectableText(props: {
         lineHeight: props.textStyle.lineHeight,
       }}
     >
-      {keyedRuns.map(({ key, run, text }) => {
+      {keyedRuns.map(({ key, run, text, linkIcon }) => {
         const href = run.href;
         const contextMenu = run.fileIcon && href ? menu?.fileContextMenu(href) : undefined;
         return (
 @@ -260,7 +272,9 @@ export function NativeMarkdownSelectableText(props: {
                   ? `t3-file:${Image.resolveAssetSource(markdownFileIconSource(run.fileIcon)).uri}`
                   : run.skillName
                     ? "t3-skill:sf:cube"
-                    : undefined
+                    : linkIcon
+                      ? `t3-link:${Image.resolveAssetSource(markdownLinkIconSource(linkIcon)).uri}`
+                      : undefined
                 : undefined
             }
             contextMenuConfig={contextMenu ? JSON.stringify(contextMenu) : undefined}
 @@ -284,6 +298,12 @@ export function NativeMarkdownSelectableText(props: {
           >
             {Platform.OS === "android" && run.fileIcon ? (
               <Image source={markdownFileIconSource(run.fileIcon)} style={styles.inlineIcon} />
+            ) : Platform.OS === "android" && linkIcon ? (
+              <Image
+                source={markdownLinkIconSource(linkIcon)}
+                style={styles.inlineIcon}
+                tintColor={props.textStyle.linkColor}
+              />
             ) : null}
             {text}
           </MarkdownTextPrimitive>

apps/mobile/modules/t3-markdown-text/src/markdownLinkIcons.ts created+12

...	@@ -0,0 +1,12 @@
1	import type { ImageSourcePropType } from "react-native";
2
3	import type { MarkdownLinkIcon } from "./markdownLinks";
4
5	// Black-on-transparent marks; callers tint them with the link color.
6	const MARKDOWN_LINK_ICON_SOURCES = {
7	github: require("../assets/link-icons/github.png"),
8	} as const satisfies Readonly<Record<MarkdownLinkIcon, ImageSourcePropType>>;
9
10	export function markdownLinkIconSource(icon: MarkdownLinkIcon): ImageSourcePropType {
11	return MARKDOWN_LINK_ICON_SOURCES[icon];
12	}

apps/mobile/modules/t3-markdown-text/src/markdownLinks.ts+12

...	@@ -33,6 +33,18 @@ export type MarkdownLinkPresentation =	...	@@ -33,6 +33,18 @@ export type MarkdownLinkPresentation =
33		33
34	export type MarkdownFileIcon = keyof typeof MARKDOWN_FILE_ICON_SOURCES;	34	export type MarkdownFileIcon = keyof typeof MARKDOWN_FILE_ICON_SOURCES;
35		35
		36	export type MarkdownLinkIcon = "github";
		37
		38	/**
		39	* Sites whose brand mark replaces the generic external-link glyph. The marks
		40	* are monochrome and tinted with the link color, so they follow the theme.
		41	*/
		42	export function resolveMarkdownLinkIcon(host: string): MarkdownLinkIcon \| null {
		43	const hostname = host.toLowerCase();
		44	if (hostname === "github.com" \|\| hostname.endsWith(".github.com")) return "github";
		45	return null;
		46	}
		47
36	const FILE_ICON_BY_NAME: Readonly<Record<string, MarkdownFileIcon>> = {	48	const FILE_ICON_BY_NAME: Readonly<Record<string, MarkdownFileIcon>> = {
37	".babelrc": "babel",	49	".babelrc": "babel",
38	".babelrc.json": "babel",	50	".babelrc.json": "babel",

apps/mobile/src/features/threads/ThreadFeed.tsx+13-4

 @@ -134,9 +134,11 @@ import {
 import { useAppearancePreferences } from "../settings/appearance/AppearancePreferencesProvider";
 import { useAppearanceCodeSurface } from "../settings/appearance/useAppearanceCodeSurface";
 import { markdownFileIconSource } from "@t3tools/mobile-markdown-text/file-icons";
+import { markdownLinkIconSource } from "@t3tools/mobile-markdown-text/link-icons";
 import {
   normalizeNativeMarkdownUrl,
   resolveMarkdownInlineCodePresentation,
+  resolveMarkdownLinkIcon,
   resolveMarkdownLinkPresentation,
 } from "@t3tools/mobile-markdown-text/links";
 import {
 @@ -606,7 +608,8 @@ const MarkdownExternalLink = memo(function MarkdownExternalLink(props: {
   readonly onPress: (href: string) => void;
 }) {
   const [failedHost, setFailedHost] = useState<string | null>(null);
-  const faviconUrl = faviconUrlForOrigin(`https://${props.host}`);
+  const linkIcon = resolveMarkdownLinkIcon(props.host);
+  const faviconUrl = linkIcon ? null : faviconUrlForOrigin(`https://${props.host}`);
   return (
     <NativeText
 @@ -617,9 +620,15 @@ const MarkdownExternalLink = memo(function MarkdownExternalLink(props: {
         textDecorationLine: "none",
       }}
     >
-      {faviconUrl !== null &&
+      {linkIcon ? (
-      failedHost !== props.host &&
+        <Image
-      !failedMarkdownFaviconHosts.has(props.host) ? (
+          source={markdownLinkIconSource(linkIcon)}
+          style={markdownLinkStyles.inlineIcon}
+          tintColor={props.color}
+        />
+      ) : faviconUrl !== null &&
+        failedHost !== props.host &&
+        !failedMarkdownFaviconHosts.has(props.host) ? (
         <Image
           source={{
             uri: faviconUrl,

apps/mobile/src/lib/markdownLinks.test.ts+15-1

...	@@ -1,6 +1,20 @@	...	@@ -1,6 +1,20 @@
1	import { describe, expect, it } from "vite-plus/test";	1	import { describe, expect, it } from "vite-plus/test";
2		2
3	import { resolveMarkdownLinkPresentation } from "@t3tools/mobile-markdown-text/links";	3	import {
		4	resolveMarkdownLinkIcon,
		5	resolveMarkdownLinkPresentation,
		6	} from "@t3tools/mobile-markdown-text/links";
		7
		8	describe("resolveMarkdownLinkIcon", () => {
		9	it("gives GitHub hosts the brand mark and everything else the generic glyph", () => {
		10	expect(resolveMarkdownLinkIcon("github.com")).toBe("github");
		11	expect(resolveMarkdownLinkIcon("GitHub.com")).toBe("github");
		12	expect(resolveMarkdownLinkIcon("gist.github.com")).toBe("github");
		13	expect(resolveMarkdownLinkIcon("github.community")).toBeNull();
		14	expect(resolveMarkdownLinkIcon("notgithub.com")).toBeNull();
		15	expect(resolveMarkdownLinkIcon("example.com")).toBeNull();
		16	});
		17	});
4		18
5	describe("resolveMarkdownLinkPresentation", () => {	19	describe("resolveMarkdownLinkPresentation", () => {
6	it("treats protocol-relative media as an external URL, not a filesystem path", () => {	20	it("treats protocol-relative media as an external URL, not a filesystem path", () => {

apps/web/src/components/ChatMarkdown.test.tsx+10-3

 @@ -5,6 +5,7 @@ import { create, type ReactTestRenderer } from "react-test-renderer";
 import { describe, expect, it, vi } from "vite-plus/test";
 import { getSyntaxHighlighterPromise } from "../lib/syntaxHighlighting";
+import { GitHubIcon } from "./Icons";
 import { Button } from "./ui/button";
 import { setMarkdownTaskChecked } from "./files/filePreviewMode";
 @@ -78,10 +79,10 @@ describe("ChatMarkdown favicon privacy", () => {
     const markdown = (url: string) => <ChatMarkdown cwd="/tmp/project" text={`[Link](${url})`} />;
     try {
       await act(async () => {
-        renderer = create(markdown("https://github.com"));
+        renderer = create(markdown("https://example.com"));
       });
       expect(renderer!.root.findAllByType("img").map((image) => image.props.src)).toEqual([
-        "https://www.google.com/s2/favicons?domain=github.com&sz=32",
+        "https://www.google.com/s2/favicons?domain=example.com&sz=32",
       ]);
       for (const url of ["http://192.168.1.10:8080", "http://localhost:3000", "http://home.arpa"]) {
         await act(async () => {
 @@ -90,9 +91,15 @@ describe("ChatMarkdown favicon privacy", () => {
         expect(renderer!.root.findAllByType("img")).toHaveLength(0);
       }
       await act(async () => {
-        renderer!.update(markdown("https://github.com"));
+        renderer!.update(markdown("https://example.com"));
       });
       expect(renderer!.root.findAllByType("img")).toHaveLength(1);
+      // GitHub links draw the brand mark in currentColor instead of fetching a favicon.
+      await act(async () => {
+        renderer!.update(markdown("https://github.com/pingdotgg/t3code/pull/1"));
+      });
+      expect(renderer!.root.findAllByType("img")).toHaveLength(0);
+      expect(renderer!.root.findAllByType(GitHubIcon)).toHaveLength(1);
     } finally {
       await act(async () => {
         renderer?.unmount();

apps/web/src/components/ChatMarkdown.tsx+13-2

 @@ -119,6 +119,7 @@ import { resolveDiffThemeName, type DiffThemeName } from "../lib/diffRendering";
 import { fnv1a32 } from "../lib/diffRendering";
 import { LRUCache } from "../lib/lruCache";
 import { getSyntaxHighlighterPromise } from "../lib/syntaxHighlighting";
+import { GitHubIcon } from "./Icons";
 import { RenderErrorBoundary } from "./RenderErrorBoundary";
 import { useTheme } from "../hooks/useTheme";
 import { getClientSettings, useClientSettings } from "../hooks/useSettings";
 @@ -1189,15 +1190,25 @@ const MARKDOWN_LINK_FAVICON_CLASS_NAME = "block size-full shrink-0 select-none";
 /** Hosts whose favicon request already failed this session — skip straight to the globe. */
 const failedFaviconHosts = new Set<string>();
+/** Sites whose brand mark (drawn in `currentColor`) replaces the fetched favicon so it follows the theme. */
+function brandLinkIcon(host: string): typeof GitHubIcon | null {
+  const hostname = host.toLowerCase();
+  if (hostname === "github.com" || hostname.endsWith(".github.com")) return GitHubIcon;
+  return null;
+}
 const MarkdownLinkFavicon = memo(function MarkdownLinkFavicon({ host }: { host: string }) {
   const [failedHost, setFailedHost] = useState<string | null>(null);
-  const faviconUrl = faviconUrlForOrigin(`https://${host}`);
+  const BrandIcon = brandLinkIcon(host);
+  const faviconUrl = BrandIcon ? null : faviconUrlForOrigin(`https://${host}`);
   return (
     <span
       className="ms-[0.25em] me-[0.2em] inline-flex size-[14px] [vertical-align:-0.125em]"
       aria-hidden
     >
-      {faviconUrl === null || failedHost === host || failedFaviconHosts.has(host) ? (
+      {BrandIcon ? (
+        <BrandIcon className={MARKDOWN_LINK_FAVICON_CLASS_NAME} />
+      ) : faviconUrl === null || failedHost === host || failedFaviconHosts.has(host) ? (
         <GlobeIcon className={MARKDOWN_LINK_FAVICON_CLASS_NAME} />
       ) : (
         <img

author	Julius Marminge <julius0216@outlook.com> 2026-09-05 23:21:44-07:00
committer	GitHub <noreply@github.com> 2026-09-05 23:21:44-07:00
log	272d6d747ef214f50dbd9d0051120de12ffa3591
tree	b928bea6bbe9c9ab5f69a9b4a60907fa77b3ffbc
parent	a495385584276d0e568df23646a49ce8b40a4707
signature	Signed by PGP key B5690EEEBB952194

feat(markdown): show the GitHub mark for github.com links (#10324)