create-fate 1.0.0 → 1.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/templates/fate/drizzle/AGENTS.md +1 -1
- package/templates/fate/drizzle/README.md +3 -3
- package/templates/fate/drizzle/client/package.json +2 -2
- package/templates/fate/drizzle/client/pages/layout.tsx +21 -29
- package/templates/fate/drizzle/client/src/ui/Header.tsx +13 -11
- package/templates/fate/drizzle/server/src/drizzle/seedData.ts +2 -2
- package/templates/fate/http/AGENTS.md +1 -1
- package/templates/fate/http/README.md +3 -3
- package/templates/fate/http/client/package.json +2 -2
- package/templates/fate/http/client/pages/layout.tsx +21 -29
- package/templates/fate/http/client/src/ui/Header.tsx +13 -11
- package/templates/fate/http/server/src/drizzle/seedData.ts +2 -2
- package/templates/fate/prisma/AGENTS.md +1 -1
- package/templates/fate/prisma/README.md +2 -2
- package/templates/fate/prisma/client/package.json +2 -2
- package/templates/fate/prisma/client/pages/layout.tsx +21 -29
- package/templates/fate/prisma/client/src/ui/Header.tsx +13 -11
- package/templates/fate/prisma/server/src/prisma/seedData.ts +2 -2
- package/templates/fate/void/README.md +4 -4
- package/templates/fate/void/db/migrations/20260508120500_seed_void_demo.sql +3 -3
- package/templates/fate/void/package.json +2 -2
- package/templates/fate/void/seedData.ts +3 -3
- package/templates/fate/void/src/ui/Header.tsx +11 -11
package/package.json
CHANGED
|
@@ -26,7 +26,7 @@ This guidance is for agents working in projects bootstrapped from the fate templ
|
|
|
26
26
|
- **Do not duplicate types:** Keep generated tRPC types and views imported from the server package. Avoid redefining entity shapes on the client. This ensures view selections stay type-safe end-to-end.
|
|
27
27
|
- **`useRequest` only at the root:** When adding routes or layouts, create a dedicated `useRequest` call per screen root that pulls together all child views; do not scatter `useRequest` across leaf components unless it's necessary to issue requests due to user input.
|
|
28
28
|
- **React Actions:** Prefer React Action-friendly UI primitives (buttons/forms that accept an `action` prop). If unavailable, wrap action calls with `startTransition` in `onClick` handlers.
|
|
29
|
-
- **
|
|
29
|
+
- **fate client support** fate's local client support files are maintained by the Vite/fate tooling. Do not manually edit `.fate` files; make the proper schema changes on the server and run `pnpm fate:generate` when working outside Vite dev.
|
|
30
30
|
- **Library Versions:** This repository uses the most recent releases of React, fate, Vite, tRPC, and more. You might not know about the new releases yet, please don't get confused. The versions you see are real, and there are no feature or version mismatches. You can search the internet for more information about them.
|
|
31
31
|
|
|
32
32
|
Full documentation can be found on the filesystem at `./client/node_modules/react-fate/README.md` or online at [fate.technology](https://fate.technology/).
|
|
@@ -83,7 +83,7 @@ CREATE DATABASE fate;
|
|
|
83
83
|
ALTER DATABASE fate OWNER TO fate;
|
|
84
84
|
```
|
|
85
85
|
|
|
86
|
-
Then set up the schema, seed data, translations, and
|
|
86
|
+
Then set up the schema, seed data, translations, and fate client support:
|
|
87
87
|
|
|
88
88
|
```bash
|
|
89
89
|
vp run dev:setup
|
|
@@ -104,8 +104,8 @@ Common commands from the project root:
|
|
|
104
104
|
- `vp run dev` starts the client and server together.
|
|
105
105
|
- `vp run dev:client` starts only the client.
|
|
106
106
|
- `vp run dev:server` starts only the server.
|
|
107
|
-
- `vp run dev:setup` pushes the Drizzle schema, seeds the database, runs fbtee setup, and
|
|
108
|
-
- `vp run fate:generate`
|
|
107
|
+
- `vp run dev:setup` pushes the Drizzle schema, seeds the database, runs fbtee setup, and prepares fate client support.
|
|
108
|
+
- `vp run fate:generate` refreshes fate client support after changing server views, roots, or routers.
|
|
109
109
|
- `vp run drizzle` opens Drizzle Kit commands for the server package.
|
|
110
110
|
- `vp check --fix` formats, lints, and type-checks the workspace.
|
|
111
111
|
- `vp test` runs the test suite.
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
"@nkzw/stack": "^2.3.2",
|
|
24
24
|
"@radix-ui/react-slot": "^1.2.4",
|
|
25
25
|
"@trpc/client": "^11.17.0",
|
|
26
|
-
"@void/react": "^0.7.
|
|
26
|
+
"@void/react": "^0.7.6",
|
|
27
27
|
"better-auth": "^1.6.9",
|
|
28
28
|
"class-variance-authority": "^0.7.1",
|
|
29
29
|
"clsx": "^2.1.1",
|
|
@@ -34,7 +34,7 @@
|
|
|
34
34
|
"react-error-boundary": "^6.1.1",
|
|
35
35
|
"react-fate": "latest",
|
|
36
36
|
"tailwind-merge": "^3.5.0",
|
|
37
|
-
"void": "^0.7.
|
|
37
|
+
"void": "^0.7.6"
|
|
38
38
|
},
|
|
39
39
|
"devDependencies": {
|
|
40
40
|
"@nkzw/babel-preset-fbtee": "^1.7.4",
|
|
@@ -67,38 +67,30 @@ export default function Layout({ children }: { children: ReactNode }) {
|
|
|
67
67
|
[userId],
|
|
68
68
|
);
|
|
69
69
|
|
|
70
|
-
if (isPending) {
|
|
71
|
-
return (
|
|
72
|
-
<LocaleContext>
|
|
73
|
-
<div className="min-h-screen bg-background text-foreground">
|
|
74
|
-
<div className="min-h-screen bg-[radial-gradient(circle_at_20%_20%,rgba(59,130,246,0.08),transparent_35%),radial-gradient(circle_at_80%_0,rgba(99,102,241,0.08),transparent_28%)]">
|
|
75
|
-
<Thinking />
|
|
76
|
-
</div>
|
|
77
|
-
</div>
|
|
78
|
-
</LocaleContext>
|
|
79
|
-
);
|
|
80
|
-
}
|
|
81
|
-
|
|
82
70
|
return (
|
|
83
71
|
<LocaleContext>
|
|
84
|
-
<
|
|
85
|
-
<div className="min-h-screen bg-
|
|
86
|
-
<
|
|
87
|
-
|
|
88
|
-
<
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
72
|
+
<div className="min-h-screen bg-background text-foreground">
|
|
73
|
+
<div className="min-h-screen bg-[radial-gradient(circle_at_20%_20%,rgba(59,130,246,0.08),transparent_35%),radial-gradient(circle_at_80%_0,rgba(99,102,241,0.08),transparent_28%)]">
|
|
74
|
+
<Header />
|
|
75
|
+
{isPending ? (
|
|
76
|
+
<Thinking />
|
|
77
|
+
) : (
|
|
78
|
+
<FateClient client={fate} key={userId}>
|
|
79
|
+
<ErrorBoundary
|
|
80
|
+
fallbackRender={({ error }) => (
|
|
81
|
+
<Section>
|
|
82
|
+
<Card>
|
|
83
|
+
<Error error={error} />
|
|
84
|
+
</Card>
|
|
85
|
+
</Section>
|
|
86
|
+
)}
|
|
87
|
+
>
|
|
88
|
+
<Suspense fallback={<Thinking />}>{children}</Suspense>
|
|
89
|
+
</ErrorBoundary>
|
|
90
|
+
</FateClient>
|
|
91
|
+
)}
|
|
100
92
|
</div>
|
|
101
|
-
</
|
|
93
|
+
</div>
|
|
102
94
|
</LocaleContext>
|
|
103
95
|
);
|
|
104
96
|
}
|
|
@@ -65,9 +65,9 @@ export default function Header() {
|
|
|
65
65
|
</span>
|
|
66
66
|
</Link>
|
|
67
67
|
</Button>
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
<Button asChild size="sm" variant="ghost">
|
|
68
|
+
<div className="flex w-9 justify-end sm:w-24">
|
|
69
|
+
{session ? (
|
|
70
|
+
<Button asChild className="w-full" size="sm" variant="ghost">
|
|
71
71
|
<Stack
|
|
72
72
|
alignCenter
|
|
73
73
|
as="a"
|
|
@@ -81,14 +81,16 @@ export default function Header() {
|
|
|
81
81
|
</span>
|
|
82
82
|
</Stack>
|
|
83
83
|
</Button>
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
</
|
|
90
|
-
|
|
91
|
-
|
|
84
|
+
) : !isPending ? (
|
|
85
|
+
<Button asChild className="w-full" size="sm" variant="ghost">
|
|
86
|
+
<Link to="/login">
|
|
87
|
+
<LogIn className="h-4 w-4" /> <fbt desc="Login button">Login</fbt>
|
|
88
|
+
</Link>
|
|
89
|
+
</Button>
|
|
90
|
+
) : (
|
|
91
|
+
<div aria-hidden className="h-9 w-full" />
|
|
92
|
+
)}
|
|
93
|
+
</div>
|
|
92
94
|
</Stack>
|
|
93
95
|
</Stack>
|
|
94
96
|
</header>
|
|
@@ -126,7 +126,7 @@ export const posts = [
|
|
|
126
126
|
{
|
|
127
127
|
authorEmail: 'alex@example.com',
|
|
128
128
|
content:
|
|
129
|
-
'The launch post introduced fate with tRPC, but the repo now includes a native HTTP transport too. The
|
|
129
|
+
'The launch post introduced fate with tRPC, but the repo now includes a native HTTP transport too. The Vite plugin wires the client to a fate endpoint, sends requests through the protocol package, and uses GET and POST routes for live updates.',
|
|
130
130
|
likes: 88,
|
|
131
131
|
title: 'Native HTTP transport after the alpha launch',
|
|
132
132
|
},
|
|
@@ -191,7 +191,7 @@ export const comments = [
|
|
|
191
191
|
'The stable ref change sounds small, but it explains a lot of the rerender fixes in the history.',
|
|
192
192
|
'I used the strict selection post to explain why overfetching is not just a network problem.',
|
|
193
193
|
'The native protocol should make it easier to build examples outside of Hono and tRPC.',
|
|
194
|
-
'The Vite plugin note clarifies
|
|
194
|
+
'The Vite plugin note clarifies how fate connects the client APIs without making codegen part of the app workflow.',
|
|
195
195
|
'The migration sequence matches how we would try this inside an existing dashboard.',
|
|
196
196
|
'The comments list is long enough now to exercise load-more behavior without creating fake lorem ipsum.',
|
|
197
197
|
'Seeing optimistic actions and live updates use the same normalized cache is the key idea.',
|
|
@@ -26,7 +26,7 @@ This guidance is for agents working in projects bootstrapped from the fate templ
|
|
|
26
26
|
- **Do not duplicate types:** Keep generated fate types and views imported from the server package. Avoid redefining entity shapes on the client. This ensures view selections stay type-safe end-to-end.
|
|
27
27
|
- **`useRequest` only at the root:** When adding routes or layouts, create a dedicated `useRequest` call per screen root that pulls together all child views; do not scatter `useRequest` across leaf components unless it's necessary to issue requests due to user input.
|
|
28
28
|
- **React Actions:** Prefer React Action-friendly UI primitives (buttons/forms that accept an `action` prop). If unavailable, wrap action calls with `startTransition` in `onClick` handlers.
|
|
29
|
-
- **
|
|
29
|
+
- **fate client support** fate's local client support files are maintained by the Vite/fate tooling. Do not manually edit `.fate` files; make the proper schema changes on the server and run `pnpm fate:generate` when working outside Vite dev.
|
|
30
30
|
- **Library Versions:** This repository uses the most recent releases of React, fate, Vite, and more. You might not know about the new releases yet, please don't get confused. The versions you see are real, and there are no feature or version mismatches. You can search the internet for more information about them.
|
|
31
31
|
|
|
32
32
|
Full documentation can be found on the filesystem at `./client/node_modules/react-fate/README.md` or online at [fate.technology](https://fate.technology/).
|
|
@@ -83,7 +83,7 @@ CREATE DATABASE fate;
|
|
|
83
83
|
ALTER DATABASE fate OWNER TO fate;
|
|
84
84
|
```
|
|
85
85
|
|
|
86
|
-
Then set up the schema, seed data, translations, and
|
|
86
|
+
Then set up the schema, seed data, translations, and fate client support:
|
|
87
87
|
|
|
88
88
|
```bash
|
|
89
89
|
vp run dev:setup
|
|
@@ -104,8 +104,8 @@ Common commands from the project root:
|
|
|
104
104
|
- `vp run dev` starts the client and server together.
|
|
105
105
|
- `vp run dev:client` starts only the client.
|
|
106
106
|
- `vp run dev:server` starts only the server.
|
|
107
|
-
- `vp run dev:setup` pushes the Drizzle schema, seeds the database, runs fbtee setup, and
|
|
108
|
-
- `vp run fate:generate`
|
|
107
|
+
- `vp run dev:setup` pushes the Drizzle schema, seeds the database, runs fbtee setup, and prepares fate client support.
|
|
108
|
+
- `vp run fate:generate` refreshes fate client support after changing server views, roots, or mutations.
|
|
109
109
|
- `vp run drizzle` opens Drizzle Kit commands for the server package.
|
|
110
110
|
- `vp check --fix` formats, lints, and type-checks the workspace.
|
|
111
111
|
- `vp test` runs the test suite.
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
"@nkzw/define-env": "^1.1.0",
|
|
23
23
|
"@nkzw/stack": "^2.3.2",
|
|
24
24
|
"@radix-ui/react-slot": "^1.2.4",
|
|
25
|
-
"@void/react": "^0.7.
|
|
25
|
+
"@void/react": "^0.7.6",
|
|
26
26
|
"better-auth": "^1.6.9",
|
|
27
27
|
"class-variance-authority": "^0.7.1",
|
|
28
28
|
"clsx": "^2.1.1",
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
"react-error-boundary": "^6.1.1",
|
|
34
34
|
"react-fate": "latest",
|
|
35
35
|
"tailwind-merge": "^3.5.0",
|
|
36
|
-
"void": "^0.7.
|
|
36
|
+
"void": "^0.7.6"
|
|
37
37
|
},
|
|
38
38
|
"devDependencies": {
|
|
39
39
|
"@nkzw/babel-preset-fbtee": "^1.7.4",
|
|
@@ -52,38 +52,30 @@ export default function Layout({ children }: { children: ReactNode }) {
|
|
|
52
52
|
[userId],
|
|
53
53
|
);
|
|
54
54
|
|
|
55
|
-
if (isPending) {
|
|
56
|
-
return (
|
|
57
|
-
<LocaleContext>
|
|
58
|
-
<div className="min-h-screen bg-background text-foreground">
|
|
59
|
-
<div className="min-h-screen bg-[radial-gradient(circle_at_20%_20%,rgba(59,130,246,0.08),transparent_35%),radial-gradient(circle_at_80%_0,rgba(99,102,241,0.08),transparent_28%)]">
|
|
60
|
-
<Thinking />
|
|
61
|
-
</div>
|
|
62
|
-
</div>
|
|
63
|
-
</LocaleContext>
|
|
64
|
-
);
|
|
65
|
-
}
|
|
66
|
-
|
|
67
55
|
return (
|
|
68
56
|
<LocaleContext>
|
|
69
|
-
<
|
|
70
|
-
<div className="min-h-screen bg-
|
|
71
|
-
<
|
|
72
|
-
|
|
73
|
-
<
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
57
|
+
<div className="min-h-screen bg-background text-foreground">
|
|
58
|
+
<div className="min-h-screen bg-[radial-gradient(circle_at_20%_20%,rgba(59,130,246,0.08),transparent_35%),radial-gradient(circle_at_80%_0,rgba(99,102,241,0.08),transparent_28%)]">
|
|
59
|
+
<Header />
|
|
60
|
+
{isPending ? (
|
|
61
|
+
<Thinking />
|
|
62
|
+
) : (
|
|
63
|
+
<FateClient client={fate} key={userId}>
|
|
64
|
+
<ErrorBoundary
|
|
65
|
+
fallbackRender={({ error }) => (
|
|
66
|
+
<Section>
|
|
67
|
+
<Card>
|
|
68
|
+
<Error error={error} />
|
|
69
|
+
</Card>
|
|
70
|
+
</Section>
|
|
71
|
+
)}
|
|
72
|
+
>
|
|
73
|
+
<Suspense fallback={<Thinking />}>{children}</Suspense>
|
|
74
|
+
</ErrorBoundary>
|
|
75
|
+
</FateClient>
|
|
76
|
+
)}
|
|
85
77
|
</div>
|
|
86
|
-
</
|
|
78
|
+
</div>
|
|
87
79
|
</LocaleContext>
|
|
88
80
|
);
|
|
89
81
|
}
|
|
@@ -65,9 +65,9 @@ export default function Header() {
|
|
|
65
65
|
</span>
|
|
66
66
|
</Link>
|
|
67
67
|
</Button>
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
<Button asChild size="sm" variant="ghost">
|
|
68
|
+
<div className="flex w-9 justify-end sm:w-24">
|
|
69
|
+
{session ? (
|
|
70
|
+
<Button asChild className="w-full" size="sm" variant="ghost">
|
|
71
71
|
<Stack
|
|
72
72
|
alignCenter
|
|
73
73
|
as="a"
|
|
@@ -81,14 +81,16 @@ export default function Header() {
|
|
|
81
81
|
</span>
|
|
82
82
|
</Stack>
|
|
83
83
|
</Button>
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
</
|
|
90
|
-
|
|
91
|
-
|
|
84
|
+
) : !isPending ? (
|
|
85
|
+
<Button asChild className="w-full" size="sm" variant="ghost">
|
|
86
|
+
<Link to="/login">
|
|
87
|
+
<LogIn className="h-4 w-4" /> <fbt desc="Login button">Login</fbt>
|
|
88
|
+
</Link>
|
|
89
|
+
</Button>
|
|
90
|
+
) : (
|
|
91
|
+
<div aria-hidden className="h-9 w-full" />
|
|
92
|
+
)}
|
|
93
|
+
</div>
|
|
92
94
|
</Stack>
|
|
93
95
|
</Stack>
|
|
94
96
|
</header>
|
|
@@ -126,7 +126,7 @@ export const posts = [
|
|
|
126
126
|
{
|
|
127
127
|
authorEmail: 'alex@example.com',
|
|
128
128
|
content:
|
|
129
|
-
'The launch post introduced fate with tRPC, but the repo now includes a native HTTP transport too. The
|
|
129
|
+
'The launch post introduced fate with tRPC, but the repo now includes a native HTTP transport too. The Vite plugin wires the client to a fate endpoint, sends requests through the protocol package, and uses GET and POST routes for live updates.',
|
|
130
130
|
likes: 88,
|
|
131
131
|
title: 'Native HTTP transport after the alpha launch',
|
|
132
132
|
},
|
|
@@ -191,7 +191,7 @@ export const comments = [
|
|
|
191
191
|
'The stable ref change sounds small, but it explains a lot of the rerender fixes in the history.',
|
|
192
192
|
'I used the strict selection post to explain why overfetching is not just a network problem.',
|
|
193
193
|
'The native protocol should make it easier to build examples outside of Hono and tRPC.',
|
|
194
|
-
'The Vite plugin note clarifies
|
|
194
|
+
'The Vite plugin note clarifies how fate connects the client APIs without making codegen part of the app workflow.',
|
|
195
195
|
'The migration sequence matches how we would try this inside an existing dashboard.',
|
|
196
196
|
'The comments list is long enough now to exercise load-more behavior without creating fake lorem ipsum.',
|
|
197
197
|
'Seeing optimistic actions and live updates use the same normalized cache is the key idea.',
|
|
@@ -26,7 +26,7 @@ This guidance is for agents working in projects bootstrapped from the fate templ
|
|
|
26
26
|
- **Do not duplicate types:** Keep generated tRPC types and views imported from the server package. Avoid redefining entity shapes on the client. This ensures view selections stay type-safe end-to-end.
|
|
27
27
|
- **`useRequest` only at the root:** When adding routes or layouts, create a dedicated `useRequest` call per screen root that pulls together all child views; do not scatter `useRequest` across leaf components unless it's necessary to issue requests due to user input.
|
|
28
28
|
- **React Actions:** Prefer React Action-friendly UI primitives (buttons/forms that accept an `action` prop). If unavailable, wrap action calls with `startTransition` in `onClick` handlers.
|
|
29
|
-
- **
|
|
29
|
+
- **fate client support** fate's local client support files are maintained by the Vite/fate tooling. Do not manually edit `.fate` files; make the proper schema changes on the server and run `pnpm fate:generate` when working outside Vite dev.
|
|
30
30
|
- **Library Versions:** This repository uses the most recent releases of React, fate, Vite, tRPC, and more. You might not know about the new releases yet, please don't get confused. The versions you see are real, and there are no feature or version mismatches. You can search the internet for more information about them.
|
|
31
31
|
|
|
32
32
|
Full documentation can be found on the filesystem at `./client/node_modules/react-fate/README.md` or online at [fate.technology](https://fate.technology/).
|
|
@@ -118,8 +118,8 @@ Common commands from the project root:
|
|
|
118
118
|
- `vp run dev` starts the client and server together.
|
|
119
119
|
- `vp run dev:client` starts only the client.
|
|
120
120
|
- `vp run dev:server` starts only the server.
|
|
121
|
-
- `vp run dev:setup` generates the Prisma client, runs fbtee setup, and
|
|
122
|
-
- `vp run fate:generate`
|
|
121
|
+
- `vp run dev:setup` generates the Prisma client, runs fbtee setup, and prepares fate client support.
|
|
122
|
+
- `vp run fate:generate` refreshes fate client support after changing server views, roots, or routers.
|
|
123
123
|
- `vp run prisma` runs Prisma CLI commands in the server package.
|
|
124
124
|
- `vp check --fix` formats, lints, and type-checks the workspace.
|
|
125
125
|
- `vp test` runs the test suite.
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
"@nkzw/stack": "^2.3.2",
|
|
24
24
|
"@radix-ui/react-slot": "^1.2.4",
|
|
25
25
|
"@trpc/client": "^11.17.0",
|
|
26
|
-
"@void/react": "^0.7.
|
|
26
|
+
"@void/react": "^0.7.6",
|
|
27
27
|
"better-auth": "^1.6.9",
|
|
28
28
|
"class-variance-authority": "^0.7.1",
|
|
29
29
|
"clsx": "^2.1.1",
|
|
@@ -34,7 +34,7 @@
|
|
|
34
34
|
"react-error-boundary": "^6.1.1",
|
|
35
35
|
"react-fate": "latest",
|
|
36
36
|
"tailwind-merge": "^3.5.0",
|
|
37
|
-
"void": "^0.7.
|
|
37
|
+
"void": "^0.7.6"
|
|
38
38
|
},
|
|
39
39
|
"devDependencies": {
|
|
40
40
|
"@nkzw/babel-preset-fbtee": "^1.7.4",
|
|
@@ -57,38 +57,30 @@ export default function Layout({ children }: { children: ReactNode }) {
|
|
|
57
57
|
[userId],
|
|
58
58
|
);
|
|
59
59
|
|
|
60
|
-
if (isPending) {
|
|
61
|
-
return (
|
|
62
|
-
<LocaleContext>
|
|
63
|
-
<div className="min-h-screen bg-background text-foreground">
|
|
64
|
-
<div className="min-h-screen bg-[radial-gradient(circle_at_20%_20%,rgba(59,130,246,0.08),transparent_35%),radial-gradient(circle_at_80%_0,rgba(99,102,241,0.08),transparent_28%)]">
|
|
65
|
-
<Thinking />
|
|
66
|
-
</div>
|
|
67
|
-
</div>
|
|
68
|
-
</LocaleContext>
|
|
69
|
-
);
|
|
70
|
-
}
|
|
71
|
-
|
|
72
60
|
return (
|
|
73
61
|
<LocaleContext>
|
|
74
|
-
<
|
|
75
|
-
<div className="min-h-screen bg-
|
|
76
|
-
<
|
|
77
|
-
|
|
78
|
-
<
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
62
|
+
<div className="min-h-screen bg-background text-foreground">
|
|
63
|
+
<div className="min-h-screen bg-[radial-gradient(circle_at_20%_20%,rgba(59,130,246,0.08),transparent_35%),radial-gradient(circle_at_80%_0,rgba(99,102,241,0.08),transparent_28%)]">
|
|
64
|
+
<Header />
|
|
65
|
+
{isPending ? (
|
|
66
|
+
<Thinking />
|
|
67
|
+
) : (
|
|
68
|
+
<FateClient client={fate} key={userId}>
|
|
69
|
+
<ErrorBoundary
|
|
70
|
+
fallbackRender={({ error }) => (
|
|
71
|
+
<Section>
|
|
72
|
+
<Card>
|
|
73
|
+
<Error error={error} />
|
|
74
|
+
</Card>
|
|
75
|
+
</Section>
|
|
76
|
+
)}
|
|
77
|
+
>
|
|
78
|
+
<Suspense fallback={<Thinking />}>{children}</Suspense>
|
|
79
|
+
</ErrorBoundary>
|
|
80
|
+
</FateClient>
|
|
81
|
+
)}
|
|
90
82
|
</div>
|
|
91
|
-
</
|
|
83
|
+
</div>
|
|
92
84
|
</LocaleContext>
|
|
93
85
|
);
|
|
94
86
|
}
|
|
@@ -65,9 +65,9 @@ export default function Header() {
|
|
|
65
65
|
</span>
|
|
66
66
|
</Link>
|
|
67
67
|
</Button>
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
<Button asChild size="sm" variant="ghost">
|
|
68
|
+
<div className="flex w-9 justify-end sm:w-24">
|
|
69
|
+
{session ? (
|
|
70
|
+
<Button asChild className="w-full" size="sm" variant="ghost">
|
|
71
71
|
<Stack
|
|
72
72
|
alignCenter
|
|
73
73
|
as="a"
|
|
@@ -81,14 +81,16 @@ export default function Header() {
|
|
|
81
81
|
</span>
|
|
82
82
|
</Stack>
|
|
83
83
|
</Button>
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
</
|
|
90
|
-
|
|
91
|
-
|
|
84
|
+
) : !isPending ? (
|
|
85
|
+
<Button asChild className="w-full" size="sm" variant="ghost">
|
|
86
|
+
<Link to="/login">
|
|
87
|
+
<LogIn className="h-4 w-4" /> <fbt desc="Login button">Login</fbt>
|
|
88
|
+
</Link>
|
|
89
|
+
</Button>
|
|
90
|
+
) : (
|
|
91
|
+
<div aria-hidden className="h-9 w-full" />
|
|
92
|
+
)}
|
|
93
|
+
</div>
|
|
92
94
|
</Stack>
|
|
93
95
|
</Stack>
|
|
94
96
|
</header>
|
|
@@ -126,7 +126,7 @@ export const posts = [
|
|
|
126
126
|
{
|
|
127
127
|
authorEmail: 'alex@example.com',
|
|
128
128
|
content:
|
|
129
|
-
'The launch post introduced fate with tRPC, but the repo now includes a native HTTP transport too. The
|
|
129
|
+
'The launch post introduced fate with tRPC, but the repo now includes a native HTTP transport too. The Vite plugin wires the client to a fate endpoint, sends requests through the protocol package, and uses GET and POST routes for live updates.',
|
|
130
130
|
likes: 88,
|
|
131
131
|
title: 'Native HTTP transport after the alpha launch',
|
|
132
132
|
},
|
|
@@ -191,7 +191,7 @@ export const comments = [
|
|
|
191
191
|
'The stable ref change sounds small, but it explains a lot of the rerender fixes in the history.',
|
|
192
192
|
'I used the strict selection post to explain why overfetching is not just a network problem.',
|
|
193
193
|
'The native protocol should make it easier to build examples outside of Hono and tRPC.',
|
|
194
|
-
'The Vite plugin note clarifies
|
|
194
|
+
'The Vite plugin note clarifies how fate connects the client APIs without making codegen part of the app workflow.',
|
|
195
195
|
'The migration sequence matches how we would try this inside an existing dashboard.',
|
|
196
196
|
'The comments list is long enough now to exercise load-more behavior without creating fake lorem ipsum.',
|
|
197
197
|
'Seeing optimistic actions and live updates use the same normalized cache is the key idea.',
|
|
@@ -25,7 +25,7 @@ Install dependencies:
|
|
|
25
25
|
vp install
|
|
26
26
|
```
|
|
27
27
|
|
|
28
|
-
Set up Void local files, seed the local database, and
|
|
28
|
+
Set up Void local files, seed the local database, and prepare fate client support:
|
|
29
29
|
|
|
30
30
|
```bash
|
|
31
31
|
vp run dev:setup
|
|
@@ -37,16 +37,16 @@ Start the app:
|
|
|
37
37
|
vp run dev
|
|
38
38
|
```
|
|
39
39
|
|
|
40
|
-
The app runs at `http://localhost:6001`.
|
|
40
|
+
The app runs at `http://localhost:6001`. fate RPC requests go to `/fate`; live updates use the SSE route at `/fate-live`.
|
|
41
41
|
|
|
42
42
|
## Development
|
|
43
43
|
|
|
44
44
|
Common commands from the project root:
|
|
45
45
|
|
|
46
46
|
- `vp run dev` starts the Void app.
|
|
47
|
-
- `vp run dev:setup` prepares Void, seeds the local database, and
|
|
47
|
+
- `vp run dev:setup` prepares Void, seeds the local database, and prepares fate client support.
|
|
48
48
|
- `vp run prepare:void` regenerates Void local files.
|
|
49
|
-
- `vp run fate:generate`
|
|
49
|
+
- `vp run fate:generate` refreshes fate client support after changing `src/fate/server.ts` or views.
|
|
50
50
|
- `vp run db:generate` generates Drizzle migration files from `db/schema.ts`.
|
|
51
51
|
- `vp run db:migrate` applies database migrations.
|
|
52
52
|
- `vp run db:seed` seeds the local database.
|
|
@@ -50,7 +50,7 @@ INSERT OR IGNORE INTO Post VALUES('69ad225c-a6d5-4747-8372-5c60da964497','31dc1b
|
|
|
50
50
|
INSERT OR IGNORE INTO Post VALUES('1418a697-43d9-4c3d-8f20-23ea82aa13a9','95212cad-8f8d-4752-90fc-54463b75eb05','useLiveView has the same shape as useView, but it subscribes to updates for the selected object through the native live transport. The client keeps one SSE stream open, sends subscribe and unsubscribe control messages, and merges returned records into the same normalized cache used by requests and mutations. Components keep their view definitions and just opt into live data.',1778241933,'fe785e82-b46b-4b27-b1c6-9e1e1cd6af73',104,'Live views over a single SSE stream',1778241933);
|
|
51
51
|
INSERT OR IGNORE INTO Post VALUES('22c06d32-a442-4cb4-83c3-da9cf6c37e77','95212cad-8f8d-4752-90fc-54463b75eb05','Live list views extend the same idea to connections. When a comment is added, the server can emit a prepend event for Post.comments and fate updates the visible connection without deleting the underlying Comment record. By default, pagination boundaries are respected, and streams like chat can opt into visible insertion. That gives realtime behavior without turning every list into special-case UI code.',1778241933,'138350a3-8b9e-415b-8fcc-5bfaec6751fc',97,'Live list views for active threads',1778241933);
|
|
52
52
|
INSERT OR IGNORE INTO Post VALUES('2a90a86b-fc30-43c6-bdc1-d3f71a65a939','95212cad-8f8d-4752-90fc-54463b75eb05','Deletion events are just as important as updates. If a comment disappears, fate removes the record from the normalized cache and prunes lists or object fields that reference it. The demo comment controls exercise that behavior so the post detail route, live comment list, and comment count stay aligned after a mutation completes.',1778241933,'8f140027-21d9-42d4-87a2-1f180fa2fcf9',64,'Keeping deletions consistent across lists',1778241933);
|
|
53
|
-
INSERT OR IGNORE INTO Post VALUES('d8714b4a-3b36-4529-b806-3e654d0c51fa','1f53b477-1823-4ae2-ad11-38d626f08c45','The launch post introduced fate with tRPC, but the repo now includes a native HTTP transport too. The
|
|
53
|
+
INSERT OR IGNORE INTO Post VALUES('d8714b4a-3b36-4529-b806-3e654d0c51fa','1f53b477-1823-4ae2-ad11-38d626f08c45','The launch post introduced fate with tRPC, but the repo now includes a native HTTP transport too. The Vite plugin wires the client to a fate endpoint, sends requests through the protocol package, and uses GET and POST routes for live updates. tRPC remains a supported adapter, but the core model no longer depends on it.',1778241933,'1c9368f3-8573-4d20-bf92-b4e0004e52fa',88,'Native HTTP transport after the alpha launch',1778241933);
|
|
54
54
|
INSERT OR IGNORE INTO Post VALUES('4b7e1e37-c199-44b3-96af-9591972fc40a','1f53b477-1823-4ae2-ad11-38d626f08c45','The server adapters now cover Prisma and Drizzle with the same data view concepts. Sources describe how to resolve records, fields, lists, counts, and computed values, while fate builds the selected shape for the client. This makes the examples useful for teams with different database layers without changing the React component model.',1778241933,'419d0f1c-00ea-4a9b-baf2-5e90886c0b2e',84,'Prisma and Drizzle source adapters',1778241933);
|
|
55
55
|
INSERT OR IGNORE INTO Post VALUES('cfdacdb3-7ad3-4158-b3fe-4baf6e197e64','1f53b477-1823-4ae2-ad11-38d626f08c45','Arguments are part of request identity, but pagination cursors are merged into the same connection when the user loads another page. This post explains why category filters, search terms, and sort options belong in the cache key while after and before control pagination state. The result follows Relay connection semantics without asking app code to manage query keys.',1778241933,'72ec3c4b-afd4-4096-87de-7d89100a8c1b',73,'Request arguments and connection identity',1778241933);
|
|
56
56
|
INSERT OR IGNORE INTO Post VALUES('38fbdd46-8410-4fc3-888b-bdcc21c1b725','c7e25ec5-66b6-4d5f-93e8-d335b898105b','The code generator is now optional for CI and custom workflows because the Vite plugin handles the common path during development. The plugin generates the typed client from the server surface, keeps imports fresh, and reduces the number of manual setup steps in a new app. It is one of the changes that makes the default template feel much closer to normal Vite development.',1778241933,'ec6a3200-bf9a-4bf3-8de2-5505e95d5f59',91,'The Vite plugin replaces everyday codegen',1778241933);
|
|
@@ -133,7 +133,7 @@ INSERT OR IGNORE INTO `Comment` (`authorId`, `content`, `createdAt`, `id`, `post
|
|
|
133
133
|
INSERT OR IGNORE INTO `Comment` (`authorId`, `content`, `createdAt`, `id`, `postId`) VALUES('1418a697-43d9-4c3d-8f20-23ea82aa13a9','The live deletion path matters for moderation workflows where comments disappear from multiple views.',1778241933,'1cb7fda9-415c-4778-bda4-ae0526555891','72ec3c4b-afd4-4096-87de-7d89100a8c1b');
|
|
134
134
|
INSERT OR IGNORE INTO `Comment` (`authorId`, `content`, `createdAt`, `id`, `postId`) VALUES('cfdacdb3-7ad3-4158-b3fe-4baf6e197e64','The native protocol should make it easier to build examples outside of Hono and tRPC.',1778241933,'d78d4967-544b-4518-ab5b-51aa76d2fe24','ec6a3200-bf9a-4bf3-8de2-5505e95d5f59');
|
|
135
135
|
INSERT OR IGNORE INTO `Comment` (`authorId`, `content`, `createdAt`, `id`, `postId`) VALUES('2a90a86b-fc30-43c6-bdc1-d3f71a65a939','This makes me want a small debugging panel that shows which views selected a field.',1778241933,'e087df50-8e3f-4888-87ac-afe2a0a18be3','5bf6844d-6cef-4a53-b6f3-5860b7ff8dea');
|
|
136
|
-
INSERT OR IGNORE INTO `Comment` (`authorId`, `content`, `createdAt`, `id`, `postId`) VALUES('cfdacdb3-7ad3-4158-b3fe-4baf6e197e64','The Vite plugin note clarifies
|
|
136
|
+
INSERT OR IGNORE INTO `Comment` (`authorId`, `content`, `createdAt`, `id`, `postId`) VALUES('cfdacdb3-7ad3-4158-b3fe-4baf6e197e64','The Vite plugin note clarifies how fate connects the client APIs without making codegen part of the app workflow.',1778241933,'536096f6-67a3-4231-a3f8-2d1d1fd0e91c','e506c96a-80b8-4f41-b91b-cd4a988b3652');
|
|
137
137
|
INSERT OR IGNORE INTO `Comment` (`authorId`, `content`, `createdAt`, `id`, `postId`) VALUES('4b7e1e37-c199-44b3-96af-9591972fc40a','The migration sequence matches how we would try this inside an existing dashboard.',1778241933,'150aaba5-c8dc-47e1-aba5-3f46c03b7823','86e6b2c6-8e37-480d-9c19-de384fa8bbae');
|
|
138
138
|
INSERT OR IGNORE INTO `Comment` (`authorId`, `content`, `createdAt`, `id`, `postId`) VALUES('38fbdd46-8410-4fc3-888b-bdcc21c1b725','The comments list is long enough now to exercise load-more behavior without creating fake lorem ipsum.',1778241933,'c6f80cba-81c9-4517-a0d6-52c4e48b724d','f1faa9f8-f2db-4fd0-8c81-2809d6174611');
|
|
139
139
|
INSERT OR IGNORE INTO `Comment` (`authorId`, `content`, `createdAt`, `id`, `postId`) VALUES('38fbdd46-8410-4fc3-888b-bdcc21c1b725','The category descriptions make the sidebar useful for navigating the demo.',1778241933,'da012227-a918-4e04-af5c-48572c004e35','0e3c60e0-f7a3-4d6b-bdaf-1d7ab5c65035');
|
|
@@ -166,5 +166,5 @@ INSERT OR IGNORE INTO EventAttendee VALUES(1778241933,'014c581d-bc2d-49b6-9450-3
|
|
|
166
166
|
INSERT OR IGNORE INTO EventAttendee VALUES(1778241933,'014c581d-bc2d-49b6-9450-3dd2b5b4a976','4e23e3fb-5863-4ace-8de9-d7417e57367c','Mapping Drizzle relations to source adapters.','GOING','69ad225c-a6d5-4747-8372-5c60da964497');
|
|
167
167
|
INSERT OR IGNORE INTO EventAttendee VALUES(1778241933,'014c581d-bc2d-49b6-9450-3dd2b5b4a976','78280ac4-bbe0-4c93-9d37-64c8f547b30d','Checking how native HTTP fits their deployment.','INTERESTED','d8714b4a-3b36-4529-b806-3e654d0c51fa');
|
|
168
168
|
INSERT OR IGNORE INTO EventAttendee VALUES(1778241933,'955e5ffc-7850-40c1-b645-ee2a9deef723','a06b3618-4149-4678-82b7-f9633f496897','Demoing the Void example home route.','GOING','2a90a86b-fc30-43c6-bdc1-d3f71a65a939');
|
|
169
|
-
INSERT OR IGNORE INTO EventAttendee VALUES(1778241933,'955e5ffc-7850-40c1-b645-ee2a9deef723','7d0906bd-e027-47a0-96e1-9211edfd656d','Testing
|
|
169
|
+
INSERT OR IGNORE INTO EventAttendee VALUES(1778241933,'955e5ffc-7850-40c1-b645-ee2a9deef723','7d0906bd-e027-47a0-96e1-9211edfd656d','Testing fate client wiring in a full-stack app.','GOING','38fbdd46-8410-4fc3-888b-bdcc21c1b725');
|
|
170
170
|
INSERT OR IGNORE INTO EventAttendee VALUES(1778241933,'955e5ffc-7850-40c1-b645-ee2a9deef723','9790adf6-9ba2-4754-b56c-3e664577b463','Watching for SSR and routing integration notes.','INTERESTED','cfdacdb3-7ad3-4158-b3fe-4baf6e197e64');
|
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
"@nkzw/fate": "latest",
|
|
25
25
|
"@nkzw/stack": "^2.3.2",
|
|
26
26
|
"@radix-ui/react-slot": "^1.2.4",
|
|
27
|
-
"@void/react": "^0.7.
|
|
27
|
+
"@void/react": "^0.7.6",
|
|
28
28
|
"better-auth": "^1.6.9",
|
|
29
29
|
"class-variance-authority": "^0.7.1",
|
|
30
30
|
"clsx": "^2.1.1",
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
"react-error-boundary": "^6.1.1",
|
|
36
36
|
"react-fate": "latest",
|
|
37
37
|
"tailwind-merge": "^3.5.0",
|
|
38
|
-
"void": "^0.7.
|
|
38
|
+
"void": "^0.7.6",
|
|
39
39
|
"void-fate": "latest",
|
|
40
40
|
"zod": "^4.4.3"
|
|
41
41
|
},
|
|
@@ -251,7 +251,7 @@ export const posts = [
|
|
|
251
251
|
authorEmail: 'ari@nakazawa.dev',
|
|
252
252
|
category: 'Server Integrations',
|
|
253
253
|
content:
|
|
254
|
-
'The launch post introduced fate with tRPC, but the repo now includes a native HTTP transport too. The
|
|
254
|
+
'The launch post introduced fate with tRPC, but the repo now includes a native HTTP transport too. The Vite plugin wires the client to a fate endpoint, sends requests through the protocol package, and uses GET and POST routes for live updates. tRPC remains a supported adapter, but the core model no longer depends on it.',
|
|
255
255
|
likes: 88,
|
|
256
256
|
tags: ['http-transport', 'server-adapters'],
|
|
257
257
|
title: 'Native HTTP transport after the alpha launch',
|
|
@@ -365,7 +365,7 @@ export const comments = [
|
|
|
365
365
|
'The live deletion path matters for moderation workflows where comments disappear from multiple views.',
|
|
366
366
|
'The native protocol should make it easier to build examples outside of Hono and tRPC.',
|
|
367
367
|
'This makes me want a small debugging panel that shows which views selected a field.',
|
|
368
|
-
'The Vite plugin note clarifies
|
|
368
|
+
'The Vite plugin note clarifies how fate connects the client APIs without making codegen part of the app workflow.',
|
|
369
369
|
'The migration sequence matches how we would try this inside an existing dashboard.',
|
|
370
370
|
'The comments list is long enough now to exercise load-more behavior without creating fake lorem ipsum.',
|
|
371
371
|
'The category descriptions make the sidebar useful for navigating the demo.',
|
|
@@ -510,7 +510,7 @@ export const events = [
|
|
|
510
510
|
userEmail: 'sora@nakazawa.dev',
|
|
511
511
|
},
|
|
512
512
|
{
|
|
513
|
-
notes: 'Testing
|
|
513
|
+
notes: 'Testing fate client wiring in a full-stack app.',
|
|
514
514
|
status: 'GOING',
|
|
515
515
|
userEmail: 'jamal@nakazawa.dev',
|
|
516
516
|
},
|
|
@@ -63,9 +63,9 @@ export default function Header() {
|
|
|
63
63
|
<span className="hidden sm:inline">Search</span>
|
|
64
64
|
</Link>
|
|
65
65
|
</Button>
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
<Button asChild size="sm" variant="ghost">
|
|
66
|
+
<div className="flex w-9 justify-end sm:w-24">
|
|
67
|
+
{session ? (
|
|
68
|
+
<Button asChild className="w-full" size="sm" variant="ghost">
|
|
69
69
|
<Stack
|
|
70
70
|
alignCenter
|
|
71
71
|
as="a"
|
|
@@ -81,14 +81,14 @@ export default function Header() {
|
|
|
81
81
|
<span className="hidden sm:inline">Logout</span>
|
|
82
82
|
</Stack>
|
|
83
83
|
</Button>
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
</
|
|
90
|
-
|
|
91
|
-
|
|
84
|
+
) : (
|
|
85
|
+
<Button asChild className="w-full" size="sm" variant="ghost">
|
|
86
|
+
<Link href="/login">
|
|
87
|
+
<LogIn className="h-4 w-4" /> Login
|
|
88
|
+
</Link>
|
|
89
|
+
</Button>
|
|
90
|
+
)}
|
|
91
|
+
</div>
|
|
92
92
|
</Stack>
|
|
93
93
|
</Stack>
|
|
94
94
|
</header>
|