How to use `localLink` (`unstable_localLink`)

globalThis.$getTRPCServerSideTerminatingLink = () => unstable_localLink({
  router: appRouter,
  createContext: createContext,
  transformer,
})

declare global {
  /** HACK: For SSR we wan't to use a `localLink` directly instead of going over HTTP so that headers are properly forwarded (Otherwise auth won't work) */
  var $getTRPCServerSideTerminatingLink: (() => TRPCLink<AppRouter>) | undefined;
}

export const TRPCWithReactQueryProvider = ({ children, queryClient }: TRPCWithReactQueryProviderProps) => {
  const qc = queryClient ?? getQueryClient();

  const links: TRPCLink<AppRouter>[] = [];

  /** Add terminating link */
  if (isServer) {
    const link = globalThis.$getTRPCServerSideTerminatingLink?.();
    if (link) {
      links.push(link);
    } else {
      throw new Error('No server-side `terminating link` found on globalThis');
    }
  } else {
    links.push(
      httpBatchLink<AppRouter>({
        url: '/api/trpc',
        transformer,
      }),
    );
  }

  const [trpcClient] = useState(() =>
    createTRPCProxyClient<AppRouter>({
      links
    }),
  );
  
  // ....
};