Implement `UpgradeTip` in App installation flow for apps that need teams plan

[hariombalhara]

What does this PR do?

Fixes #7973

Demo

https://www.loom.com/share/eae39ce07e824e1385be4e39ee82b5d7

Type of change

• Bug fix (non-breaking change which fixes an issue)

How should this be tested?

• [x] Try installing Routing Forms App when for an account that doesn't have teams plan and you would notice that you are shown Upgrade Tip.
• [x] Try the same for an account that has teams plan and it won't show Upgrade Tip.

Checklist

• I haven't added tests that prove my fix is effective or that my feature works

[linear[bot]]

CAL-1707 Routing Forms misinformation

The Routing forms App is stated as free but is not available after installation without a team account.

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
cal	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	May 18, 2023 9:59am
ui	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	May 18, 2023 9:59am

[github-actions[bot]]

📦 Next.js Bundle Analysis for @calcom/web

This analysis was generated by the Next.js Bundle Analysis action. 🤖

This PR introduced no changes to the JavaScript bundle! 🙌

[deploysentinel[bot]]

Current Playwright Test Results Summary

✅ 114 Passing - ⚠️ 4 Flaky

Run may still be in progress, this comment will be updated as current testing workflow or job completes...

(Last updated on 05/18/2023 10:18:30am UTC)

Run Details

Running Workflow PR Update on Github Actions

Commit: f43d65d28f8878b9ba2f289f7db8d910ec95ea4f

Started: 05/18/2023 10:06:04am UTC

⚠️ Flakes

📄   apps/web/playwright/reschedule.e2e.ts • 1 Flake

Test Case Results

Test Case	Last 7 days Failures	Last 7 days Flakes
Reschedule Tests -- old-booker Should do a booking request reschedule from /bookings Retry 1 • Initial Attempt	0.74% (2) 2 / 272 runs failed over last 7 days	1.47% (4) 4 / 272 runs flaked over last 7 days

---

📄   apps/web/playwright/booking-seats.e2e.ts • 1 Flake

Test Case Results

Test Case	Last 7 days Failures	Last 7 days Flakes
Booking with Seats -- new-booker Reschedule for booking with seats -- old-booker Should reschedule booking with seats and if everyone rescheduled it should be deleted Retry 1 • Initial Attempt	0% (0) 0 / 283 runs failed over last 7 days	83.04% (235) 235 / 283 runs flaked over last 7 days

---

📄   packages/app-store/routing-forms/playwright/tests/basic.e2e.ts • 1 Flake

Test Case Results

Test Case	Last 7 days Failures	Last 7 days Flakes
Routing Forms Seeded Routing Form Routing Link - Reporting and CSV Download Retry 1 • Initial Attempt	0.56% (1) 1 / 180 run failed over last 7 days	5% (9) 9 / 180 runs flaked over last 7 days

---

📄   packages/embeds/embed-core/playwright/tests/action-based.test.ts • 1 Flake

Test Case Results

Test Case	Last 7 days Failures	Last 7 days Flakes
Popup Tests should be able to reschedule Retry 2 • Retry 1 • Initial Attempt	11.46% (18) 18 / 157 runs failed over last 7 days	38.22% (60) 60 / 157 runs flaked over last 7 days

---

View Detailed Build Results

---

[hariombalhara]

Yeah I agree that it's not a good UX. But I think (as I mentioned in TODO) a dialog is more appropriate here. We have no implementation of Dialog for Upgrade right now.

With the dialog in place and Pricing in there already, I think we won't need to add more messaging as you suggest. Also, maybe we can highlight the pricing a bit better.

@PeerRich What do you think should be the approach here? I am inclined towards adding the flow quickly as it's misleading pricing right now. A followup with the correct approach can be done later.

[sean-brydon]

Yeah I agree that it's not a good UX. But I think (as I mentioned in TODO) a dialog is more appropriate here. We have no implementation of Dialog for Upgrade right now.

With the dialog in place and Pricing in there already, I think we won't need to add more messaging as you suggest. Also, maybe we can highlight the pricing a bit better.

@PeerRich What do you think should be the approach here? I am inclined towards adding the flow quickly as it's misleading pricing right now. A followup with the correct approach can be done later.

@Jaibles if you can design a dialog update tip i'll make it for @hariombalhara so he can use it in a follow up :)

[ciaranha]

Proposed designs here: https://www.figma.com/file/ZJNAFHCAq6rnuGRgUFxjzQ/4.-Orgs-%2F-Teams.---New-Features?type=design&node-id=4786%3A212846&t=174oVDVZxCkNZJpU-1 Comment with any feedback!

[hariombalhara]

Merging this one. @sean-brydon or I would pick up the design as a followup.