3 replies

How do I use a tRPC procedure outside a react component

Hello guys, I made a simple router which will give me similar tags from my tags model from prisma

import { z } from "zod";

import {
  createTRPCRouter,
  publicProcedure,
  protectedProcedure,
} from "~/server/api/trpc";

export const tags = createTRPCRouter({
  relatedTags: publicProcedure.input(z.string()).query(({ ctx, input }) => {
    const searchString = input.toLowerCase().replace(/ /g, "");
    return ctx.prisma.tag.findMany({
      where: { name: { contains: searchString } },
      take: 5,
    });
  }),

  getAll: publicProcedure.query(({ ctx }) => {
    return ctx.prisma.tag.findMany();
  }),
});

import { z } from "zod";

import {
  createTRPCRouter,
  publicProcedure,
  protectedProcedure,
} from "~/server/api/trpc";

export const tags = createTRPCRouter({
  relatedTags: publicProcedure.input(z.string()).query(({ ctx, input }) => {
    const searchString = input.toLowerCase().replace(/ /g, "");
    return ctx.prisma.tag.findMany({
      where: { name: { contains: searchString } },
      take: 5,
    });
  }),

  getAll: publicProcedure.query(({ ctx }) => {
    return ctx.prisma.tag.findMany();
  }),
});

However the part where I want to call this code is outside of a react component and as its a hook I cannot call it outside a react component. I tried searching the web and I found out that to do that I will need to expose it using next API endpoint. There must be a better way to do this please let me know if you know any.

Here is the image where I want to call it, in case you want the extra info

How do I use a tRPC procedure outside a react component

Hello guys, I made a simple router which will give me similar tags from my tags model from prisma

import { z } from "zod";

import {
  createTRPCRouter,
  publicProcedure,
  protectedProcedure,
} from "~/server/api/trpc";

export const tags = createTRPCRouter({
  relatedTags: publicProcedure.input(z.string()).query(({ ctx, input }) => {
    const searchString = input.toLowerCase().replace(/ /g, "");
    return ctx.prisma.tag.findMany({
      where: { name: { contains: searchString } },
      take: 5,
    });
  }),

  getAll: publicProcedure.query(({ ctx }) => {
    return ctx.prisma.tag.findMany();
  }),
});

import { z } from "zod";

import {
  createTRPCRouter,
  publicProcedure,
  protectedProcedure,
} from "~/server/api/trpc";

export const tags = createTRPCRouter({
  relatedTags: publicProcedure.input(z.string()).query(({ ctx, input }) => {
    const searchString = input.toLowerCase().replace(/ /g, "");
    return ctx.prisma.tag.findMany({
      where: { name: { contains: searchString } },
      take: 5,
    });
  }),

  getAll: publicProcedure.query(({ ctx }) => {
    return ctx.prisma.tag.findMany();
  }),
});

How do I use a tRPC procedure outside a react component

Similar Threads

How do I use a tRPC procedure outside a react component

Similar Threads

Similar Threads

Similar Threads