Dismissable App Promo Banner #2394

leofelix077 · 2025-11-20T14:29:45Z

I added it as a storage setting, so it's shown only once per user, and depends on the extension store, so only shown on the pop-up version, but depending on the direction we want to go, can add it as a "session only" banner without memory if it has been dismissed or not and/or make it available on both the full-screen and the popup versions

⚠️ - Not currently available for full-screen, just the mockup before implementing the store restrictions:

Screen.Recording.2025-11-19.at.16.37.35.mov

* upgrade to yarn 2 and use resolutions to block vulnerable package versions (#2239) * upgrade to yarn 2 and use resolutions to block vulnerable package versions * rm deprecated .yarnrc * rm yarnpath * try committing yarn binary to repo * try corepack enable for gha * update run tests cmd * rm yarnpath * rm npm i yarn * update all pipelines * rm superfluous history types * ensure invoke host function tx shows contract parameters (#2243) * ensure invoke host function tx shows contract parameters * add test for fallback if contract spec retrieval fails * Bugfix/rm auth param names (#2244) * ensure invoke host function tx shows contract parameters * add test for fallback if contract spec retrieval fails * do not show contract parameters for authorizations * add tests for create contract v1 and invoke contract * add issuer for changeTrust op (#2246) * add issuer for changeTrust op * programmatically disable overflow:hidden when copying a value * Revert "add issuer for changeTrust op (#2246)" (#2247) This reverts commit 19c8a68. * Bugfix/add issuer for changetrust (#2249) * ensure invoke host function tx shows contract parameters * add test for fallback if contract spec retrieval fails * do not show contract parameters for authorizations * add tests for create contract v1 and invoke contract * add issuer for changeTrust op * programmatically disable overflow:hidden when copying a value * cache account balances and poll for updates * fix CI tests * rm `force:true` which was causing action to happen too fast * do a fresh balance fetch on account/network change * first pass at async history * pr comments * allow for history caching * add more sentry tracking for Account and Wallets views (#2268) * add more sentry tracking for Account and Wallets views * adding more sentry reporting * gracefully degrade on errors from Blockaid (#2269) * gracefully degrade on errors from Blockaid * should not be necessary to skip dapp scanning on custom network * rm extra dep * add a test for persisting configurations in the send flow (#2271) * add a test for persisting configurations in the send flow * rm logs and update muxed acct; lower xlm payment * rm slow loading simulation * handle missing scan-tx result; add disabled state for Confirm Anyway (#2272) * handle missing scan-tx result; add disabled state for Confirm Anyway * assertions to show correct confirm button on Blockaid error * add cache for balances to ensure we do a fresh lookup when needed (#2275) * add cache for balances to ensure we do a fresh lookup when needed * add try...catch to token-prices polling * rm log * only dispatch saveBalancesForAccount when fresh data has been fetched * adjust test to wait for UI change * replace yarn setup with just yarn * rm unnecessary return * clear token details on redux clear action * make history row construction async and check for redux state for updates * add tests for assetdetails * increase timeout for flakey test * pr comments * refresh account history every time account balances refresh

* check for updated appdata before showing password modal * update error msg * rm unused redirect logic

* move get icons out of critical path; rely on background's cache * add tests and comments * add comment * add comment * only dispatch if we have cached icons * PR comments

* skip blockaid scan on first fetch of account-balances * rm stub change * rm more stubs * rm log * add comments and update boolean naming

* add button to copy address from dropdown * Added translations * revert translation file changes * revert translation file changes * Added translations * revert changes to translation files * move copy address button to first dropdown position

* scroll on long strings; pretty print json * rm log * add correct snapshot for json message * rm log * finish comment * add error case for JSON * don't use carat for lib * update yarn.lock * move scrollbar to btm of container; reduce json font size * update snapshot

* re-searching so should abort any in flight API requests * add comment * fix test name * make test more reliable * add check for correct search results * fix jest locator

* adds SelectionTile and AddressTile, updates nav flows to match updates. Adds query parameter for default values in send flow * Added translations * adds address tile and uses it in swap flow, tweaks selection tile styles * adds unit tests for new tile components * Added translations * updates swap navigation flow to match updates, updates tests flows to match * updates back icon for send and swap steps, fixes bad test references * tweaks locator in address tile tests * adds store state to asset tile tests, removes asset icon mock * updates SelectionTile prop name, adds isSuspicious prop for AssetTile * adds placeholder value in TokenList for missing token USD value * uses real IdenticonImg in address tile unit tests * adds query param validation for send and swap flow * Update extension/src/popup/views/SendPayment/index.tsx Co-authored-by: Cássio Marcos Goulart <[email protected]> * adds missing import * adds class for tile icon --------- Co-authored-by: Cássio Marcos Goulart <[email protected]>

* adds send and swap buttons to asset detail view * uses secondary button styles * removes run snapshots job (#2355) * release/5.35.4 (#2354) * upgrade to ledger-hq/hw-transport-webhid (#2350) * upgrade to ledger-hq/hw-transport-webhid * add tests * add ledger support for new trustline flow (#2352) * upgrade to ledger-hq/hw-transport-webhid * add ledger support for new trustline flow * only re-fetch balances if we were successful * test for fetching balances on success * add reset spys * adjust spacing at top of hw wallet modal * Now that `Done` button properly shows, click it in tests (#2356) * skip flakey test * skip flakey test * renames local vars to follow convention * adds tests for LP share and tweaks LP title * adds links with query params for asset detail CTAs --------- Co-authored-by: Piyal Basu <[email protected]>

* only fetch asset list data if needed * correctly show icon loading state

* adds SAC detection when changing trust in the add and remove token flows * updates arg signature for isAssetSac

# Conflicts: # extension/src/popup/locales/en/translation.json # extension/src/popup/locales/pt/translation.json

* cache token prices and batch loading wallets * use similar methodology for token price and account balance caching * fix loading state trigger * fix tests * use helper for cache clearing * set isFetchingTokenPrices to false in catch handler * rollback error change

* load backend settings async on Account view * rm console.logs

* use ledger-key/accounts endpoint for home domains * fix tests * create generic ledger key account helper; add tests * rm unneeded data-test prop * rm unused import * [CHORE] git process updates (#2361) * moves the add translations hook to the pre commit stage, removes standalone translations commit * adds script to update app version, removes version update from submit production action, adds update version step to test run action for release branches * removes version input, now uses package version * fetch asset domains in one calls * fix tests * cache home domains while iterating over account history rows * fitler non-G keys * rm .only * fix test param * PR comments --------- Co-authored-by: aristides <[email protected]>

) * makes send swap buttons stay in the container in full screen mode * add a pause to make sure flakey e2e test has time to save changes

piyalbasu · 2025-11-20T17:31:13Z

extension/src/popup/components/account/MobileAppBanner/index.tsx

@@ -0,0 +1,102 @@
+import React, { useState, useEffect } from "react";
+import { Icon } from "@stellar/design-system";
+import { Text } from "@stellar/design-system";


NIT: could you combine these imports into 1 line?

oh yes. I'm used to this being done automatically on save. didn't even notice it was in two lines

aristidesstaffieri · 2025-11-20T17:43:51Z

extension/src/popup/components/account/MobileAppBanner/index.tsx

+const STORAGE_KEY = "mobileAppBannerDismissed";
+
+// Only create store if browserLocalStorage is available
+const localStore = browserLocalStorage


we tend to contain interactions with storage to the background script by implementing store methods or helpers(I know its not necessary but it is a pattern in this repo). Can we continue this pattern here?

will do. hopping on @piyalbasu 's comment as well. will check on how it's being done on the other places and follow the pattern

piyalbasu · 2025-11-20T17:47:02Z

extension/src/popup/components/account/MobileAppBanner/index.tsx

+// Only create store if browserLocalStorage is available
+const localStore = browserLocalStorage
+  ? dataStorageAccess(browserLocalStorage)
+  : null;


This technically isn't wrong - but we generally follow a pattern of keeping interactions with the extension's data store in the background folder. This allows us to keep UI concerns and data storage concerns separate. That way, it's easier to keep track of what is making changes to our stored data (this is important because we keep sensitive data, like encrypted private keys, in our data store. We want to make sure requests to write data to our store are all handled in the same place to prevent collisions)

You can use the example of addTokenId as a model for how to send request to write to the data store:

the UI calls addTokenId, which sends a message to the background script: https://github.com/stellar/freighter/blob/master/%40shared/api/internal.ts#L1704

The background script picks up the request: https://github.com/stellar/freighter/blob/master/extension/src/background/messageListener/popupMessageListener.ts#L395

The background script hands off the request to a handler that writes data to the store: https://github.com/stellar/freighter/blob/master/extension/src/background/messageListener/handlers/addTokenId.ts

Does that make sense? Happy to hop on a call and talk through it if not!

oh yes. it does. thanks for explaining. it's good for me to get a better hang on how things are done on the extension. it's very helpful!

Will take a look by myself first to try and understand it. if I get block I can ping you for sure. thanks a lot

* use redux selector for allAccounts to properly update rename * add longer timeout for flakey btn

…ature/app-promotion-banner

piyalbasu · 2025-11-28T14:47:47Z

extension/src/background/messageListener/handlers/dismissMobileAppBanner.ts

@@ -0,0 +1,11 @@
+import { DataStorageAccess } from "background/helpers/dataStorageAccess";
+
+const STORAGE_KEY = "mobileAppBannerDismissed";


You can actually store this in /extension/src/constants/localStorageTypes. Then, you can reuse this const in getMobileAppBannerDismissed, as well

piyalbasu · 2025-11-28T14:50:51Z

extension/src/background/messageListener/handlers/dismissMobileAppBanner.ts

+}: {
+  localStore: DataStorageAccess;
+}): Promise<void> => {
+  await localStore.setItem(STORAGE_KEY, true);


it'd be nice to have this function return {isDismissed: localStore.getItem(STORAGE_KEY)}. Then, in the UI, you can use the return value from this function to set the UI state. This makes sure that the value was correctly set in localStore and we don't accidentally have a mismatch in the UI state and the localStore

piyalbasu · 2025-11-28T14:54:55Z

extension/src/popup/components/account/MobileAppBanner/index.tsx

+import "./styles.scss";
+
+// Check if browser storage is available (extension context, not fullscreen)
+const isStorageAvailable = (): boolean => {


I think this check is a holdover from the last version of this PR, right? You shouldn't need to check this anymore. Whether you're in extension mode or in fullscreen mode, you should have access to the background storage now.

You should be able to safely remove this

piyalbasu · 2025-11-28T14:55:25Z

extension/src/popup/components/account/MobileAppBanner/index.tsx

+        const dismissed = await getMobileAppBannerDismissed();
+        setIsDismissed(dismissed);
+      } catch (error) {
+        console.error("Error checking banner dismissal status:", error);


let's use captureException here to report this error to Sentry so we can have visibility if there's an issue

piyalbasu · 2025-11-28T14:55:47Z

extension/src/popup/components/account/MobileAppBanner/index.tsx

+      await dismissMobileAppBanner();
+      setIsDismissed(true);
+    } catch (error) {
+      console.error("Error dismissing banner:", error);


similar to above comment - let's use captureException

piyalbasu · 2025-11-28T14:57:07Z

extension/src/popup/components/account/MobileAppBanner/index.tsx

+    e.stopPropagation();
+    try {
+      await dismissMobileAppBanner();
+      setIsDismissed(true);


Related to this comment: https://github.com/stellar/freighter/pull/2394/files#r2571903580

dismissMobileAppeBanner should return {isDismissed: true} and you can use that value in setIsDismissed to make sure there isn't a possible mismatch between the UI and the background storage

piyalbasu and others added 22 commits October 7, 2025 15:45

check for updated appdata before showing password modal (#2300)

b61ec65

* check for updated appdata before showing password modal * update error msg * rm unused redirect logic

stringify errors rather than using cause (#2302)

91a49a5

Feature/move icons to own hook (#2308)

cc130fc

* move get icons out of critical path; rely on background's cache * add tests and comments * add comment * add comment * only dispatch if we have cached icons * PR comments

skip blockaid scan on first fetch of account-balances (#2310)

c50cbc1

* skip blockaid scan on first fetch of account-balances * rm stub change * rm more stubs * rm log * add comments and update boolean naming

Merge branch 'master' into release/5.36.0

89b00b0

Merge branch 'master' into release/5.36.0

9218e3f

re-searching so should abort any in flight API requests (#2323)

077117e

* re-searching so should abort any in flight API requests * add comment * fix test name * make test more reliable * add check for correct search results * fix jest locator

only fetch asset list data if needed (#2369)

5199754

* only fetch asset list data if needed * correctly show icon loading state

[BUG] SAC token management improvements (#2374)

cdafa95

* adds SAC detection when changing trust in the add and remove token flows * updates arg signature for isAssetSac

Merge branch 'master' into release/5.36.0

85014fb

# Conflicts: # extension/src/popup/locales/en/translation.json # extension/src/popup/locales/pt/translation.json

load backend settings async on Account view (#2381)

6268562

* load backend settings async on Account view * rm console.logs

update version numbers for release

9a0dd5e

add v1 of dismissable app promo banner

6817e58

rm unnecessary calls to make flows even faster (#2391)

0aed2a4

makes send swap buttons stay in the container in full screen mode (#2392

1e8117a

) * makes send swap buttons stay in the container in full screen mode * add a pause to make sure flakey e2e test has time to save changes

leofelix077 requested review from aristidesstaffieri and piyalbasu November 20, 2025 14:29

leofelix077 self-assigned this Nov 20, 2025

leofelix077 added don't review yet wip / tests in progress / missing videos or screenshots / pending self code-review enhancement New feature or request and removed don't review yet wip / tests in progress / missing videos or screenshots / pending self code-review labels Nov 20, 2025

piyalbasu reviewed Nov 20, 2025

View reviewed changes

aristidesstaffieri reviewed Nov 20, 2025

View reviewed changes

piyalbasu reviewed Nov 20, 2025

View reviewed changes

piyalbasu and others added 2 commits November 21, 2025 10:52

Merge branch 'master' into release/5.36.0

bd6034d

send app promotion store messages to background

c559337

leofelix077 marked this pull request as draft November 21, 2025 17:52

leofelix077 added the don't review yet wip / tests in progress / missing videos or screenshots / pending self code-review label Nov 21, 2025

leofelix077 changed the base branch from master to release/5.36.0 November 21, 2025 17:52

piyalbasu and others added 2 commits November 21, 2025 12:59

use redux selector for allAccounts to properly update rename (#2403)

1f3710d

* use redux selector for allAccounts to properly update rename * add longer timeout for flakey btn

merge 5.36 into branch

192ce88

leofelix077 marked this pull request as ready for review November 21, 2025 18:35

adjust unified package imports

924d488

leofelix077 removed the don't review yet wip / tests in progress / missing videos or screenshots / pending self code-review label Nov 21, 2025

Base automatically changed from release/5.36.0 to master November 24, 2025 20:31

leofelix077 closed this Nov 25, 2025

leofelix077 reopened this Nov 26, 2025

leofelix077 changed the base branch from master to release/5.37.0 November 26, 2025 13:41

Merge branch 'release/5.37.0' of github.com:stellar/freighter into fe…

1e98b16

…ature/app-promotion-banner

piyalbasu reviewed Nov 28, 2025

View reviewed changes

		@@ -0,0 +1,11 @@
		import { DataStorageAccess } from "background/helpers/dataStorageAccess";

		const STORAGE_KEY = "mobileAppBannerDismissed";

Dismissable App Promo Banner #2394

Are you sure you want to change the base?

Dismissable App Promo Banner #2394

Uh oh!

Conversation

leofelix077 commented Nov 20, 2025

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

leofelix077 Nov 21, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

leofelix077 Nov 21, 2025 •

edited

Loading