diff --git a/ui/litellm-dashboard/src/components/view_logs/GuardrailViewer/GuardrailViewer.tsx b/ui/litellm-dashboard/src/components/view_logs/GuardrailViewer/GuardrailViewer.tsx index 96d1da9162..ebacda497c 100644 --- a/ui/litellm-dashboard/src/components/view_logs/GuardrailViewer/GuardrailViewer.tsx +++ b/ui/litellm-dashboard/src/components/view_logs/GuardrailViewer/GuardrailViewer.tsx @@ -1,8 +1,9 @@ import React, { useState } from "react"; +import { Tooltip } from "antd"; import PresidioDetectedEntities from "./PresidioDetectedEntities"; import BedrockGuardrailDetails, { BedrockGuardrailResponse, -} from "@/components/view_logs/GuardrailViewer/BedrockGuardrailDetails" +} from "@/components/view_logs/GuardrailViewer/BedrockGuardrailDetails"; interface RecognitionMetadata { recognizer_name: string; @@ -44,9 +45,13 @@ const GuardrailViewer = ({ data }: GuardrailViewerProps) => { // Default to presidio for backwards compatibility const guardrailProvider = data.guardrail_provider ?? "presidio"; - if (!data) { - return null; - } + if (!data) return null; + + const isSuccess = + typeof data.guardrail_status === "string" && + data.guardrail_status.toLowerCase() === "success"; + + const tooltipTitle = isSuccess ? null : "Guardrail failed to run."; // Calculate total masked entities const totalMaskedEntities = data.masked_entity_count ? @@ -73,13 +78,18 @@ const GuardrailViewer = ({ data }: GuardrailViewerProps) => {

Guardrail Information

- - {data.guardrail_status} - + + {/* Header status chip with tooltip */} + + + {data.guardrail_status} + + + {totalMaskedEntities > 0 && ( {totalMaskedEntities} masked {totalMaskedEntities === 1 ? 'entity' : 'entities'} @@ -104,15 +114,18 @@ const GuardrailViewer = ({ data }: GuardrailViewerProps) => {
Status: - - {data.guardrail_status} - + + + {data.guardrail_status} + +
+
Start Time: @@ -158,6 +171,6 @@ const GuardrailViewer = ({ data }: GuardrailViewerProps) => { )}
); -} +}; -export default GuardrailViewer; \ No newline at end of file +export default GuardrailViewer;