Fix truncated URLs in web search results opening broken links

[marksftw]

When web search results are collapsed, URLs were being truncated for display but the truncated text was also used as the href. Now URLs that would be cut by truncation are converted to markdown links that preserve the full URL in the href while showing truncated display text.

Fixes #387

Summary by CodeRabbit

• Bug Fixes

  • Preview truncation for tool and function call outputs now preserves URLs and Markdown links, preventing broken or unclickable links when content is shortened.
  • Truncated previews use cleaner ellipses and maintain clickable link behavior, improving readability in chat/tool output previews.

• Notes

  • No changes to public API behavior or external integrations.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[coderabbitai]

Note

Other AI code review bot(s) detected

CodeRabbit has detected other AI code review bot(s) in this pull request and will avoid duplicating their findings in the review comments. This may lead to a less comprehensive review.

📝 Walkthrough

Walkthrough

Replaces ad-hoc 150-character truncation in UnifiedChat tool output previews with a new helper truncateMarkdownPreservingLinks(text, maxLength) that truncates text while avoiding broken or partially-truncated URLs and preserving markdown links.

Changes

Cohort / File(s)	Summary
Markdown utility frontend/src/utils/markdown.ts	Added export function truncateMarkdownPreservingLinks(text: string, maxLength: number): string which truncates text to maxLength while preserving clickable plain URLs and existing markdown links (converts truncated plain-URL tails into proper markdown links or truncates before existing markdown links).
Preview usage in chat UI frontend/src/components/UnifiedChat.tsx	Replaced ad-hoc 150-character truncation with truncateMarkdownPreservingLinks(output, 150) in two tool output rendering code paths (toolOutput preview and tool_call_output preview).

Sequence Diagram(s)

(omitted)

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

Poem

🐰 I nibble lines and guard each link,

I trim the tail but leave the brink.
A hop, a stitch, the URL stays true—
Clicks go home, and I smile too. 🥕🔗

🚥 Pre-merge checks | ✅ 4

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately summarizes the main change: fixing truncated URLs in web search results that were opening broken links.
Linked Issues check	✅ Passed	The changes fully address issue #387 by implementing truncateMarkdownPreservingLinks to preserve full URLs in hrefs while displaying truncated text.
Out of Scope Changes check	✅ Passed	All changes are directly related to fixing the linked issue: new markdown truncation utility and its integration into UnifiedChat component.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

• 📝 Generate docstrings

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[greptile-apps]

Greptile Summary

Fixed broken links in collapsed web search results by implementing smart truncation that preserves full URLs. When truncation would cut a plain URL, the function now converts it to a markdown link with truncated display text but full href, ensuring clicks navigate to the correct destination.

• Created new truncateMarkdownPreservingLinks utility that handles three cases: plain URLs being truncated (converts to markdown), existing markdown links being truncated (truncates before the link), and safe truncation points
• Replaced simple substring truncation with the new utility in ToolCallRenderer for both grouped and standalone tool outputs
• The solution uses precomputed ranges to efficiently detect markdown links and avoid double-processing URLs

Confidence Score: 4/5

• This PR is safe to merge with minimal risk - it fixes a clear bug with a focused solution
• The implementation correctly solves the stated problem of broken truncated URLs. The logic is sound with proper range checking and edge case handling. Score is 4 rather than 5 because: (1) no tests were added to verify the fix works correctly, (2) the URL regex could potentially match trailing punctuation, and (3) the markdown link output can exceed maxLength, which is intentional but could be unexpected in some contexts
• No files require special attention - both changes are straightforward

Important Files Changed

Filename	Overview
frontend/src/utils/markdown.ts	New utility function that converts truncated plain URLs to markdown links, preserving full href
frontend/src/components/UnifiedChat.tsx	Replaced simple substring truncation with markdown-aware truncation in tool output previews

Sequence Diagram

sequenceDiagram
    participant User
    participant UnifiedChat
    participant Markdown Utils
    participant Markdown Component

    User->>UnifiedChat: View tool output (web search results)
    UnifiedChat->>UnifiedChat: Check if output > 150 chars
    
    alt Output needs truncation
        UnifiedChat->>Markdown Utils: truncateMarkdownPreservingLinks(output, 150)
        Markdown Utils->>Markdown Utils: Precompute markdown link ranges
        Markdown Utils->>Markdown Utils: Find plain URLs not in markdown
        
        alt Truncation point in plain URL
            Markdown Utils->>Markdown Utils: Convert URL to markdown link [truncated...](full-url)
            Markdown Utils-->>UnifiedChat: Return markdown with preserved href
        else Truncation point in markdown link
            Markdown Utils->>Markdown Utils: Truncate before markdown link
            Markdown Utils-->>UnifiedChat: Return truncated text + "..."
        else Safe truncation
            Markdown Utils->>Markdown Utils: Truncate at maxLength
            Markdown Utils-->>UnifiedChat: Return truncated text + "..."
        end
        
        UnifiedChat->>Markdown Component: Render preview with preserved links
        Markdown Component-->>User: Display truncated text with clickable full URL
    else Output fits in preview
        UnifiedChat->>Markdown Component: Render full output
        Markdown Component-->>User: Display full text
    end

Loading

[greptile-apps]

_{1 file reviewed, 1 comment}

_{Edit Code Review Agent Settings | Greptile}

[cloudflare-workers-and-pages]

Deploying maple with    Cloudflare Pages

Latest commit:	e511237
Status:	✅  Deploy successful!
Preview URL:	https://e01a9004.maple-ca8.pages.dev
Branch Preview URL:	https://linkfix.maple-ca8.pages.dev

View logs

[greptile-apps]

Greptile's behavior is changing!

From now on, if a review finishes with no comments, we will not post an additional "statistics" comment to confirm that our review found nothing to comment on. However, you can confirm that we reviewed your changes in the status check section.

_{This feature can be toggled off in your Code Review Settings by deselecting "Create a status check for each PR".}

[AnthonyRonning]

I think these should move to a utility file

[marksftw]

Addressed code review feedback: moved truncateMarkdownPreservingLinks function from UnifiedChat.tsx to a dedicated utility file at frontend/src/utils/markdown.ts.

[AnthonyRonning]

Great, thanks. Please rebase into a single commit since this is a tiny change and only needs to be one commit.

[coderabbitai]

Actionable comments posted: 1

🤖 Fix all issues with AI agents

In `@frontend/src/utils/markdown.ts`:
- Around line 10-43: Precompute all markdown link ranges by iterating
mdLinkRegex (/\[([^\]]*)\]\(([^)]+)\)/g) first and collect their start/end
indices, then when scanning plain URLs with urlRegex use those ranges to skip
any URL match whose index falls inside an existing markdown link (instead of
current brittle isInMarkdownLink heuristic); also reuse the same markdown link
ranges when checking truncation (so when maxLength falls inside a markdown link
range you truncate before the whole link as you do now), and ensure the urls
array only contains plain-URL matches that are not inside any md link range.