Add @mention support in AI Chat input (#17943)

## Summary
- Add `@mention` support to the AI Chat text input by replacing the
plain textarea with a minimal Tiptap editor and building a shared
`mention` module with reusable Tiptap extensions (`MentionTag`,
`MentionSuggestion`), search hook (`useMentionSearch`), and suggestion
menu — all shared with the existing BlockNote-based Notes mentions to
avoid code duplication
- Mentions are serialized as
`[[record:objectName:recordId:displayName]]` markdown (the format
already understood by the backend and rendered in chat messages), and
displayed using the existing `RecordLink` chip component for visual
consistency
- Fix images in chat messages overflowing their container by
constraining to `max-width: 100%`
- Fix web_search tool display showing literal `{query}` instead of the
actual query (ICU single-quote escaping issue in Lingui `t` tagged
templates)

## Test plan
- [ ] Open AI Chat, type `@` and verify the suggestion menu appears with
searchable records
- [ ] Select a mention from the dropdown (via click or keyboard
Enter/ArrowUp/Down) and verify the record chip renders inline
- [ ] Send a message containing a mention and verify it appears
correctly in the conversation as a clickable `RecordLink`
- [ ] Verify Enter sends the message when the suggestion menu is closed,
and selects a mention when the menu is open
- [ ] Verify images in AI chat responses are constrained to the
container width
- [ ] Verify the web_search tool step shows the actual search query
(e.g. "Searched the web for Salesforce") instead of `{query}`
- [ ] Verify Notes @mentions still work as before


Made with [Cursor](https://cursor.com)

---------

Co-authored-by: Cursor <cursoragent@cursor.com>

packages/twenty-front/src/modules/ai/components/internal/SendMessageButton.tsx

@@ -1,31 +1,16 @@
-import { AI_CHAT_INPUT_ID } from '@/ai/constants/AiChatInputId';
 import { useAgentChatContextOrThrow } from '@/ai/hooks/useAgentChatContextOrThrow';
 import { agentChatInputState } from '@/ai/states/agentChatInputState';
-import { useHotkeysOnFocusedElement } from '@/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElement';
 import { useRecoilValue } from 'recoil';
-import { Key } from 'ts-key-enum';
 import { IconArrowUp, IconPlayerStop } from 'twenty-ui/display';
 import { RoundedIconButton } from 'twenty-ui/input';
 
-export const SendMessageButton = () => {
-  const agentChatInput = useRecoilValue(agentChatInputState);
-  const { handleSendMessage, handleStop, isLoading, isStreaming } =
-    useAgentChatContextOrThrow();
+type SendMessageButtonProps = {
+  onSend: () => void;
+};
 
-  useHotkeysOnFocusedElement({
-    keys: [Key.Enter],
-    callback: (event: KeyboardEvent) => {
-      if (!event.ctrlKey && !event.metaKey) {
-        event.preventDefault();
-        handleSendMessage();
-      }
-    },
-    focusId: AI_CHAT_INPUT_ID,
-    dependencies: [agentChatInput, isLoading],
-    options: {
-      enableOnFormTags: true,
-    },
-  });
+export const SendMessageButton = ({ onSend }: SendMessageButtonProps) => {
+  const agentChatInput = useRecoilValue(agentChatInputState);
+  const { handleStop, isLoading, isStreaming } = useAgentChatContextOrThrow();
 
   if (isStreaming) {
     return (
@@ -41,7 +26,7 @@ export const SendMessageButton = () => {
     <RoundedIconButton
       Icon={IconArrowUp}
       size="medium"
-      onClick={() => handleSendMessage()}
+      onClick={onSend}
       disabled={!agentChatInput || isLoading}
     />
   );