From 8ab024b04945b41a752a4310dfd7d7f2d93915ec Mon Sep 17 00:00:00 2001
From: Alejandro <95312462+AGMASO@users.noreply.github.com>
Date: Thu, 4 Dec 2025 09:53:42 +0100
Subject: [PATCH] fix: ui bugs afecting reserve overview page

---
 src/components/TextWithTooltip.tsx                 | 9 ++++++++-
 src/components/caps/CapsCircularStatus.tsx         | 1 +
 src/components/infoTooltips/VariableAPYTooltip.tsx | 2 +-
 src/modules/reserve-overview/ReserveActions.tsx    | 6 +++++-
 4 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/src/components/TextWithTooltip.tsx b/src/components/TextWithTooltip.tsx
index 406692221e..dc6c2875ce 100644
--- a/src/components/TextWithTooltip.tsx
+++ b/src/components/TextWithTooltip.tsx
@@ -20,6 +20,7 @@ export interface TextWithTooltipProps extends TypographyProps {
   event?: TrackEventProps;
   open?: boolean;
   setOpen?: (open: boolean) => void;
+  placement?: 'bottom' | 'left' | 'right';
 }
 
 export const TextWithTooltip = ({
@@ -34,6 +35,7 @@ export const TextWithTooltip = ({
   event,
   open: openProp = false,
   setOpen: setOpenProp,
+  placement = 'bottom',
   ...rest
 }: TextWithTooltipProps) => {
   const [open, setOpen] = useState(openProp);
@@ -52,7 +54,12 @@ export const TextWithTooltip = ({
         </Typography>
       )}
 
-      <ContentWithTooltip tooltipContent={<>{children}</>} open={open} setOpen={toggleOpen}>
+      <ContentWithTooltip
+        tooltipContent={<>{children}</>}
+        open={open}
+        setOpen={toggleOpen}
+        placement={placement}
+      >
         <IconButton
           sx={{
             display: 'flex',
diff --git a/src/components/caps/CapsCircularStatus.tsx b/src/components/caps/CapsCircularStatus.tsx
index 383993195f..fbdbdbd124 100644
--- a/src/components/caps/CapsCircularStatus.tsx
+++ b/src/components/caps/CapsCircularStatus.tsx
@@ -42,6 +42,7 @@ export const CapsCircularStatus = ({ value, tooltipContent, onClick }: CapsCircu
   return (
     <ContentWithTooltip
       tooltipContent={<>{tooltipContent}</>}
+      placement="bottom"
       open={open}
       setOpen={(value) => {
         setOpen(value);
diff --git a/src/components/infoTooltips/VariableAPYTooltip.tsx b/src/components/infoTooltips/VariableAPYTooltip.tsx
index 2db8621311..18faaa933b 100644
--- a/src/components/infoTooltips/VariableAPYTooltip.tsx
+++ b/src/components/infoTooltips/VariableAPYTooltip.tsx
@@ -4,7 +4,7 @@ import { TextWithTooltip, TextWithTooltipProps } from '../TextWithTooltip';
 
 export const VariableAPYTooltip = ({ ...rest }: TextWithTooltipProps) => {
   return (
-    <TextWithTooltip {...rest}>
+    <TextWithTooltip {...rest} placement="bottom">
       <Trans>
         Variable interest rate will <b>fluctuate</b> based on the market conditions.
       </Trans>
diff --git a/src/modules/reserve-overview/ReserveActions.tsx b/src/modules/reserve-overview/ReserveActions.tsx
index 9bb415a09d..13fb0986c8 100644
--- a/src/modules/reserve-overview/ReserveActions.tsx
+++ b/src/modules/reserve-overview/ReserveActions.tsx
@@ -389,7 +389,11 @@ const WrappedBaseAssetSelector = ({
       color="primary"
       value={selectedAsset}
       exclusive
-      onChange={(_, value) => setSelectedAsset(value)}
+      onChange={(_, value) => {
+        if (value !== null) {
+          setSelectedAsset(value);
+        }
+      }}
       sx={{ mb: 4 }}
     >
       <StyledTxModalToggleButton value={assetSymbol}>