From 5aa5c284659bf70e6a78f20ce5a522c4e2511153 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Julien=20Valverd=C3=A9?= <julien.valverde@mailo.com>
Date: Sat, 12 Jul 2025 03:05:14 +0200
Subject: [PATCH] useFC memo

---
 packages/effect-fc/src/Component.ts | 10 +++++++---
 packages/example/src/todo/Todo.tsx  |  3 ---
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/packages/effect-fc/src/Component.ts b/packages/effect-fc/src/Component.ts
index ab56dfa..ceb75f8 100644
--- a/packages/effect-fc/src/Component.ts
+++ b/packages/effect-fc/src/Component.ts
@@ -1,4 +1,4 @@
-import { Context, Effect, type Equivalence, ExecutionStrategy, Function, Pipeable, Runtime, Scope, String, Tracer, type Utils } from "effect"
+import { Context, Effect, type Equivalence, ExecutionStrategy, Function, Pipeable, Predicate, Runtime, Scope, String, Tracer, type Utils } from "effect"
 import * as React from "react"
 import * as Hook from "./Hook.js"
 import type { ExcludeKeys } from "./utils.js"
@@ -111,7 +111,9 @@ export const useFC: {
         self: Component<E, R, P>
     ): Effect.Effect<React.FC<P>, never, Exclude<R, Scope.Scope>>
 } = Effect.fn("useFC")(function* <E, R, P extends {}>(
-    self: Component<E, R, P>
+    self:
+        | Component<E, R, P> & Memoized<P>
+        | Component<E, R, P>
 ) {
     const runtimeRef = React.useRef<Runtime.Runtime<Exclude<R, Scope.Scope>>>(null!)
     runtimeRef.current = yield* Effect.runtime<Exclude<R, Scope.Scope>>()
@@ -129,7 +131,9 @@ export const useFC: {
                 Effect.provideService(self.body(props), Scope.Scope, scope)
             )
             f.displayName = self.displayName ?? "Anonymous"
-            return f
+            return Predicate.hasProperty(self, "memo")
+                ? React.memo(f, self.propsAreEqual)
+                : f
         }, [scope])
 
         return React.createElement(FC, props)
diff --git a/packages/example/src/todo/Todo.tsx b/packages/example/src/todo/Todo.tsx
index 3a2495f..7767e32 100644
--- a/packages/example/src/todo/Todo.tsx
+++ b/packages/example/src/todo/Todo.tsx
@@ -111,6 +111,3 @@ export const Todo = Component.make(function* Todo(props: TodoProps) {
         </Flex>
     )
 })
-
-const MemoizedTodo = Component.memo(Todo)
-const MemoizedTodo2 = Component.memo(MemoizedTodo)