Skip to content

Commit

Permalink
Add route groups to react integration (#1083)
Browse files Browse the repository at this point in the history
  • Loading branch information
@AlecAivazis
AlecAivazis committed May 6, 2023
1 parent 520e093 commit 4a30b1a
Show file tree
Hide file tree
Showing 5 changed files with 171 additions and 92 deletions.
46 changes: 23 additions & 23 deletions packages/houdini-react/src/plugin/codegen/entries.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,27 +41,27 @@ test('composes layouts and pages', async function () {
{ plugins: ['jsx'] }
)
expect(page_entry).toMatchInlineSnapshot(`
import Layout___ from "../layouts/__.jsx";
import Layout___subRoute from "../layouts/__subRoute.jsx";
import Page___subRoute__nested from "../pages/__subRoute__nested.jsx";
import PageFallback___subRoute__nested from "../fallbacks/page/__subRoute__nested.jsx";
import LayoutFallback___subRoute__nested from "../../fallbacks/layout";
import Layout__0 from "../layouts/_0.jsx";
import Layout__0subRoute from "../layouts/_0subRoute.jsx";
import Page__0subRoute_0nested from "../pages/_0subRoute_0nested.jsx";
import PageFallback__0subRoute_0nested from "../fallbacks/page/_0subRoute_0nested.jsx";
import LayoutFallback__0subRoute_0nested from "../../fallbacks/layout";
export default (
{
url
}
) => {
return (
(<LayoutFallback___subRoute__nested key={url}>
<Layout___ key={url}>
<Layout___subRoute key={url}>
<PageFallback___subRoute__nested key={url}>
<Page___subRoute__nested />
</PageFallback___subRoute__nested>
</Layout___subRoute>
</Layout___>
</LayoutFallback___subRoute__nested>)
(<LayoutFallback__0subRoute_0nested key={url}>
<Layout__0 key={url}>
<Layout__0subRoute key={url}>
<PageFallback__0subRoute_0nested key={url}>
<Page__0subRoute_0nested />
</PageFallback__0subRoute_0nested>
</Layout__0subRoute>
</Layout__0>
</LayoutFallback__0subRoute_0nested>)
);
};
`)
Expand All @@ -74,7 +74,7 @@ test('composes layouts and pages', async function () {
)
expect(page_unit).toMatchInlineSnapshot(`
import { useQueryResult } from "$houdini/plugins/houdini-react/runtime/routing/components/Router";
import Component___subRoute__nested from "../../../../../src/routes/subRoute/nested/+page";
import Component__0subRoute_0nested from "../../../../../src/routes/subRoute/nested/+page";
export default (
{
Expand All @@ -84,9 +84,9 @@ test('composes layouts and pages', async function () {
const [FinalQuery$data, FinalQuery$handle] = useQueryResult("FinalQuery");
return (
(<Component___subRoute__nested FinalQuery={FinalQuery$data} FinalQuery$handle={FinalQuery$handle}>
(<Component__0subRoute_0nested FinalQuery={FinalQuery$data} FinalQuery$handle={FinalQuery$handle}>
{children}
</Component___subRoute__nested>)
</Component__0subRoute_0nested>)
);
};
`)
Expand All @@ -99,17 +99,17 @@ test('composes layouts and pages', async function () {
)
expect(root_layout_unit).toMatchInlineSnapshot(`
import { useQueryResult } from "$houdini/plugins/houdini-react/runtime/routing/components/Router";
import Component___ from "../../../../../src/routes/+layout";
import Component__0 from "../../../../../src/routes/+layout";
export default (
{
children
}
) => {
return (
(<Component___>
(<Component__0>
{children}
</Component___>)
</Component__0>)
);
};
`)
Expand All @@ -122,7 +122,7 @@ test('composes layouts and pages', async function () {
)
expect(deep_layout_unit).toMatchInlineSnapshot(`
import { useQueryResult } from "$houdini/plugins/houdini-react/runtime/routing/components/Router";
import Component___subRoute from "../../../../../src/routes/subRoute/+layout";
import Component__0subRoute from "../../../../../src/routes/subRoute/+layout";
export default (
{
Expand All @@ -133,13 +133,13 @@ test('composes layouts and pages', async function () {
const [SubQuery$data, SubQuery$handle] = useQueryResult("SubQuery");
return (
(<Component___subRoute
(<Component__0subRoute
RootQuery={RootQuery$data}
RootQuery$handle={RootQuery$handle}
SubQuery={SubQuery$data}
SubQuery$handle={SubQuery$handle}>
{children}
</Component___subRoute>)
</Component__0subRoute>)
);
};
`)
Expand Down
134 changes: 106 additions & 28 deletions packages/houdini-react/src/plugin/codegen/manifest.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,84 @@ test('empty routes dir generates empty manifest', async function () {
`)
})

test('route groups', async function () {
const config = await test_config()

// create the mock filesystem
await fs.mock({
[config.routesDir]: {
'+layout.tsx': mockView([]),
'(subRoute)': {
'+layout.tsx': mockView(['RootQuery']),
'+layout.gql': mockQuery('RootQuery'),
nested: {
'+page.gql': mockQuery('FinalQuery', true),
'+page.tsx': mockView(['FinalQuery']),
},
},
},
})

expect(
await load_manifest({
config,
})
).toMatchInlineSnapshot(`
{
"pages": {
"_0_3subRoute_4_0nested": {
"id": "_0_3subRoute_4_0nested",
"queries": [
"FinalQuery"
],
"url": "/(subRoute)/nested",
"layouts": [
"_0",
"_0_3subRoute_4"
],
"path": "(subRoute)/nested/+page.tsx"
}
},
"layouts": {
"_0": {
"id": "_0",
"queries": [],
"url": "/",
"layouts": [],
"path": "+layout.tsx"
},
"_0_3subRoute_4": {
"id": "_0_3subRoute_4",
"queries": [
"RootQuery"
],
"url": "/(subRoute)/",
"layouts": [
"_0"
],
"path": "(subRoute)/+layout.tsx"
}
},
"page_queries": {
"_0_3subRoute_4_0nested": {
"path": "(subRoute)/nested/+page.gql",
"name": "FinalQuery",
"url": "/(subRoute)/nested/",
"loading": true
}
},
"layout_queries": {
"_0_3subRoute_4": {
"path": "(subRoute)/+layout.gql",
"name": "RootQuery",
"url": "/(subRoute)/",
"loading": false
}
}
}
`)
})

test('nested route structure happy path', async function () {
const config = await test_config()

Expand Down Expand Up @@ -59,115 +137,115 @@ test('nested route structure happy path', async function () {
).resolves.toMatchInlineSnapshot(`
{
"pages": {
"__": {
"id": "__",
"_0": {
"id": "_0",
"queries": [
"RootQuery"
],
"url": "/",
"layouts": [
"__"
"_0"
],
"path": "+page.tsx"
},
"__subRoute": {
"id": "__subRoute",
"_0subRoute": {
"id": "_0subRoute",
"queries": [
"SubQuery",
"RootQuery"
],
"url": "/subRoute",
"layouts": [
"__",
"__subRoute"
"_0",
"_0subRoute"
],
"path": "subRoute/+page.jsx"
},
"__another": {
"id": "__another",
"_0another": {
"id": "_0another",
"queries": [
"MyQuery",
"MyLayoutQuery"
],
"url": "/another",
"layouts": [
"__",
"__another"
"_0",
"_0another"
],
"path": "another/+page.tsx"
},
"__subRoute__nested": {
"id": "__subRoute__nested",
"_0subRoute_0nested": {
"id": "_0subRoute_0nested",
"queries": [
"FinalQuery"
],
"url": "/subRoute/nested",
"layouts": [
"__",
"__subRoute"
"_0",
"_0subRoute"
],
"path": "subRoute/nested/+page.tsx"
}
},
"layouts": {
"__": {
"id": "__",
"_0": {
"id": "_0",
"queries": [],
"url": "/",
"layouts": [],
"path": "+layout.tsx"
},
"__another": {
"id": "__another",
"_0another": {
"id": "_0another",
"queries": [
"RootQuery"
],
"url": "/another/",
"layouts": [
"__"
"_0"
],
"path": "another/+layout.tsx"
},
"__subRoute": {
"id": "__subRoute",
"_0subRoute": {
"id": "_0subRoute",
"queries": [
"RootQuery"
],
"url": "/subRoute/",
"layouts": [
"__"
"_0"
],
"path": "subRoute/+layout.tsx"
}
},
"page_queries": {
"__another": {
"_0another": {
"path": "another/+page.gql",
"name": "MyQuery",
"url": "/another/",
"loading": false
},
"__subRoute__nested": {
"_0subRoute_0nested": {
"path": "subRoute/nested/+page.gql",
"name": "FinalQuery",
"url": "/subRoute/nested/",
"loading": true
}
},
"layout_queries": {
"__": {
"_0": {
"path": "+layout.gql",
"name": "RootQuery",
"url": "/",
"loading": true
},
"__another": {
"_0another": {
"path": "another/+layout.gql",
"name": "MyLayoutQuery",
"url": "/another/",
"loading": false
},
"__subRoute": {
"_0subRoute": {
"path": "subRoute/+layout.gql",
"name": "SubQuery",
"url": "/subRoute/",
Expand Down
2 changes: 1 addition & 1 deletion packages/houdini-react/src/plugin/codegen/manifest.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -296,7 +296,7 @@ export async function extractQueries(source: string): Promise<string[]> {
throw new Error('Props should be specified as an object pattern.')
}
} else {
throw new Error('Default export function has no arguments.')
return []
}

return props.filter((p) => p !== 'children')
Expand Down

0 comments on commit 4a30b1a

Please sign in to comment.