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

Add the Expensify CPA Card to the NewDot homepage and redirect to use dot #7771

Merged
merged 8 commits into from
Feb 17, 2022

Conversation

ctkochan22
Copy link
Contributor

@ctkochan22 ctkochan22 commented Feb 16, 2022

@Expensify/pullerbear
cc @TomatoToaster @jamesdeanexpensify

Details

It adds the CPA card to the login promo rotation, and it allows users to click the image and it'll redirect to the CPA page on use dot

WEB
mphM05TVXZ

DESKTOP
JKkxfNIkrc

IPAD
ZIg4mbnX1f

Fixed Issues

$ https://github.com/Expensify/Expensify/issues/196589

Tests / QA Steps

  • Go to login page. If its the...
    • CPA promo (in screen shot above) click it and verify that it takes you to use.expensify.com/accountants
    • Regular promo card. Verify that it is not clickable
      image

Tested On

  • Web
  • Mobile Web
  • Desktop
  • iOS
  • Android

Screenshots

Web

Mobile Web

Desktop

iOS

Android

@ctkochan22 ctkochan22 requested a review from a team as a code owner February 16, 2022 02:02
@ctkochan22 ctkochan22 self-assigned this Feb 16, 2022
@MelvinBot MelvinBot requested review from pecanoro and removed request for a team February 16, 2022 02:03
@jamesdeanexpensify
Copy link
Contributor

Great work, thank you! Is it possible to make the UseDot page open in a new tab? I just don't want people to be pulled away from logging in if that's what they came here to do :)

@ctkochan22
Copy link
Contributor Author

Yep, its already doing that. I can read your mind

@pecanoro
Copy link
Contributor

@ctkochan22 You need to test this in all platforms, you can also get the background page on Dekstop.

@ctkochan22
Copy link
Contributor Author

Ah right

TomatoToaster
TomatoToaster previously approved these changes Feb 16, 2022
Copy link
Contributor

@TomatoToaster TomatoToaster left a comment

Choose a reason for hiding this comment

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

Cool! Glad to see this is working very similarly to how it does on OldDot

@@ -4,6 +4,7 @@ import ENVIRONMENT from './ENVIRONMENT';
import * as Url from '../libs/Url';

const CLOUDFRONT_URL = 'https://d2k5nsl2zxldvw.cloudfront.net';
const USE_EXPENSIFY_URL = 'https://use.expensify.com';
Copy link
Contributor

Choose a reason for hiding this comment

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

Nice 😎

@ctkochan22 ctkochan22 changed the title Add the Expensify CPA Card to the NewDot homepage and redirect to use dot [WIP] Add the Expensify CPA Card to the NewDot homepage and redirect to use dot Feb 16, 2022
@ctkochan22 ctkochan22 changed the title [WIP] Add the Expensify CPA Card to the NewDot homepage and redirect to use dot Add the Expensify CPA Card to the NewDot homepage and redirect to use dot Feb 16, 2022
@ctkochan22
Copy link
Contributor Author

Is the background color "ivory" #fffaf0 ? -- https://github.com/Expensify/Web-Expensify/pull/32976/files#diff-fff5ee4811b1f78a4ee67300c49ce858d59f05016a7d902fd45a182a2880ecdcR48

In the node-modules/css-colo-keywords/colors.json, that hex is called "floralwhite"

cc @shawnborton

@ctkochan22
Copy link
Contributor Author

Also updated!

@pecanoro pecanoro merged commit 18ff4f8 into main Feb 17, 2022
@pecanoro pecanoro deleted the ckt_cpa_addNewImage branch February 17, 2022 02:55
@OSBotify
Copy link
Contributor

✋ This PR was not deployed to staging yet because QA is ongoing. It will be automatically deployed to staging after the next production release.

@shawnborton
Copy link
Contributor

In the future, can we make sure to get sign off from Design before merging these kinds of changes?

It looks like the homepage image can get too close to the edges of the container here:
image

@ctkochan22 where did you get the image you are using for the background?

@pecanoro
Copy link
Contributor

@shawnborton oh you actually bring an interesting problem, there is actually no process for that and we merged because all reviewers approved it. I actually think we should bring this up in engineering to come up with a process where we ensure the design team has reviewed these changes before merging, like some kind of pullerBear for design when things deal with CSS or design content.

@shawnborton
Copy link
Contributor

Ah, I could have sworn adding Design to a PR in this repo would automatically assign a Designer?

@pecanoro
Copy link
Contributor

pecanoro commented Feb 17, 2022

Maybe it only works with issues and not PRs?

@ctkochan22
Copy link
Contributor Author

Ah thats my bad, it seemed like the design aspect was flushed out. But I should have assigned one of yall to be sure

@ctkochan22
Copy link
Contributor Author

Yeah adding the design label works for the issue, not the PR

@OSBotify
Copy link
Contributor

🚀 Deployed to staging by @pecanoro in version: 1.1.40-0 🚀

platform result
🤖 android 🤖 success ✅
🖥 desktop 🖥 success ✅
🍎 iOS 🍎 success ✅
🕸 web 🕸 success ✅

@stitesExpensify
Copy link
Contributor

I just checked this off on the deploy checklist 👍

@OSBotify
Copy link
Contributor

OSBotify commented Mar 1, 2022

🚀 Deployed to production by @yuwenmemon in version: 1.1.40-2 🚀

platform result
🤖 android 🤖 success ✅
🖥 desktop 🖥 success ✅
🍎 iOS 🍎 success ✅
🕸 web 🕸 success ✅

{
backgroundColor: colors.floralwhite,
backgroundImageUri: `${CONST.CLOUDFRONT_URL}/images/homepage/brand-stories/cpa-card.svg`,
redirectUri: `${CONST.USE_EXPENSIFY_URL}/accountants`,
Copy link
Contributor

Choose a reason for hiding this comment

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

Hi! 👋 Coming in super late, but I noticed this and StyleUtils should only be returning things that are styles. This URL is used only for redirecting the user so it should not be returned from the styles. @ctkochan22 can you please fix this so that Link.openExternalLink(backgroundStyle.redirectUri); uses ${CONST.USE_EXPENSIFY_URL}/accountants directly?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Design Engineering Improvement Item broken or needs improvement.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

8 participants