merge conflicts

src/module.ts

@@ -0,0 +1,80 @@
+import { fileURLToPath } from 'url'
+import { join, resolve } from 'pathe'
+import { defu } from 'defu'
+import dedent from 'dedent'
+
+import { addImports, addPlugin, addServerHandler, addTemplate, defineNuxtModule, useLogger } from '@nuxt/kit'
+
+export interface ModuleOptions {
+  baseURL: string
+  endpoint: string
+  installPlugin?: boolean
+}
+
+const metaName = 'trpc-nuxt'
+
+export default defineNuxtModule<ModuleOptions>({
+  meta: {
+    name: metaName,
+    configKey: 'trpc',
+  },
+  defaults: {
+    baseURL: '',
+    endpoint: '/trpc',
+    installPlugin: true,
+  },
+  async setup(options, nuxt) {
+    const logger = useLogger(metaName)
+
+    const runtimeDir = fileURLToPath(new URL('./runtime', import.meta.url))
+    nuxt.options.build.transpile.push(runtimeDir, '#build/trpc-handler')
+
+    const handlerPath = join(nuxt.options.buildDir, 'trpc-handler.ts')
+    const trpcOptionsPath = join(nuxt.options.srcDir, 'server/trpc')
+
+    // Final resolved configuration
+    const finalConfig = nuxt.options.runtimeConfig.public.trpc = defu(nuxt.options.runtimeConfig.public.trpc, {
+      baseURL: options.baseURL,
+      endpoint: options.endpoint,
+      installPlugin: options.installPlugin,
+    })
+
+    addServerHandler({
+      route: `${finalConfig.endpoint}/*`,
+      handler: handlerPath,
+    })
+
+    addTemplate({
+      filename: 'trpc-handler.ts',
+      write: true,
+      getContents() {
+        return dedent`
+          import { createTRPCHandler } from 'trpc-nuxt/api'
+          import * as functions from '${trpcOptionsPath}'
+    
+          export default createTRPCHandler({
+            ...functions,
+            endpoint: '${finalConfig.endpoint}'
+          })
+        `
+      },
+    })
+
+    if (finalConfig.installPlugin) {
+      addImports([
+        { name: 'useClient', from: join(runtimeDir, 'client') },
+        { name: 'useAsyncQuery', from: join(runtimeDir, 'client') },
+        { name: 'useClientHeaders', from: join(runtimeDir, 'client') },
+        { name: 'getQueryKey', from: join(runtimeDir, 'client') },
+      ])
+
+      addPlugin(resolve(runtimeDir, 'plugin'))
+
+      logger.success('Plugin successfully installed.')
+    }
+    else {
+      logger.info('Plugin not installed. Create your own @trpc/client client plugin and composables.')
+    }
+  },
+})
+

src/runtime/client.ts

@@ -0,0 +1,71 @@
+import type {
+  AsyncData,
+  AsyncDataOptions,
+  KeyOfRes,
+  PickFrom,
+  _Transform,
+} from 'nuxt/dist/app/composables/asyncData'
+import type { ProcedureRecord, inferHandlerInput, inferProcedureInput, inferProcedureOutput } from '@trpc/server'
+import type { TRPCClient, TRPCClientErrorLike } from '@trpc/client'
+import { objectHash } from 'ohash'
+import type { Ref } from 'vue'
+import { useAsyncData, useNuxtApp, useState } from '#app'
+import type { router } from '~/server/trpc'
+
+type MaybeRef<T> = T | Ref<T>
+
+type AppRouter = typeof router
+
+export type inferProcedures<
+  TObj extends ProcedureRecord<any, any, any, any, any, any>,
+> = {
+  [TPath in keyof TObj]: {
+    input: inferProcedureInput<TObj[TPath]>
+    output: inferProcedureOutput<TObj[TPath]>
+  };
+}
+
+export type TQueries = AppRouter['_def']['queries']
+export type TError = TRPCClientErrorLike<AppRouter>
+
+export type TQueryValues = inferProcedures<AppRouter['_def']['queries']>
+
+/**
+ * Calculates the key used for `useAsyncData` call
+ * @param pathAndInput
+ */
+export function getQueryKey<
+    TPath extends keyof TQueryValues & string,
+    >(pathAndInput: [path: TPath, ...args: inferHandlerInput<TQueries[TPath]>]) {
+  return `${pathAndInput[0]}-${objectHash(pathAndInput[1] ? JSON.stringify(pathAndInput[1]) : '')}`
+}
+
+export async function useAsyncQuery<
+  TPath extends keyof TQueryValues & string,
+  TOutput extends TQueryValues[TPath]['output'] = TQueryValues[TPath]['output'],
+  Transform extends _Transform<TOutput> = _Transform<TOutput, TOutput>,
+  PickKeys extends KeyOfRes<Transform> = KeyOfRes<Transform>,
+>(
+  pathAndInput: [path: TPath, ...args: inferHandlerInput<TQueries[TPath]>],
+  options: AsyncDataOptions<TOutput, Transform, PickKeys> = {},
+): Promise<AsyncData<PickFrom<ReturnType<Transform>, PickKeys>, TError>> {
+  const { $client } = useNuxtApp()
+  const key = getQueryKey(pathAndInput)
+  const result = await useAsyncData(
+    key,
+    () => $client.query(...pathAndInput),
+    // @ts-expect-error: Internal
+    options,
+  )
+
+  return result as any
+}
+
+export function useClient(): TRPCClient<AppRouter> {
+  const { $client } = useNuxtApp()
+  return $client
+}
+
+export function useClientHeaders(initialValue: MaybeRef<Record<string, any>> = {}): Ref<Record<string, any>> {
+  return useState('trpc-nuxt-header', () => initialValue)
+}