From 0b5f0ede3be9ec76775d9da36823b4a0f182d524 Mon Sep 17 00:00:00 2001
From: Huang Xin <chrox.huang@gmail.com>
Date: Wed, 7 May 2025 20:44:17 +0800
Subject: [PATCH] fix: close action bar when the footbar is dismissed, closes
 #1064 (#1086)

---
 apps/readest-app/src/app/reader/components/FooterBar.tsx | 8 +++++++-
 apps/readest-app/src/components/Button.tsx               | 5 ++++-
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/apps/readest-app/src/app/reader/components/FooterBar.tsx b/apps/readest-app/src/app/reader/components/FooterBar.tsx
index 1850c64a..ff8c9a53 100644
--- a/apps/readest-app/src/app/reader/components/FooterBar.tsx
+++ b/apps/readest-app/src/app/reader/components/FooterBar.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import clsx from 'clsx';
 import { RiArrowLeftWideLine, RiArrowRightWideLine } from 'react-icons/ri';
 import { RiArrowGoBackLine, RiArrowGoForwardLine } from 'react-icons/ri';
@@ -122,6 +122,12 @@ const FooterBar: React.FC<FooterBarProps> = ({
     }
   };
 
+  useEffect(() => {
+    if (hoveredBookKey !== bookKey) {
+      setActionTab('');
+    }
+  }, [hoveredBookKey, bookKey]);
+
   const getMarginProgressValue = (marginPx: number, gapPercent: number) => {
     return (marginPx / 88 + gapPercent / 10) * 50;
   };
diff --git a/apps/readest-app/src/components/Button.tsx b/apps/readest-app/src/components/Button.tsx
index cadf7314..853bb538 100644
--- a/apps/readest-app/src/components/Button.tsx
+++ b/apps/readest-app/src/components/Button.tsx
@@ -1,5 +1,6 @@
-import React from 'react';
 import clsx from 'clsx';
+import React from 'react';
+import { useEnv } from '@/context/EnvContext';
 
 interface ButtonProps {
   icon: React.ReactNode;
@@ -18,6 +19,7 @@ const Button: React.FC<ButtonProps> = ({
   tooltipDirection = 'top',
   className,
 }) => {
+  const { appService } = useEnv();
   return (
     <div
       className={clsx(
@@ -32,6 +34,7 @@ const Button: React.FC<ButtonProps> = ({
       <button
         className={clsx(
           'btn btn-ghost h-8 min-h-8 w-8 p-0',
+          appService?.isMobileApp && 'hover:bg-transparent',
           disabled && 'btn-disabled !bg-transparent',
           className,
         )}