Fix(setting-sidebar): sidebar "no results found" overflow in API key, Copilot, Credentials, and Environment sections

[Anil567849]

Summary

This PR fixes text wrapping issues across multiple sidebar sections.
Previously, long unbroken strings caused horizontal overflow and overlapping with other content.
Now, text correctly wraps with vertical scrolling preserved, ensuring proper alignment and readability. And there is no text overlapping.

Type of Change

• Bug fix

Testing

• Tested with long unbroken strings in all affected sidebar sections:
  • Environment: "No environment variables found matching"
  • API Key: "No API key results"
  • Copilot: "No API keys found matching"
  • Credentials: "No services found matching"
• Verified no horizontal overflow occurs.
• Verified text wraps correctly without overlapping content.
• Verified vertical scrolling still works as expected and there is text overlapping.

Checklist

• Code follows project style guidelines
• Self-reviewed my changes
• Tests added/updated and passing
• No new warnings introduced
• I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

Screenshots/Videos

Before: and After:: sidebar->environment:

Before: and After:: sidebar->integration:

Before: and After:: sidebar->integration:

[vercel]

@Anil567849 is attempting to deploy a commit to the Sim Team on Vercel.

A member of the Team first needs to authorize it.

[greptile-apps]

Greptile Summary

This PR addresses a UI layout issue by adding the break-all CSS class to "no results found" messages across four sidebar settings modal components: API Keys, Copilot, Credentials, and Environment sections. The change specifically targets the empty state messages that display when users search for items and no matches are found.

The problem occurred when users searched using long unbroken strings (such as lengthy API keys, identifiers, or URLs). These search terms would be displayed within the "No [items] found matching '[searchTerm]'" messages, causing horizontal text overflow that broke the sidebar layout and potentially overlapped with other UI elements.

The solution applies the CSS break-all property to force long words to break at any character boundary when necessary to fit within the container width. This ensures proper text wrapping while preserving the existing vertical scrolling behavior and maintaining the responsive design of the sidebar components.

The fix is implemented consistently across all affected components, demonstrating a systematic approach to resolving this layout issue. The changes are minimal and focused, affecting only the visual presentation without modifying any functional behavior or component logic.

Confidence score: 5/5

• This PR is safe to merge with minimal risk as it only adds a CSS class to improve text wrapping
• Score reflects simple, targeted changes that address a specific UI issue without affecting functionality
• No files require special attention as the changes are straightforward CSS additions

_{3 files reviewed, no comments}

_{Edit Code Review Bot Settings | Greptile}