From 40c248985dc015c38ff0ecc34255698b38beea6a Mon Sep 17 00:00:00 2001
From: alexsparkes <alexsparkes@gmail.com>
Date: Mon, 26 Jan 2026 10:26:02 +0000
Subject: [PATCH] fix(quote/buttons): improve state management and event
 handling

---
 .../quote/components/QuoteButtons.jsx         | 52 ++++++++++---------
 1 file changed, 27 insertions(+), 25 deletions(-)

diff --git a/src/features/quote/components/QuoteButtons.jsx b/src/features/quote/components/QuoteButtons.jsx
index 66e2a936..abddc470 100644
--- a/src/features/quote/components/QuoteButtons.jsx
+++ b/src/features/quote/components/QuoteButtons.jsx
@@ -1,58 +1,60 @@
+import { useState, useEffect } from 'react';
 import { MdContentCopy, MdStarBorder, MdStar, MdIosShare } from 'react-icons/md';
 import { Tooltip } from 'components/Elements';
 import { useT } from 'contexts';
 import variables from 'config/variables';
+import EventBus from 'utils/eventbus';
 
 /**
  * Quote action buttons component
  */
-export default function QuoteButtons({
-  onCopy,
-  onFavourite,
-  onShare,
-  isFavourited,
-}) {
+export default function QuoteButtons({ onCopy, onFavourite, onShare, isFavourited }) {
   const t = useT();
-  const showCopy = localStorage.getItem('copyButton') !== 'false';
-  const showShare = localStorage.getItem('quoteShareButton') !== 'false';
-  const showFavourite = localStorage.getItem('favouriteQuoteEnabled') === 'true';
+  const [showCopy, setShowCopy] = useState(localStorage.getItem('copyButton') !== 'false');
+  const [showShare, setShowShare] = useState(localStorage.getItem('quoteShareButton') !== 'false');
+  const [showFavourite, setShowFavourite] = useState(
+    localStorage.getItem('favouriteQuoteEnabled') === 'true',
+  );
+
+  useEffect(() => {
+    const handleRefresh = (data) => {
+      if (data === 'quote') {
+        setShowCopy(localStorage.getItem('copyButton') !== 'false');
+        setShowShare(localStorage.getItem('quoteShareButton') !== 'false');
+        setShowFavourite(localStorage.getItem('favouriteQuoteEnabled') === 'true');
+      }
+    };
+
+    EventBus.on('refresh', handleRefresh);
+    return () => {
+      EventBus.off('refresh', handleRefresh);
+    };
+  }, []);
 
   return (
     <>
       {showCopy && (
         <Tooltip title={t('widgets.quote.copy')}>
-          <button
-            onClick={onCopy}
-            aria-label={t('widgets.quote.copy')}
-          >
+          <button onClick={onCopy} aria-label={t('widgets.quote.copy')}>
             <MdContentCopy className="copyButton" />
           </button>
         </Tooltip>
       )}
       {showShare && (
         <Tooltip title={t('widgets.quote.share')}>
-          <button
-            onClick={onShare}
-            aria-label={t('widgets.quote.share')}
-          >
+          <button onClick={onShare} aria-label={t('widgets.quote.share')}>
             <MdIosShare className="copyButton" />
           </button>
         </Tooltip>
       )}
       {showFavourite && (
         <Tooltip
-          title={
-            isFavourited
-              ? t('widgets.quote.unfavourite')
-              : t('widgets.quote.favourite')
-          }
+          title={isFavourited ? t('widgets.quote.unfavourite') : t('widgets.quote.favourite')}
         >
           <button
             onClick={onFavourite}
             aria-label={
-              isFavourited
-                ? t('widgets.quote.unfavourite')
-                : t('widgets.quote.favourite')
+              isFavourited ? t('widgets.quote.unfavourite') : t('widgets.quote.favourite')
             }
           >
             {isFavourited ? (