Creando un nuevo router para el profile

¿Cómo crear un nuevo router en t3-stack?

Para crear un nuevo router, necesitamos agregar un nuevo objeto al router principal src/server/api/root.ts, en este caso que haga referencia al profile.

1. Creamos el archivo para el router del profile src/server/api/routers/profile.ts y dentro de este utilizamos la librería Clerk para obtener el usuario.

   import { clerkClient } from '@clerk/nextjs'
   import { TRPCError } from '@trpc/server'
   import { z } from 'zod'
   import { createTRPCRouter, publicProcedure } from '../trpc'
   
   export const profileRouter = createTRPCRouter({
       getUserByUsername: publicProcedure
           .input(z.object({ username: z.string() }))
           .query(async ({ ctx, input }) => {
               const [user] = await clerkClient.users.getUserList({
                   username: [input.username],
               })
   
               if (!user) {
                   throw new TRPCError({
                       code: 'NOT_FOUND',
                       message: 'User not found',
                   })
               }
   
               return user
           }),
   })
   

   Temporalmente he utilizado mi username “arumals” el cual después será reemplazado por el valor enviado desde el path (url).

2. Actualizamos el router principal agregando este subrouter src/server/api/root.ts, de esta manera pasará a formar parte de las peticiones disponibles de TRPC.

   import { createTRPCRouter } from '~/server/api/trpc'
   import { postsRouter } from './routers/post'
   import { profileRouter } from './routers/profile'
   
   export const appRouter = createTRPCRouter({
       posts: postsRouter,
       profile: profileRouter,
   })
   
   export type AppRouter = typeof appRouter
   

3. Agregamos el llamado al componente, para que este reciba y despliegue la información del usuario.

   import { clerkClient } from '@clerk/nextjs'
   import { TRPCError } from '@trpc/server'
   import { z } from 'zod'
   import { createTRPCRouter, publicProcedure } from '../trpc'
   
   export const profileRouter = createTRPCRouter({
       getUserByUsername: publicProcedure
           .input(z.object({ username: z.string() }))
           .query(async ({ ctx, input }) => {
               const [user] = await clerkClient.users.getUserList({
                   username: [input.username],
               })
   
               if (!user) {
                   throw new TRPCError({
                       code: 'NOT_FOUND',
                       message: 'User not found',
                   })
               }
   
               return user
           }),
   })
   

Agregando routers podemos dividir la funcionalidad de nuestra aplicación en múltiples partes. En este ejemplo hemos visto como implementar un router para mostrar la información del nombre de usuario conectando el cliente con TRPC.