Skip to content

Conversation

@adonesky1
Copy link
Contributor

@adonesky1 adonesky1 commented Jun 22, 2022

Fixes: #15070
I haven't had time or any design feedback to create a wholly separate flow specific to setApproveForAll, rather I've further parameterized the confirm-approve component to provide specific verbiage for this method (both granting and revoking approval). This is not the way I would do it with more time, but the timeline has been compressed and there is some urgency to get something out there since this method is so commonly used.

cc @rachelcope and/or @SayaGT we may want to tweak the verbiage here.

To Do after this PR:

  • E2E test

setApproveForAll (when granting permission)
Before:
Screen Shot 2022-06-28 at 4 35 39 PM

After:
Screen Shot 2022-06-28 at 4 05 34 PM
Screen Shot 2022-06-28 at 4 04 57 PM

setApproveForAll (when revoking permission):

Before:
Screen Shot 2022-06-28 at 4 36 05 PM

After:
Screen Shot 2022-06-28 at 4 25 50 PM
Screen Shot 2022-06-28 at 4 26 24 PM

How to test:

  1. Go to etherscan and navigate to any ERC721 or ERC1155 contract
  2. Navigate to the contract tab and then write contract:

Screen Shot 2022-06-28 at 4 37 02 PM

3. Connect your wallet by clicking `Connect to Web3`

Screen Shot 2022-06-28 at 4 38 08 PM

4. Scroll down to `setApprovalForAll` and click it so it drops down inputs 5. Enter args: For `operator` enter another address (any will do) and for `approved` enter true to see the grant permission flow. (then repeat and enter false to see the revoke flow)

@github-actions
Copy link
Contributor

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.

@adonesky1 adonesky1 changed the title wip Fix SetApprovalForAll confirmation view Jun 22, 2022
@adonesky1 adonesky1 dismissed a stale review via f8751e3 June 23, 2022 19:29
@adonesky1 adonesky1 force-pushed the fix-set-approval-for-all branch 5 times, most recently from 48cac45 to aa76f84 Compare June 28, 2022 21:15
@adonesky1 adonesky1 marked this pull request as ready for review June 28, 2022 21:41
@adonesky1 adonesky1 requested a review from a team as a code owner June 28, 2022 21:41
@adonesky1 adonesky1 requested a review from PeterYinusa June 28, 2022 21:41
@adonesky1 adonesky1 changed the title Fix SetApprovalForAll confirmation view Add setApprovalForAll confirmation view Jun 28, 2022
@metamaskbot
Copy link
Collaborator

Builds ready [aa76f84]
Page Load Metrics (1778 ± 45 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint94140112136
domContentLoaded1604196517638239
load1624206217789345
domInteractive1604196517638239

highlights:

storybook

@rachelcope
Copy link

This looks good to me. Big improvement to what we currently have 🚢

digiwand
digiwand previously approved these changes Jun 29, 2022
Copy link
Contributor

@digiwand digiwand left a comment

Choose a reason for hiding this comment

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

Nice fix / feature update!

No blockers, just some small comments to consider later

title = t('revokeAllTokensTitle', [titleTokenDescription]);
}
}
return title;
Copy link
Contributor

Choose a reason for hiding this comment

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

comment & no need to change:

Another way to go about this is

let title;
// ... 
return title || t('allowSpendToken', [titleTokenDescription]);

could save 1 translation call

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Done here: 2584852

{t('approvedAsset')}:
</div>
<div className="confirm-approve-content__medium-text">
{isSetApproveForAll ? `${t('allOfYour')} ` : null}
Copy link
Contributor

Choose a reason for hiding this comment

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

This is not a blocker for this fix. We should pass this in as a param to the titleTokenDescription because the translations might change the sentence structure

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Done here: 2584852

? t('functionSetApprovalForAll')
: t('functionApprove')}
</div>
<div className="confirm-approve-content__small-text">
Copy link
Contributor

Choose a reason for hiding this comment

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

nit and non-blocker: Could avoid showing an empty element when we are not displaying isSetApproveForAll

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Done here: 2584852

@digiwand
Copy link
Contributor

verified using Chrome x MacOS

title = t('approveSpendLimit', [token?.symbol || t('token')]);
subtitle = origin;
subtitleContainsOrigin = true;
} else if (type === TRANSACTION_TYPES.TOKEN_METHOD_SET_APPROVAL_FOR_ALL) {
Copy link
Contributor

Choose a reason for hiding this comment

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

does this type actually get set anywhere?

Copy link
Contributor

Choose a reason for hiding this comment

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

@digiwand when you tested this, did you see the setApprovalForAllTitle in the transaction history list?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Screen Shot 2022-07-11 at 2 41 32 PM

Should be able to! I see it. cc @digiwand

Copy link
Contributor Author

Choose a reason for hiding this comment

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

its set here in the method determineTransactionType

@hilvmason hilvmason added the PR - P1 identifies PRs deemed priority for Extension team label Jul 4, 2022
@adonesky1 adonesky1 dismissed stale reviews from ghost and digiwand via 2584852 July 11, 2022 20:21
@adonesky1 adonesky1 force-pushed the fix-set-approval-for-all branch from aa76f84 to 2584852 Compare July 11, 2022 20:21
@adonesky1 adonesky1 requested review from danjm and digiwand July 11, 2022 20:23
@metamaskbot
Copy link
Collaborator

Builds ready [2584852]
Page Load Metrics (1729 ± 42 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint88153109199
domContentLoaded1585191817228641
load1585193817298742
domInteractive1585191817228642

highlights:

storybook

Copy link
Contributor

@georgewrmarshall georgewrmarshall left a comment

Choose a reason for hiding this comment

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

UI looks good to me! I can see some improvements that we can make to approval screen UI in general which I can save for another PR

const { isSetApproveForAll, setApproveForAllArg } = this.props;
const titleTokenDescription = this.getTitleTokenDescription();

let title;
Copy link
Contributor

Choose a reason for hiding this comment

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

This could be let title = t('allowSpendToken', [titleTokenDescription]);, and we avoid the || in the return statement, but I won't block on that.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

lol this is what I had before and Ariella suggested this way: #15010 (comment)

I don't have much of an opinion on this one.

Copy link
Contributor

Choose a reason for hiding this comment

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

haha sorry @adonesky1 and @darkwing. I actually liked the || to possibly do one less translation here. I can switch the preference to @darkwing 's for future implementations

@adonesky1 adonesky1 merged commit 4f0115f into develop Jul 11, 2022
@adonesky1 adonesky1 deleted the fix-set-approval-for-all branch July 11, 2022 23:32
@github-actions github-actions bot locked and limited conversation to collaborators Jul 11, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

PR - P1 identifies PRs deemed priority for Extension team

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add setApproveForAll Screen

9 participants