Refactor auto-suggestion (#40)

src/components/chat/ChatInput.tsx

@@ -317,7 +317,7 @@ export function ChatInput({ chatId }: { chatId?: number }) {
 }
 
 function SummarizeInNewChatButton() {
-  const [chatId] = useAtom(selectedChatIdAtom);
+  const chatId = useAtomValue(selectedChatIdAtom);
   const appId = useAtomValue(selectedAppIdAtom);
   const { streamMessage } = useStreamChat();
   const navigate = useNavigate();
@@ -349,10 +349,48 @@ function SummarizeInNewChatButton() {
     </TooltipProvider>
   );
 }
+
+function RefactorFileButton({ path }: { path: string }) {
+  const chatId = useAtomValue(selectedChatIdAtom);
+  const { streamMessage } = useStreamChat();
+  return (
+    <TooltipProvider>
+      <Tooltip>
+        <TooltipTrigger asChild>
+          <Button
+            variant="outline"
+            size="sm"
+            onClick={() => {
+              if (!chatId) {
+                console.error("No chat id found");
+                return;
+              }
+              streamMessage({
+                prompt: `Refactor ${path} and make it more modular`,
+                chatId,
+                redo: false,
+              });
+            }}
+          >
+            <span className="max-w-[180px] overflow-hidden whitespace-nowrap text-ellipsis">
+              Refactor {path.split("/").slice(-2).join("/")}
+            </span>
+          </Button>
+        </TooltipTrigger>
+        <TooltipContent>
+          <p>Refactor {path} to improve maintainability</p>
+        </TooltipContent>
+      </Tooltip>
+    </TooltipProvider>
+  );
+}
+
 function mapActionToButton(action: SuggestedAction) {
   switch (action.id) {
     case "summarize-in-new-chat":
       return <SummarizeInNewChatButton />;
+    case "refactor-file":
+      return <RefactorFileButton path={action.path} />;
     default:
       console.error(`Unsupported action: ${action.id}`);
       return (

src/ipc/handlers/proposal_handlers.ts

@@ -224,6 +224,23 @@ const getProposalHandler = async (
           );
         }
       }
+      const actions: ActionProposal["actions"] = [];
+      if (latestAssistantMessage?.content) {
+        const writeTags = getDyadWriteTags(latestAssistantMessage.content);
+        const refactorTarget = writeTags.reduce((largest, tag) => {
+          const lineCount = tag.content.split("\n").length;
+          return lineCount > 500 && (!largest || lineCount > largest.lineCount)
+            ? { path: tag.path, lineCount }
+            : largest;
+        }, null as { path: string; lineCount: number } | null);
+        if (refactorTarget) {
+          actions.push({
+            id: "refactor-file",
+            path: refactorTarget.path,
+          });
+        }
+      }
+
       // Get all chat messages to calculate token usage
       const chat = await db.query.chats.findFirst({
         where: eq(chats.id, chatId),
@@ -260,16 +277,21 @@ const getProposalHandler = async (
           logger.log(
             `Token usage high (${totalTokens}/${contextWindow}), suggesting summarize action`
           );
+          actions.push({
+            id: "summarize-in-new-chat",
+          });
+        }
+      }
+      if (actions.length > 0 && latestAssistantMessage) {
         return {
           proposal: {
             type: "action-proposal",
-              actions: [{ id: "summarize-in-new-chat" }],
+            actions: actions,
           },
           chatId,
           messageId: latestAssistantMessage.id,
         };
       }
-      }
       return null;
     } catch (error) {
       logger.error(`Error processing proposal for chatId ${chatId}:`, error);

src/lib/schemas.ts

@@ -155,8 +155,22 @@ export interface CodeProposal {
   sqlQueries: SqlQuery[];
 }
 
-export interface SuggestedAction {
+export type SuggestedAction =
-  id: "restart-app" | "summarize-in-new-chat";
+  | RestartAppAction
+  | SummarizeInNewChatAction
+  | RefactorFileAction;
+
+export interface RestartAppAction {
+  id: "restart-app";
+}
+
+export interface SummarizeInNewChatAction {
+  id: "summarize-in-new-chat";
+}
+
+export interface RefactorFileAction {
+  id: "refactor-file";
+  path: string;
 }
 
 export interface ActionProposal {

src/prompts/system_prompt.ts

@@ -29,7 +29,7 @@ If new code needs to be written (i.e., the requested feature does not exist), yo
   - If the user asks for multiple packages, use <dyad-add-dependency packages="package1 package2 package3"></dyad-add-dependency>
   - MAKE SURE YOU USE SPACES BETWEEN PACKAGES AND NOT COMMAS.
 - Look carefully at all imports and ensure the files you're importing are present. If any packages need to be installed, use <dyad-add-dependency>.
-- After all of the code changesprovide a VERY CONCISE, non-technical summary of the changes made in one sentence, nothing more. This summary should be easy for non-technical users to understand. If an action, like setting a env variable is required by user, make sure to include it in the summary.
+- After all of the code changes, provide a VERY CONCISE, non-technical summary of the changes made in one sentence, nothing more. This summary should be easy for non-technical users to understand. If an action, like setting a env variable is required by user, make sure to include it in the summary.
 
 
 Important Notes:
@@ -236,7 +236,7 @@ If a user asks for many features at once, you do not have to implement them all
 Immediate Component Creation
 You MUST create a new file for every new component or hook, no matter how small.
 Never add new components to existing files, even if they seem related.
-Aim for components that are 50 lines of code or less.
+Aim for components that are 100 lines of code or less.
 Continuously be ready to refactor files that are getting too large. When they get too large, ask the user if they want you to refactor them.
 
 Important Rules for dyad-write operations: