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

Next.js 15 redirect() to parallel route causes infinite reload #67522

Open
dalkommatt opened this issue Jul 6, 2024 · 2 comments
Open

Next.js 15 redirect() to parallel route causes infinite reload #67522

dalkommatt opened this issue Jul 6, 2024 · 2 comments
Labels
bug Issue was opened via the bug report template. create-next-app Related to our CLI tool for quickly starting a new Next.js application. Navigation Related to Next.js linking (e.g., <Link>) and navigation. Parallel & Intercepting Routes Related to Parallel and/or Intercepting routes. TypeScript Related to types with Next.js.

Comments

@dalkommatt
Copy link

dalkommatt commented Jul 6, 2024

Link to the code that reproduces this issue

https://github.com/dalkommatt/redirect-parallel-route-infinite-reload

To Reproduce

  1. pnpm dlx create-next-app@rc
  2. Create @modal parallel route with (.)login, catchAll and default
    image
export default function ModalLoginPage() {
  return (
    <div className="absolute inset-0 flex items-center justify-center bg-black/[.5] dark:bg-white/[.5]">
      <h1>Login here</h1>;
    </div>
  );
}
export default function CatchAll() {
    return null
  }
export default function Default() {
  return null
}
  1. Create a /login route
    image
export default function LoginPage() {
  return <h1>Login here</h1>;
}
  1. redirect('/login') from '/'
export default function Home() {
 const user = false;
 if (!user) {
   redirect("/login");
 }
/* default home page return */

Current vs. Expected behavior

Current: Infinitely reloads /login
Expected: Opens model route

Provide environment information

Operating System:
  Platform: win32
  Arch: x64
  Version: Windows 11 Education
  Available memory (MB): 32506
  Available CPU cores: 16
Binaries:
  Node: 18.18.0
  npm: N/A
  Yarn: N/A
  pnpm: 9.0.4
Relevant Packages:
  next: 15.0.0-rc.0 // Latest available version is detected (15.0.0-rc.0).
  eslint-config-next: 15.0.0-rc.0
  react: 19.0.0-rc-f994737d14-20240522
  react-dom: 19.0.0-rc-f994737d14-20240522
  typescript: 5.5.3
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

create-next-app, Navigation, Parallel & Intercepting Routes, TypeScript

Which stage(s) are affected? (Select all that apply)

next dev (local), next start (local), Vercel (Deployed)

Additional context

Tested on both RC and canary versions of Next.js 15

@dalkommatt dalkommatt added the bug Issue was opened via the bug report template. label Jul 6, 2024
@github-actions github-actions bot added create-next-app Related to our CLI tool for quickly starting a new Next.js application. Navigation Related to Next.js linking (e.g., <Link>) and navigation. Parallel & Intercepting Routes Related to Parallel and/or Intercepting routes. TypeScript Related to types with Next.js. labels Jul 6, 2024
@dalkommatt dalkommatt changed the title Next.js 15 redirect() to parallel route causes infinite relaod Next.js 15 redirect() to parallel route causes infinite reload Jul 12, 2024
@sang-onbpad
Copy link

sang-onbpad commented Sep 8, 2024

I also meet the same issue. I realized that the problem is all slots don't have same routes. For example, in @children slot includes /page.tsx but @modal doesn't. So please try add /page.tsx as default.tsx to your @modal slot will resolve problem. Please guarantee all your slots includes same route even though there is return empty.
Screenshot 2024-09-08 at 20 36 34

@dalkommatt
Copy link
Author

I also meet the same issue. I realized that the problem is all slots don't have same routes. For example, in @children slot includes /page.tsx but @modal doesn't. So please try add /page.tsx as default.tsx to your @modal slot will resolve problem. Please guarantee all your slots includes same route even though there is return empty. Screenshot 2024-09-08 at 20 36 34

@sang-onbpad I'm not sure I follow. Adding a page.tsx with a null return to /@modal did not seem to solve the problem. Please create a PR on the repo with your fix.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Issue was opened via the bug report template. create-next-app Related to our CLI tool for quickly starting a new Next.js application. Navigation Related to Next.js linking (e.g., <Link>) and navigation. Parallel & Intercepting Routes Related to Parallel and/or Intercepting routes. TypeScript Related to types with Next.js.
Projects
None yet
Development

No branches or pull requests

3 participants
@dalkommatt @sang-onbpad and others