JACoB PR for Issue Update the Todos - Issue.tsx component to add a button to manually generate research

src/app/dashboard/[org]/[repo]/todos/components/Issue.tsx

@@ -1,6 +1,7 @@
 import React, { useEffect } from "react";
 import type Todo from "../Todo";
 import { type Issue } from "../Todo";
+import { type ResearchItem } from "../Todo";
 import LoadingIndicator from "../../components/LoadingIndicator";
 import { TodoStatus } from "~/server/db/enums";
 import { api } from "~/trpc/react";
@@ -25,7 +26,7 @@ const Issue: React.FC<IssueProps> = ({
 }) => {
   console.log("selectedIssue", selectedIssue);
   const { data: research, isLoading: isLoadingResearch } =
-    api.events.getResearch.useQuery({
+    api.todos.getResearch.useQuery({
       todoId: selectedTodo.id,
       issueId: selectedTodo.issueId ?? 0,
     });
@@ -42,6 +43,9 @@ const Issue: React.FC<IssueProps> = ({
   }, [selectedIssue]);
 
   const { mutateAsync: updateIssue } = api.github.updateIssue.useMutation();
+  const { mutateAsync: researchIssue, isLoading: isGeneratingResearch } =
+    api.todos.researchIssue.useMutation();
+  const utils = api.useContext();
 
   const handleSaveIssue = async () => {
     try {
@@ -81,6 +85,23 @@ const Issue: React.FC<IssueProps> = ({
     }
   };
 
+  const handleGenerateResearch = async () => {
+    try {
+      await researchIssue({
+        todoId: selectedTodo.id,
+        issueId: selectedTodo.issueId ?? 0,
+      });
+      toast.success("Research generated successfully!");
+      await utils.todos.getResearch.invalidate({
+        todoId: selectedTodo.id,
+        issueId: selectedTodo.issueId ?? 0,
+      });
+    } catch (error) {
+      console.error("Error generating research:", error);
+      toast.error("Failed to generate research.");
+    }
+  };
+
   if (isLoadingIssue) {
     return <LoadingIndicator />;
   }
@@ -208,16 +229,24 @@ const Issue: React.FC<IssueProps> = ({
           {isLoadingResearch ? (
             <LoadingIndicator />
           ) : (
-            research?.map((item) => (
+            research?.map((item: ResearchItem) => (
               <div className="markdown-chat" key={item.id}>
                 <MarkdownRenderer>{item.answer}</MarkdownRenderer>
               </div>
             ))
           )}
         </div>
+        <button
+          onClick={handleGenerateResearch}
+          disabled={isGeneratingResearch}
+          className="mt-4 rounded-full bg-sunset-500 px-4 py-2 text-white dark:bg-purple-700"
+          aria-label="Generate Research"
+        >
+          {isGeneratingResearch ? "Generating..." : "Generate Research"}
+        </button>
       </div>
     </>
   );
 };
 
-export default Issue;
+export default Issue;

src/server/api/routers/todos.ts

@@ -4,6 +4,14 @@ import { TodoStatus } from "~/server/db/enums";
 import { researchIssue } from "~/server/agent/research";
 import { createTRPCRouter, protectedProcedure } from "~/server/api/trpc";
 import { type Todo } from "./events";
+const researchIssueInput = z.object({
+  todoId: z.number(),
+  issueId: z.number(),
+  description: z.string(),
+  arg2: z.string(),
+  arg5: z.string(),
+  arg6: z.number(),
+ });
 
 export const todoRouter = createTRPCRouter({
   getAll: protectedProcedure
@@ -121,4 +129,21 @@ export const todoRouter = createTRPCRouter({
       await db.todos.find(id).delete();
       return { id };
     }),
-});
+  researchIssue: protectedProcedure
+    .input(researchIssueInput)
+    .mutation(async ({ input }): Promise<void> => {
+      await researchIssue(input.todoId, input.issueId);
+    }),
+      await researchIssue(input.description, input.arg2, input.todoId, input.issueId, input.arg5, input.arg6);
+
+  getResearch: protectedProcedure
+    .input(
+      z.object({
+        todoId: z.number(),
+        issueId: z.number(),
+      })
+    )
+    .query(async ({ input }) => {
+      const researchItems = await db.research.where({ todoId: input.todoId, issueId: input.issueId }).all();
+      return researchItems;
+    }),