Fixed chat-history view

Author: Ruben Gomez

polaris/components/base.js

@@ -167,8 +167,9 @@ class BaseComponent extends HTMLElement {
         text = text.replace(/_orakle_loading_signal_\|([^ \n]+)/gm, '<span class="orakle-skill" title="Orakle Skill">$1</span>');
 
         // Extract and replace triple backtick code blocks
-        text = text.replace(/```([\s\S]*?)```/gm, (match, content) => {
+        text = text.replace(/```([^ \n]+)([\s\S]*?)```/gm, (match, codetype, content) => {
             codeBlocks.push(`<div class="code-block-wrapper">
+                <span class="code-type">${codetype}</span>
                 <button class="copy-btn" onclick="navigator.clipboard.writeText(this.nextElementSibling.textContent)">Copy</button>
                 <code>${content}</code>
             </div>`);

polaris/components/document-view.css

@@ -205,6 +205,23 @@ code {
     position: relative;
     margin: 8px 4px;
 }
+.code-type {
+    position: absolute;
+    top: 4px;
+    left: 8px;
+    font-family: 'Menlo', 'Consolas', monospace;
+    font-size: 14px;
+    line-height: 1.5;
+    white-space: pre-wrap;
+    display: inline-block;
+    max-width: 98%;
+    border-radius: 5px;
+    margin: 4px;
+    /* padding: 2px 4px; */
+    /* background-color: #444; */
+    font-weight: bold;
+    color: #FFF;
+}
 .copy-btn {
     position: absolute;
     top: 8px;
@@ -227,4 +244,5 @@ code {
     display: block;
     padding: 12px;
     margin: 0;
+    margin-top: 40px;
 }