packages/example/src/routes/query/service.tsx

@@ -1,8 +1,9 @@
 import { QueryContext } from "@/query/reffuse"
 import { Uuid4Query } from "@/query/services"
+import { Uuid4QueryService } from "@/query/views/Uuid4QueryService"
 import { R } from "@/reffuse"
 import { createFileRoute } from "@tanstack/react-router"
-import { Effect, Layer } from "effect"
+import { Layer } from "effect"
 import { useMemo } from "react"
 
 
@@ -11,16 +12,16 @@ export const Route = createFileRoute("/query/service")({
 })
 
 function RouteComponent() {
-    const context = R.useContext()
+    const context = R.useLayer()
 
     const layer = useMemo(() => Layer.empty.pipe(
         Layer.provideMerge(Uuid4Query.Uuid4QueryLive),
-        Layer.provide(context)
+        Layer.provide(context),
-    ), [])
+    ), [context])
 
     return (
         <QueryContext.Provider layer={layer}>
-
+            <Uuid4QueryService />
         </QueryContext.Provider>
     )
 }

packages/reffuse/src/ReffuseContext.tsx

@@ -97,15 +97,15 @@ export function useMergeAll<T extends Array<unknown>>(
     return React.useMemo(() => Context.mergeAll(...values), values)
 }
 
-export function useMergeAllLayers<T extends Array.NonEmptyArray<unknown>>(
+export function useMergeAllLayers<T extends Array<unknown>>(
     ...contexts: [...{ [K in keyof T]: ReffuseContext<T[K]> }]
 ): Layer.Layer<T[number]> {
-    const values = Array.map(
+    const values = contexts.map(v => React.use(v.Context))
-        contexts as Array.NonEmptyArray<ReffuseContext<T[number]>>,
-        v => React.use(v.Context),
-    )
 
-    return React.useMemo(() => Layer.mergeAll(
+    return React.useMemo(() => Array.isNonEmptyArray(values)
-        ...Array.map(values, context => Layer.effectContext(Effect.succeed(context)))
+        ? Layer.mergeAll(
-    ), values)
+            ...Array.map(values, context => Layer.effectContext(Effect.succeed(context)))
+        )
+        : Layer.empty as Layer.Layer<T[number]>,
+    values)
 }