Add maintenance mode through Amplitude by leofelix077 · Pull Request #2666 · stellar/freighter

leofelix077 · 2026-03-25T16:49:53Z

Closes #2531

…x/adjust-unfunded-acct-errors

…r/freighter into feature/add-maintenance-mode

socket-security · 2026-03-25T16:50:33Z

Review the following changes in direct dependencies. Learn more about Socket for GitHub.

Diff	Package	Supply Chain Security	Vulnerability	Quality	Maintenance	License
	npm/@amplitude/experiment-js-client@1.20.4

View full report

socket-security · 2026-03-25T16:50:35Z

All alerts resolved. Learn more about Socket for GitHub.

This PR previously contained dependency changes with security issues that have been resolved, removed, or ignored.

View full report

Copilot

Pull request overview

Implements “maintenance mode” in the extension popup driven by Amplitude Experiment feature flags, enabling both a non-blocking banner and a full-screen blocking maintenance screen (plus supporting debug/testing tooling).

Changes:

Add Amplitude Experiment client initialization + Redux “remoteConfig” duck to fetch and expose maintenance flags/content.
Introduce MaintenanceBanner (Account header) and MaintenanceScreen (app-wide gate) with localized payload parsing.
Expand Debug tooling and add unit + Playwright E2E tests (including test-only Redux store injection).

Reviewed changes

Copilot reviewed 35 out of 36 changed files in this pull request and generated 7 comments.

Show a summary per file

File	Description
yarn.lock	Adds Amplitude Experiment dependencies and transitive packages.
extension/package.json	Adds `@amplitude/experiment-js-client` dependency.
extension/webpack.extension.js	Adds Experiment deployment key env wiring; defaults env param.
extension/webpack.dev.js	Adds Experiment deployment key to dev env merge.
extension/webpack.common.js	Defines `AMPLITUDE_EXPERIMENT_DEPLOYMENT_KEY` at build time.
extension/.env.example	Documents new Experiment deployment key env var.
extension/src/constants/env.ts	Exposes `AMPLITUDE_EXPERIMENT_DEPLOYMENT_KEY` constant.
extension/src/helpers/experimentClient.ts	Adds Experiment client init/get helper.
extension/src/helpers/metrics.ts	Initializes Experiment client after analytics init; refactors constants.
extension/src/popup/ducks/remoteConfig.ts	Adds remote config slice + thunk + maintenance selectors.
extension/src/popup/ducks/tests/remoteConfig.test.ts	Unit tests for remoteConfig thunk/selectors.
extension/src/popup/helpers/hooks/useRemoteConfig.ts	Hook to fetch flags once per popup open.
extension/src/popup/helpers/maintenance/types.ts	Defines maintenance payload/content types and banner themes.
extension/src/popup/helpers/maintenance/parseMaintenanceContent.ts	Parses and localizes maintenance payloads safely.
extension/src/popup/helpers/maintenance/tests/parseMaintenanceContent.test.ts	Unit tests for maintenance payload parsing.
extension/src/popup/components/MaintenanceBanner/index.tsx	Implements maintenance banner + optional modal interaction.
extension/src/popup/components/MaintenanceBanner/styles.scss	Styles for banner strip and modal content.
extension/src/popup/components/MaintenanceScreen/index.tsx	Implements full-screen maintenance overlay.
extension/src/popup/components/MaintenanceScreen/styles.scss	Styles for the full-screen overlay.
extension/src/popup/components/SlideupModal/index.tsx	Adds optional full-screen backdrop support.
extension/src/popup/components/SlideupModal/styles.scss	Uses `visibility` toggling to improve Playwright visibility assertions.
extension/src/popup/components/account/AccountHeader/index.tsx	Renders `MaintenanceBanner` as header top content.
extension/src/popup/basics/layout/View/index.tsx	Adds `topContent` slot to `View.AppHeader`.
extension/src/popup/basics/layout/View/styles.scss	Adds styling hook for `View__topContent`.
extension/src/popup/App.tsx	Adds MaintenanceGate and dev-only `window.__store` exposure for E2E.
extension/src/popup/testHelpers/index.tsx	Registers `remoteConfig` reducer in dummy store.
extension/src/popup/views/Debug.tsx	Adds feature flag debug section + layout changes.
extension/src/popup/views/Debug/styles.scss	Adds side-by-side layout and increases max width.
extension/src/popup/styles/global.scss	Adds z-index CSS var for maintenance overlay.
extension/src/popup/components/tests/maintenanceMode.test.tsx	Unit tests for banner + screen components.
extension/src/popup/locales/en/translation.json	Adds new strings for flags/debug + maintenance banner.
extension/src/popup/locales/pt/translation.json	Adds Portuguese translations for new strings.
extension/e2e-tests/helpers/stubs.ts	Adds helpers to inject maintenance state via `window.__store`.
extension/e2e-tests/maintenanceMode.test.ts	Adds Playwright E2E coverage for banner/screen behavior.
eslint.config.js	Updates TypeScript import resolver to include extension tsconfig.
config/jest/setupTests.tsx	Adds globals for env constants used in tests and formats mocked middleware.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Copilot · 2026-03-25T16:56:00Z

+        onKeyDown={
+          isClickable
+            ? (e) => {
+                if (e.key === "Enter" || e.key === " ") handleClick();


The banner strip is rendered as a <div> with role="button", but the keyboard handler doesn’t preventDefault() for the Space key. On Space, browsers typically scroll the page; for custom buttons you generally need to prevent default to match native button behavior. Consider using a real <button type="button"> for the clickable banner (or at least call e.preventDefault() when e.key === " ") to improve accessibility and keyboard parity.

Suggested change

if (e.key === "Enter" || e.key === " ") handleClick();

if (e.key === "Enter") {

handleClick();

} else if (e.key === " ") {

e.preventDefault();

handleClick();

}

Copilot

Pull request overview

Copilot reviewed 35 out of 36 changed files in this pull request and generated 7 comments.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Copilot · 2026-03-25T17:33:17Z

+  await expect(page.getByTestId("maintenance-banner")).toBeVisible();
+  await expect(
+    page
+      .getByTestId("maintenance-banner")
+      .locator(".MaintenanceBanner__alert--warning"),
+  ).toBeVisible();
+});


This locator is scoped to the maintenance-banner element and then searches for a descendant with .MaintenanceBanner__alert--warning, but that class is on the banner element itself (not a child). locator() won’t match the scope element, so this assertion will fail. Assert the class directly on the banner element (e.g. via toHaveClass) or use a :scope selector.

CassioMG · 2026-03-27T19:36:49Z

@leofelix077 the font size here seems a bit bigger than what we have on Figma. (left is Figma - right is PR) Is this intended?

CassioMG · 2026-03-27T21:43:12Z

+ * String flags — variant value is used directly.
+ * Empty for now; add flag names here as new string flags are introduced.
+ */
+const STRING_FLAGS = [] as const;


on mobile we don't have STRING_FLAGS, we actually have VERSION_FLAGS which receive a special treatment where we parse 1_2_3 => 1.2.3

I'd suggest updating it to VERSION_FLAGSn + special parsing so we don't need to worry about it whenever we need to use a version flag with extension so we keep same behavior on both platforms for consistency

CassioMG · 2026-03-27T21:49:47Z

+      return { ...initialState, isInitialized: true };
+    }
+
+    await client.fetch();


I think we need to fetch the flags passing user_properties + bundleId to rest assure it'll fetch the flags when users have opt out of analytics, the same we do on mobile:

await experimentClient.fetch({ user_properties: { // We need to explicitly pass the "Bundle Id" here to make sure the // correct flag values will be assigned regardless if (iOS) users // have ever enabled tracking permission or not. // Other common properties like "Platform" and "Version" appear to be // always forwarded regardless of tracking permission. [ANALYTICS_CONFIG.BUNDLE_ID_KEY]: getBundleId(), }, });

could you please apply this change and test what happens when a user opt-out of analytics? the analytics metrics should stop being sent to Amplitude but we should still be able to fetch the feature flags with no issues

CassioMG · 2026-03-27T21:55:23Z

 # To test Amplitude locally, add the line below with your Amplitude key, then run: yarn start
 #
 # AMPLITUDE_KEY=
+# AMPLITUDE_EXPERIMENT_DEPLOYMENT_KEY=


I think we need to polish the comments on lines 4-5 a little bit to account for this new variable

CassioMG · 2026-03-27T22:12:00Z

+function resolveLocalizedArray(map: LocalizedStringArray): string[] {
+  const lang = getLang();
+  return map[lang] ?? map.en ?? [];
+}


on mobile we do some filtering here to take only the string values from the array. E.g.: if the Amplitude payload contains ["text", 42, null], mobile filters to ["text"] but extension would pass all values through.

I think extension should add the same .filter() guard for consistency.

This is there I saw it on mobile:

const getLocalizedStringArray = ( obj: LocalizedStringArray | undefined, fallback: string[], ): string[] => { if (!obj) return fallback; const lang = getDeviceLanguage(); const value = obj[lang] ?? obj.en; if (!Array.isArray(value)) return fallback; return value.filter( (v): v is string => typeof v === "string" && v.trim().length > 0, ); // ========================> filter out non-string values };

…ature/add-maintenance-mode

leofelix077 · 2026-03-30T16:59:14Z

@CassioMG finished adjusting the UI + open comments from review

Copilot

Pull request overview

Copilot reviewed 37 out of 38 changed files in this pull request and generated 2 comments.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

…llar/freighter into feature/add-maintenance-mode

CassioMG · 2026-03-31T17:21:45Z

+    // the user has opted out of analytics (mirrors mobile implementation).
+    await client.fetch({
+      user_properties: {
+        "Bundle Id": `extension.${BUILD_TYPE}`,


could we extract "Bundle Id" to a const and extension.${BUILD_TYPE} to a getBundleId helper? I think we use it in multiple places now

oh yes. done 👌

…llar/freighter into feature/add-maintenance-mode

…ature/add-maintenance-mode

leofelix077 added 17 commits March 23, 2026 12:05

add amplitude SDK to extension

7a7e481

fix codeql warnings

cd56f2a

adjust yaml syntax

83e1c39

fix random uuid generation

d75f480

fix random uuid generation

e89e797

Merge branch 'release/5.38.0' of github.com:stellar/freighter into fi…

92baa6d

…x/adjust-unfunded-acct-errors

add initial version of maintenance mode

f497dbd

adjust metrics build error

09bd9f5

fix flag setting for dev server and build type

918de53

Merge branch 'feature/add-amplitude-sdk' of https://github.com/stella…

346d017

…r/freighter into feature/add-maintenance-mode

merge tsconfig rules

54d6a71

add ui and fine tune for maintenance mode banner

92d2e17

fix UI for maintenance screen

4ff5016

adjust maintenance mode findings from opencode and code review

aef584c

fix tests

964f888

security adjustments from opencode review

baad18f

security adjustments from opencode review

171181f

leofelix077 self-assigned this Mar 25, 2026

Copilot AI review requested due to automatic review settings March 25, 2026 16:49

leofelix077 added the don't review yet wip / tests in progress / missing videos or screenshots / pending self code-review label Mar 25, 2026

leofelix077 changed the base branch from master to feature/add-amplitude-sdk March 25, 2026 16:50

Copilot started reviewing on behalf of leofelix077 March 25, 2026 16:50 View session

revert build type to not prod

048fe09

Copilot AI reviewed Mar 25, 2026

View reviewed changes

adjust code from copilot review

18ae266

leofelix077 requested a review from Copilot March 25, 2026 17:27

Copilot started reviewing on behalf of leofelix077 March 25, 2026 17:28 View session

Copilot AI reviewed Mar 25, 2026

View reviewed changes

leofelix077 added 2 commits March 27, 2026 11:29

merge base into branch

ec2a08a

fix typings on metrics

5fd98eb

CassioMG reviewed Mar 27, 2026

View reviewed changes

Base automatically changed from feature/add-amplitude-sdk to master March 30, 2026 13:35

leofelix077 added 4 commits March 30, 2026 10:43

Merge branch 'master' of https://github.com/stellar/freighter into fe…

3a1aa53

…ature/add-maintenance-mode

remove orphan translation keys and debug props on test

ce5b917

add try catches for maintenance modes parsing

113d0fb

adjust docs and parity with mobile for version strings

84e3857

adjust UI to match closer to figma designs

bfc322d

leofelix077 requested a review from Copilot March 30, 2026 18:35

Copilot started reviewing on behalf of leofelix077 March 30, 2026 18:35 View session

Copilot AI reviewed Mar 30, 2026

View reviewed changes

Comment thread extension/src/popup/components/SlideupModal/styles.scss

Comment thread extension/src/popup/locales/pt/translation.json

leofelix077 added 4 commits March 30, 2026 15:53

Merge branch 'master' into feature/add-maintenance-mode

7265a64

fix animation for slideup modal

b1998ff

Merge branch 'feature/add-maintenance-mode' of https://github.com/ste…

ca799db

…llar/freighter into feature/add-maintenance-mode

Merge branch 'master' into feature/add-maintenance-mode

e1f3094

CassioMG approved these changes Mar 31, 2026

View reviewed changes

CassioMG reviewed Mar 31, 2026

View reviewed changes

leofelix077 added 3 commits March 31, 2026 15:23

extract bundleId and getBundleId to analytics helper

2084399

Merge branch 'feature/add-maintenance-mode' of https://github.com/ste…

2ef60a4

…llar/freighter into feature/add-maintenance-mode

Merge branch 'master' of https://github.com/stellar/freighter into fe…

4d8c92c

…ature/add-maintenance-mode

CassioMG approved these changes Mar 31, 2026

View reviewed changes

leofelix077 merged commit e202b8a into master Mar 31, 2026
9 checks passed

leofelix077 deleted the feature/add-maintenance-mode branch March 31, 2026 18:32

github-actions bot mentioned this pull request Apr 16, 2026

v5.39.0 #2697

Merged

Conversation

leofelix077 commented Mar 25, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

socket-security bot commented Mar 25, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

socket-security bot commented Mar 25, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

Copilot AI Mar 25, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI Mar 25, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

CassioMG commented Mar 27, 2026

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!

leofelix077 commented Mar 30, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

leofelix077 commented Mar 25, 2026 •

edited

Loading

socket-security bot commented Mar 25, 2026 •

edited

Loading

socket-security bot commented Mar 25, 2026 •

edited

Loading

leofelix077 commented Mar 30, 2026 •

edited

Loading