Working lazyref extension
Some checks failed
Lint / lint (push) Failing after 12s

This commit is contained in:
Julien Valverdé
2025-02-25 12:17:45 +01:00
parent d9a01dae0f
commit 8754020323
8 changed files with 103 additions and 25 deletions

View File

@@ -0,0 +1,31 @@
import { R } from "@/reffuse"
import { Button, Text } from "@radix-ui/themes"
import { createFileRoute } from "@tanstack/react-router"
import * as LazyRef from "@typed/lazy-ref"
import { Suspense, use } from "react"
export const Route = createFileRoute("/lazyref")({
component: RouteComponent
})
function RouteComponent() {
const promise = R.usePromise(LazyRef.of(0))
return (
<Suspense fallback={<Text>Loading...</Text>}>
<LazyRefComponent promise={promise} />
</Suspense>
)
}
function LazyRefComponent({ promise }: { readonly promise: Promise<LazyRef.LazyRef<number>> }) {
const ref = use(promise)
const [value, setValue] = R.useLazyRefState(ref)
return (
<Button onClick={() => setValue(prev => prev + 1)}>
{value}
</Button>
)
}