Improve JsonView component styling and change to use JsonView in PromptsTab

This commit is contained in:
cgoing
2025-03-27 10:49:37 +09:00
parent 196fd67ce9
commit e6f5da8383
3 changed files with 22 additions and 22 deletions

View File

@@ -54,17 +54,14 @@ const ToolsTab = ({
return (
<>
<h4 className="font-semibold mb-2">Invalid Tool Result:</h4>
<pre className="bg-gray-50 dark:bg-gray-800 dark:text-gray-100 p-4 rounded text-sm overflow-auto max-h-64">
<div className="p-4 border rounded">
<JsonView data={escapeUnicode(toolResult)} />
</pre>
</div>
<h4 className="font-semibold mb-2">Errors:</h4>
{parsedResult.error.errors.map((error, idx) => (
<pre
key={idx}
className="bg-gray-50 dark:bg-gray-800 dark:text-gray-100 p-4 rounded text-sm overflow-auto max-h-64"
>
<div key={idx} className="p-4 border rounded">
<JsonView data={escapeUnicode(error)} />
</pre>
</div>
))}
</>
);
@@ -80,9 +77,9 @@ const ToolsTab = ({
{structuredResult.content.map((item, index) => (
<div key={index} className="mb-2">
{item.type === "text" && (
<pre className="bg-gray-50 dark:bg-gray-800 dark:text-gray-100 p-4 rounded text-sm overflow-auto max-h-64">
<div className="p-4 border rounded">
<JsonView data={item.text} />
</pre>
</div>
)}
{item.type === "image" && (
<img
@@ -101,9 +98,9 @@ const ToolsTab = ({
<p>Your browser does not support audio playback</p>
</audio>
) : (
<pre className="bg-gray-50 dark:bg-gray-800 dark:text-gray-100 whitespace-pre-wrap break-words p-4 rounded text-sm overflow-auto max-h-64">
<div className="p-4 border rounded">
<JsonView data={escapeUnicode(item.resource)} />
</pre>
</div>
))}
</div>
))}
@@ -113,9 +110,9 @@ const ToolsTab = ({
return (
<>
<h4 className="font-semibold mb-2">Tool Result (Legacy):</h4>
<pre className="bg-gray-50 dark:bg-gray-800 dark:text-gray-100 p-4 rounded text-sm overflow-auto max-h-64">
<div className="p-4 border rounded">
<JsonView data={escapeUnicode(toolResult.toolResult)} />
</pre>
</div>
</>
);
}