fix: Proper markdown when generating and rendering tasks (#595)

* fix: Proper markdown when genertaing and rendering tasks

* cr

apps/open-swe/src/graphs/planner/nodes/generate-plan/prompt.ts

@@ -59,6 +59,8 @@ When ready, call the 'session_plan' tool with your plan. Each plan item should b
 Structure your plan items as clear directives, for example:
 - "Implement function X in file Y that performs Z using the existing pattern from file A"
 - "Modify the authentication middleware in /src/auth.js to add rate limiting using the Express rate-limit package"
+
+Always format your plan items with proper markdown. Avoid large headers, but you may use bold, italics, code blocks/inline code, and other markdown elements to make your plan items more readable.
 </output_format>
 
 {CUSTOM_RULES}

apps/web/src/components/tasks/progress-bar.tsx

@@ -20,6 +20,7 @@ import {
   HoverCardContent,
   HoverCardTrigger,
 } from "@/components/ui/hover-card";
+import { InlineMarkdownText } from "../thread/markdown-text";
 
 interface ProgressBarProps {
   taskPlan?: TaskPlan;
@@ -240,7 +241,9 @@ export function ProgressBar({
                             : "Pending"}
                       </span>
                     </div>
-                    <p className="text-xs break-words">{item.plan}</p>
+                    <InlineMarkdownText className="text-xs break-words">
+                      {item.plan}
+                    </InlineMarkdownText>
                   </div>
                 </HoverCardContent>
               </HoverCard>

apps/web/src/components/thread/markdown-text.tsx

@@ -321,17 +321,12 @@ const InlineMarkdownTextImpl: FC<{ children: string; className?: string }> = ({
       if (match) {
         // If it's a code block, render as plain text to keep it inline
         return (
-          <span className={cn("font-mono text-sm", className)}>
-            {String(children)}
-          </span>
+          <span className={cn("font-mono", className)}>{String(children)}</span>
         );
       }
       return (
         <code
-          className={cn(
-            "bg-muted rounded px-1 py-0.5 font-mono text-sm",
-            className,
-          )}
+          className={cn("bg-muted rounded px-1 py-0.5 font-mono", className)}
           {...props}
         >
           {children}