Query service work

packages/example/src/query/reffuse.ts

@@ -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)
+) {}

packages/example/src/query/services/Uuid4Query.ts

@@ -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,
+))

packages/example/src/query/services/index.ts

@@ -0,0 +1 @@
+export * as Uuid4Query from "./Uuid4Query"

packages/example/src/query/views/Uuid4QueryService.tsx

@@ -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>
+    )
+}