refactor: drop usage of ES6 Proxy (#142)

* refactor: drop usage of ES6 Proxy

* chore: trigger SonarCloud

Co-authored-by: Oliver Butler <dev@oliverbutler.uk>

Author: Gabrola

.changeset/giant-lizards-jam.md

@@ -0,0 +1,7 @@
+---
+'@ts-rest/core': patch
+'@ts-rest/react-query': patch
+'@ts-rest/solid-query': patch
+---
+
+Drop usage of ES6 Proxy for clients (fixes IE11 support)

libs/ts-rest/core/src/lib/client.ts

@@ -70,8 +70,9 @@ export type ApiRouteResponse<T> =
       body: unknown;
     };
 
-export type ApiResponseForRoute<T extends AppRoute> = ApiRouteResponse<T['responses']>
-
+export type ApiResponseForRoute<T extends AppRoute> = ApiRouteResponse<
+  T['responses']
+>;
 
 /**
  * Returned from a mutation or query call
@@ -202,45 +203,30 @@ export const getRouteQuery = <TAppRoute extends AppRoute>(
   };
 };
 
-const createNewProxy = (router: AppRouter, args: ClientArgs) => {
-  return new Proxy(
-    {},
-    {
-      get: (target, propKey): any => {
-        if (typeof propKey === 'string' && propKey in router) {
-          const subRouter = router[propKey];
-
-          if (isAppRoute(subRouter)) {
-            // If the current router.X is a route, return a function to handle the users args
-            return getRouteQuery(subRouter, args);
-          } else {
-            return createNewProxy(subRouter, args);
-          }
-        }
-
-        return createNewProxy(router, args);
-      },
-    }
-  );
-};
-
 export type InitClientReturn<T extends AppRouter> = RecursiveProxyObj<T>;
 
 export const initClient = <T extends AppRouter>(
   router: T,
   args: ClientArgs
 ): InitClientReturn<T> => {
-  const proxy = createNewProxy(router, args);
-
-  return proxy as InitClientReturn<T>;
+  return Object.fromEntries(
+    Object.entries(router).map(([key, subRouter]) => {
+      if (isAppRoute(subRouter)) {
+        return [key, getRouteQuery(subRouter, args)];
+      } else {
+        return [key, initClient(subRouter, args)];
+      }
+    })
+  );
 };
 
 // takes a router and returns response types for each AppRoute
 // does not support nested routers, yet
 
 export function getRouteResponses<T extends AppRouter>(router: T) {
   return {} as {
-     [K in keyof typeof router]: 
-        typeof router[K] extends AppRoute ? ApiResponseForRoute<typeof router[K]> : 'not a route'
-   }
-}
+    [K in keyof typeof router]: typeof router[K] extends AppRoute
+      ? ApiResponseForRoute<typeof router[K]>
+      : 'not a route';
+  };
+}

libs/ts-rest/react-query/src/lib/react-query.ts

@@ -340,45 +340,29 @@ const getRouteUseMutation = <TAppRoute extends AppRoute>(
   };
 };
 
-const createNewProxy = (router: AppRouter | AppRoute, args: ClientArgs) => {
-  return new Proxy(
-    {},
-    {
-      get: (_, propKey): unknown => {
-        if (isAppRoute(router)) {
-          switch (propKey) {
-            case 'query':
-              return getRouteQuery(router, args);
-            case 'mutation':
-              return getRouteQuery(router, args);
-            case 'useQuery':
-              return getRouteUseQuery(router, args);
-            case 'useInfiniteQuery':
-              return getRouteUseInfiniteQuery(router, args);
-            case 'useQueries':
-              return getRouteUseQueries(router, args);
-            case 'useMutation':
-              return getRouteUseMutation(router, args);
-            default:
-              throw new Error(`Unknown method called on ${String(propKey)}`);
-          }
-        } else {
-          const subRouter = router[propKey as string];
-
-          return createNewProxy(subRouter, args);
-        }
-      },
-    }
-  );
-};
-
 export type InitClientReturn<T extends AppRouter> = RecursiveProxyObj<T>;
 
 export const initQueryClient = <T extends AppRouter>(
   router: T,
   args: ClientArgs
 ): InitClientReturn<T> => {
-  const proxy = createNewProxy(router, args);
-
-  return proxy as InitClientReturn<T>;
+  return Object.fromEntries(
+    Object.entries(router).map(([key, subRouter]) => {
+      if (isAppRoute(subRouter)) {
+        return [
+          key,
+          {
+            query: getRouteQuery(subRouter, args),
+            mutation: getRouteQuery(subRouter, args),
+            useQuery: getRouteUseQuery(subRouter, args),
+            useQueries: getRouteUseQueries(subRouter, args),
+            useInfiniteQuery: getRouteUseInfiniteQuery(subRouter, args),
+            useMutation: getRouteUseMutation(subRouter, args),
+          },
+        ];
+      } else {
+        return [key, initQueryClient(subRouter, args)];
+      }
+    })
+  );
 };

libs/ts-rest/solid-query/src/lib/solid-query.ts

@@ -246,43 +246,28 @@ const getRouteUseMutation = <TAppRoute extends AppRoute>(
   };
 };
 
-const createNewProxy = (router: AppRouter | AppRoute, args: ClientArgs) => {
-  return new Proxy(
-    {},
-    {
-      get: (_, propKey): any => {
-        if (isAppRoute(router)) {
-          switch (propKey) {
-            case 'query':
-              return getRouteQuery(router, args);
-            case 'mutation':
-              return getRouteQuery(router, args);
-            case 'createQuery':
-              return getRouteUseQuery(router, args);
-            case 'createInfiniteQuery':
-              return getRouteUseInfiniteQuery(router, args);
-            case 'createMutation':
-              return getRouteUseMutation(router, args);
-            default:
-              throw new Error(`Unknown method called on ${String(propKey)}`);
-          }
-        } else {
-          const subRouter = router[propKey as string];
-
-          return createNewProxy(subRouter, args);
-        }
-      },
-    }
-  );
-};
-
 export type InitClientReturn<T extends AppRouter> = RecursiveProxyObj<T>;
 
 export const initQueryClient = <T extends AppRouter>(
   router: T,
   args: ClientArgs
 ): InitClientReturn<T> => {
-  const proxy = createNewProxy(router, args);
-
-  return proxy as InitClientReturn<T>;
+  return Object.fromEntries(
+    Object.entries(router).map(([key, subRouter]) => {
+      if (isAppRoute(subRouter)) {
+        return [
+          key,
+          {
+            query: getRouteQuery(subRouter, args),
+            mutation: getRouteQuery(subRouter, args),
+            createQuery: getRouteUseQuery(subRouter, args),
+            createInfiniteQuery: getRouteUseInfiniteQuery(subRouter, args),
+            createMutation: getRouteUseMutation(subRouter, args),
+          },
+        ];
+      } else {
+        return [key, initQueryClient(subRouter, args)];
+      }
+    })
+  );
 };