From 7e9a56a85e4aeed4b563d82a8f6ddff0a33490fd Mon Sep 17 00:00:00 2001
From: Adrien KISSIE <fredkiss3@gmail.com>
Date: Thu, 22 Dec 2022 23:09:39 +0100
Subject: [PATCH 1/2] refactor: updated trpc query keys format for RSC to
 correspond to how trpc v10.0 format them

---
 @trpc/next-layout/createTRPCNextLayout.ts | 28 ++++++++++++++++-------
 1 file changed, 20 insertions(+), 8 deletions(-)

diff --git a/@trpc/next-layout/createTRPCNextLayout.ts b/@trpc/next-layout/createTRPCNextLayout.ts
index be4aa6a..ad198eb 100644
--- a/@trpc/next-layout/createTRPCNextLayout.ts
+++ b/@trpc/next-layout/createTRPCNextLayout.ts
@@ -28,10 +28,10 @@ export type DecorateProcedure<TProcedure extends AnyProcedure> =
   TProcedure extends AnyQueryProcedure
     ? {
         fetch(
-          input: inferProcedureInput<TProcedure>,
+          input: inferProcedureInput<TProcedure>
         ): Promise<inferProcedureOutput<TProcedure>>;
         fetchInfinite(
-          input: inferProcedureInput<TProcedure>,
+          input: inferProcedureInput<TProcedure>
         ): Promise<inferProcedureOutput<TProcedure>>;
       }
     : never;
@@ -47,7 +47,7 @@ type OmitNever<TType> = Pick<
  */
 export type DecoratedProcedureRecord<
   TProcedures extends ProcedureRouterRecord,
-  TPath extends string = "",
+  TPath extends string = ""
 > = OmitNever<{
   [TKey in keyof TProcedures]: TProcedures[TKey] extends AnyRouter
     ? DecoratedProcedureRecord<
@@ -65,12 +65,24 @@ type CreateTRPCNextLayout<TRouter extends AnyRouter> = DecoratedProcedureRecord<
   dehydrate(): Promise<DehydratedState>;
 };
 
-function getQueryKey(path: string[], input: unknown) {
-  return input === undefined ? [path] : [path, input];
+function getQueryKey(
+  path: string[],
+  input: unknown,
+  isFetchInfinite?: boolean
+) {
+  return input === undefined
+    ? [path, { type: isFetchInfinite ? "infinite" : "query" }] // We added { type: "infinite" | "query"  }, because it is how trpc v10.0 format the new queryKeys
+    : [
+        path,
+        {
+          input: { ...input },
+          type: isFetchInfinite ? "infinite" : "query",
+        },
+      ];
 }
 
 export function createTRPCNextLayout<TRouter extends AnyRouter>(
-  opts: CreateTRPCNextLayoutOptions<TRouter>,
+  opts: CreateTRPCNextLayoutOptions<TRouter>
 ): CreateTRPCNextLayout<TRouter> {
   function getState() {
     const requestStorage = getRequestStorage<{
@@ -117,11 +129,11 @@ export function createTRPCNextLayout<TRouter extends AnyRouter>(
 
     const pathStr = path.join(".");
     const input = callOpts.args[0];
-    const queryKey = getQueryKey(path, input);
+    const queryKey = getQueryKey(path, input, lastPart === "fetchInfinite");
 
     if (lastPart === "fetchInfinite") {
       return queryClient.fetchInfiniteQuery(queryKey, () =>
-        caller.query(pathStr, input),
+        caller.query(pathStr, input)
       );
     }
 

From 2d35af65de89c3c8531ef4c5235e199c000af4d9 Mon Sep 17 00:00:00 2001
From: Adrien KISSIE <fredkiss3@gmail.com>
Date: Thu, 22 Dec 2022 23:20:23 +0100
Subject: [PATCH 2/2] chore: update to trpc v10.0

---
 package.json | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index c205cd5..55f4211 100644
--- a/package.json
+++ b/package.json
@@ -18,9 +18,9 @@
     "@tailwindcss/typography": "^0.5.7",
     "@tanstack/query-core": "^4.14.5",
     "@tanstack/react-query": "^4.14.5",
-    "@trpc/client": "^10.0.0-rc.1",
-    "@trpc/react-query": "^10.0.0-rc.1",
-    "@trpc/server": "^10.0.0-rc.1",
+    "@trpc/client": "^10.0.0",
+    "@trpc/react-query": "^10.0.0",
+    "@trpc/server": "^10.0.0",
     "next": "^13.0.1-canary.3",
     "next-auth": "4.14.0",
     "npm-run-all": "^4.1.5",