Skip to content

Commit

Permalink
fix(create-pages): Ensure dynamic layouts receive path prop (#1256)
Browse files Browse the repository at this point in the history
The logic seemed to be reversed when checking if the current layout
segment is dynamic or static (see `!` in create-pages.ts), so the `path`
prop was never provided.

Didn't run the E2E tests locally but verified by adding a temp test to
`create-pages.test.ts` locally.
  • Loading branch information
hamlim authored Feb 22, 2025
1 parent 29af481 commit ec0c419
Show file tree
Hide file tree
Showing 4 changed files with 40 additions and 1 deletion.
10 changes: 10 additions & 0 deletions e2e/create-pages.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,16 @@ for (const mode of ['DEV', 'PRD'] as const) {
await expect(page.getByRole('heading', { name: 'Foo' })).toBeVisible();
});

test('dynamic', async ({ page }) => {
await page.goto(`http://localhost:${port}/dynamic`);
await expect(page.getByRole('navigation')).toHaveText(
'Current path: /dynamic',
);
await expect(
page.getByRole('heading', { name: 'Dynamic Page' }),
).toBeVisible();
});

test('nested/foo', async ({ page }) => {
// /nested/foo is defined as a staticPath of /nested/[id] which matches this layout
await page.goto(`http://localhost:${port}/nested/foo`);
Expand Down
16 changes: 16 additions & 0 deletions e2e/fixtures/create-pages/src/components/DynamicLayout.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import type { ReactNode } from 'react';

export default function DynamicLayout({
children,
path,
}: {
children: ReactNode;
path: string;
}) {
return (
<>
<nav>Current path: {path}</nav>
{children}
</>
);
}
13 changes: 13 additions & 0 deletions e2e/fixtures/create-pages/src/entries.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import type { PathsForPages } from 'waku/router';

import FooPage from './components/FooPage.js';
import HomeLayout from './components/HomeLayout.js';
import DynamicLayout from './components/DynamicLayout.js';
import HomePage from './components/HomePage.js';
import NestedBazPage from './components/NestedBazPage.js';
import NestedLayout from './components/NestedLayout.js';
Expand Down Expand Up @@ -140,6 +141,18 @@ const pages: ReturnType<typeof createPages> = createPages(
exactPath: true,
component: () => <h1>EXACTLY!!</h1>,
}),

createLayout({
render: 'dynamic',
path: '/dynamic',
component: DynamicLayout,
}),

createPage({
render: 'dynamic',
path: '/dynamic',
component: () => <h1>Dynamic Page</h1>,
}),
],
);

Expand Down
2 changes: 1 addition & 1 deletion packages/waku/src/router/create-pages.ts
Original file line number Diff line number Diff line change
Expand Up @@ -624,7 +624,7 @@ export const createPages = <
dynamicLayoutPathMap.get(segment)?.[1] ??
staticComponentMap.get(joinPath(segment, 'layout').slice(1)); // feels like a hack

const isDynamic = !dynamicLayoutPathMap.has(segment);
const isDynamic = dynamicLayoutPathMap.has(segment);

// always true
if (layout) {
Expand Down

0 comments on commit ec0c419

Please sign in to comment.