diff --git a/web-console/src/dialogs/history-dialog/history-dialog.tsx b/web-console/src/dialogs/history-dialog/history-dialog.tsx
index 66656c7d948f..6b7f219e6471 100644
--- a/web-console/src/dialogs/history-dialog/history-dialog.tsx
+++ b/web-console/src/dialogs/history-dialog/history-dialog.tsx
@@ -60,7 +60,7 @@ export const HistoryDialog = React.memo(function HistoryDialog(props: HistoryDia
 
   let content: JSX.Element;
   if (historyRecords.length === 0) {
-    content = <div className="no-record">No history records available. Try setting 'druid.audit.destiation=sql' to record config changes in metadata store.</div>;
+    content = <div className="no-record">No history records available. Try setting &apos;druid.audit.destiation=sql&apos; to record config changes in metadata store.</div>;
   } else {
     content = (
       <Tabs animate renderActiveTabPanelOnly vertical defaultSelectedTabId={0}>