Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix(Orgs): do not set gridArea directly on a DOM element #5137

Merged
merged 1 commit into from
Feb 26, 2025

Conversation

jmealy
Copy link
Contributor

@jmealy jmealy commented Feb 26, 2025

What it solves

There is a console error when opening the add members modal:
React does not recognize the gridAreaprop on a DOM element.

How this PR fixes it

  • Wraps the svg in a box and sets gridArea on that instead.

How to test it

  • Open the add members modal
  • Observe no console error.

Checklist

  • I've tested the branch on mobile 📱
  • I've documented how it affects the analytics (if at all) 📊
  • I've written a unit/e2e test for it (if applicable) 🧑‍💻

Copy link

github-actions bot commented Feb 26, 2025

Copy link

📦 Next.js Bundle Analysis for @safe-global/web

This analysis was generated by the Next.js Bundle Analysis action. 🤖

⚠️ Global Bundle Size Increased

Page Size (compressed)
global 1.07 MB (🟡 +80.06 KB)
Details

The global bundle is the javascript bundle that loads alongside every page. It is in its own category because its impact is much higher - an increase to its size means that every page on your website loads slower, and a decrease means every page loads faster.

Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis

If you want further insight into what is behind the changes, give @next/bundle-analyzer a try!

New Pages Added

The following pages were added to the bundle from the code in this PR:

Page Size (compressed) First Load
/organizations/[orgId] 15.11 KB 1.08 MB
/organizations/[orgId]/members 9.74 KB 1.08 MB
/organizations/[orgId]/safeAccounts 4.32 KB 1.07 MB
/organizations/[orgId]/settings 2.64 KB 1.07 MB
/welcome/organizations 5 KB 1.07 MB

Thirty-two Pages Changed Size

The following pages changed size from the code in this PR compared to its base branch:

Page Size (compressed) First Load
/ 509 B (🟢 -1 B) 1.07 MB
/address-book 23.21 KB (🟡 +140 B) 1.09 MB
/apps 35.75 KB (🟡 +2.03 KB) 1.1 MB
/apps/custom 33.82 KB (🟡 +2.03 KB) 1.1 MB
/apps/open 55.36 KB (🟡 +1.75 KB) 1.12 MB
/balances 29.68 KB (🟢 -23 B) 1.1 MB
/balances/nfts 9.32 KB (🟢 -234 B) 1.08 MB
/bridge 2.55 KB (🟢 -4 B) 1.07 MB
/cookie 8.77 KB (🟡 +1 B) 1.08 MB
/home 66.57 KB (🟡 +7.31 KB) 1.13 MB
/licenses 2.46 KB (🟢 -1 B) 1.07 MB
/new-safe/advanced-create 26.26 KB (🟢 -201 B) 1.09 MB
/new-safe/create 25.4 KB (🟢 -198 B) 1.09 MB
/privacy 14.57 KB (🟡 +2 B) 1.08 MB
/settings 476 B (🟡 +1 B) 1.07 MB
/settings/data 1.79 KB (🟢 -1 B) 1.07 MB
/settings/modules 2.88 KB (🟢 -1.18 KB) 1.07 MB
/settings/notifications 7.49 KB (🟢 -13.82 KB) 1.07 MB
/settings/safe-apps 20.15 KB (🟡 +1.87 KB) 1.09 MB
/settings/security 2.34 KB (🟡 +2 B) 1.07 MB
/settings/setup 30.97 KB (🟡 +247 B) 1.1 MB
/share/safe-app 7.55 KB (🟢 -9 B) 1.07 MB
/stake 617 B (🟢 -2 B) 1.07 MB
/swap 763 B (🟡 +3 B) 1.07 MB
/terms 12.93 KB (🟡 +1 B) 1.08 MB
/transactions 99.46 KB (🟡 +2.88 KB) 1.16 MB
/transactions/history 99.42 KB (🟡 +2.88 KB) 1.16 MB
/transactions/messages 60.25 KB (🟡 +1.95 KB) 1.13 MB
/transactions/msg 56.5 KB (🟡 +1.95 KB) 1.12 MB
/transactions/queue 49.36 KB (🟡 +1.96 KB) 1.12 MB
/transactions/tx 48.72 KB (🟡 +1.96 KB) 1.11 MB
/welcome 6.93 KB (🟢 -2 B) 1.07 MB
Details

Only the gzipped size is provided here based on an expert tip.

First Load is the size of the global bundle plus the bundle for the individual page. If a user were to show up to your website and land on a given page, the first load size represents the amount of javascript that user would need to download. If next/link is used, subsequent page loads would only need to download that page's bundle (the number in the "Size" column), since the global bundle has already been downloaded.

Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis

Next to the size is how much the size has increased or decreased compared with the base branch of this PR. If this percentage has increased by 20% or more, there will be a red status indicator applied, indicating that special attention should be given to this.

Copy link

Coverage report for apps/web

St.
Category Percentage Covered / Total
🟡 Statements 77.16% 14272/18496
🔴 Branches 56.02% 3575/6382
🟡 Functions 61.92% 2125/3432
🟡 Lines 78.64% 12889/16390

Test suite run success

1838 tests passing in 251 suites.

Report generated by 🧪jest coverage report action from 011e61d

@jmealy jmealy merged commit 10e053f into orgsepic Feb 26, 2025
10 of 11 checks passed
@jmealy jmealy deleted the fixconsoleerror branch February 26, 2025 13:38
@github-actions github-actions bot locked and limited conversation to collaborators Feb 26, 2025
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants