feat: merge UI/UX changes from psl feature branch into mark branch

[Tejasri-Microsoft]

This pull request introduces improvements to how JSON and Python-style dictionary blocks are rendered in streaming agent and buffer messages, making them more readable for users. The changes also enhance image rendering and downloading, and improve the overall layout and styling for message content.

Enhanced JSON/Python-dict rendering and UI improvements:

1. JSON/Python-dict formatting and rendering

• Added a new utility (jsonFormatter.ts) that detects raw JSON and Python-dict style blocks in agent and buffer messages, converting them into human-readable Markdown lists. This prevents raw JSON from appearing in the UI and supports both strict JSON and Python-like variants (e.g., single quotes, True/False/None keywords). ([src/App/src/utils/jsonFormatter.tsR1-R310](https://github.com/microsoft/Multi-Agent-Custom-Automation-Engine-Solution-Accelerator/pull/1054/files#diff-cb7c95f472bcc8ac2a7e23063ec5263afadce949774042fcac7e9e7fe13f631fR1-R310))
• Updated StreamingAgentMessage.tsx and StreamingBufferMessage.tsx to use the new formatJsonInText utility, so all agent and buffer messages automatically render embedded JSON/dict blocks as readable Markdown. ([[1]](https://github.com/microsoft/Multi-Agent-Custom-Automation-Engine-Solution-Accelerator/pull/1054/files#diff-c26ac18a584ecb7ae24ae119a199389d0de392a77282a6fe57e6ad91020be487R275-R310), [[2]](https://github.com/microsoft/Multi-Agent-Custom-Automation-Engine-Solution-Accelerator/pull/1054/files#diff-4e0fee9c0b039190c955318187b1fe9f7fd76d05c0ac3a5fbbe9574d76da6a2cR46-R47), [[3]](https://github.com/microsoft/Multi-Agent-Custom-Automation-Engine-Solution-Accelerator/pull/1054/files#diff-4e0fee9c0b039190c955318187b1fe9f7fd76d05c0ac3a5fbbe9574d76da6a2cR183-R204), [[4]](https://github.com/microsoft/Multi-Agent-Custom-Automation-Engine-Solution-Accelerator/pull/1054/files#diff-4e0fee9c0b039190c955318187b1fe9f7fd76d05c0ac3a5fbbe9574d76da6a2cR235-R253))

2. Improved image rendering and download handling

• Enhanced the image rendering in agent and buffer messages for better responsiveness and appearance (full width, contained, rounded corners). ([[1]](https://github.com/microsoft/Multi-Agent-Custom-Automation-Engine-Solution-Accelerator/pull/1054/files#diff-c26ac18a584ecb7ae24ae119a199389d0de392a77282a6fe57e6ad91020be487L222-R229), [[2]](https://github.com/microsoft/Multi-Agent-Custom-Automation-Engine-Solution-Accelerator/pull/1054/files#diff-4e0fee9c0b039190c955318187b1fe9f7fd76d05c0ac3a5fbbe9574d76da6a2cR183-R204), [[3]](https://github.com/microsoft/Multi-Agent-Custom-Automation-Engine-Solution-Accelerator/pull/1054/files#diff-4e0fee9c0b039190c955318187b1fe9f7fd76d05c0ac3a5fbbe9574d76da6a2cR235-R253))
• Improved the image download button logic to handle CORS issues gracefully: attempts to fetch and download images directly, with a fallback for non-CORS-enabled URLs. ([src/App/src/components/content/streaming/StreamingAgentMessage.tsxL242-R266](https://github.com/microsoft/Multi-Agent-Custom-Automation-Engine-Solution-Accelerator/pull/1054/files#diff-c26ac18a584ecb7ae24ae119a199389d0de392a77282a6fe57e6ad91020be487L242-R266))

3. Message layout and styling

• Improved the styling for paragraphs, headings, lists, and blockquotes in agent messages for better readability and consistent formatting. ([src/App/src/components/content/streaming/StreamingAgentMessage.tsxR275-R310](https://github.com/microsoft/Multi-Agent-Custom-Automation-Engine-Solution-Accelerator/pull/1054/files#diff-c26ac18a584ecb7ae24ae119a199389d0de392a77282a6fe57e6ad91020be487R275-R310))
• Adjusted message container styles for better alignment and to prevent overflow issues. ([[1]](https://github.com/microsoft/Multi-Agent-Custom-Automation-Engine-Solution-Accelerator/pull/1054/files#diff-c26ac18a584ecb7ae24ae119a199389d0de392a77282a6fe57e6ad91020be487R86-R88), [[2]](https://github.com/microsoft/Multi-Agent-Custom-Automation-Engine-Solution-Accelerator/pull/1054/files#diff-2dfb8255456c535073a19c5da801e8eeede754e2eb24a7a98b392daf90f1beebL64-R66))

4. UI logic for plan execution

• Modified plan streaming updates to remain hidden while approval prompts are pending, ensuring the approval action is presented at the correct step in the UI flow. ([src/App/src/components/content/PlanChat.tsxL90-R93](https://github.com/microsoft/Multi-Agent-Custom-Automation-Engine-Solution-Accelerator/pull/1054/files#diff-ab0bd447558f7a38a11957c0703fa820a391b2d368cb7a0830547cbcede2c0e2L90-R93))

These changes significantly improve the usability and readability of agent and buffer messages, especially when they contain structured data or images.## Purpose

• ...

Does this introduce a breaking change?

• Yes
• [x ] No

How to Test

• Get the code

git clone [repo-address]
cd [repo-name]
git checkout [branch-name]
npm install

• Test the code

What to Check

Verify that the following are valid

• ...

Other Information