App: [HOLD for payment 2023-09-21] [$500] Implement new layout for SecurityPage
If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!
Action Performed:
Open the security settings page
Expected Result:
It should look like this:
and should be implemented using the IllustratedHeaderPageLayout component. The asset for the safe animation lottie JSON file can be found here:
The correct background color is ice500 or #4ED7DE
Actual Result:
It looks like this:
Upwork Automation - Do Not Edit
- Upwork Job URL: https://www.upwork.com/jobs/~0179e9954261696fde
- Upwork Job ID: 1699055159124353024
- Last Price Increase: 2023-09-05
- Automatic offers:
- hungvu193 | Contributor | 26507971
About this issue
- Original URL
- State: closed
- Created 10 months ago
- Comments: 36 (28 by maintainers)
Hey @maddylewis ! I’m from Callstack - no needs any payment with Upwork
@maddylewis unless I’m missing something I think this is separate from https://github.com/Expensify/App/issues/27487 so we should be able to pay this out. However, this technically caused a regression, so we should only pay 50%.
Comparisons:
Found it! I’ll create a PR soon.
Also, just to set expectations here, this PR will be subject to the ongoing merge freeze
Ok, I think @hungvu193’s proposal was the first that was prettymuch close enough. Sorry everyone else! Maybe check out https://github.com/Expensify/App/issues/26779 (not you @hungvu193)
Proposal
Please re-state the feature request that we are trying to solve in this issue.
Implement new layout for SecurityPage
What is the root cause of that problem?
We’re using ScreenWrapper for SecurityPage.
What changes do you think we should make in order to solve the problem?
ScreenWrapperwithIllustratedHeaderPageLayoutwith the illustration we just saved and background color:#4ED7DEHeaderWithBackButtonand move the its props toIllustratedHeaderPageLayout.shouldShowBackButtontoIllustratedHeaderPageLayoutto make sure the back button is visible.What alternative solutions did you explore? (Optional)
N/A
Proposal
Please re-state the problem that we are trying to solve in this issue.
this is new layout implementation
What is the root cause of that problem?
no specific root cause we need to use
IllustratedHeaderPageLayoutWhat changes do you think we should make in order to solve the problem?
We should use
IllustratedHeaderPageLayoutlike insideLoungeAccessPageand add the required props.https://github.com/Expensify/App/blob/b95c1dd22474fb48929e78a102c1121c1e6e4360/src/pages/settings/Profile/LoungeAccessPage.js#L46-L50
What alternative solutions did you explore? (Optional)
Please use our standard proposal template.