Chat page is broken - Throws error when the chat reponse has code snippet

[raolak]

Describe the bug
When the chat response has code blocks then rendering is throwing error

Unexpected Application Error!
Cannot assign to read only property '0' of string 'import { defineConfig } from 'modernjs-builder'; export default defineConfig({ source: { entries: { main: './src/index.js', }, }, output: { path: './dist', filename: '[name].[hash].js', publicPath: '/', }, devServer: { port: 8082, open: true, hot: true, }, module: { rules: [ { test: /.tsx?$/, use: 'ts-loader', exclude: /node_modules/, }, { test: /.css$/, use: ['style-loader', 'css-loader'], }, ], }, resolve: { extensions: ['.ts', '.tsx', '.js'], }, plugins: [], }); '

Example content unable to render
my-todo-app/
├── public/
│ └── index.html
├── src/
│ ├── components/
│ │ ├── TodoItem.js
│ │ └── TodoList.js
│ ├── App.js
│ └── index.js
├── .gitignore
├── package.json
├── README.md
└── webpack.config.js

...

Possible fix...wrap the chat message with Markdown renderers like ReactMarkdown ..or provide specialised Renderer based on chat repsponse that UI can decide which renderer to use ...thats chat response will be processed through chain of renderers to provide both static and dynamic treatment to chat response...

For quick fix
import ReactMarkdown from 'react-markdown';
{chatMessage}