[Rewards] Hide expand button on Android bubble

brave · Feb 27, 2025 · 40c51b4 · 40c51b4
1 parent f504bae
commit 40c51b4
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 17 deletions.
diff --git a/components/brave_rewards/resources/rewards_page/components/app_frame.style.ts b/components/brave_rewards/resources/rewards_page/components/app_frame.style.ts
@@ -98,14 +98,6 @@ export const style = scoped.css`
         background: ${color.container.highlight};
       }
     }
-
-    .expand-button {
-      visibility: hidden;
-
-      .is-bubble & {
-        visibility: visible;
-      }
-    }
   }
 
   &.page-frame {

diff --git a/components/brave_rewards/resources/rewards_page/components/app_frame.tsx b/components/brave_rewards/resources/rewards_page/components/app_frame.tsx
@@ -103,13 +103,10 @@ function MoreMenu(props: { children: React.ReactNode }) {
   const { getString } = useLocaleContext()
   const tabOpener = React.useContext(TabOpenerContext)
   const eventHub = React.useContext(EventHubContext)
-  const isBubble = useAppState((state) => state.embedder.isBubble)
+  const embedder = useAppState((state) => state.embedder)
+  const hideReset = embedder.isBubble && embedder.platform === 'desktop'
 
   function onReset() {
-    if (isBubble) {
-      tabOpener.openTab(urls.resetURL)
-      return
-    }
     eventHub.dispatch('open-modal', 'reset')
   }
 
@@ -127,7 +124,7 @@ function MoreMenu(props: { children: React.ReactNode }) {
         <span>{getString('helpButtonLabel')}</span>
       </leo-menu-item>
       {
-        !isBubble &&
+        !hideReset &&
           <leo-menu-item class='reset' onClick={onReset}>
             <Icon name='history' />
             <span>{getString('resetRewardsButtonLabel')}</span>
@@ -144,6 +141,7 @@ interface Props {
 function PanelFrame(props: Props) {
   const tabOpener = React.useContext(TabOpenerContext)
   const { getString } = useLocaleContext()
+  const embedder = useAppState((state) => state.embedder)
   const [isScrolled, setIsScrolled] = React.useState(false)
 
   function onExpand() {
@@ -162,9 +160,12 @@ function PanelFrame(props: Props) {
   return (
     <div className='panel-frame' {...style}>
       <header className={isScrolled ? 'overlapped' : ''}>
-        <button className='expand-button' onClick={onExpand}>
-          <Icon name='expand' />
-        </button>
+        {
+          embedder.platform === 'desktop' && embedder.isBubble &&
+            <button className='expand-button' onClick={onExpand}>
+              <Icon name='expand' />
+            </button>
+        }
         <h4>{getString('rewardsPageTitle')}</h4>
         <MoreMenu><Icon name='more-vertical' /></MoreMenu>
       </header>

diff --git a/components/brave_rewards/resources/rewards_page/stories/storybook_model.ts b/components/brave_rewards/resources/rewards_page/stories/storybook_model.ts
@@ -20,6 +20,12 @@ export function createModel(): AppModel {
   const locale = createLocaleContextForTesting(localeStrings)
   const stateManager = createStateManager<AppState>({
     ...defaultState(),
+    embedder: {
+      platform: 'desktop',
+      isAutoResizeBubble: false,
+      isBubble: false,
+      animatedBackgroundEnabled: false
+    },
     loading: false,
     paymentId: 'abc123',
     countryCode: 'US',