first commit

test/e2e/app-dir/interception-dynamic-single-segment/app/@modal/(.)[a]/[b]/[c]/item/page.tsx

@@ -0,0 +1,10 @@
+export default async function ItemModal(props: {
+  params: Promise<{ a: string; b: string; c: string }>
+}) {
+  const params = await props.params
+  return (
+    <div id="item-modal">
+      Modal: Item for path {params.a}/{params.b}/{params.c}
+    </div>
+  )
+}

test/e2e/app-dir/interception-dynamic-single-segment/app/@modal/(.)admin/dashboard/users/new/page.tsx

@@ -0,0 +1,3 @@
+export default function NewUserModal() {
+  return <div id="new-user-modal">Modal: New User Form</div>
+}

test/e2e/app-dir/interception-dynamic-single-segment/app/@modal/(.)groups/[id]/new/page.tsx

@@ -0,0 +1,6 @@
+export default async function NewItemModal(props: {
+  params: Promise<{ id: string }>
+}) {
+  const params = await props.params
+  return <div id="new-modal">Modal: New item for group {params.id}</div>
+}

test/e2e/app-dir/interception-dynamic-single-segment/app/@modal/(.)org/[orgId]/team/[teamId]/settings/page.tsx

@@ -0,0 +1,10 @@
+export default async function TeamSettingsModal(props: {
+  params: Promise<{ orgId: string; teamId: string }>
+}) {
+  const params = await props.params
+  return (
+    <div id="settings-modal">
+      Modal: Settings for Team {params.teamId} in Org {params.orgId}
+    </div>
+  )
+}

test/e2e/app-dir/interception-dynamic-single-segment/app/@modal/[a]/[b]/[c]/page.tsx

@@ -0,0 +1,3 @@
+export default function ConsecutiveDynamicModalDefault() {
+  return null
+}

test/e2e/app-dir/interception-dynamic-single-segment/app/@modal/admin/dashboard/users/page.tsx

@@ -0,0 +1,3 @@
+export default function UsersModalDefault() {
+  return null
+}

test/e2e/app-dir/interception-dynamic-single-segment/app/@modal/default.tsx

@@ -0,0 +1 @@
+export default () => 'default'

test/e2e/app-dir/interception-dynamic-single-segment/app/@modal/groups/[id]/page.tsx

@@ -0,0 +1,3 @@
+export default function GroupModalDefault() {
+  return null
+}

test/e2e/app-dir/interception-dynamic-single-segment/app/@modal/org/[orgId]/team/[teamId]/page.tsx

@@ -0,0 +1,3 @@
+export default function TeamModalDefault() {
+  return null
+}

test/e2e/app-dir/interception-dynamic-single-segment/app/[a]/[b]/[c]/item/page.tsx

@@ -0,0 +1,10 @@
+export default async function ItemPage(props: {
+  params: Promise<{ a: string; b: string; c: string }>
+}) {
+  const params = await props.params
+  return (
+    <div id="item-page">
+      Item for path: {params.a}/{params.b}/{params.c}
+    </div>
+  )
+}

test/e2e/app-dir/interception-dynamic-single-segment/app/[a]/[b]/[c]/page.tsx

@@ -0,0 +1,17 @@
+import Link from 'next/link'
+
+export default async function ConsecutiveDynamicPage(props: {
+  params: Promise<{ a: string; b: string; c: string }>
+}) {
+  const params = await props.params
+  return (
+    <div>
+      <div id="consecutive-page">
+        Path: {params.a}/{params.b}/{params.c}
+      </div>
+      <Link href={`/${params.a}/${params.b}/${params.c}/item`} id="item-link">
+        View Item
+      </Link>
+    </div>
+  )
+}

test/e2e/app-dir/interception-dynamic-single-segment/app/admin/dashboard/users/new/page.tsx

@@ -0,0 +1,3 @@
+export default function NewUserPage() {
+  return <div id="new-user-page">New User Form</div>
+}

test/e2e/app-dir/interception-dynamic-single-segment/app/admin/dashboard/users/page.tsx

@@ -0,0 +1,12 @@
+import Link from 'next/link'
+
+export default function UsersPage() {
+  return (
+    <div>
+      <div id="users-page">Admin Dashboard - Users</div>
+      <Link href="/admin/dashboard/users/new" id="new-user-link">
+        New User
+      </Link>
+    </div>
+  )
+}

test/e2e/app-dir/interception-dynamic-single-segment/app/default.tsx

@@ -0,0 +1,3 @@
+export default function Default() {
+  return null
+}

test/e2e/app-dir/interception-dynamic-single-segment/app/groups/[id]/new/page.tsx

@@ -0,0 +1,6 @@
+export default async function NewItemPage(props: {
+  params: Promise<{ id: string }>
+}) {
+  const params = await props.params
+  return <div id="new-page">New item for group {params.id}</div>
+}

test/e2e/app-dir/interception-dynamic-single-segment/app/groups/[id]/page.tsx

@@ -0,0 +1,15 @@
+import Link from 'next/link'
+
+export default async function GroupPage(props: {
+  params: Promise<{ id: string }>
+}) {
+  const params = await props.params
+  return (
+    <div>
+      <div id="group-page">Group {params.id}</div>
+      <Link href={`/groups/${params.id}/new`} id="new-link">
+        New Item
+      </Link>
+    </div>
+  )
+}

test/e2e/app-dir/interception-dynamic-single-segment/app/layout.tsx

@@ -0,0 +1,17 @@
+import { Suspense } from 'react'
+
+export default function Layout(props: {
+  children: React.ReactNode
+  modal: React.ReactNode
+}) {
+  return (
+    <Suspense>
+      <html>
+        <body>
+          <div id="children">{props.children}</div>
+          <div id="modal">{props.modal}</div>
+        </body>
+      </html>
+    </Suspense>
+  )
+}

test/e2e/app-dir/interception-dynamic-single-segment/app/org/[orgId]/team/[teamId]/page.tsx

@@ -0,0 +1,20 @@
+import Link from 'next/link'
+
+export default async function TeamPage(props: {
+  params: Promise<{ orgId: string; teamId: string }>
+}) {
+  const params = await props.params
+  return (
+    <div>
+      <div id="team-page">
+        Team {params.teamId} in Org {params.orgId}
+      </div>
+      <Link
+        href={`/org/${params.orgId}/team/${params.teamId}/settings`}
+        id="settings-link"
+      >
+        Settings
+      </Link>
+    </div>
+  )
+}

test/e2e/app-dir/interception-dynamic-single-segment/app/org/[orgId]/team/[teamId]/settings/page.tsx

@@ -0,0 +1,10 @@
+export default async function TeamSettingsPage(props: {
+  params: Promise<{ orgId: string; teamId: string }>
+}) {
+  const params = await props.params
+  return (
+    <div id="settings-page">
+      Settings for Team {params.teamId} in Org {params.orgId}
+    </div>
+  )
+}

test/e2e/app-dir/interception-dynamic-single-segment/app/page.tsx

@@ -0,0 +1,20 @@
+import Link from 'next/link'
+
+export default function Page() {
+  return (
+    <div>
+      <Link href="/groups/123" id="groups-link">
+        Group 123
+      </Link>{' '}
+      <Link href="/org/acme/team/engineering" id="team-link">
+        Team
+      </Link>{' '}
+      <Link href="/x/y/z" id="consecutive-link">
+        Consecutive
+      </Link>{' '}
+      <Link href="/admin/dashboard/users" id="admin-link">
+        Admin
+      </Link>
+    </div>
+  )
+}