Help adding trpc-openapi to t3 app

import { generateOpenApiDocument } from 'trpc-openapi';
import { appRouter } from './root';

export const openApiDocument = generateOpenApiDocument(appRouter, {
    title: 'tRPC OpenAPI - test',
    version: '1.0.0',
    baseUrl: 'http://localhost:3000/api',
});

import { documentRouter } from "@/server/api/routers/document";
import { favoriteRouter } from "@/server/api/routers/favorite";
import { messageRouter } from "@/server/api/routers/message";
import { realEstateRouter } from '@/server/api/routers/real-estate';
import { userActivityRouter } from '@/server/api/routers/user-activity';
import { z } from "zod";
import { router, t } from './trpc';


/**
 * This is the primary router for your server.
 *
 * All routers added in /api/routers should be manually added here.
 */
export const appRouter = router({
  realEstate: realEstateRouter,
  document: documentRouter,
  userActivity: userActivityRouter,
  message: messageRouter,
  favorite: favoriteRouter,
  sayHello: t.procedure
    .meta({ /* 👉 */ openapi: { method: 'GET', path: '/say-hello' } })
    .input(z.object({ name: z.string() }))
    .output(z.object({ greeting: z.string() }))
    .query(({ input }) => {
      return { greeting: `Hello ${input.name}!` };
    }),
});

export type AppRouter = typeof appRouter;