feat: notifications renewal [SW-631] #4699
Open
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Branch preview✅ Deploy successful! Storybook: |
Coverage report
Show new covered files 🐣
Show files with reduced coverage 🔻
Test suite run success1752 tests passing in 237 suites. Report generated by 🧪jest coverage report action from 79b6be6 |
|
@tmjssz please rebase to the new dev, the src folder got moved to |
…ons token version for each safe in local storage
…als and preferences for safes
…sage on app open
…wal process in the Push Notifications settings
…PushNotifications
tmjssz
force-pushed
the
feat/notifications-renewal
branch
from
79b6be6 to
f7aa0b5
Compare
Coverage report for
|
St.❔ |
Category | Percentage | Covered / Total |
|---|---|---|---|
| 🟡 | Statements | 74.24% (+0.13% 🔼) |
14691/19789 |
| 🔴 | Branches | 51.88% (+0.18% 🔼) |
3508/6762 |
| 🔴 | Functions | 57.33% (+0.22% 🔼) |
2085/3637 |
| 🟡 | Lines | 75.77% (+0.13% 🔼) |
13328/17589 |
Show new covered files 🐣
St.❔ |
File | Statements | Branches | Functions | Lines |
|---|---|---|---|---|---|
| 🟢 | ... / useNotificationsTokenVersion.ts |
100% | 92.31% | 100% | 100% |
| 🟢 | ... / useNotificationsRenewal.ts |
100% | 94.44% | 100% | 100% |
| 🟢 | ... / constants.ts |
100% | 100% | 100% | 100% |
| 🟢 | ... / useShowNotificationsRenewalMessage.ts |
100% | 100% | 100% | 100% |
Show files with reduced coverage 🔻
St.❔ |
File | Statements | Branches | Functions | Lines |
|---|---|---|---|---|---|
| 🟢 | ... / safe-migrations.ts |
97.44% (-0.13% 🔻) |
88.89% (+1.39% 🔼) |
100% | 97.3% (-0.14% 🔻) |
| 🔴 | ... / GlobalPushNotifications.tsx |
61.97% (-0.41% 🔻) |
39.71% | 58.73% | 59.04% (-0.42% 🔻) |
| 🟡 | ... / index.tsx |
61.54% (-21.79% 🔻) |
0% (-66.67% 🔻) |
0% (-66.67% 🔻) |
66.67% (-21.57% 🔻) |
| 🔴 | ... / index.tsx |
32.69% (-2.72% 🔻) |
0% | 0% | 35.42% (-3.22% 🔻) |
Test suite run failed
Failed tests: 5/1782. Failed suites: 3/240.
● ConfirmationView › should display a confirmation screen for a SETTINGS_CHANGE transaction
expect(received).toMatchSnapshot()
Snapshot name: `ConfirmationView should display a confirmation screen for a SETTINGS_CHANGE transaction 1`
- Snapshot - 9
+ Received + 9
@@ -121,19 +121,19 @@
style="--Paper-shadow: none;"
>
<h3
class="MuiAccordion-heading css-cy7rkm-MuiAccordion-heading"
>
- <div
+ <button
aria-expanded="false"
- class="MuiButtonBase-root MuiAccordionSummary-root MuiAccordionSummary-gutters accordion css-6csn7x-MuiButtonBase-root-MuiAccordionSummary-root"
+ class="MuiButtonBase-root MuiAccordionSummary-root MuiAccordionSummary-gutters accordion css-10sjung-MuiButtonBase-root-MuiAccordionSummary-root"
data-testid="decoded-tx-summary"
- role="button"
tabindex="0"
+ type="button"
>
- <div
- class="MuiAccordionSummary-content MuiAccordionSummary-contentGutters css-1pnrdlh-MuiAccordionSummary-content"
+ <span
+ class="MuiAccordionSummary-content MuiAccordionSummary-contentGutters css-1r0e0ir-MuiAccordionSummary-content"
>
Advanced details
<span
class=""
data-mui-internal-clone-element="true"
@@ -146,12 +146,12 @@
</span>
<div
class="MuiBox-root css-i9gxme"
/>
addOwnerWithThreshold
- </div>
- <div
+ </span>
+ <span
class="MuiAccordionSummary-expandIconWrapper css-1wqf3nl-MuiAccordionSummary-expandIconWrapper"
>
<svg
aria-hidden="true"
class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1dhtbeh-MuiSvgIcon-root"
@@ -161,12 +161,12 @@
>
<path
d="M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z"
/>
</svg>
- </div>
- </div>
+ </span>
+ </button>
</h3>
<div
class="MuiCollapse-root MuiCollapse-vertical MuiCollapse-hidden css-cwrbtg-MuiCollapse-root"
style="min-height: 0px;"
>
116 | )
117 |
> 118 | expect(container).toMatchSnapshot()
| ^
119 | })
120 |
121 | it("should display a confirmation with method call when the transaction type is not found in the ConfirmationView's mapper", () => {
at Object.toMatchSnapshot (src/components/tx/confirmation-views/ConfirmationView.test.tsx:118:23)
● ConfirmationView › should display a confirmation with method call when the transaction type is not found in the ConfirmationView's mapper
expect(received).toMatchSnapshot()
Snapshot name: `ConfirmationView should display a confirmation with method call when the transaction type is not found in the ConfirmationView's mapper 1`
- Snapshot - 9
+ Received + 9
@@ -10,19 +10,19 @@
style="--Paper-shadow: none;"
>
<h3
class="MuiAccordion-heading css-cy7rkm-MuiAccordion-heading"
>
- <div
+ <button
aria-expanded="false"
- class="MuiButtonBase-root MuiAccordionSummary-root MuiAccordionSummary-gutters accordion css-6csn7x-MuiButtonBase-root-MuiAccordionSummary-root"
+ class="MuiButtonBase-root MuiAccordionSummary-root MuiAccordionSummary-gutters accordion css-10sjung-MuiButtonBase-root-MuiAccordionSummary-root"
data-testid="decoded-tx-summary"
- role="button"
tabindex="0"
+ type="button"
>
- <div
- class="MuiAccordionSummary-content MuiAccordionSummary-contentGutters css-1pnrdlh-MuiAccordionSummary-content"
+ <span
+ class="MuiAccordionSummary-content MuiAccordionSummary-contentGutters css-1r0e0ir-MuiAccordionSummary-content"
>
Advanced details
<span
class=""
data-mui-internal-clone-element="true"
@@ -35,12 +35,12 @@
</span>
<div
class="MuiBox-root css-i9gxme"
/>
addOwnerWithThreshold
- </div>
- <div
+ </span>
+ <span
class="MuiAccordionSummary-expandIconWrapper css-1wqf3nl-MuiAccordionSummary-expandIconWrapper"
>
<svg
aria-hidden="true"
class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1dhtbeh-MuiSvgIcon-root"
@@ -50,12 +50,12 @@
>
<path
d="M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z"
/>
</svg>
- </div>
- </div>
+ </span>
+ </button>
</h3>
<div
class="MuiCollapse-root MuiCollapse-vertical MuiCollapse-hidden css-cwrbtg-MuiCollapse-root"
style="min-height: 0px;"
>
131 | )
132 |
> 133 | expect(container).toMatchSnapshot()
| ^
134 | })
135 | })
136 |
at Object.toMatchSnapshot (src/components/tx/confirmation-views/ConfirmationView.test.tsx:133:23)
● SignOrExecute › should display a confirmation screen
expect(received).toMatchSnapshot()
Snapshot name: `SignOrExecute should display a confirmation screen 1`
- Snapshot - 9
+ Received + 9
@@ -17,19 +17,19 @@
style="--Paper-shadow: none;"
>
<h3
class="MuiAccordion-heading css-cy7rkm-MuiAccordion-heading"
>
- <div
+ <button
aria-expanded="false"
- class="MuiButtonBase-root MuiAccordionSummary-root MuiAccordionSummary-gutters accordion css-6csn7x-MuiButtonBase-root-MuiAccordionSummary-root"
+ class="MuiButtonBase-root MuiAccordionSummary-root MuiAccordionSummary-gutters accordion css-10sjung-MuiButtonBase-root-MuiAccordionSummary-root"
data-testid="decoded-tx-summary"
- role="button"
tabindex="0"
+ type="button"
>
- <div
- class="MuiAccordionSummary-content MuiAccordionSummary-contentGutters css-1pnrdlh-MuiAccordionSummary-content"
+ <span
+ class="MuiAccordionSummary-content MuiAccordionSummary-contentGutters css-1r0e0ir-MuiAccordionSummary-content"
>
Advanced details
<span
class=""
data-mui-internal-clone-element="true"
@@ -41,12 +41,12 @@
/>
</span>
<div
class="MuiBox-root css-i9gxme"
/>
- </div>
- <div
+ </span>
+ <span
class="MuiAccordionSummary-expandIconWrapper css-1wqf3nl-MuiAccordionSummary-expandIconWrapper"
>
<svg
aria-hidden="true"
class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1dhtbeh-MuiSvgIcon-root"
@@ -56,12 +56,12 @@
>
<path
d="M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z"
/>
</svg>
- </div>
- </div>
+ </span>
+ </button>
</h3>
<div
class="MuiCollapse-root MuiCollapse-vertical MuiCollapse-hidden css-cwrbtg-MuiCollapse-root"
style="min-height: 0px;"
>
54 |
55 | expect(getByTestId('sign-btn')).toBeInTheDocument()
> 56 | expect(container).toMatchSnapshot()
| ^
57 | })
58 |
59 | it('should display an error screen', async () => {
at Object.toMatchSnapshot (src/components/tx/SignOrExecuteForm/__tests__/SignOrExecute.test.tsx:56:23)
● SignOrExecute › should display an error screen
expect(received).toMatchSnapshot()
Snapshot name: `SignOrExecute should display an error screen 1`
- Snapshot - 9
+ Received + 9
@@ -17,19 +17,19 @@
style="--Paper-shadow: none;"
>
<h3
class="MuiAccordion-heading css-cy7rkm-MuiAccordion-heading"
>
- <div
+ <button
aria-expanded="false"
- class="MuiButtonBase-root MuiAccordionSummary-root MuiAccordionSummary-gutters accordion css-6csn7x-MuiButtonBase-root-MuiAccordionSummary-root"
+ class="MuiButtonBase-root MuiAccordionSummary-root MuiAccordionSummary-gutters accordion css-10sjung-MuiButtonBase-root-MuiAccordionSummary-root"
data-testid="decoded-tx-summary"
- role="button"
tabindex="0"
+ type="button"
>
- <div
- class="MuiAccordionSummary-content MuiAccordionSummary-contentGutters css-1pnrdlh-MuiAccordionSummary-content"
+ <span
+ class="MuiAccordionSummary-content MuiAccordionSummary-contentGutters css-1r0e0ir-MuiAccordionSummary-content"
>
Advanced details
<span
class=""
data-mui-internal-clone-element="true"
@@ -41,12 +41,12 @@
/>
</span>
<div
class="MuiBox-root css-i9gxme"
/>
- </div>
- <div
+ </span>
+ <span
class="MuiAccordionSummary-expandIconWrapper css-1wqf3nl-MuiAccordionSummary-expandIconWrapper"
>
<svg
aria-hidden="true"
class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1dhtbeh-MuiSvgIcon-root"
@@ -56,12 +56,12 @@
>
<path
d="M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z"
/>
</svg>
- </div>
- </div>
+ </span>
+ </button>
</h3>
<div
class="MuiCollapse-root MuiCollapse-vertical MuiCollapse-hidden css-cwrbtg-MuiCollapse-root"
style="min-height: 0px;"
>
73 |
74 | expect(container.querySelector('sign-btn')).not.toBeInTheDocument()
> 75 | expect(container).toMatchSnapshot()
| ^
76 | })
77 | })
78 |
at Object.toMatchSnapshot (src/components/tx/SignOrExecuteForm/__tests__/SignOrExecute.test.tsx:75:23)
● BatchTransactions › should render a list of batch transactions
expect(received).toMatchSnapshot()
Snapshot name: `BatchTransactions should render a list of batch transactions 1`
- Snapshot - 9
+ Received + 9
@@ -15,18 +15,18 @@
style="--Paper-shadow: none;"
>
<h3
class="MuiAccordion-heading css-cy7rkm-MuiAccordion-heading"
>
- <div
+ <button
aria-expanded="false"
- class="MuiButtonBase-root MuiAccordionSummary-root MuiAccordionSummary-gutters accordion css-6csn7x-MuiButtonBase-root-MuiAccordionSummary-root"
- role="button"
+ class="MuiButtonBase-root MuiAccordionSummary-root MuiAccordionSummary-gutters accordion css-10sjung-MuiButtonBase-root-MuiAccordionSummary-root"
tabindex="0"
+ type="button"
>
- <div
- class="MuiAccordionSummary-content MuiAccordionSummary-contentGutters css-1pnrdlh-MuiAccordionSummary-content"
+ <span
+ class="MuiAccordionSummary-content MuiAccordionSummary-contentGutters css-1r0e0ir-MuiAccordionSummary-content"
>
<div
class="MuiBox-root css-mvjamn"
>
<div
@@ -58,12 +58,12 @@
</b>
</span>
</div>
</div>
- </div>
- <div
+ </span>
+ <span
class="MuiAccordionSummary-expandIconWrapper css-1wqf3nl-MuiAccordionSummary-expandIconWrapper"
>
<svg
aria-hidden="true"
class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1dhtbeh-MuiSvgIcon-root"
@@ -73,12 +73,12 @@
>
<path
d="M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z"
/>
</svg>
- </div>
- </div>
+ </span>
+ </button>
</h3>
<div
class="MuiCollapse-root MuiCollapse-vertical MuiCollapse-hidden css-cwrbtg-MuiCollapse-root"
style="min-height: 0px;"
>
10 | const { container, getByText } = render(<BatchTransactions />)
11 |
> 12 | expect(container).toMatchSnapshot()
| ^
13 | expect(getByText('GnosisSafeProxy')).toBeDefined()
14 | })
15 | })
at Object.toMatchSnapshot (src/components/tx/confirmation-views/BatchTransactions/BatchTransactions.test.tsx:12:23)
Report generated by 🧪jest coverage report action from c93846d
📦 Next.js Bundle Analysis for @safe-global/webThis analysis was generated by the Next.js Bundle Analysis action. 🤖
|
| Page | Size (compressed) |
|---|---|
global |
1.04 MB (🟡 +53.07 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!
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 |
|---|---|---|
/ |
508 B (🟢 -2 B) |
1.04 MB |
/address-book |
23.21 KB (🟡 +142 B) |
1.06 MB |
/apps |
35.8 KB (🟡 +2.08 KB) |
1.08 MB |
/apps/custom |
33.87 KB (🟡 +2.08 KB) |
1.07 MB |
/apps/open |
55.57 KB (🟡 +1.96 KB) |
1.09 MB |
/balances |
29.88 KB (🟡 +176 B) |
1.07 MB |
/balances/nfts |
9.52 KB (🟢 -24 B) |
1.05 MB |
/bridge |
2.56 KB (🟡 +1 B) |
1.04 MB |
/cookie |
8.77 KB (🟡 +1 B) |
1.05 MB |
/home |
61.38 KB (🟡 +2.12 KB) |
1.1 MB |
/new-safe/advanced-create |
26.38 KB (🟢 -75 B) |
1.07 MB |
/new-safe/create |
25.52 KB (🟢 -74 B) |
1.07 MB |
/new-safe/load |
6.08 KB (🟢 -5 B) |
1.05 MB |
/privacy |
14.57 KB (🟡 +2 B) |
1.05 MB |
/settings/appearance |
2.25 KB (🟡 +2 B) |
1.04 MB |
/settings/environment-variables |
3.27 KB (🟢 -1 B) |
1.04 MB |
/settings/modules |
4.06 KB (🟡 +1 B) |
1.04 MB |
/settings/notifications |
6.41 KB (🟢 -14.91 KB) |
1.05 MB |
/settings/safe-apps |
20.35 KB (🟡 +2.08 KB) |
1.06 MB |
/settings/security |
2.34 KB (🟡 +1 B) |
1.04 MB |
/settings/setup |
30.82 KB (🟡 +92 B) |
1.07 MB |
/share/safe-app |
7.56 KB (🟢 -5 B) |
1.05 MB |
/stake |
618 B (🟢 -1 B) |
1.04 MB |
/swap |
764 B (🟡 +4 B) |
1.04 MB |
/terms |
12.93 KB (🟡 +1 B) |
1.05 MB |
/transactions |
99.47 KB (🟡 +2.9 KB) |
1.14 MB |
/transactions/history |
99.43 KB (🟡 +2.9 KB) |
1.14 MB |
/transactions/messages |
60.26 KB (🟡 +1.96 KB) |
1.1 MB |
/transactions/msg |
56.51 KB (🟡 +1.96 KB) |
1.1 MB |
/transactions/queue |
49.37 KB (🟡 +1.97 KB) |
1.09 MB |
/transactions/tx |
48.73 KB (🟡 +1.96 KB) |
1.09 MB |
/welcome/accounts |
409 B (🟡 +2 B) |
1.04 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.
tmjssz
force-pushed
the
feat/notifications-renewal
branch
from
5f9ea3d to
1bae52d
Compare
katspaugh
reviewed
Dec 27, 2024
apps/web/src/components/notification-center/NotificationRenewal/index.tsx
Outdated
Show resolved
Hide resolved
apps/web/src/components/notification-center/NotificationRenewal/index.tsx
Show resolved
Hide resolved
apps/web/src/components/settings/PushNotifications/hooks/useNotificationsRenewal.ts
Outdated
Show resolved
Hide resolved
apps/web/src/components/settings/PushNotifications/hooks/useNotificationsRenewal.ts
Show resolved
Hide resolved
… remove unused function
Implement logic to show notifications renewal message in a separate hook
…ion handling in registerNotifications
katspaugh
approved these changes
Dec 30, 2024
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What it solves
Resolves SW-631
Displays a message prompting users to re-register their token with the new notification service.
Token Versioning
Warning Mechanism
Token Renewal
Feature Flag
All logic is gated by the
RENEW_NOTIFICATIONS_TOKENfeature flag.How this PR fixes it
NotificationRenewalcomponent to handle the renewal of notifications with a user interface for signing messages.useNotificationsRenewalto manage the renewal of notifications, including functions to check if renewal is needed and to perform the renewal.useNotificationsTokenVersionto manage the token versions for notifications in local storage and to check if the renewal feature is enabled.V2upon successful registration.useNotificationsRenewalhook to show the renewal message when the app is opened.NotificationRenewalcomponent in the push notifications settings page.Additional changes
How to test it
For a specific Safe
For the global settings
Screenshots
notifications-renewal-warning.mp4
Checklist