fix: ui bugs afecting reserve overview page

Author: AGMASO

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',

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);

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>

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}>