Query work
All checks were successful
Lint / lint (push) Successful in 12s

This commit is contained in:
Julien Valverdé
2025-02-28 00:27:22 +01:00
parent 91b95ea6af
commit b01b95a9d5

View File

@@ -1,17 +1,18 @@
import * as AsyncData from "@typed/async-data" import * as AsyncData from "@typed/async-data"
import { Effect, Scope } from "effect" import { Effect, Fiber, Option, Ref } from "effect"
import * as React from "react" import * as React from "react"
import { useState } from "react" import { useState } from "react"
import { ReffuseExtension, type ReffuseHelpers } from "reffuse" import { ReffuseExtension, type ReffuseHelpers } from "reffuse"
export interface UseQueryProps<A, E, R> { export interface UseQueryProps<A, E, R> {
effect: () => Effect.Effect<A, E, R | Scope.Scope> effect: () => Effect.Effect<A, E, R>
readonly deps?: React.DependencyList readonly deps: React.DependencyList
} }
export interface UseQueryResult<A, E> { export interface UseQueryResult<A, E, R> {
readonly state: AsyncData.AsyncData<A, E> readonly state: AsyncData.AsyncData<A, E>
readonly refresh: Effect.Effect<void, never, R>
} }
@@ -19,17 +20,44 @@ export const QueryExtension = ReffuseExtension.make(() => ({
useQuery<A, E, R>( useQuery<A, E, R>(
this: ReffuseHelpers.ReffuseHelpers<R>, this: ReffuseHelpers.ReffuseHelpers<R>,
props: UseQueryProps<A, E, R>, props: UseQueryProps<A, E, R>,
): UseQueryResult<A, E> { ): UseQueryResult<A, E, R> {
const fiberRef = this.useRef(Option.none<Fiber.Fiber<void, never>>())
const [state, setState] = useState(AsyncData.noData<A, E>()) const [state, setState] = useState(AsyncData.noData<A, E>())
this.useFork(() => Effect.sync(() => setState(AsyncData.loading())).pipe( const interruptRunningQuery = React.useMemo(() => fiberRef.pipe(
Effect.andThen(props.effect()), Effect.flatMap(Option.match({
onSome: Fiber.interrupt,
onNone: () => Effect.void,
}))
), [])
const runQuery = React.useMemo(() => props.effect().pipe(
Effect.matchCause({ Effect.matchCause({
onSuccess: v => setState(AsyncData.success(v)), onSuccess: v => setState(AsyncData.success(v)),
onFailure: c => setState(AsyncData.failure(c)), onFailure: c => setState(AsyncData.failure(c)),
}), })
), props.deps) ), props.deps)
return { state } const refresh = React.useMemo(() => interruptRunningQuery.pipe(
Effect.andThen(Effect.sync(() => setState(prev =>
AsyncData.isSuccess(prev) || AsyncData.isFailure(prev)
? AsyncData.refreshing(prev)
: AsyncData.loading()
))),
Effect.andThen(runQuery),
Effect.forkDaemon,
Effect.flatMap(fiber => Ref.set(fiberRef, Option.some(fiber))),
), [runQuery])
this.useEffect(() => interruptRunningQuery.pipe(
Effect.andThen(Effect.sync(() => setState(AsyncData.loading()))),
Effect.andThen(runQuery),
Effect.forkDaemon,
Effect.flatMap(fiber => Ref.set(fiberRef, Option.some(fiber))),
), [runQuery])
return { state, refresh }
} }
})) }))