From f3947fa375e74c7ca1f0e6ff15d84bfd66608b06 Mon Sep 17 00:00:00 2001
From: Nik Graf <nik@nikgraf.com>
Date: Wed, 26 Jun 2024 05:54:37 +0200
Subject: [PATCH] improve infering the return type

---
 examples/app/src/components/Settings.tsx |  2 +-
 examples/app/src/components/Todos.tsx    |  4 ++--
 packages/react-yjs/src/useY.ts           | 19 ++++++++++++-------
 3 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/examples/app/src/components/Settings.tsx b/examples/app/src/components/Settings.tsx
index 2b765b1..58a216b 100644
--- a/examples/app/src/components/Settings.tsx
+++ b/examples/app/src/components/Settings.tsx
@@ -7,7 +7,7 @@ export const Settings: React.FC = () => {
     // initialize a Y.Doc and get the settings
     // when the component mounts
     const yDoc = new Y.Doc();
-    const ySettings = yDoc.getMap("settings");
+    const ySettings = yDoc.getMap<boolean>("settings");
     ySettings.set("weeklyReminderEmail", true);
     return ySettings;
   });
diff --git a/examples/app/src/components/Todos.tsx b/examples/app/src/components/Todos.tsx
index 8749d49..ceb228d 100644
--- a/examples/app/src/components/Todos.tsx
+++ b/examples/app/src/components/Todos.tsx
@@ -43,7 +43,7 @@ export const Todos: React.FC = () => {
               <label>
                 <input
                   type="checkbox"
-                  checked={todo.checked}
+                  checked={todo.checked as boolean}
                   onChange={(event) => {
                     yTodos
                       .get(index)
@@ -52,7 +52,7 @@ export const Todos: React.FC = () => {
                 />
                 <input
                   type="text"
-                  value={todo.text}
+                  value={todo.text as string}
                   onChange={(event) => {
                     yTodos.get(index).set("text", event.currentTarget.value);
                   }}
diff --git a/packages/react-yjs/src/useY.ts b/packages/react-yjs/src/useY.ts
index 2cde59a..49dca42 100644
--- a/packages/react-yjs/src/useY.ts
+++ b/packages/react-yjs/src/useY.ts
@@ -3,14 +3,19 @@ import { useRef, useSyncExternalStore } from "react";
 import * as Y from "yjs";
 import { YJsonValue } from "./types.js";
 
+type YTypeToJson<YType> =
+  YType extends Y.Array<infer Value>
+    ? Array<YTypeToJson<Value>>
+    : YType extends Y.Map<infer MapValue>
+      ? { [key: string]: YTypeToJson<MapValue> }
+      : YType extends Y.XmlFragment | Y.XmlText | Y.XmlElement
+        ? string
+        : YType;
+
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function useY(yData: Y.Array<any>): any[];
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function useY(yData: Y.Map<any>): Record<string, any>;
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function useY(yData: Y.XmlElement | Y.XmlFragment | Y.Text): string;
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function useY(yData: any): any {
+export function useY<YType extends Y.AbstractType<any>>(
+  yData: YType
+): YTypeToJson<YType> {
   const prevDataRef = useRef<YJsonValue | null>(null);
   return useSyncExternalStore(
     (callback) => {