update stream card, update leaderboards on match finished webhook

src/trpc/react.tsx

@@ -1,7 +1,12 @@
 'use client'
 
 import { type QueryClient, QueryClientProvider } from '@tanstack/react-query'
-import { httpBatchLink, httpBatchStreamLink, loggerLink } from '@trpc/client'
+import {
+  httpBatchLink,
+  httpSubscriptionLink,
+  loggerLink,
+  splitLink,
+} from '@trpc/client'
 import { createTRPCReact } from '@trpc/react-query'
 import type { inferRouterInputs, inferRouterOutputs } from '@trpc/server'
 import { useState } from 'react'
@@ -49,14 +54,24 @@ export function TRPCReactProvider(props: { children: React.ReactNode }) {
             process.env.NODE_ENV === 'development' ||
             (op.direction === 'down' && op.result instanceof Error),
         }),
-        httpBatchLink({
-          transformer: SuperJSON,
-          url: `${getBaseUrl()}/api/trpc`,
-          headers: () => {
-            const headers = new Headers()
-            headers.set('x-trpc-source', 'nextjs-react')
-            return headers
+
+        splitLink({
+          condition(op) {
+            return op.type === 'subscription'
           },
+          true: httpSubscriptionLink({
+            url: `${getBaseUrl()}/api/trpc`,
+            transformer: SuperJSON,
+          }),
+          false: httpBatchLink({
+            transformer: SuperJSON,
+            url: `${getBaseUrl()}/api/trpc`,
+            headers: () => {
+              const headers = new Headers()
+              headers.set('x-trpc-source', 'nextjs-react')
+              return headers
+            },
+          }),
         }),
       ],
     })