"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ResponseAnalyzer = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const Card_1 = require("../common/Card");
const Button_1 = require("../forms/Button");
const Textarea_1 = require("../forms/Textarea");
const ResponseAnalyzer = ({ autoAnalyze = true, showDetailedMetrics = true, showImprovements = true, onAnalysisComplete, }) => {
    const [responseText, setResponseText] = (0, react_1.useState)('');
    const [analysisResult, setAnalysisResult] = (0, react_1.useState)(null);
    const [isAnalyzing, setIsAnalyzing] = (0, react_1.useState)(false);
    const analyzeResponse = async () => {
        if (!responseText.trim())
            return;
        setIsAnalyzing(true);
        try {
            // Mock analysis - replace with actual API call
            await new Promise(resolve => setTimeout(resolve, 1500));
            const mockResult = {
                qualityScore: 85,
                sentiment: 'positive',
                tone: ['professional', 'informative', 'friendly'],
                readabilityScore: 78,
                factualityScore: 92,
                helpfulnessScore: 88,
                keyPoints: [
                    'Clear explanation of the concept',
                    'Practical examples provided',
                    'Step-by-step approach',
                ],
                suggestedImprovements: [
                    'Add more specific examples',
                    'Include visual diagrams',
                    'Simplify technical jargon',
                ],
                wordCount: responseText.split(/\s+/).length,
                complexity: 'moderate',
            };
            setAnalysisResult(mockResult);
            onAnalysisComplete?.(mockResult);
        }
        catch (error) {
            console.error('Analysis failed:', error);
        }
        finally {
            setIsAnalyzing(false);
        }
    };
    (0, react_1.useEffect)(() => {
        if (autoAnalyze && responseText.trim() && responseText.length > 50) {
            const debounceTimer = setTimeout(() => {
                analyzeResponse();
            }, 1000);
            return () => clearTimeout(debounceTimer);
        }
    }, [responseText, autoAnalyze]);
    const getScoreColor = (score) => {
        if (score >= 80)
            return 'text-green-600';
        if (score >= 60)
            return 'text-yellow-600';
        return 'text-red-600';
    };
    const getSentimentIcon = (sentiment) => {
        switch (sentiment) {
            case 'positive':
                return '😊';
            case 'negative':
                return '😟';
            default:
                return '😐';
        }
    };
    return ((0, jsx_runtime_1.jsx)(Card_1.Card, { className: "response-analyzer", children: (0, jsx_runtime_1.jsxs)("div", { className: "p-6", children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-lg font-semibold mb-6", children: "AI Response Analyzer" }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-6", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { className: "block text-sm font-medium text-gray-700 mb-2", children: "Paste AI Response to Analyze" }), (0, jsx_runtime_1.jsx)(Textarea_1.Textarea, { value: responseText, onChange: (e) => setResponseText(e.target.value), placeholder: "Enter the AI response you want to analyze...", rows: 6, className: "w-full" }), (0, jsx_runtime_1.jsxs)("div", { className: "mt-2 flex justify-between items-center", children: [(0, jsx_runtime_1.jsxs)("span", { className: "text-sm text-gray-500", children: [responseText.split(/\s+/).filter(Boolean).length, " words"] }), !autoAnalyze && ((0, jsx_runtime_1.jsx)(Button_1.Button, { onClick: analyzeResponse, disabled: !responseText.trim() || isAnalyzing, loading: isAnalyzing, children: "Analyze Response" }))] })] }), isAnalyzing && ((0, jsx_runtime_1.jsxs)("div", { className: "text-center py-8", children: [(0, jsx_runtime_1.jsx)("div", { className: "inline-block animate-spin rounded-full h-8 w-8 border-b-2 border-blue-500" }), (0, jsx_runtime_1.jsx)("p", { className: "mt-2 text-sm text-gray-600", children: "Analyzing response..." })] })), analysisResult && !isAnalyzing && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "bg-gray-50 rounded-lg p-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-center", children: [(0, jsx_runtime_1.jsx)("div", { className: `text-5xl font-bold ${getScoreColor(analysisResult.qualityScore)}`, children: analysisResult.qualityScore }), (0, jsx_runtime_1.jsx)("div", { className: "text-sm text-gray-600 mt-1", children: "Overall Quality Score" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "mt-4 flex justify-center items-center space-x-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-center", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-2xl", children: getSentimentIcon(analysisResult.sentiment) }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-gray-600 capitalize", children: analysisResult.sentiment })] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-center", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-sm font-medium text-gray-700", children: analysisResult.complexity }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-gray-600", children: "Complexity" })] })] })] }), showDetailedMetrics && ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h4", { className: "font-medium text-gray-900 mb-4", children: "Detailed Metrics" }), (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [(0, jsx_runtime_1.jsx)(MetricCard, { label: "Readability", score: analysisResult.readabilityScore, icon: "\uD83D\uDCD6" }), (0, jsx_runtime_1.jsx)(MetricCard, { label: "Factuality", score: analysisResult.factualityScore, icon: "\u2713" }), (0, jsx_runtime_1.jsx)(MetricCard, { label: "Helpfulness", score: analysisResult.helpfulnessScore, icon: "\uD83D\uDCA1" })] })] })), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h4", { className: "font-medium text-gray-900 mb-3", children: "Tone Analysis" }), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-wrap gap-2", children: analysisResult.tone.map((tone) => ((0, jsx_runtime_1.jsx)("span", { className: "px-3 py-1 bg-blue-100 text-blue-800 rounded-full text-sm", children: tone }, tone))) })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h4", { className: "font-medium text-gray-900 mb-3", children: "Key Points" }), (0, jsx_runtime_1.jsx)("ul", { className: "space-y-2", children: analysisResult.keyPoints.map((point, index) => ((0, jsx_runtime_1.jsxs)("li", { className: "flex items-start", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-green-500 mr-2", children: "\u2713" }), (0, jsx_runtime_1.jsx)("span", { className: "text-sm text-gray-700", children: point })] }, index))) })] }), showImprovements && analysisResult.suggestedImprovements.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h4", { className: "font-medium text-gray-900 mb-3", children: "Suggested Improvements" }), (0, jsx_runtime_1.jsx)("ul", { className: "space-y-2", children: analysisResult.suggestedImprovements.map((improvement, index) => ((0, jsx_runtime_1.jsxs)("li", { className: "flex items-start", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-yellow-500 mr-2", children: "!" }), (0, jsx_runtime_1.jsx)("span", { className: "text-sm text-gray-700", children: improvement })] }, index))) })] }))] }))] })] }) }));
};
exports.ResponseAnalyzer = ResponseAnalyzer;
const MetricCard = ({ label, score, icon }) => {
    const getScoreColor = (score) => {
        if (score >= 80)
            return 'bg-green-100 text-green-800';
        if (score >= 60)
            return 'bg-yellow-100 text-yellow-800';
        return 'bg-red-100 text-red-800';
    };
    return ((0, jsx_runtime_1.jsxs)("div", { className: "bg-white border rounded-lg p-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between mb-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-sm font-medium text-gray-700", children: label }), (0, jsx_runtime_1.jsx)("span", { className: "text-xl", children: icon })] }), (0, jsx_runtime_1.jsxs)("div", { className: `text-2xl font-bold rounded px-2 py-1 text-center ${getScoreColor(score)}`, children: [score, "%"] })] }));
};
exports.default = exports.ResponseAnalyzer;
//# sourceMappingURL=ResponseAnalyzer.js.map