From c016753f87cc18b69cbf04e3d869b91f4189036d Mon Sep 17 00:00:00 2001
From: Tahier Hussain <tahier@zipstack.com>
Date: Fri, 22 Nov 2024 16:23:55 +0530
Subject: [PATCH] Add markdown rendering support to WF and PS log components

---
 frontend/src/components/agency/display-logs/DisplayLogs.jsx    | 3 ++-
 .../src/components/custom-tools/display-logs/DisplayLogs.jsx   | 3 ++-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/agency/display-logs/DisplayLogs.jsx b/frontend/src/components/agency/display-logs/DisplayLogs.jsx
index 93cb7aca7..8afb4e1b2 100644
--- a/frontend/src/components/agency/display-logs/DisplayLogs.jsx
+++ b/frontend/src/components/agency/display-logs/DisplayLogs.jsx
@@ -1,5 +1,6 @@
 import { useEffect, useRef } from "react";
 import { Col, Row, Typography } from "antd";
+import ReactMarkdown from "markdown-to-jsx";
 
 import "./DisplayLogs.css";
 import { useSocketLogsStore } from "../../../store/socket-logs-store";
@@ -38,7 +39,7 @@ function DisplayLogs() {
               </Col>
               <Col span={8}>
                 <Typography className="display-logs-col">
-                  {log?.message}
+                  <ReactMarkdown>{log?.message}</ReactMarkdown>
                 </Typography>
               </Col>
               <Col span={2}>
diff --git a/frontend/src/components/custom-tools/display-logs/DisplayLogs.jsx b/frontend/src/components/custom-tools/display-logs/DisplayLogs.jsx
index f0f6b7bd0..6fe89195b 100644
--- a/frontend/src/components/custom-tools/display-logs/DisplayLogs.jsx
+++ b/frontend/src/components/custom-tools/display-logs/DisplayLogs.jsx
@@ -1,5 +1,6 @@
 import { useEffect, useRef } from "react";
 import { Col, Row, Typography } from "antd";
+import ReactMarkdown from "markdown-to-jsx";
 
 import "../../agency/display-logs/DisplayLogs.css";
 import { useSocketCustomToolStore } from "../../../store/socket-custom-tool";
@@ -49,7 +50,7 @@ function DisplayLogs() {
               </Col>
               <Col span={8}>
                 <Typography className="display-logs-col">
-                  {message?.message}
+                  <ReactMarkdown>{message?.message}</ReactMarkdown>
                 </Typography>
               </Col>
             </Row>