Skip to content

fix: Update activity log header to use arrow disclosure variant#39767

Merged
georgewrmarshall merged 2 commits intomainfrom
activity-log
Feb 5, 2026
Merged

fix: Update activity log header to use arrow disclosure variant#39767
georgewrmarshall merged 2 commits intomainfrom
activity-log

Conversation

@georgewrmarshall
Copy link
Contributor

@georgewrmarshall georgewrmarshall commented Feb 4, 2026

Description

This PR addresses MDP-464 by updating the Activity Log header in the transaction details modal to use a more intuitive accordion-style interface.

What is the reason for the change?
The Activity Log header was using a "+" icon which didn't follow standard accordion UI patterns and the interaction was inconsistent with typical disclosure components.

What is the improvement/solution?

  • Removed the "+" icon
  • Changed to "Activity Log" with proper capitalization
  • Added a down caret icon (↓) with 8px left margin that rotates when opened/closed
  • Uses the existing arrow variant of the Disclosure component

Changelog

CHANGELOG entry: Updated Activity Log header to use arrow disclosure variant for better UX consistency

Related issues

Fixes: https://consensyssoftware.atlassian.net/browse/MDP-464

Manual testing steps

  1. Open MetaMask extension
  2. Navigate to Activity tab
  3. Click on any transaction to open the transaction details modal
  4. Scroll down to the Activity Log section
  5. Verify that the header shows "Activity Log" with a down caret icon (↓)
  6. Click to expand/collapse and verify the caret rotates properly

Screenshots/Recordings

Before

  • Header displayed "Activity log" with "+" icon
  • Non-standard accordion interaction
Screenshot 2026-02-03 at 4 04 43 PM

After

  • Header displays "Activity Log" with down caret (↓) icon
  • Standard accordion behavior with rotating caret
  • 8px margin between text and icon
Screenshot 2026-02-04 at 7 07 46 PM

Pre-merge author checklist

Pre-merge reviewer checklist

  • I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
  • I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.

Note

Low Risk
Small UI-only change that alters the Disclosure variant used for the transaction details Activity Log; minimal functional risk beyond potential styling/regression in that section.

Overview
Updates the transaction details modal’s Activity Log section to use the DisclosureVariant.Arrow accordion styling instead of the default disclosure presentation.

This adds an import for DisclosureVariant and passes variant={DisclosureVariant.Arrow} to the Activity Log Disclosure, aligning the header behavior/iconography with standard accordion patterns.

Written by Cursor Bugbot for commit 61ed57b. This will update automatically on new commits. Configure here.

@github-actions
Copy link
Contributor

github-actions bot commented Feb 4, 2026

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

@metamaskbot metamaskbot added the team-design-system All issues relating to design system in Extension label Feb 4, 2026
@metamaskbotv2
Copy link
Contributor

metamaskbotv2 bot commented Feb 4, 2026

✨ Files requiring CODEOWNER review ✨

👨‍🔧 @MetaMask/core-extension-ux (1 files, +2 -0)
  • 📁 ui/
    • 📁 components/
      • 📁 app/
        • 📁 transaction-list-item-details/
          • 📄 transaction-list-item-details.component.js +2 -0

@github-actions github-actions bot added the size-M label Feb 4, 2026
<Disclosure
title={t('activityLog')}
size="small"
variant="arrow"
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Missing size argument causes small text variant to be ignored

Low Severity

The size="small" prop passed to Disclosure has no effect when using variant="arrow". In disclosure.js, renderSummaryByType(variant, title) is called without the size argument, so the arrow variant's text sizing logic (size === 'small' ? TextVariant.bodySm : TextVariant.bodyMd) always evaluates to bodyMd. The Activity Log header will render with medium text instead of the intended small text.

Fix in Cursor Fix in Web

Copy link

@cursor cursor bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cursor Bugbot has reviewed your changes and found 1 potential issue.

@metamaskbotv2
Copy link
Contributor

metamaskbotv2 bot commented Feb 4, 2026

Builds ready [61dff95]
UI Startup Metrics (1352 ± 84 ms)
PlatformBuildTypePageMetricTest Title (ms)Persona (ms)Mean (ms)Min (ms)Max (ms)Std Dev (ms)P 75 (ms)P 95 (ms)
ChromeBrowserifyStandard Home0--------
1--------
2--------
3--------
4--------
5--------
6--------
7--------
8--------
9--------
10--------
11--------
12--------
13--------
14--------
15--------
16--------
17--------
18--------
uiStartup--1352116815438414071491
load--115395013658412121282
domContentLoaded--114794613578212071276
domInteractive--251685172273
firstPaint--167641372178197284
backgroundConnect--23221033417235256
firstReactRender--17103551928
initialActions--105113
loadScripts--9327371127829901058
setupStore--1365371623
numNetworkReqs--221583181575
19--------
BrowserifyPower User Home0--------
1--------
2--------
3--------
4--------
5--------
6--------
7--------
8--------
9--------
10--------
11--------
12--------
13--------
14--------
15--------
16--------
17--------
18--------
uiStartup--265116558471131926635141
load--12061013197817812621594
domContentLoaded--11871004197217312431546
domInteractive--42182914536124
firstPaint--214681582163253389
backgroundConnect--73729135268664812913
firstReactRender--25166382741
initialActions--106113
loadScripts--95177216601619991273
setupStore--1563861829
numNetworkReqs--1234933656146239
19--------
WebpackStandard Home0--------
1--------
2--------
3--------
4--------
5--------
6--------
7--------
8--------
9--------
10--------
11--------
12--------
13--------
14--------
15--------
16--------
17--------
18--------
uiStartup--86768511361109541082
load--7336171037105801952
domContentLoaded--7286131031104795945
domInteractive--261690172378
firstPaint--1106432453136220
backgroundConnect--36181502540109
firstReactRender--16103761631
initialActions--106113
loadScripts--7256111029103791943
setupStore--1263551224
numNetworkReqs--221584181575
19--------
WebpackPower User Home0--------
1--------
2--------
3--------
4--------
5--------
6--------
7--------
8--------
9--------
10--------
11--------
12--------
13--------
14--------
15--------
16--------
17--------
18--------
uiStartup--1273898183423415201736
load--72863411001067281013
domContentLoaded--71862510951057131007
domInteractive--35181272333104
firstPaint--164691025150184292
backgroundConnect--15413237333155222
firstReactRender--23193632529
initialActions--103111
loadScripts--7156231087104712998
setupStore--1352031518
numNetworkReqs--964926050107220
19--------
FirefoxBrowserifyStandard Home0--------
1--------
2--------
3--------
4--------
5--------
6--------
7--------
8--------
9--------
10--------
11--------
12--------
13--------
14--------
15--------
16--------
17--------
18--------
uiStartup--15611288215517116451907
load--13101131179713913871536
domContentLoaded--13091127179613913871536
domInteractive--63321803588136
firstPaint--------
backgroundConnect--62252273562137
firstReactRender--1293531216
initialActions--103112
loadScripts--12781108175312613511507
setupStore--155211241151
numNetworkReqs--231286191881
19--------
BrowserifyPower User Home0--------
1--------
2--------
3--------
4--------
5--------
6--------
7--------
8--------
9--------
10--------
11--------
12--------
13--------
14--------
15--------
16--------
17--------
18--------
uiStartup--31512221931098933304392
load--16431215662178016452474
domContentLoaded--16431210662178016452474
domInteractive--14538580111169386
firstPaint--------
backgroundConnect--39911212173076511045
firstReactRender--18146461828
initialActions--103122
loadScripts--16041194657677615892448
setupStore--13410800172153689
numNetworkReqs--893826647104204
19--------
WebpackStandard Home0--------
1--------
2--------
3--------
4--------
5--------
6--------
7--------
8--------
9--------
10--------
11--------
12--------
13--------
14--------
15--------
16--------
17--------
18--------
uiStartup--16701394245616717671995
load--14281190171011014901647
domContentLoaded--14281190171011014901643
domInteractive--1003031952133186
firstPaint--------
backgroundConnect--712424746106173
firstReactRender--15114841523
initialActions--103112
loadScripts--1390117716849814421609
setupStore--145138211235
numNetworkReqs--231286171876
19--------
WebpackPower User Home0--------
1--------
2--------
3--------
4--------
5--------
6--------
7--------
8--------
9--------
10--------
11--------
12--------
13--------
14--------
15--------
16--------
17--------
18--------
uiStartup--316420478977105432465063
load--17781300657987617232787
domContentLoaded--17781299657987617232787
domInteractive--160361266173161483
firstPaint--------
backgroundConnect--42611216413166181018
firstReactRender--22166662531
initialActions--207123
loadScripts--17371278653486816852645
setupStore--144101172198178626
numNetworkReqs--84392835190203
19--------
📊 Page Load Benchmark Results

Current Commit: 61dff95 | Date: 2/4/2026

📄 Localhost MetaMask Test Dapp

Samples: 100

Summary

  • pageLoadTime-> current mean value: 997ms (±66ms) 🟢 | historical mean value: 1.04s ⬇️ (historical data)
  • domContentLoaded-> current mean value: 699ms (±86ms) 🟢 | historical mean value: 724ms ⬇️ (historical data)
  • firstContentfulPaint-> current mean value: 86ms (±151ms) 🟢 | historical mean value: 79ms ⬆️ (historical data)

📈 Detailed Results

Metric Mean Std Dev Min Max P95 P99
pageLoadTime 997ms 66ms 959ms 1.60s 1.02s 1.60s
domContentLoaded 699ms 86ms 661ms 1.52s 713ms 1.52s
firstPaint 86ms 151ms 56ms 1.59s 84ms 1.59s
firstContentfulPaint 86ms 151ms 56ms 1.59s 84ms 1.59s
largestContentfulPaint 0ms 0ms 0ms 0ms 0ms 0ms
Bundle size diffs [🚀 Bundle size reduced!]
  • background: 58 Bytes (0%)
  • ui: -38.38 KiB (-0.46%)
  • common: 20 Bytes (0%)

@georgewrmarshall georgewrmarshall self-assigned this Feb 5, 2026
Replace string literal "arrow" with DisclosureVariant.Arrow enum constant
in transaction-list-item-details component for improved type safety and
consistency with other usages across the codebase.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
@georgewrmarshall georgewrmarshall requested a review from a team February 5, 2026 03:25
@georgewrmarshall georgewrmarshall marked this pull request as ready for review February 5, 2026 03:25
@georgewrmarshall georgewrmarshall requested a review from a team as a code owner February 5, 2026 03:25
@metamaskbotv2
Copy link
Contributor

metamaskbotv2 bot commented Feb 5, 2026

Builds ready [61ed57b]
UI Startup Metrics (1371 ± 95 ms)
PlatformBuildTypePageMetricTest Title (ms)Persona (ms)Mean (ms)Min (ms)Max (ms)Std Dev (ms)P 75 (ms)P 95 (ms)
ChromeBrowserifyStandard Home0--------
1--------
2--------
3--------
4--------
5--------
6--------
7--------
8--------
9--------
10--------
11--------
12--------
13--------
14--------
15--------
16--------
17--------
18--------
uiStartup--1371116516149514371538
load--118299513938612451313
domContentLoaded--117399113858512311306
domInteractive--261584182280
firstPaint--2126512572512001149
backgroundConnect--23421229516239273
firstReactRender--17104151826
initialActions--106113
loadScripts--95677911708610161086
setupStore--1263051620
numNetworkReqs--231589201584
19--------
BrowserifyPower User Home0--------
1--------
2--------
3--------
4--------
5--------
6--------
7--------
8--------
9--------
10--------
11--------
12--------
13--------
14--------
15--------
16--------
17--------
18--------
uiStartup--17631331444935318262238
load--11271013167015011061586
domContentLoaded--11131007165715010931579
domInteractive--34181472432101
firstPaint--1777239471235291
backgroundConnect--3452802688239333428
firstReactRender--22144562537
initialActions--105112
loadScripts--87877513511378601312
setupStore--1674371730
numNetworkReqs--1214627750147244
19--------
WebpackStandard Home0--------
1--------
2--------
3--------
4--------
5--------
6--------
7--------
8--------
9--------
10--------
11--------
12--------
13--------
14--------
15--------
16--------
17--------
18--------
uiStartup--86069311631019121032
load--724603105499778925
domContentLoaded--719599104298774921
domInteractive--2615106192279
firstPaint--1096142960125229
backgroundConnect--3519125213898
firstReactRender--16103651730
initialActions--104112
loadScripts--716597103897772918
setupStore--1263661325
numNetworkReqs--231589201684
19--------
WebpackPower User Home0--------
1--------
2--------
3--------
4--------
5--------
6--------
7--------
8--------
9--------
10--------
11--------
12--------
13--------
14--------
15--------
16--------
17--------
18--------
uiStartup--1225884229122713011689
load--72462813851387071091
domContentLoaded--71562213771386971083
domInteractive--36181973333129
firstPaint--154641013123192377
backgroundConnect--16813137854171317
firstReactRender--22173642429
initialActions--104111
loadScripts--71261913671366951074
setupStore--1153131316
numNetworkReqs--1044728553140216
19--------
FirefoxBrowserifyStandard Home0--------
1--------
2--------
3--------
4--------
5--------
6--------
7--------
8--------
9--------
10--------
11--------
12--------
13--------
14--------
15--------
16--------
17--------
18--------
uiStartup--15781282283419716411916
load--13361128265318913921655
domContentLoaded--13351128265318913861655
domInteractive--8531143214289140
firstPaint--------
backgroundConnect--64281763570146
firstReactRender--1293631213
initialActions--102112
loadScripts--13021108263118213511541
setupStore--12556111148
numNetworkReqs--251296231794
19--------
BrowserifyPower User Home0--------
1--------
2--------
3--------
4--------
5--------
6--------
7--------
8--------
9--------
10--------
11--------
12--------
13--------
14--------
15--------
16--------
17--------
18--------
uiStartup--27072033429243628883556
load--15871276262728316972219
domContentLoaded--15871276262728216972219
domInteractive--12838492100124356
firstPaint--------
backgroundConnect--2811111201218292843
firstReactRender--18143131925
initialActions--203122
loadScripts--15391252248825916422082
setupStore--1498720190184599
numNetworkReqs--72371553293131
19--------
WebpackStandard Home0--------
1--------
2--------
3--------
4--------
5--------
6--------
7--------
8--------
9--------
10--------
11--------
12--------
13--------
14--------
15--------
16--------
17--------
18--------
uiStartup--16151335211617216962021
load--1379120516649614651528
domContentLoaded--1379120016649714621527
domInteractive--842818942125152
firstPaint--------
backgroundConnect--70262985580196
firstReactRender--15115351521
initialActions--102122
loadScripts--1346119015498614121491
setupStore--146192251127
numNetworkReqs--231382171870
19--------
WebpackPower User Home0--------
1--------
2--------
3--------
4--------
5--------
6--------
7--------
8--------
9--------
10--------
11--------
12--------
13--------
14--------
15--------
16--------
17--------
18--------
uiStartup--27631907690262529113835
load--15971168557851717272415
domContentLoaded--15961167557851817262415
domInteractive--13232711149108562
firstPaint--------
backgroundConnect--3281101086250361967
firstReactRender--22165852430
initialActions--2114123
loadScripts--15451153555450216732278
setupStore--1578786200234688
numNetworkReqs--69371433097125
19--------
📊 Page Load Benchmark Results

Current Commit: 61ed57b | Date: 2/5/2026

📄 Localhost MetaMask Test Dapp

Samples: 100

Summary

  • pageLoadTime-> current mean value: 1.05s (±41ms) 🟡 | historical mean value: 1.03s ⬆️ (historical data)
  • domContentLoaded-> current mean value: 733ms (±38ms) 🟢 | historical mean value: 723ms ⬆️ (historical data)
  • firstContentfulPaint-> current mean value: 78ms (±14ms) 🟢 | historical mean value: 80ms ⬇️ (historical data)

📈 Detailed Results

Metric Mean Std Dev Min Max P95 P99
pageLoadTime 1.05s 41ms 1.03s 1.34s 1.07s 1.34s
domContentLoaded 733ms 38ms 710ms 1.00s 747ms 1.00s
firstPaint 78ms 14ms 60ms 200ms 88ms 200ms
firstContentfulPaint 78ms 14ms 60ms 200ms 88ms 200ms
largestContentfulPaint 0ms 0ms 0ms 0ms 0ms 0ms
Bundle size diffs [🚨 Warning! Bundle size has increased!]
  • background: 7.29 KiB (0.14%)
  • ui: 44.37 KiB (0.54%)
  • common: 3.02 KiB (0.03%)

@georgewrmarshall georgewrmarshall added this pull request to the merge queue Feb 5, 2026
Merged via the queue into main with commit bc6b038 Feb 5, 2026
180 checks passed
@georgewrmarshall georgewrmarshall deleted the activity-log branch February 5, 2026 18:13
@github-actions github-actions bot locked and limited conversation to collaborators Feb 5, 2026
@metamaskbot metamaskbot added the release-13.18.0 Issue or pull request that will be included in release 13.18.0 label Feb 5, 2026
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

release-13.18.0 Issue or pull request that will be included in release 13.18.0 size-XS team-design-system All issues relating to design system in Extension

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants