From f6d60c243a5f00b149fc3026c8b507919ef86247 Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Fri, 13 Oct 2023 17:29:52 -0500
Subject: [PATCH] MentionNode: add Tooltip

---
 .../compose/editor/nodes/mention-node.tsx     | 19 +++++++++++--------
 1 file changed, 11 insertions(+), 8 deletions(-)

diff --git a/src/features/compose/editor/nodes/mention-node.tsx b/src/features/compose/editor/nodes/mention-node.tsx
index cb8cbe538..e170550ab 100644
--- a/src/features/compose/editor/nodes/mention-node.tsx
+++ b/src/features/compose/editor/nodes/mention-node.tsx
@@ -8,6 +8,8 @@ import { addClassNamesToElement } from '@lexical/utils';
 import { $applyNodeReplacement, DecoratorNode } from 'lexical';
 import React from 'react';
 
+import { Tooltip } from 'soapbox/components/ui';
+
 import type {
   EditorConfig,
   LexicalNode,
@@ -79,14 +81,15 @@ class MentionNode extends DecoratorNode<JSX.Element> {
     const username = acct.split('@')[0];
 
     return (
-      <button
-        className='text-accent-blue'
-        type='button'
-        title={`@${acct}`}
-        dir='ltr'
-      >
-        @{username}
-      </button>
+      <Tooltip text={`@${acct}`}>
+        <button
+          className='text-accent-blue'
+          type='button'
+          dir='ltr'
+        >
+          @{username}
+        </button>
+      </Tooltip>
     );
   }