Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commita91ea96

Browse files
committed
release(runway): cherry-pick feat: confirmations for sidepanel (#38375)
<!--Please submit this PR as a draft initially.Do not mark it as "Ready for review" until the template has beencompletely filled out, and PR status checks have passed at least once.-->## **Description**Enables the confirmation handler to listen from pages other than thehome page.There's a list of exempted routes including the confirmation routes.Depends on#38361 <!--Write a short description of the changes included in this pull request,also include relevant motivation and context. Have in mind the followingquestions:1. What is the reason for the change?2. What is the improvement/solution?-->[![Open in GitHubCodespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/MetaMask/metamask-extension/pull/38375?quickstart=1)## **Changelog**<!--If this PR is not End-User-Facing and should not show up in theCHANGELOG, you can choose to either:1. Write `CHANGELOG entry: null`2. Label with `no-changelog`If this PR is End-User-Facing, please write a short User-Facingdescription in the past tense like:`CHANGELOG entry: Added a new tab for users to see their NFTs``CHANGELOG entry: Fixed a bug that was causing some NFTs to flicker`(This helps the Release Engineer do their job more quickly andaccurately)-->CHANGELOG entry: feat: confirmations for sidepanel## **Related issues**Fixes:## **Manual testing steps**1. Switch to sidepanel2. Test requests and approvals## **Screenshots/Recordings**<!-- If applicable, add screenshots and/or recordings to visualize thebefore and after of your change. -->### **Before**<!-- [screenshots/recordings] -->### **After**<!-- [screenshots/recordings] -->## **Pre-merge author checklist**- [ ] I've followed [MetaMask ContributorDocs](https://github.com/MetaMask/contributor-docs) and [MetaMaskExtension CodingStandards](https://github.com/MetaMask/metamask-extension/blob/main/.github/guidelines/CODING_GUIDELINES.md).- [ ] I've completed the PR template to the best of my ability- [ ] I’ve included tests if applicable- [ ] I’ve documented my code using [JSDoc](https://jsdoc.app/) formatif applicable- [ ] I’ve applied the right labels on the PR (see [labelingguidelines](https://github.com/MetaMask/metamask-extension/blob/main/.github/guidelines/LABELING_GUIDELINES.md)).Not required for external contributors.## **Pre-merge reviewer checklist**- [ ] I've manually tested the PR (e.g. pull and build branch, run theapp, test code being changed).- [ ] I confirm that this PR addresses all acceptance criteria describedin the ticket it closes and includes the necessary testing evidence suchas recordings and or screenshots.<!-- CURSOR_SUMMARY -->---> [!NOTE]> Enable confirmation navigation from any route (incl. sidepanel), addside panel manifest/config, and centralize network menu modal with aclose action.> > - **Confirmations & Navigation**:> - Run confirmation redirection from any route via`ConfirmationHandler` with an exempted-routes list; closes open modalsbefore navigating.> - Remove reliance on home/default route checks.> - **Modals Refactor**:> - Add `useModalState` hook and `CLOSE_NETWORK_MENU` action; updatereducer to support explicit close.> - Introduce `Modals` aggregator to render `NetworkListMenu`; integrateinto `routes.component` and remove inline menu handling.> - Export selector `selectIsNetworkMenuOpen`.> - **Sidepanel Enablement**:> - Add `"sidePanel"` permission and Chrome `side_panel.default_path` in`manifest`.> - Set `IS_SIDEPANEL: true` for main build.> - **Cleanup**:> - Remove unused sidepanel/env and swaps-related props from`home.container`.> > <sup>Written by [CursorBugbot](https://cursor.com/dashboard?tab=bugbot) for commitc08536b. This will update automaticallyon new commits. Configure[here](https://cursor.com/dashboard?tab=bugbot).</sup><!-- /CURSOR_SUMMARY -->
1 parent74e4bd9 commita91ea96

File tree

12 files changed

+100
-32
lines changed

12 files changed

+100
-32
lines changed

‎app/manifest/v3/_base.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -88,6 +88,7 @@
8888
"webRequest",
8989
"offscreen",
9090
"identity",
91+
"sidePanel",
9192
"contextMenus"
9293
],
9394
"sandbox": {

‎app/manifest/v3/chrome.json‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,5 +10,8 @@
1010
"matches": ["http://*/*","https://*/*"],
1111
"ids": ["*"]
1212
},
13-
"minimum_chrome_version":"115"
13+
"minimum_chrome_version":"115",
14+
"side_panel": {
15+
"default_path":"sidepanel.html"
16+
}
1417
}

‎builds.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ buildTypes:
3434
-REJECT_INVALID_SNAPS_PLATFORM_VERSION:true
3535
-IFRAME_EXECUTION_ENVIRONMENT_URL:https://execution.metamask.io/iframe/10.2.3/index.html
3636
-ACCOUNT_SNAPS_DIRECTORY_URL:https://snaps.metamask.io/account-management
37-
-IS_SIDEPANEL:false
37+
-IS_SIDEPANEL:true
3838
# for seedless onboarding (social login)
3939
-GOOGLE_PROD_CLIENT_ID
4040
-APPLE_PROD_CLIENT_ID

‎ui/ducks/app/app.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -716,6 +716,11 @@ export default function reduceApp(
716716
),
717717
isNetworkMenuOpen:!appState.isNetworkMenuOpen,
718718
};
719+
caseactionConstants.CLOSE_NETWORK_MENU:
720+
return{
721+
...appState,
722+
isNetworkMenuOpen:false,
723+
};
719724
caseactionConstants.DELETE_METAMETRICS_DATA_MODAL_OPEN:
720725
return{
721726
...appState,

‎ui/hooks/useModalState.ts‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import{useCallback}from'react';
2+
import{useDispatch}from'react-redux';
3+
import{closeNetworkMenu}from'../store/actions';
4+
5+
exportfunctionuseModalState(){
6+
constdispatch=useDispatch();
7+
8+
constcloseModals=useCallback(
9+
()=>dispatch(closeNetworkMenu()),
10+
[dispatch],
11+
);
12+
13+
return{
14+
closeModals,
15+
};
16+
}

‎ui/pages/home/home.container.js‎

Lines changed: 0 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,6 @@ import {
2626
hasPendingApprovals,
2727
getSelectedInternalAccount,
2828
getEditedNetwork,
29-
selectPendingApprovalsForNavigation,
3029
getShowUpdateModal,
3130
getIsSocialLoginFlow,
3231
getShowShieldEntryModal,
@@ -76,7 +75,6 @@ import { getIsBrowserDeprecated } from '../../helpers/utils/util';
7675
import{
7776
ENVIRONMENT_TYPE_NOTIFICATION,
7877
ENVIRONMENT_TYPE_POPUP,
79-
ENVIRONMENT_TYPE_SIDEPANEL,
8078
///: BEGIN:ONLY_INCLUDE_IF(keyring-snaps)
8179
SNAP_MANAGE_ACCOUNTS_CONFIRMATION_TYPES,
8280
///: END:ONLY_INCLUDE_IF
@@ -99,8 +97,6 @@ const mapStateToProps = (state) => {
9997
seedPhraseBackedUp,
10098
connectedStatusPopoverHasBeenShown,
10199
defaultHomeActiveTabName,
102-
swapsState,
103-
quotes,
104100
dataCollectionForMarketing,
105101
participateInMetaMetrics,
106102
firstTimeFlowType,
@@ -111,13 +107,11 @@ const mapStateToProps = (state) => {
111107
const{address:selectedAddress}=selectedAccount;
112108
consttotalUnapprovedCount=getTotalUnapprovedCount(state);
113109
constswapsEnabled=getSwapsFeatureIsLive(state);
114-
constpendingApprovals=selectPendingApprovalsForNavigation(state);
115110
constredirectAfterDefaultPage=getRedirectAfterDefaultPage(state);
116111

117112
constenvType=getEnvironmentType();
118113
constisPopup=envType===ENVIRONMENT_TYPE_POPUP;
119114
constisNotification=envType===ENVIRONMENT_TYPE_NOTIFICATION;
120-
constisSidepanel=envType===ENVIRONMENT_TYPE_SIDEPANEL;
121115

122116
constoriginOfCurrentTab=getOriginOfCurrentTab(state);
123117
constshouldShowWeb3ShimUsageNotification=
@@ -154,7 +148,6 @@ const mapStateToProps = (state) => {
154148
isPopup,
155149
isNotification,
156150
dataCollectionForMarketing,
157-
isSidepanel,
158151
selectedAddress,
159152
totalUnapprovedCount,
160153
participateInMetaMetrics,
@@ -163,14 +156,9 @@ const mapStateToProps = (state) => {
163156
defaultHomeActiveTabName,
164157
firstTimeFlowType,
165158
completedOnboarding,
166-
haveSwapsQuotes:Boolean(Object.values(swapsState.quotes||{}).length),
167-
swapsFetchParams:swapsState.fetchParams,
168-
showAwaitingSwapScreen:swapsState.routeState==='awaiting',
169-
haveBridgeQuotes:Boolean(Object.values(quotes||{}).length),
170159
isMainnet:getIsMainnet(state),
171160
originOfCurrentTab,
172161
shouldShowWeb3ShimUsageNotification,
173-
pendingApprovals,
174162
infuraBlocked:getInfuraBlocked(state),
175163
announcementsToShow:getSortedAnnouncementsToShow(state).length>0,
176164
showWhatsNewPopup,

‎ui/pages/routes/confirmation-handler.tsx‎

Lines changed: 33 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,13 @@ import {
77
AWAITING_SWAP_ROUTE,
88
PREPARE_SWAP_ROUTE,
99
CROSS_CHAIN_SWAP_ROUTE,
10-
DEFAULT_ROUTE,
10+
ACCOUNT_LIST_PAGE_ROUTE,
11+
UNLOCK_ROUTE,
12+
CONNECT_ROUTE,
13+
CONFIRMATION_V_NEXT_ROUTE,
14+
CONFIRM_TRANSACTION_ROUTE,
15+
CONFIRM_ADD_SUGGESTED_TOKEN_ROUTE,
16+
CONFIRM_ADD_SUGGESTED_NFT_ROUTE,
1117
}from'../../helpers/constants/routes';
1218
import{getConfirmationRoute}from'../confirmations/hooks/useConfirmationNavigation';
1319
// eslint-disable-next-line import/no-restricted-paths
@@ -28,6 +34,20 @@ import {
2834
selectShowAwaitingSwapScreen,
2935
}from'../../ducks/swaps/swaps';
3036
import{useNavState}from'../../contexts/navigation-state';
37+
import{useModalState}from'../../hooks/useModalState';
38+
39+
constEXEMPTED_ROUTES=[
40+
ACCOUNT_LIST_PAGE_ROUTE,
41+
AWAITING_SWAP_ROUTE,
42+
PREPARE_SWAP_ROUTE,
43+
CROSS_CHAIN_SWAP_ROUTE,
44+
UNLOCK_ROUTE,
45+
CONNECT_ROUTE,
46+
CONFIRMATION_V_NEXT_ROUTE,
47+
CONFIRM_TRANSACTION_ROUTE,
48+
CONFIRM_ADD_SUGGESTED_TOKEN_ROUTE,
49+
CONFIRM_ADD_SUGGESTED_NFT_ROUTE,
50+
];
3151

3252
constSNAP_APPROVAL_TYPES=[
3353
'wallet_installSnapResult',
@@ -44,6 +64,7 @@ export const ConfirmationHandler = () => {
4464
constlocation=useLocation();
4565
const{ pathname}=location;
4666
constnavState=useNavState();
67+
const{ closeModals}=useModalState();
4768

4869
constenvType=getEnvironmentType();
4970
constisFullscreen=envType===ENVIRONMENT_TYPE_FULLSCREEN;
@@ -66,10 +87,13 @@ export const ConfirmationHandler = () => {
6687
// Ported from home.component - checkStatusAndNavigate()
6788
constcheckStatusAndNavigate=useCallback(()=>{
6889
if(canRedirect&&showAwaitingSwapScreen){
90+
closeModals();
6991
navigate(AWAITING_SWAP_ROUTE);
7092
}elseif(canRedirect&&(hasSwapsQuotes||swapsFetchParams)){
93+
closeModals();
7194
navigate(PREPARE_SWAP_ROUTE);
7295
}elseif(canRedirect&&hasBridgeQuotes){
96+
closeModals();
7397
navigate(CROSS_CHAIN_SWAP_ROUTE+PREPARE_SWAP_ROUTE);
7498
}elseif(pendingApprovals.length||hasApprovalFlows){
7599
consturl=getConfirmationRoute(
@@ -80,11 +104,13 @@ export const ConfirmationHandler = () => {
80104
);
81105

82106
if(url){
107+
closeModals();
83108
navigate(url,{replace:true});
84109
}
85110
}
86111
},[
87112
canRedirect,
113+
closeModals,
88114
hasApprovalFlows,
89115
hasBridgeQuotes,
90116
hasSwapsQuotes,
@@ -94,13 +120,16 @@ export const ConfirmationHandler = () => {
94120
swapsFetchParams,
95121
]);
96122

123+
constisExemptedRoute=EXEMPTED_ROUTES.some((route)=>
124+
pathname.startsWith(route),
125+
);
126+
97127
consthasAllowedPopupRedirectApprovals=pendingApprovals.some((approval)=>
98128
SNAP_APPROVAL_TYPES.includes(approval.type),
99129
);
100130

101131
useEffect(()=>{
102-
// Only run when on home/default page (for now)
103-
if(pathname!==DEFAULT_ROUTE){
132+
if(isExemptedRoute){
104133
return;
105134
}
106135

@@ -112,8 +141,8 @@ export const ConfirmationHandler = () => {
112141
},[
113142
checkStatusAndNavigate,
114143
hasAllowedPopupRedirectApprovals,
144+
isExemptedRoute,
115145
isFullscreen,
116-
pathname,
117146
]);
118147

119148
returnnull;

‎ui/pages/routes/modals.tsx‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
importReact,{useCallback}from'react';
2+
import{useDispatch}from'react-redux';
3+
import{useAppSelector}from'../../store/store';
4+
import{setEditedNetwork}from'../../store/actions';
5+
import{NetworkListMenu}from'../../components/multichain/network-list-menu';
6+
import{useModalState}from'../../hooks/useModalState';
7+
8+
exportconstModals=()=>{
9+
constdispatch=useDispatch();
10+
const{ closeModals}=useModalState();
11+
constisNetworkMenuOpen=useAppSelector(
12+
({ appState})=>appState.isNetworkMenuOpen,
13+
);
14+
15+
consthandleClose=useCallback(()=>{
16+
closeModals();
17+
dispatch(setEditedNetwork());
18+
},[closeModals,dispatch]);
19+
20+
constmodal=isNetworkMenuOpen ?'network' :undefined;
21+
22+
return(
23+
<>{modal==='network'&&<NetworkListMenuonClose={handleClose}/>}</>
24+
);
25+
};

‎ui/pages/routes/routes.component.tsx‎

Lines changed: 5 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,6 @@ import Loading from '../../components/ui/loading-screen';
2323
import{Modal}from'../../components/app/modals';
2424
importAlertfrom'../../components/ui/alert';
2525
import{
26-
NetworkListMenu,
2726
ImportNftsModal,
2827
ImportTokensModal,
2928
}from'../../components/multichain';
@@ -95,14 +94,12 @@ import {
9594
setCurrentCurrency,
9695
setLastActiveTime,
9796
toggleAccountMenu,
98-
toggleNetworkMenu,
9997
hideImportTokensModal,
10098
hideDeprecatedNetworkModal,
10199
automaticallySwitchNetwork,
102100
///: BEGIN:ONLY_INCLUDE_IF(keyring-snaps)
103101
hideKeyringRemovalResultModal,
104102
///: END:ONLY_INCLUDE_IF
105-
setEditedNetwork,
106103
}from'../../store/actions';
107104
import{pageChanged}from'../../ducks/history/history';
108105
import{
@@ -161,6 +158,7 @@ import {
161158
setTheme,
162159
}from'./utils';
163160
import{ConfirmationHandler}from'./confirmation-handler';
161+
import{Modals}from'./modals';
164162

165163
/**
166164
* V5-to-v5-compat navigation function that bridges react-router-dom v5 history
@@ -525,9 +523,7 @@ export default function Routes() {
525523
constisAccountMenuOpen=useAppSelector(
526524
(state)=>state.appState.isAccountMenuOpen,
527525
);
528-
constisNetworkMenuOpen=useAppSelector(
529-
(state)=>state.appState.isNetworkMenuOpen,
530-
);
526+
531527
constisImportTokensModalOpen=useAppSelector(
532528
(state)=>state.appState.importTokensModalOpen,
533529
);
@@ -1198,14 +1194,7 @@ export default function Routes() {
11981194
<MultichainMetaFoxLogo/>
11991195
)}
12001196
{isAccountMenuOpen ?accountListMenu :null}
1201-
{isNetworkMenuOpen ?(
1202-
<NetworkListMenu
1203-
onClose={()=>{
1204-
dispatch(toggleNetworkMenu());
1205-
dispatch(setEditedNetwork());
1206-
}}
1207-
/>
1208-
) :null}
1197+
12091198
<NetworkConfirmationPopover/>
12101199
{isImportNftsModalOpen ?(
12111200
<ImportNftsModalonClose={()=>dispatch(hideImportNftsModal())}/>
@@ -1253,6 +1242,8 @@ export default function Routes() {
12531242
}>,
12541243
{ location},
12551244
)}
1245+
1246+
<Modals/>
12561247
</div>
12571248
);
12581249
}

‎ui/selectors/selectors.js‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1641,6 +1641,9 @@ const selectSnapId = (_state, snapId) => snapId;
16411641
*/
16421642
exportconstselectInstalledSnaps=(state)=>state.metamask.snaps;
16431643

1644+
exportconstselectIsNetworkMenuOpen=(state)=>
1645+
state.appState.isNetworkMenuOpen;
1646+
16441647
/**
16451648
* Retrieve registry data for requested Snap.
16461649
*

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp