From 3f6aa7a832c395b1d7234c7678a945b36850c368 Mon Sep 17 00:00:00 2001
From: Michal Zielenkiewicz <michal@oasisprotocol.org>
Date: Mon, 3 Nov 2025 09:36:11 +0100
Subject: [PATCH 1/2] Replace MUI Tooltip with Oasis UI Library component

---
 .changelog/2301.internal.md                        |  1 +
 .../ConsensusTransactionMethod/index.tsx           | 14 ++------------
 src/app/components/Tooltip/MaybeWithTooltip.tsx    |  7 ++-----
 3 files changed, 5 insertions(+), 17 deletions(-)
 create mode 100644 .changelog/2301.internal.md

diff --git a/.changelog/2301.internal.md b/.changelog/2301.internal.md
new file mode 100644
index 0000000000..e56965d3eb
--- /dev/null
+++ b/.changelog/2301.internal.md
@@ -0,0 +1 @@
+Replace MUI Tooltip with Oasis UI Library component
diff --git a/src/app/components/ConsensusTransactionMethod/index.tsx b/src/app/components/ConsensusTransactionMethod/index.tsx
index 0c5c06ff13..20b45f9eab 100644
--- a/src/app/components/ConsensusTransactionMethod/index.tsx
+++ b/src/app/components/ConsensusTransactionMethod/index.tsx
@@ -13,8 +13,7 @@ import MiscellaneousServicesIcon from '@mui/icons-material/MiscellaneousServices
 import PersonIcon from '@mui/icons-material/Person'
 import PriceChangeIcon from '@mui/icons-material/PriceChange'
 import QuestionMarkIcon from '@mui/icons-material/QuestionMark'
-import Tooltip from '@mui/material/Tooltip'
-import { tooltipDelay } from '../../../styles/theme'
+import { Tooltip } from '@oasisprotocol/ui-library/src/components/tooltip'
 import { ConsensusTxMethod, GetConsensusTransactionsParams } from '../../../oasis-nexus/api'
 import { COLORS } from '../../../styles/theme/colors'
 import { exhaustedTypeWarning } from '../../../types/errors'
@@ -142,16 +141,7 @@ const MethodIconWithTruncatedLabel: FC<MethodIconProps> = props => {
   }, [applyTruncate, elementRef, props.label, props.size])
 
   return (
-    <Tooltip
-      arrow
-      placement="top"
-      title={props.label}
-      enterDelay={tooltipDelay}
-      enterNextDelay={tooltipDelay}
-      disableFocusListener={!truncate}
-      disableHoverListener={!truncate}
-      disableTouchListener={!truncate}
-    >
+    <Tooltip title={props.label} disabled={!truncate}>
       <div>
         <MethodIconContent {...props} elementRef={elementRef} truncate={truncate} />
       </div>
diff --git a/src/app/components/Tooltip/MaybeWithTooltip.tsx b/src/app/components/Tooltip/MaybeWithTooltip.tsx
index 6e04ef7328..be8b6ebd14 100644
--- a/src/app/components/Tooltip/MaybeWithTooltip.tsx
+++ b/src/app/components/Tooltip/MaybeWithTooltip.tsx
@@ -1,5 +1,5 @@
 import { FC, ReactNode } from 'react'
-import Tooltip from '@mui/material/Tooltip'
+import { Tooltip } from '@oasisprotocol/ui-library/src/components/tooltip'
 
 type MaybeWithTooltipProps = {
   /**
@@ -26,11 +26,8 @@ type MaybeWithTooltipProps = {
 export const MaybeWithTooltip: FC<MaybeWithTooltipProps> = ({ title, children, spanClassName }) => {
   return (
     <Tooltip
-      placement="top"
       title={<div className="flex items-center gap-2 md:mx-0 -mx-3 min-w-0 wrap-anywhere">{title}</div>}
-      disableFocusListener={!title}
-      disableHoverListener={!title}
-      disableTouchListener={!title}
+      disabled={!title}
     >
       <span className={spanClassName}>{children}</span>
     </Tooltip>

From 0d918e4879c293713f549cd3009665771d546c43 Mon Sep 17 00:00:00 2001
From: Michal Zielenkiewicz <michal@oasisprotocol.org>
Date: Tue, 4 Nov 2025 12:12:54 +0100
Subject: [PATCH 2/2] Do not wrap oasis1 addresses in MaybeWithTooltip

---
 src/app/components/Tooltip/MaybeWithTooltip.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/app/components/Tooltip/MaybeWithTooltip.tsx b/src/app/components/Tooltip/MaybeWithTooltip.tsx
index be8b6ebd14..30b8ff7c12 100644
--- a/src/app/components/Tooltip/MaybeWithTooltip.tsx
+++ b/src/app/components/Tooltip/MaybeWithTooltip.tsx
@@ -26,6 +26,7 @@ type MaybeWithTooltipProps = {
 export const MaybeWithTooltip: FC<MaybeWithTooltipProps> = ({ title, children, spanClassName }) => {
   return (
     <Tooltip
+      className="max-w-[410px]"
       title={<div className="flex items-center gap-2 md:mx-0 -mx-3 min-w-0 wrap-anywhere">{title}</div>}
       disabled={!title}
     >