This commit is contained in:
10
packages/example/src/query/reffuse.ts
Normal file
10
packages/example/src/query/reffuse.ts
Normal file
@@ -0,0 +1,10 @@
|
||||
import { GlobalReffuse } from "@/reffuse"
|
||||
import { Reffuse, ReffuseContext } from "reffuse"
|
||||
import { Uuid4Query } from "./services"
|
||||
|
||||
|
||||
export const QueryContext = ReffuseContext.make<Uuid4Query.Uuid4Query>()
|
||||
|
||||
export const R = new class QueryReffuse extends GlobalReffuse.pipe(
|
||||
Reffuse.withContexts(QueryContext)
|
||||
) {}
|
||||
20
packages/example/src/query/services/Uuid4Query.ts
Normal file
20
packages/example/src/query/services/Uuid4Query.ts
Normal file
@@ -0,0 +1,20 @@
|
||||
import { HttpClient, HttpClientError } from "@effect/platform"
|
||||
import { QueryService } from "@reffuse/extension-query"
|
||||
import { Console, Effect, ParseResult, Schema } from "effect"
|
||||
|
||||
|
||||
export const Result = Schema.Tuple(Schema.String)
|
||||
|
||||
export class Uuid4Query extends QueryService.Tag("Uuid4Query")<Uuid4Query,
|
||||
typeof Result.Type,
|
||||
HttpClientError.HttpClientError | ParseResult.ParseError
|
||||
>() {}
|
||||
|
||||
export const Uuid4QueryLive = QueryService.layer(Uuid4Query, Console.log("Querying...").pipe(
|
||||
Effect.andThen(Effect.sleep("500 millis")),
|
||||
Effect.andThen(HttpClient.get("https://www.uuidtools.com/api/generate/v4")),
|
||||
HttpClient.withTracerPropagation(false),
|
||||
Effect.flatMap(res => res.json),
|
||||
Effect.flatMap(Schema.decodeUnknown(Result)),
|
||||
Effect.scoped,
|
||||
))
|
||||
1
packages/example/src/query/services/index.ts
Normal file
1
packages/example/src/query/services/index.ts
Normal file
@@ -0,0 +1 @@
|
||||
export * as Uuid4Query from "./Uuid4Query"
|
||||
32
packages/example/src/query/views/Uuid4QueryService.tsx
Normal file
32
packages/example/src/query/views/Uuid4QueryService.tsx
Normal file
@@ -0,0 +1,32 @@
|
||||
import { Button, Container, Flex, Text } from "@radix-ui/themes"
|
||||
import * as AsyncData from "@typed/async-data"
|
||||
import { R } from "../reffuse"
|
||||
import { Uuid4Query } from "../services"
|
||||
|
||||
|
||||
export function Uuid4QueryService() {
|
||||
const runSync = R.useRunSync()
|
||||
|
||||
const { state, refresh } = R.useMemo(() => Uuid4Query.Uuid4Query, [])
|
||||
const [queryState] = R.useRefState(state)
|
||||
|
||||
|
||||
return (
|
||||
<Container>
|
||||
<Flex direction="column" align="center" gap="2">
|
||||
<Text>
|
||||
{AsyncData.match(queryState, {
|
||||
NoData: () => "No data yet",
|
||||
Loading: () => "Loading...",
|
||||
Success: (value, { isRefreshing, isOptimistic }) =>
|
||||
`Value: ${value} ${isRefreshing ? "(refreshing)" : ""} ${isOptimistic ? "(optimistic)" : ""}`,
|
||||
Failure: (cause, { isRefreshing }) =>
|
||||
`Error: ${cause} ${isRefreshing ? "(refreshing)" : ""}`,
|
||||
})}
|
||||
</Text>
|
||||
|
||||
<Button onClick={() => runSync(refresh)}>Refresh</Button>
|
||||
</Flex>
|
||||
</Container>
|
||||
)
|
||||
}
|
||||
@@ -19,6 +19,7 @@ import { Route as LazyrefImport } from './routes/lazyref'
|
||||
import { Route as CountImport } from './routes/count'
|
||||
import { Route as BlankImport } from './routes/blank'
|
||||
import { Route as IndexImport } from './routes/index'
|
||||
import { Route as QueryServiceImport } from './routes/query/service'
|
||||
|
||||
// Create/Update Routes
|
||||
|
||||
@@ -70,6 +71,12 @@ const IndexRoute = IndexImport.update({
|
||||
getParentRoute: () => rootRoute,
|
||||
} as any)
|
||||
|
||||
const QueryServiceRoute = QueryServiceImport.update({
|
||||
id: '/service',
|
||||
path: '/service',
|
||||
getParentRoute: () => QueryRoute,
|
||||
} as any)
|
||||
|
||||
// Populate the FileRoutesByPath interface
|
||||
|
||||
declare module '@tanstack/react-router' {
|
||||
@@ -130,20 +137,38 @@ declare module '@tanstack/react-router' {
|
||||
preLoaderRoute: typeof TimeImport
|
||||
parentRoute: typeof rootRoute
|
||||
}
|
||||
'/query/service': {
|
||||
id: '/query/service'
|
||||
path: '/service'
|
||||
fullPath: '/query/service'
|
||||
preLoaderRoute: typeof QueryServiceImport
|
||||
parentRoute: typeof QueryImport
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Create and export the route tree
|
||||
|
||||
interface QueryRouteChildren {
|
||||
QueryServiceRoute: typeof QueryServiceRoute
|
||||
}
|
||||
|
||||
const QueryRouteChildren: QueryRouteChildren = {
|
||||
QueryServiceRoute: QueryServiceRoute,
|
||||
}
|
||||
|
||||
const QueryRouteWithChildren = QueryRoute._addFileChildren(QueryRouteChildren)
|
||||
|
||||
export interface FileRoutesByFullPath {
|
||||
'/': typeof IndexRoute
|
||||
'/blank': typeof BlankRoute
|
||||
'/count': typeof CountRoute
|
||||
'/lazyref': typeof LazyrefRoute
|
||||
'/promise': typeof PromiseRoute
|
||||
'/query': typeof QueryRoute
|
||||
'/query': typeof QueryRouteWithChildren
|
||||
'/tests': typeof TestsRoute
|
||||
'/time': typeof TimeRoute
|
||||
'/query/service': typeof QueryServiceRoute
|
||||
}
|
||||
|
||||
export interface FileRoutesByTo {
|
||||
@@ -152,9 +177,10 @@ export interface FileRoutesByTo {
|
||||
'/count': typeof CountRoute
|
||||
'/lazyref': typeof LazyrefRoute
|
||||
'/promise': typeof PromiseRoute
|
||||
'/query': typeof QueryRoute
|
||||
'/query': typeof QueryRouteWithChildren
|
||||
'/tests': typeof TestsRoute
|
||||
'/time': typeof TimeRoute
|
||||
'/query/service': typeof QueryServiceRoute
|
||||
}
|
||||
|
||||
export interface FileRoutesById {
|
||||
@@ -164,9 +190,10 @@ export interface FileRoutesById {
|
||||
'/count': typeof CountRoute
|
||||
'/lazyref': typeof LazyrefRoute
|
||||
'/promise': typeof PromiseRoute
|
||||
'/query': typeof QueryRoute
|
||||
'/query': typeof QueryRouteWithChildren
|
||||
'/tests': typeof TestsRoute
|
||||
'/time': typeof TimeRoute
|
||||
'/query/service': typeof QueryServiceRoute
|
||||
}
|
||||
|
||||
export interface FileRouteTypes {
|
||||
@@ -180,6 +207,7 @@ export interface FileRouteTypes {
|
||||
| '/query'
|
||||
| '/tests'
|
||||
| '/time'
|
||||
| '/query/service'
|
||||
fileRoutesByTo: FileRoutesByTo
|
||||
to:
|
||||
| '/'
|
||||
@@ -190,6 +218,7 @@ export interface FileRouteTypes {
|
||||
| '/query'
|
||||
| '/tests'
|
||||
| '/time'
|
||||
| '/query/service'
|
||||
id:
|
||||
| '__root__'
|
||||
| '/'
|
||||
@@ -200,6 +229,7 @@ export interface FileRouteTypes {
|
||||
| '/query'
|
||||
| '/tests'
|
||||
| '/time'
|
||||
| '/query/service'
|
||||
fileRoutesById: FileRoutesById
|
||||
}
|
||||
|
||||
@@ -209,7 +239,7 @@ export interface RootRouteChildren {
|
||||
CountRoute: typeof CountRoute
|
||||
LazyrefRoute: typeof LazyrefRoute
|
||||
PromiseRoute: typeof PromiseRoute
|
||||
QueryRoute: typeof QueryRoute
|
||||
QueryRoute: typeof QueryRouteWithChildren
|
||||
TestsRoute: typeof TestsRoute
|
||||
TimeRoute: typeof TimeRoute
|
||||
}
|
||||
@@ -220,7 +250,7 @@ const rootRouteChildren: RootRouteChildren = {
|
||||
CountRoute: CountRoute,
|
||||
LazyrefRoute: LazyrefRoute,
|
||||
PromiseRoute: PromiseRoute,
|
||||
QueryRoute: QueryRoute,
|
||||
QueryRoute: QueryRouteWithChildren,
|
||||
TestsRoute: TestsRoute,
|
||||
TimeRoute: TimeRoute,
|
||||
}
|
||||
@@ -261,13 +291,20 @@ export const routeTree = rootRoute
|
||||
"filePath": "promise.tsx"
|
||||
},
|
||||
"/query": {
|
||||
"filePath": "query.tsx"
|
||||
"filePath": "query.tsx",
|
||||
"children": [
|
||||
"/query/service"
|
||||
]
|
||||
},
|
||||
"/tests": {
|
||||
"filePath": "tests.tsx"
|
||||
},
|
||||
"/time": {
|
||||
"filePath": "time.tsx"
|
||||
},
|
||||
"/query/service": {
|
||||
"filePath": "query/service.tsx",
|
||||
"parent": "/query"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
26
packages/example/src/routes/query/service.tsx
Normal file
26
packages/example/src/routes/query/service.tsx
Normal file
@@ -0,0 +1,26 @@
|
||||
import { QueryContext } from "@/query/reffuse"
|
||||
import { Uuid4Query } from "@/query/services"
|
||||
import { R } from "@/reffuse"
|
||||
import { createFileRoute } from "@tanstack/react-router"
|
||||
import { Effect, Layer } from "effect"
|
||||
import { useMemo } from "react"
|
||||
|
||||
|
||||
export const Route = createFileRoute("/query/service")({
|
||||
component: RouteComponent
|
||||
})
|
||||
|
||||
function RouteComponent() {
|
||||
const context = R.useContext()
|
||||
|
||||
const layer = useMemo(() => Layer.empty.pipe(
|
||||
Layer.provideMerge(Uuid4Query.Uuid4QueryLive),
|
||||
Layer.provide(context)
|
||||
), [])
|
||||
|
||||
return (
|
||||
<QueryContext.Provider layer={layer}>
|
||||
|
||||
</QueryContext.Provider>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user