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

fix: [app dir bootstrapping 8] useParamsWithFallback hook and add tests #12041

Merged
merged 3 commits into from
Nov 7, 2023

Conversation

hbjORbj
Copy link
Contributor

@hbjORbj hbjORbj commented Oct 23, 2023

What does this PR do?

  • Bug: Error: NextRouter was not mounted is thrown if useRouter from next/router is called in App router. Since useParamsWithFallback is meant to be used in both page router and app router, this shouldn't happen.
  • How the bug was found: In order to migrate pages/workflows/[workflow].tsx to App router, I created a file at app/workflows/[workflow]/page.tsx that imports component from @calcom/features/ee/workflows/pages/workflow. The component at @calcom/features/ee/workflows/pages/workflow uses useParamsWithFallback hook, in which useRouter from next/router is called.
  • Solution: Use next.js compat router (this doesn't throw error but rather returns null in app router)
  • Extra Note: We added tests to ensure the functionality of the hook.

Requirement/Documentation

Type of change

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

How should this be tested?

  1. We added tests to ensure the functionality of the hook. Run yarn vitest run packages/lib/hooks/useParamsWithFallback.test.ts.
  2. To test in real browser, try to call the hook useParamsWithFallback in any client component in app router page. You can go to this branch, create any dummy component in app router and call the hook from there.

Mandatory Tasks

  • Make sure you have self-reviewed the code. A decent size PR without self-review might be rejected.

@vercel
Copy link

vercel bot commented Oct 23, 2023

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

Name Status Preview Comments Updated (UTC)
dev ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 26, 2023 7:18pm
ui ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 26, 2023 7:18pm

@vercel
Copy link

vercel bot commented Oct 23, 2023

@hbjORbj is attempting to deploy a commit to the cal Team on Vercel.

A member of the Team first needs to authorize it.

@github-actions
Copy link
Contributor

github-actions bot commented Oct 23, 2023

Thank you for following the naming conventions! 🙏 Feel free to join our discord and post your PR link to collect XP and win prizes!

@github-actions
Copy link
Contributor

github-actions bot commented Oct 23, 2023

📦 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! 🙌

@hbjORbj hbjORbj changed the title fix: useParamsWithFallback hook and add tests fix: [app dir bootstrapping 8] useParamsWithFallback hook and add tests Oct 23, 2023
@PeerRich PeerRich added the Medium priority Created by Linear-GitHub Sync label Oct 24, 2023
@hbjORbj hbjORbj force-pushed the fix/useParamsWithFallback branch from 66176eb to f511ea4 Compare October 24, 2023 10:47
@hbjORbj hbjORbj force-pushed the fix/useParamsWithFallback branch 2 times, most recently from 1400259 to bdad5e9 Compare November 2, 2023 17:35
@hbjORbj hbjORbj force-pushed the fix/useParamsWithFallback branch from bdad5e9 to cf5a295 Compare November 2, 2023 18:06
Copy link
Contributor

@emrysal emrysal left a comment

Choose a reason for hiding this comment

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

Looks good to me, lgtm

@emrysal emrysal merged commit 13ec810 into calcom:main Nov 7, 2023
zomars pushed a commit that referenced this pull request Jan 29, 2024
…ests (#12041)

* fix: first solution using RouterContext

* fix: second solution by importing router from next/compat/router

* fix return type
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Medium priority Created by Linear-GitHub Sync
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants