Bits

pages/_app.tsx

@@ -41,7 +41,7 @@ const Big_AGI_App = ({ Component, emotionCache, pageProps }: MyAppProps) => {
     <ProviderTheming emotionCache={emotionCache}>
       <ProviderSingleTab>
         <ProviderBackendCapabilities>
-          {/* ^ SSR boundary */}
+          {/* ^ Backend capabilities & SSR boundary */}
           <ProviderBootstrapLogic>
             <SnackbarInsert />
             {getLayout(<Component {...pageProps} />)}

src/common/providers/ProviderBackendCapabilities.tsx

@@ -173,5 +173,5 @@ export function ProviderBackendCapabilities(props: { children: React.ReactNode }
   }
 
   // Render the children when ready
-  return versionVerified ? props.children : null;
+  return props.children;
 }

src/server/api/trpc.server.ts

@@ -6,6 +6,7 @@
  * TL;DR - This is where all the tRPC server stuff is created and plugged in. The pieces you will
  * need to use are documented accordingly near the end.
  */
+import type { FetchCreateContextFnOptions } from '@trpc/server/adapters/fetch';
 import { ZodError } from 'zod';
 import { initTRPC } from '@trpc/server';
 import { transformer } from '~/server/api/trpc.transformer';
@@ -17,7 +18,7 @@ import { transformer } from '~/server/api/trpc.transformer';
  *
  * These allow you to access things when processing a request, like the database, the session, etc.
  */
-export const createTRPCFetchContext = ({ req /*, resHeaders*/ }: { req: Request; resHeaders: Headers; }) => {
+export const createTRPCFetchContext = async ({ req }: FetchCreateContextFnOptions) => {
   // const user = { name: req.headers.get('username') ?? 'anonymous' };
   // return { req, resHeaders };
   return {