Render line breaks in our markdown block

[mrubens]

Saw this show up in the new thinking output

---

Important

Add remark-breaks plugin to render line breaks in markdown content in MarkdownBlock.tsx.

• Behavior:
  • Add remark-breaks to remarkPlugins in MarkdownBlock.tsx to render line breaks in markdown content.
• Dependencies:
  • Add remark-breaks to dependencies in package.json.

^{This description was created by for 4941b92. You can customize this summary. It will automatically update as commits are pushed.}

[roomote]

Thank you for your contribution! I've reviewed the changes and have some suggestions for improvement. The implementation looks clean and follows the existing pattern for adding remark plugins.

[roomote]

Consider adding a brief comment explaining why this plugin was added, for future maintainers:

Suggested change

	import remarkBreaks from "remark-breaks"
	import remarkBreaks from "remark-breaks" // Converts line breaks in markdown to <br> tags for better rendering in thinking output

[roomote]

Consider adding a test case for line break rendering in the existing test file at webview-ui/src/components/common/__tests__/MarkdownBlock.spec.tsx. This would help ensure the remark-breaks plugin works as expected and prevent regressions.

For example:

it('should render line breaks correctly with remark-breaks', async () => {
  const markdown = 'First line\nSecond line\nThird line';
  const { container } = render(<MarkdownBlock markdown={markdown} />);
  
  // Wait for content to be processed
  await screen.findByText(/First line/, { exact: false });
  
  // Check that line breaks are rendered as <br> tags
  const brElements = container.querySelectorAll('br');
  expect(brElements.length).toBe(2);
});

Also, I noticed that the p tag styling already has white-space: pre-wrap (line 119), which preserves line breaks. Could this potentially conflict with or duplicate the behavior of remark-breaks? It might be worth verifying that these two approaches work well together.