react-fate 1.0.2 → 1.1.0
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/README.md +354 -2
- package/docs/api/functions/FateClient.md +1 -1
- package/docs/api/functions/clientRoot.md +1 -1
- package/docs/api/functions/createClient.md +8 -4
- package/docs/api/functions/createGraphQLTransport.md +21 -0
- package/docs/api/functions/createHTTPTransport.md +1 -1
- package/docs/api/functions/createTRPCTransport.md +1 -1
- package/docs/api/functions/graphqlMutation.md +39 -0
- package/docs/api/functions/mutation.md +1 -1
- package/docs/api/functions/useFateClient.md +1 -1
- package/docs/api/functions/useListView.md +2 -2
- package/docs/api/functions/useLiveListView.md +2 -2
- package/docs/api/functions/useLiveView.md +1 -1
- package/docs/api/functions/useRequest.md +1 -1
- package/docs/api/functions/useView.md +1 -1
- package/docs/api/functions/view.md +1 -1
- package/docs/api/index.md +11 -0
- package/docs/api/type-aliases/ConnectionRef.md +2 -2
- package/docs/api/type-aliases/FateDehydratedState.md +11 -0
- package/docs/api/type-aliases/GraphQLMutationDefinition.md +19 -0
- package/docs/api/type-aliases/GraphQLMutationInput.md +11 -0
- package/docs/api/type-aliases/GraphQLMutationMap.md +11 -0
- package/docs/api/type-aliases/GraphQLMutationOutput.md +11 -0
- package/docs/api/type-aliases/GraphQLTransportOptions.md +119 -0
- package/docs/api/type-aliases/HydrateOptions.md +7 -0
- package/docs/api/type-aliases/HydrationLimits.md +7 -0
- package/docs/api/type-aliases/InferFateAPI.md +1 -1
- package/docs/api/type-aliases/Pagination.md +39 -0
- package/docs/api/type-aliases/ViewRef.md +1 -1
- package/docs/api/variables/toEntityId.md +1 -1
- package/docs/guide/getting-started.md +1 -1
- package/docs/guide/graphql-integration.md +298 -0
- package/docs/guide/requests.md +52 -0
- package/docs/guide/server-integration.md +2 -1
- package/lib/index.d.mts +7 -9
- package/lib/index.mjs +2 -2
- package/package.json +5 -5
package/README.md
CHANGED
|
@@ -68,7 +68,7 @@ Create a new fate app with Vite+:
|
|
|
68
68
|
vp create fate my-app
|
|
69
69
|
```
|
|
70
70
|
|
|
71
|
-
The template selector can create a Void app with Drizzle, a tRPC app with Drizzle
|
|
71
|
+
The template selector can create a Void app with Drizzle, a tRPC app with Drizzle or Prisma, a GraphQL app with Prisma, or a fate client for an existing GraphQL server. The template sources live in the fate repo under [`packages/create-fate/templates/fate`](https://github.com/nkzw-tech/fate/tree/main/packages/create-fate/templates/fate). They feature modern tools to deliver an incredibly fast development experience.
|
|
72
72
|
|
|
73
73
|
### Manual Installation
|
|
74
74
|
|
|
@@ -549,6 +549,58 @@ try {
|
|
|
549
549
|
|
|
550
550
|
Garbage collection waits for active optimistic updates to settle before sweeping records. This keeps temporary optimistic records and their list positions stable while mutations are still pending.
|
|
551
551
|
|
|
552
|
+
### SSR and Hydration
|
|
553
|
+
|
|
554
|
+
Create a request-scoped fate client on the server, preload the route data, and dehydrate its normalized cache:
|
|
555
|
+
|
|
556
|
+
```tsx
|
|
557
|
+
const fate = createFateClient();
|
|
558
|
+
await fate.request({ post: { id: '12', view: PostView } });
|
|
559
|
+
|
|
560
|
+
return {
|
|
561
|
+
fate: fate.dehydrate(),
|
|
562
|
+
};
|
|
563
|
+
```
|
|
564
|
+
|
|
565
|
+
Transport the returned value through your framework's loader serialization, React Server Component props, or a safely escaped JSON bootstrap script. The snapshot contains plain serializable values, so serializers such as Seroval can carry it without fate-specific integration. Treat the snapshot as opaque: hydrate it through fate rather than reading or editing its internal data.
|
|
566
|
+
|
|
567
|
+
On the browser, hydrate the new client before rendering components that call `useRequest`:
|
|
568
|
+
|
|
569
|
+
```tsx
|
|
570
|
+
const fate = createFateClient();
|
|
571
|
+
fate.hydrate(loaderData.fate);
|
|
572
|
+
|
|
573
|
+
hydrateRoot(
|
|
574
|
+
document,
|
|
575
|
+
<FateClient client={fate}>
|
|
576
|
+
<App />
|
|
577
|
+
</FateClient>,
|
|
578
|
+
);
|
|
579
|
+
```
|
|
580
|
+
|
|
581
|
+
Hydrated `cache-first` requests resolve from the normalized cache without refetching. Hydration restores records, selected-field coverage, root queries, and list pagination state. It intentionally does not restore active requests, subscriptions, retainers, timers, or optimistic mutation state.
|
|
582
|
+
|
|
583
|
+
Snapshots carry a hydration scope and are rejected by clients with a different scope. Generated clients set a stable scope automatically. When constructing a client directly, pass `hydrationScope` and rotate it when deploying an incompatible cache schema or when separating cache namespaces:
|
|
584
|
+
|
|
585
|
+
```tsx
|
|
586
|
+
const fate = createClient({
|
|
587
|
+
hydrationScope: 'storefront-v2',
|
|
588
|
+
// ...
|
|
589
|
+
});
|
|
590
|
+
```
|
|
591
|
+
|
|
592
|
+
Use `hydrationLimits` when an application needs stricter bootstrap payload limits. fate applies conservative defaults for total encoded values, collection sizes, and string lengths.
|
|
593
|
+
|
|
594
|
+
By default, hydration preserves values already present in the browser cache while adding missing server data. Pass `{ merge: 'replace' }` only when the snapshot should authoritatively reset the durable cache:
|
|
595
|
+
|
|
596
|
+
```tsx
|
|
597
|
+
fate.hydrate(loaderData.fate, { merge: 'replace' });
|
|
598
|
+
```
|
|
599
|
+
|
|
600
|
+
`preserve-existing` recursively combines plain scalar objects while keeping browser values on conflicts. Arrays, dates, entity references, and list windows are atomic: an existing browser value wins as a whole. Replaying a snapshot is safe and does not notify subscribers when durable cache state is unchanged.
|
|
601
|
+
|
|
602
|
+
Do not reuse request-scoped snapshots across users. Dehydrate after awaited route preloading: snapshots are point-in-time values and do not stream cache patches for data that resolves later. Hydration and dehydration reject clients with in-flight requests, so hydrate the initial snapshot before rendering.
|
|
603
|
+
|
|
552
604
|
## List Views
|
|
553
605
|
|
|
554
606
|
### Pagination with `useListView`
|
|
@@ -1201,12 +1253,312 @@ addComment({
|
|
|
1201
1253
|
});
|
|
1202
1254
|
```
|
|
1203
1255
|
|
|
1256
|
+
## GraphQL Integration
|
|
1257
|
+
|
|
1258
|
+
_fate_ can use an existing GraphQL API as its transport. This keeps the React APIs, view composition, normalized cache, masking, requests, list views, live views, and actions the same while replacing the native or tRPC backend with GraphQL operations.
|
|
1259
|
+
|
|
1260
|
+
Use the GraphQL transport when your backend already exposes GraphQL and you want fate's client model without adding fate's native server protocol.
|
|
1261
|
+
|
|
1262
|
+
### Template
|
|
1263
|
+
|
|
1264
|
+
Create a client for an existing GraphQL server with:
|
|
1265
|
+
|
|
1266
|
+
```bash
|
|
1267
|
+
vp create fate my-app --template graphql-client
|
|
1268
|
+
```
|
|
1269
|
+
|
|
1270
|
+
Create a full GraphQL + Prisma example app with:
|
|
1271
|
+
|
|
1272
|
+
```bash
|
|
1273
|
+
vp create fate my-app --template graphql
|
|
1274
|
+
```
|
|
1275
|
+
|
|
1276
|
+
The client-only template is the smallest reference for the integration. It contains a `src/fate/graphql.ts` file that maps your GraphQL schema to fate views and roots.
|
|
1277
|
+
|
|
1278
|
+
### GraphQL Schema Shape
|
|
1279
|
+
|
|
1280
|
+
The GraphQL transport expects a schema with Relay-style object identity and pagination:
|
|
1281
|
+
|
|
1282
|
+
- Entity objects include `id` and `__typename`.
|
|
1283
|
+
- Object fetches go through a `nodes(ids:)` field.
|
|
1284
|
+
- List fields return Relay connections with `edges`, `cursor`, `node`, and `pageInfo`.
|
|
1285
|
+
- Root queries and mutations return the entity type selected by the fate view.
|
|
1286
|
+
|
|
1287
|
+
For example, a `Post` list can be exposed as a normal GraphQL connection:
|
|
1288
|
+
|
|
1289
|
+
```graphql
|
|
1290
|
+
type Query {
|
|
1291
|
+
posts(first: Int, after: String): PostConnection!
|
|
1292
|
+
viewer: User
|
|
1293
|
+
nodes(ids: [ID!]!): [Node]!
|
|
1294
|
+
}
|
|
1295
|
+
|
|
1296
|
+
type PostConnection {
|
|
1297
|
+
edges: [PostEdge!]!
|
|
1298
|
+
pageInfo: PageInfo!
|
|
1299
|
+
}
|
|
1300
|
+
```
|
|
1301
|
+
|
|
1302
|
+
If your schema uses different root field names, keep the fate names you want on the client and map them with `fateGraphQL.roots`.
|
|
1303
|
+
|
|
1304
|
+
### Mapping Your Schema
|
|
1305
|
+
|
|
1306
|
+
Create a module that exports data views, `Root`, and an optional `fateGraphQL` config. The Vite plugin reads this module during development and build time, generates the client wiring, and leaves your runtime GraphQL server unchanged.
|
|
1307
|
+
|
|
1308
|
+
```tsx
|
|
1309
|
+
import { graphqlMutation } from '@nkzw/fate';
|
|
1310
|
+
import { dataView, list, type Entity } from '@nkzw/fate/server';
|
|
1311
|
+
|
|
1312
|
+
type GraphQLUser = {
|
|
1313
|
+
id: string;
|
|
1314
|
+
name?: string | null;
|
|
1315
|
+
username?: string | null;
|
|
1316
|
+
};
|
|
1317
|
+
|
|
1318
|
+
type GraphQLPost = {
|
|
1319
|
+
author?: GraphQLUser | null;
|
|
1320
|
+
id: string;
|
|
1321
|
+
title: string;
|
|
1322
|
+
};
|
|
1323
|
+
|
|
1324
|
+
export const userDataView = dataView<GraphQLUser>('User')({
|
|
1325
|
+
id: true,
|
|
1326
|
+
name: true,
|
|
1327
|
+
username: true,
|
|
1328
|
+
});
|
|
1329
|
+
|
|
1330
|
+
export const postDataView = dataView<GraphQLPost>('Post')({
|
|
1331
|
+
author: userDataView,
|
|
1332
|
+
id: true,
|
|
1333
|
+
title: true,
|
|
1334
|
+
});
|
|
1335
|
+
|
|
1336
|
+
export type User = Entity<typeof userDataView, 'User'>;
|
|
1337
|
+
export type Post = Entity<
|
|
1338
|
+
typeof postDataView,
|
|
1339
|
+
'Post',
|
|
1340
|
+
{
|
|
1341
|
+
author: User | null;
|
|
1342
|
+
}
|
|
1343
|
+
>;
|
|
1344
|
+
|
|
1345
|
+
export const Root = {
|
|
1346
|
+
posts: list(postDataView),
|
|
1347
|
+
viewer: userDataView,
|
|
1348
|
+
};
|
|
1349
|
+
|
|
1350
|
+
export const fateGraphQL = {
|
|
1351
|
+
roots: {
|
|
1352
|
+
posts: { field: 'posts' },
|
|
1353
|
+
viewer: { field: 'viewer' },
|
|
1354
|
+
},
|
|
1355
|
+
} as const;
|
|
1356
|
+
```
|
|
1357
|
+
|
|
1358
|
+
The data views describe the fields React components are allowed to select. `Root` describes the root operations available to `useRequest`. `fateGraphQL.roots` maps those root names to actual GraphQL fields. If the GraphQL field has the same name as the fate root, the `field` entry can be omitted.
|
|
1359
|
+
|
|
1360
|
+
### Vite Plugin
|
|
1361
|
+
|
|
1362
|
+
Configure the fate Vite plugin with the GraphQL transport and point it at the mapping module:
|
|
1363
|
+
|
|
1364
|
+
```tsx
|
|
1365
|
+
import { fate } from 'react-fate/vite';
|
|
1366
|
+
import { defineConfig } from 'vite';
|
|
1367
|
+
|
|
1368
|
+
export default defineConfig({
|
|
1369
|
+
plugins: [
|
|
1370
|
+
fate({
|
|
1371
|
+
module: './src/fate/graphql.ts',
|
|
1372
|
+
transport: 'graphql',
|
|
1373
|
+
}),
|
|
1374
|
+
],
|
|
1375
|
+
});
|
|
1376
|
+
```
|
|
1377
|
+
|
|
1378
|
+
The plugin generates a typed `createFateClient` helper from your views, roots, and GraphQL mapping. It also watches the mapping module and the files it imports during development.
|
|
1379
|
+
|
|
1380
|
+
### Creating a Client
|
|
1381
|
+
|
|
1382
|
+
Create the client with your GraphQL endpoint and provide it through the `FateClient` provider:
|
|
1383
|
+
|
|
1384
|
+
```tsx
|
|
1385
|
+
import { FateClient } from 'react-fate';
|
|
1386
|
+
import { createFateClient } from 'react-fate/client';
|
|
1387
|
+
|
|
1388
|
+
const fate = createFateClient({
|
|
1389
|
+
headers: () => ({
|
|
1390
|
+
authorization: `Bearer ${token}`,
|
|
1391
|
+
}),
|
|
1392
|
+
url: 'https://api.example.com/graphql',
|
|
1393
|
+
});
|
|
1394
|
+
|
|
1395
|
+
export function App() {
|
|
1396
|
+
return <FateClient client={fate}>{/* Components go here */}</FateClient>;
|
|
1397
|
+
}
|
|
1398
|
+
```
|
|
1399
|
+
|
|
1400
|
+
Use `fetch` when you need to customize credentials or reuse an application fetch wrapper:
|
|
1401
|
+
|
|
1402
|
+
```tsx
|
|
1403
|
+
const fate = createFateClient({
|
|
1404
|
+
fetch: (input, init) =>
|
|
1405
|
+
fetch(input, {
|
|
1406
|
+
...init,
|
|
1407
|
+
credentials: 'include',
|
|
1408
|
+
}),
|
|
1409
|
+
url: `${env('SERVER_URL')}/graphql`,
|
|
1410
|
+
});
|
|
1411
|
+
```
|
|
1412
|
+
|
|
1413
|
+
GraphQL operations issued in the same microtask are batched into a single GraphQL query or mutation document with aliased fields.
|
|
1414
|
+
|
|
1415
|
+
### Object IDs
|
|
1416
|
+
|
|
1417
|
+
The transport converts between fate entity IDs and GraphQL node IDs. By default, it sends IDs as `${type}-${id}` and strips that prefix from returned IDs. Override this if your schema uses Relay global IDs, raw database IDs, or another encoding:
|
|
1418
|
+
|
|
1419
|
+
```tsx
|
|
1420
|
+
const fate = createFateClient({
|
|
1421
|
+
decodeNodeId: (type, id) => {
|
|
1422
|
+
const [nodeType, nodeId] = atob(String(id)).split(':');
|
|
1423
|
+
if (nodeType !== type) {
|
|
1424
|
+
throw new Error(`Expected a ${type} node id.`);
|
|
1425
|
+
}
|
|
1426
|
+
return nodeId;
|
|
1427
|
+
},
|
|
1428
|
+
encodeNodeId: (type, id) => btoa(`${type}:${id}`),
|
|
1429
|
+
url: '/graphql',
|
|
1430
|
+
});
|
|
1431
|
+
```
|
|
1432
|
+
|
|
1433
|
+
If your GraphQL API already accepts and returns the same IDs you use in the app, return `id` from both functions.
|
|
1434
|
+
|
|
1435
|
+
### Requests and Arguments
|
|
1436
|
+
|
|
1437
|
+
Client code keeps using `useRequest` with the same shape as the other transports:
|
|
1438
|
+
|
|
1439
|
+
```tsx
|
|
1440
|
+
const { posts, viewer } = useRequest({
|
|
1441
|
+
posts: {
|
|
1442
|
+
args: { first: 10 },
|
|
1443
|
+
list: PostView,
|
|
1444
|
+
},
|
|
1445
|
+
viewer: { view: UserView },
|
|
1446
|
+
});
|
|
1447
|
+
```
|
|
1448
|
+
|
|
1449
|
+
Root arguments are sent to the root GraphQL field. Nested relation arguments are scoped by relation name:
|
|
1450
|
+
|
|
1451
|
+
```tsx
|
|
1452
|
+
const { posts } = useRequest({
|
|
1453
|
+
posts: {
|
|
1454
|
+
args: {
|
|
1455
|
+
comments: { first: 3 },
|
|
1456
|
+
first: 10,
|
|
1457
|
+
},
|
|
1458
|
+
list: PostWithCommentsView,
|
|
1459
|
+
},
|
|
1460
|
+
});
|
|
1461
|
+
```
|
|
1462
|
+
|
|
1463
|
+
This produces a root `posts(first: 10)` field and a nested `comments(first: 3)` field in the generated GraphQL selection.
|
|
1464
|
+
|
|
1465
|
+
### Mutations
|
|
1466
|
+
|
|
1467
|
+
Map fate mutation names to GraphQL mutation fields with `graphqlMutation`:
|
|
1468
|
+
|
|
1469
|
+
```tsx
|
|
1470
|
+
export const fateGraphQL = {
|
|
1471
|
+
mutations: {
|
|
1472
|
+
'post.like': graphqlMutation<Post, { id: string }, Post>('Post', {
|
|
1473
|
+
field: 'postLike',
|
|
1474
|
+
}),
|
|
1475
|
+
},
|
|
1476
|
+
roots: {
|
|
1477
|
+
posts: { field: 'posts' },
|
|
1478
|
+
},
|
|
1479
|
+
} as const;
|
|
1480
|
+
```
|
|
1481
|
+
|
|
1482
|
+
By default, the input is sent as an `input` argument:
|
|
1483
|
+
|
|
1484
|
+
```graphql
|
|
1485
|
+
mutation {
|
|
1486
|
+
postLike(input: { id: "12" }) {
|
|
1487
|
+
id
|
|
1488
|
+
likes
|
|
1489
|
+
}
|
|
1490
|
+
}
|
|
1491
|
+
```
|
|
1492
|
+
|
|
1493
|
+
Use `inputArg` when your schema uses a different argument name, or `inputArg: false` when the input object should be spread into field arguments:
|
|
1494
|
+
|
|
1495
|
+
```tsx
|
|
1496
|
+
export const fateGraphQL = {
|
|
1497
|
+
mutations: {
|
|
1498
|
+
'post.like': graphqlMutation<Post, { id: string }, Post>('Post', {
|
|
1499
|
+
field: 'likePost',
|
|
1500
|
+
inputArg: 'payload',
|
|
1501
|
+
}),
|
|
1502
|
+
'user.follow': graphqlMutation<User, { id: string }, User>('User', {
|
|
1503
|
+
field: 'followUser',
|
|
1504
|
+
inputArg: false,
|
|
1505
|
+
}),
|
|
1506
|
+
},
|
|
1507
|
+
} as const;
|
|
1508
|
+
```
|
|
1509
|
+
|
|
1510
|
+
Actions use the same `mutation(...)` and `useActionState` APIs described in the [Actions Guide](/docs/guide/actions.md).
|
|
1511
|
+
|
|
1512
|
+
### Live Views
|
|
1513
|
+
|
|
1514
|
+
GraphQL live views use [GraphQL SSE](https://github.com/enisdenjo/graphql-sse). Install `graphql-sse` in the client package and leave `live` enabled, or pass `live: false` when your schema does not support subscriptions.
|
|
1515
|
+
|
|
1516
|
+
```tsx
|
|
1517
|
+
const fate = createFateClient({
|
|
1518
|
+
live: {
|
|
1519
|
+
url: 'https://api.example.com/graphql/stream',
|
|
1520
|
+
},
|
|
1521
|
+
url: 'https://api.example.com/graphql',
|
|
1522
|
+
});
|
|
1523
|
+
```
|
|
1524
|
+
|
|
1525
|
+
The default subscription fields are `fateLiveNode` for `useLiveView` and `fateLiveConnection` for `useLiveListView`. Rename them with `entityField` and `connectionField`:
|
|
1526
|
+
|
|
1527
|
+
```tsx
|
|
1528
|
+
const fate = createFateClient({
|
|
1529
|
+
live: {
|
|
1530
|
+
connectionField: 'liveConnection',
|
|
1531
|
+
entityField: 'liveNode',
|
|
1532
|
+
url: '/graphql/stream',
|
|
1533
|
+
},
|
|
1534
|
+
url: '/graphql',
|
|
1535
|
+
});
|
|
1536
|
+
```
|
|
1537
|
+
|
|
1538
|
+
The live node subscription returns `{ data, delete, id, select }`. The live connection subscription returns events such as `appendNode`, `prependNode`, `deleteEdge`, and `invalidate`. These payloads match fate's live transport events, so the cache update behavior is the same as the native transport.
|
|
1539
|
+
|
|
1540
|
+
If you do not need live views, disable them explicitly:
|
|
1541
|
+
|
|
1542
|
+
```tsx
|
|
1543
|
+
const fate = createFateClient({
|
|
1544
|
+
live: false,
|
|
1545
|
+
url: '/graphql',
|
|
1546
|
+
});
|
|
1547
|
+
```
|
|
1548
|
+
|
|
1549
|
+
### Existing Servers
|
|
1550
|
+
|
|
1551
|
+
The GraphQL transport is intentionally a mapping layer. It does not require `createFateServer`, the Prisma adapter, or the Drizzle adapter. Your GraphQL server remains responsible for authorization, validation, resolver behavior, cursor pagination, and mutation side effects.
|
|
1552
|
+
|
|
1553
|
+
Use data views to expose only the fields the client should be able to select, keep GraphQL schema authorization in your server, and treat `src/fate/graphql.ts` as the contract between your GraphQL API and fate's React client.
|
|
1554
|
+
|
|
1204
1555
|
## Server Integration
|
|
1205
1556
|
|
|
1206
|
-
Until now, we have focused on the client-side API of fate. You'll need a backend that
|
|
1557
|
+
Until now, we have focused on the client-side API of fate. You'll need a backend that can be wired into fate's typed request model so the Vite plugin can connect the typed fate APIs to your app. _fate_ currently ships three integration paths:
|
|
1207
1558
|
|
|
1208
1559
|
- The native fate protocol, which is transport-agnostic and can be hosted by any Fetch-compatible server.
|
|
1209
1560
|
- The tRPC adapter, which keeps compatibility with existing tRPC backends.
|
|
1561
|
+
- The [GraphQL transport](/docs/guide/graphql-integration.md), which maps fate views and roots to an existing GraphQL schema.
|
|
1210
1562
|
|
|
1211
1563
|
_fate_ currently provides database adapters for Prisma and Drizzle, but the framework itself is not coupled to a particular ORM. The adapters plug into the same source execution runtime and can be exposed through the native protocol or through tRPC.
|
|
1212
1564
|
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
> **FateClient**(`__namedParameters`): `Element`
|
|
4
4
|
|
|
5
|
-
Defined in: [packages/react-fate/src/context.tsx:17](https://github.com/nkzw-tech/fate/blob/
|
|
5
|
+
Defined in: [packages/react-fate/src/context.tsx:17](https://github.com/nkzw-tech/fate/blob/b6f90b96eb193852523df58a538c7900829d4862/packages/react-fate/src/context.tsx#L17)
|
|
6
6
|
|
|
7
7
|
Provider component that supplies a configured `FateClient` to React hooks.
|
|
8
8
|
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
# Function: createClient()
|
|
2
2
|
|
|
3
|
-
> **createClient**\<`T`\>(`options`): `FateClient`\<`T`\[`0`\], `T`\[`1`\]
|
|
3
|
+
> **createClient**\<`T`, `HydrationScope`\>(`options`): `FateClient`\<`T`\[`0`\], `T`\[`1`\], `HydrationScope`\>
|
|
4
4
|
|
|
5
|
-
Defined in: packages/fate/lib/
|
|
5
|
+
Defined in: packages/fate/lib/transport-BTgtSwOM.d.mts:934
|
|
6
6
|
|
|
7
7
|
## Type Parameters
|
|
8
8
|
|
|
@@ -10,12 +10,16 @@ Defined in: packages/fate/lib/types-Dz46PXr3.d.mts:973
|
|
|
10
10
|
|
|
11
11
|
`T` *extends* \[`FateRoots`, `FateMutations`\] = \[`Record`\<`never`, `RootDefinition`\<`any`, `any`\>\>, `Record`\<`never`, `MutationDefinition`\<`any`, `any`, `any`\>\>\]
|
|
12
12
|
|
|
13
|
+
### HydrationScope
|
|
14
|
+
|
|
15
|
+
`HydrationScope` *extends* `string` = `string`
|
|
16
|
+
|
|
13
17
|
## Parameters
|
|
14
18
|
|
|
15
19
|
### options
|
|
16
20
|
|
|
17
|
-
`FateClientOptions`\<`T`\[`0`\], `T`\[`1`\]
|
|
21
|
+
`FateClientOptions`\<`T`\[`0`\], `T`\[`1`\], `HydrationScope`\>
|
|
18
22
|
|
|
19
23
|
## Returns
|
|
20
24
|
|
|
21
|
-
`FateClient`\<`T`\[`0`\], `T`\[`1`\]
|
|
25
|
+
`FateClient`\<`T`\[`0`\], `T`\[`1`\], `HydrationScope`\>
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
# Function: createGraphQLTransport()
|
|
2
|
+
|
|
3
|
+
> **createGraphQLTransport**\<`Mutations`\>(`__namedParameters`): `Transport`\<`Mutations`\>
|
|
4
|
+
|
|
5
|
+
Defined in: packages/fate/lib/graphqlTransport-DbRHbYtb.d.mts:62
|
|
6
|
+
|
|
7
|
+
## Type Parameters
|
|
8
|
+
|
|
9
|
+
### Mutations
|
|
10
|
+
|
|
11
|
+
`Mutations` *extends* `TransportMutations` = `EmptyTransportMutations`
|
|
12
|
+
|
|
13
|
+
## Parameters
|
|
14
|
+
|
|
15
|
+
### \_\_namedParameters
|
|
16
|
+
|
|
17
|
+
[`GraphQLTransportOptions`](../type-aliases/GraphQLTransportOptions.md)\<`Mutations`\>
|
|
18
|
+
|
|
19
|
+
## Returns
|
|
20
|
+
|
|
21
|
+
`Transport`\<`Mutations`\>
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
> **createTRPCTransport**\<`AppRouter`, `Mutations`\>(`__namedParameters`): `Transport`\<`MutationMapFromResolvers`\<`Mutations`\>\>
|
|
4
4
|
|
|
5
|
-
Defined in: packages/fate/lib/
|
|
5
|
+
Defined in: packages/fate/lib/transport-BTgtSwOM.d.mts:1399
|
|
6
6
|
|
|
7
7
|
Builds a `Transport` backed by a tRPC client using the configured resolvers
|
|
8
8
|
for by-id queries, lists, and mutations.
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
# Function: graphqlMutation()
|
|
2
|
+
|
|
3
|
+
> **graphqlMutation**\<`T`, `Input`, `Output`\>(`entity`, `options`): [`GraphQLMutationDefinition`](../type-aliases/GraphQLMutationDefinition.md)\<`T`, `Input`, `Output`\>
|
|
4
|
+
|
|
5
|
+
Defined in: packages/fate/lib/graphqlTransport-DbRHbYtb.d.mts:58
|
|
6
|
+
|
|
7
|
+
## Type Parameters
|
|
8
|
+
|
|
9
|
+
### T
|
|
10
|
+
|
|
11
|
+
`T` *extends* `Entity`
|
|
12
|
+
|
|
13
|
+
### Input
|
|
14
|
+
|
|
15
|
+
`Input`
|
|
16
|
+
|
|
17
|
+
### Output
|
|
18
|
+
|
|
19
|
+
`Output`
|
|
20
|
+
|
|
21
|
+
## Parameters
|
|
22
|
+
|
|
23
|
+
### entity
|
|
24
|
+
|
|
25
|
+
`T`\[`"__typename"`\]
|
|
26
|
+
|
|
27
|
+
### options
|
|
28
|
+
|
|
29
|
+
#### field
|
|
30
|
+
|
|
31
|
+
`string`
|
|
32
|
+
|
|
33
|
+
#### inputArg?
|
|
34
|
+
|
|
35
|
+
`string` \| `false`
|
|
36
|
+
|
|
37
|
+
## Returns
|
|
38
|
+
|
|
39
|
+
[`GraphQLMutationDefinition`](../type-aliases/GraphQLMutationDefinition.md)\<`T`, `Input`, `Output`\>
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
> **mutation**\<`T`, `I`, `R`\>(`entity`): `MutationDefinition`\<`T`, `I`, `R`\>
|
|
4
4
|
|
|
5
|
-
Defined in: packages/fate/lib/
|
|
5
|
+
Defined in: packages/fate/lib/transport-BTgtSwOM.d.mts:941
|
|
6
6
|
|
|
7
7
|
Defines a mutation for a given entity type, preserving the input and output
|
|
8
8
|
types for transports.
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
> **useFateClient**\<`T`\>(): `FateClient`\<`T`\[`0`\], `T`\[`1`\]\>
|
|
4
4
|
|
|
5
|
-
Defined in: [packages/react-fate/src/context.tsx:30](https://github.com/nkzw-tech/fate/blob/
|
|
5
|
+
Defined in: [packages/react-fate/src/context.tsx:30](https://github.com/nkzw-tech/fate/blob/b6f90b96eb193852523df58a538c7900829d4862/packages/react-fate/src/context.tsx#L30)
|
|
6
6
|
|
|
7
7
|
Returns the nearest `FateClient` from context.
|
|
8
8
|
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
> **useListView**\<`C`\>(`selection`, `connection`): \[`ConnectionItems`\<`NonNullable`\<`C`\>\>, `LoadMoreFn` \| `null`, `LoadMoreFn` \| `null`\]
|
|
4
4
|
|
|
5
|
-
Defined in: [packages/react-fate/src/useListView.tsx:16](https://github.com/nkzw-tech/fate/blob/
|
|
5
|
+
Defined in: [packages/react-fate/src/useListView.tsx:16](https://github.com/nkzw-tech/fate/blob/b6f90b96eb193852523df58a538c7900829d4862/packages/react-fate/src/useListView.tsx#L16)
|
|
6
6
|
|
|
7
7
|
Subscribes to a connection field, returning the current items and pagination
|
|
8
8
|
helpers to load the next or previous page.
|
|
@@ -11,7 +11,7 @@ helpers to load the next or previous page.
|
|
|
11
11
|
|
|
12
12
|
### C
|
|
13
13
|
|
|
14
|
-
`C` *extends* \{ `items?`: readonly `any`[]; `pagination?`: `Pagination
|
|
14
|
+
`C` *extends* \{ `items?`: readonly `any`[]; `pagination?`: [`Pagination`](../type-aliases/Pagination.md); \} \| `null` \| `undefined`
|
|
15
15
|
|
|
16
16
|
## Parameters
|
|
17
17
|
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
> **useLiveListView**\<`C`\>(`selection`, `connection`): \[`ConnectionItems`\<`NonNullable`\<`C`\>\>, `LoadMoreFn` \| `null`, `LoadMoreFn` \| `null`\]
|
|
4
4
|
|
|
5
|
-
Defined in: [packages/react-fate/src/useLiveListView.tsx:16](https://github.com/nkzw-tech/fate/blob/
|
|
5
|
+
Defined in: [packages/react-fate/src/useLiveListView.tsx:16](https://github.com/nkzw-tech/fate/blob/b6f90b96eb193852523df58a538c7900829d4862/packages/react-fate/src/useLiveListView.tsx#L16)
|
|
6
6
|
|
|
7
7
|
Subscribes to a connection field, returning live-updating items and pagination
|
|
8
8
|
helpers to load the next or previous page.
|
|
@@ -11,7 +11,7 @@ helpers to load the next or previous page.
|
|
|
11
11
|
|
|
12
12
|
### C
|
|
13
13
|
|
|
14
|
-
`C` *extends* \{ `items?`: readonly `any`[]; `pagination?`: `Pagination
|
|
14
|
+
`C` *extends* \{ `items?`: readonly `any`[]; `pagination?`: [`Pagination`](../type-aliases/Pagination.md); \} \| `null` \| `undefined`
|
|
15
15
|
|
|
16
16
|
## Parameters
|
|
17
17
|
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
> **useLiveView**\<`V`, `R`\>(`view`, `ref`): `R` *extends* `null` ? `null` : `Readonly`\<`ViewSelection`\<`V`\> *extends* `Selection`\<`ViewEntityWithTypename`\<`V`\>\> ? `Mask`\<`ViewEntityWithTypename`\<`V`\>, \{ \[K in string \| number \| symbol as K extends "\_\_typename" ? never : K\]?: SelectionFieldValue\<ViewEntityWithTypename\<V\>, K\> \} & `object` & `SelectionViewSpread`\<`ViewEntityWithTypename`\<`V`\>\> & `ViewSelection`\<`V`\>\> : `ViewEntityWithTypename`\<`V`\> & `object`\>
|
|
4
4
|
|
|
5
|
-
Defined in: [packages/react-fate/src/useLiveView.tsx:17](https://github.com/nkzw-tech/fate/blob/
|
|
5
|
+
Defined in: [packages/react-fate/src/useLiveView.tsx:17](https://github.com/nkzw-tech/fate/blob/b6f90b96eb193852523df58a538c7900829d4862/packages/react-fate/src/useLiveView.tsx#L17)
|
|
6
6
|
|
|
7
7
|
Resolves a reference against a view and subscribes to live server updates for
|
|
8
8
|
that selection.
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
> **useRequest**\<`R`, `O`\>(`request`, `options?`): `RequestResult`\<`O`, `R`\>
|
|
4
4
|
|
|
5
|
-
Defined in: [packages/react-fate/src/useRequest.tsx:25](https://github.com/nkzw-tech/fate/blob/
|
|
5
|
+
Defined in: [packages/react-fate/src/useRequest.tsx:25](https://github.com/nkzw-tech/fate/blob/b6f90b96eb193852523df58a538c7900829d4862/packages/react-fate/src/useRequest.tsx#L25)
|
|
6
6
|
|
|
7
7
|
Declares the data a screen needs and kicks off fetching, suspending while the
|
|
8
8
|
request resolves.
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
> **useView**\<`V`, `R`\>(`view`, `ref`): `R` *extends* `null` ? `null` : `Readonly`\<`ViewSelection`\<`V`\> *extends* `Selection`\<`ViewEntityWithTypename`\<`V`\>\> ? `Mask`\<`ViewEntityWithTypename`\<`V`\>, \{ \[K in string \| number \| symbol as K extends "\_\_typename" ? never : K\]?: SelectionFieldValue\<ViewEntityWithTypename\<V\>, K\> \} & `object` & `SelectionViewSpread`\<`ViewEntityWithTypename`\<`V`\>\> & `ViewSelection`\<`V`\>\> : `ViewEntityWithTypename`\<`V`\> & `object`\>
|
|
4
4
|
|
|
5
|
-
Defined in: [packages/react-fate/src/useView.tsx:37](https://github.com/nkzw-tech/fate/blob/
|
|
5
|
+
Defined in: [packages/react-fate/src/useView.tsx:37](https://github.com/nkzw-tech/fate/blob/b6f90b96eb193852523df58a538c7900829d4862/packages/react-fate/src/useView.tsx#L37)
|
|
6
6
|
|
|
7
7
|
Resolves a reference against a view and subscribes to updates for that selection.
|
|
8
8
|
|
package/docs/api/index.md
CHANGED
|
@@ -11,7 +11,16 @@ import { useView, view } from 'react-fate';
|
|
|
11
11
|
## Type Aliases
|
|
12
12
|
|
|
13
13
|
- [ConnectionRef](type-aliases/ConnectionRef.md)
|
|
14
|
+
- [FateDehydratedState](type-aliases/FateDehydratedState.md)
|
|
15
|
+
- [GraphQLMutationDefinition](type-aliases/GraphQLMutationDefinition.md)
|
|
16
|
+
- [GraphQLMutationInput](type-aliases/GraphQLMutationInput.md)
|
|
17
|
+
- [GraphQLMutationMap](type-aliases/GraphQLMutationMap.md)
|
|
18
|
+
- [GraphQLMutationOutput](type-aliases/GraphQLMutationOutput.md)
|
|
19
|
+
- [GraphQLTransportOptions](type-aliases/GraphQLTransportOptions.md)
|
|
20
|
+
- [HydrateOptions](type-aliases/HydrateOptions.md)
|
|
21
|
+
- [HydrationLimits](type-aliases/HydrationLimits.md)
|
|
14
22
|
- [InferFateAPI](type-aliases/InferFateAPI.md)
|
|
23
|
+
- [Pagination](type-aliases/Pagination.md)
|
|
15
24
|
- [ViewRef](type-aliases/ViewRef.md)
|
|
16
25
|
|
|
17
26
|
## Variables
|
|
@@ -22,9 +31,11 @@ import { useView, view } from 'react-fate';
|
|
|
22
31
|
|
|
23
32
|
- [clientRoot](functions/clientRoot.md)
|
|
24
33
|
- [createClient](functions/createClient.md)
|
|
34
|
+
- [createGraphQLTransport](functions/createGraphQLTransport.md)
|
|
25
35
|
- [createHTTPTransport](functions/createHTTPTransport.md)
|
|
26
36
|
- [createTRPCTransport](functions/createTRPCTransport.md)
|
|
27
37
|
- [FateClient](functions/FateClient.md)
|
|
38
|
+
- [graphqlMutation](functions/graphqlMutation.md)
|
|
28
39
|
- [mutation](functions/mutation.md)
|
|
29
40
|
- [useFateClient](functions/useFateClient.md)
|
|
30
41
|
- [useListView](functions/useListView.md)
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
# Type Alias: ConnectionRef\<TName\>
|
|
2
2
|
|
|
3
|
-
> **ConnectionRef**\<`TName`\> = `Readonly`\<\{ `items`: `ReadonlyArray`\<\{ `cursor?`: `string`; `node`: [`ViewRef`](ViewRef.md)\<`TName`\>; \}\>; `pagination?`: `Pagination
|
|
3
|
+
> **ConnectionRef**\<`TName`\> = `Readonly`\<\{ `items`: `ReadonlyArray`\<\{ `cursor?`: `string`; `node`: [`ViewRef`](ViewRef.md)\<`TName`\>; \}\>; `pagination?`: [`Pagination`](Pagination.md); \}\>
|
|
4
4
|
|
|
5
|
-
Defined in: packages/fate/lib/
|
|
5
|
+
Defined in: packages/fate/lib/transport-BTgtSwOM.d.mts:1093
|
|
6
6
|
|
|
7
7
|
Ref for a connection, including pagination metadata.
|
|
8
8
|
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
# Type Alias: FateDehydratedState\<Scope\>
|
|
2
|
+
|
|
3
|
+
> **FateDehydratedState**\<`Scope`\> = `Readonly`\<\{ `[hydrationScopeBrand]?`: `Scope`; `data`: `FateSerializedValue`; `scope`: `Scope`; `version`: `1`; \}\>
|
|
4
|
+
|
|
5
|
+
Defined in: packages/fate/lib/transport-BTgtSwOM.d.mts:685
|
|
6
|
+
|
|
7
|
+
## Type Parameters
|
|
8
|
+
|
|
9
|
+
### Scope
|
|
10
|
+
|
|
11
|
+
`Scope` *extends* `string` = `string`
|