Newbie here, need some assistance. Can't trigger useMutation.

[alpacaPwaa]

I'm so confused, no errors, the logs I place inside the usemutation doesn't appear in my terminal, it just straight up don't give me anything.

trpc version:

"@tanstack/react-query": "4",
"@trpc/client": "^10.45.0",
"@trpc/next": "^10.45.0",
"@trpc/react-query": "^10.45.0",
"@trpc/server": "^10.45.0",

Here's my tRPC useMutation.

createVideo: privateProcedure
    .input(
      z.object({
        promt: z.string(),
      })
    )
    .mutation(async ({ ctx, input }) => {
      const openai = new OpenAI({
        apiKey: process.env.OPENAI_API_KEY,
      });

      const allQuestion = await openai.completions.create({
        model: "gpt-3.5-turbo-instruct",
        prompt: input.promt,
        temperature: 1,
        max_tokens: 256,
        top_p: 1,
        frequency_penalty: 1,
        presence_penalty: 1,
      });

      console.log(allQuestion);

      const SampleResponse = allQuestion.choices[0].text;

      return SampleResponse;
    }),

Here's where I trigger it.

const { mutate: createVideo, isLoading } = trpc.createVideo.useMutation({});

 const handleGenerateScript = (e: React.FormEvent<HTMLElement>) => {
    if (!promptText) {
      setPromptError("Please write a prompt");
      return;
    }

    createVideo({
      promt: promptText,
    });

    console.log("Prompt", promptText);
  };
  
  const handleChangePrompt = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
    setPromptText(e.target.value);
  };

Here's my button.

<button
  onClick={handleGenerateScript}
  className="bg-blue-500 text-white rounded-md px-4 py-2 hover:bg-blue-600 transition duration-300 ease-in-out"
>
  Generate Quiz
</button>