"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ModelVersions = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
/**
 * ModelVersions Component
 *
 * Displays version history for a model and allows rollback to previous versions
 */
const ModelVersions = ({ modelId, currentVersion, onRollback, onVersionSelect, loading: propLoading = false, error: propError = '' }) => {
    // State for versions, loading status, and errors
    const [versions, setVersions] = (0, react_1.useState)([]);
    const [loading, setLoading] = (0, react_1.useState)(propLoading);
    const [error, setError] = (0, react_1.useState)(propError || null);
    // Mock data for demonstration purposes
    // In a real implementation, this would be fetched from an API
    (0, react_1.useEffect)(() => {
        const fetchVersions = async () => {
            setLoading(true);
            try {
                // Mock API call delay
                await new Promise(resolve => setTimeout(resolve, 500));
                // Mock version data
                const mockVersions = [
                    {
                        version: currentVersion,
                        status: 'active',
                        created_at: new Date().toISOString(),
                        deployed_at: new Date().toISOString(),
                        deployment_id: 'dep-1234',
                        rollback_eligible: false,
                        metrics: {
                            accuracy: 0.92,
                            latency: 450,
                            throughput: 35,
                            error_rate: 0.02
                        },
                        changelog: 'Current production version'
                    },
                    {
                        version: getVersionDecrement(currentVersion, 1),
                        status: 'archived',
                        created_at: new Date(Date.now() - 7 * 24 * 60 * 60 * 1000).toISOString(),
                        deployed_at: new Date(Date.now() - 7 * 24 * 60 * 60 * 1000).toISOString(),
                        deployment_id: 'dep-1233',
                        rollback_eligible: true,
                        metrics: {
                            accuracy: 0.90,
                            latency: 470,
                            throughput: 33,
                            error_rate: 0.03
                        },
                        changelog: 'Improved response quality and reduced latency'
                    },
                    {
                        version: getVersionDecrement(currentVersion, 2),
                        status: 'archived',
                        created_at: new Date(Date.now() - 14 * 24 * 60 * 60 * 1000).toISOString(),
                        deployed_at: new Date(Date.now() - 14 * 24 * 60 * 60 * 1000).toISOString(),
                        deployment_id: 'dep-1232',
                        rollback_eligible: true,
                        metrics: {
                            accuracy: 0.88,
                            latency: 490,
                            throughput: 30,
                            error_rate: 0.04
                        },
                        changelog: 'Added new capabilities and improved error handling'
                    },
                    {
                        version: getVersionDecrement(currentVersion, 3),
                        status: 'archived',
                        created_at: new Date(Date.now() - 21 * 24 * 60 * 60 * 1000).toISOString(),
                        deployed_at: new Date(Date.now() - 21 * 24 * 60 * 60 * 1000).toISOString(),
                        deployment_id: 'dep-1231',
                        rollback_eligible: true,
                        metrics: {
                            accuracy: 0.85,
                            latency: 520,
                            throughput: 28,
                            error_rate: 0.05
                        },
                        changelog: 'Initial production deployment'
                    }
                ];
                setVersions(mockVersions);
                setError(null);
            }
            catch (err) {
                setError(`Failed to fetch version history: ${err instanceof Error ? err.message : 'Unknown error'}`);
            }
            finally {
                setLoading(false);
            }
        };
        fetchVersions();
    }, [modelId, currentVersion]);
    const handleRollback = (version) => {
        if (window.confirm(`Are you sure you want to roll back to version ${version}? This will affect all deployments.`)) {
            onRollback?.(version);
        }
    };
    // Utility function to decrement a semantic version
    function getVersionDecrement(version, decrement) {
        // Split version into parts
        const versionParts = version.split('.');
        const major = parseInt(versionParts[0], 10);
        const minor = parseInt(versionParts[1], 10);
        const patch = parseInt(versionParts[2].split('-')[0], 10);
        // Calculate decremented version
        // This is a simplified approach; a more complex implementation would handle
        // semantic versioning more thoroughly
        let newPatch = patch - decrement;
        let newMinor = minor;
        let newMajor = major;
        if (newPatch < 0) {
            newPatch = 0;
            newMinor -= 1;
            if (newMinor < 0) {
                newMinor = 0;
                newMajor = Math.max(0, newMajor - 1);
            }
        }
        return `${newMajor}.${newMinor}.${newPatch}`;
    }
    // Helper to format dates
    const formatDate = (dateString) => {
        const date = new Date(dateString);
        return date.toLocaleDateString() + ' ' + date.toLocaleTimeString();
    };
    if (loading && versions.length === 0) {
        return ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-center h-64", children: [(0, jsx_runtime_1.jsx)("div", { className: "animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600" }), (0, jsx_runtime_1.jsx)("span", { className: "ml-3 text-gray-600", children: "Loading version history..." })] }));
    }
    if (error && versions.length === 0) {
        return ((0, jsx_runtime_1.jsxs)("div", { className: "bg-red-50 border border-red-200 text-red-700 px-4 py-3 rounded mb-4", role: "alert", children: [(0, jsx_runtime_1.jsx)("p", { className: "font-medium", children: "Error" }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm", children: error }), (0, jsx_runtime_1.jsx)("button", { className: "mt-2 text-sm text-red-700 underline", onClick: () => window.location.reload(), children: "Retry" })] }));
    }
    return ((0, jsx_runtime_1.jsxs)("div", { className: "model-versions-container", children: [loading && versions.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { className: "text-blue-600 flex items-center mb-4", children: [(0, jsx_runtime_1.jsxs)("svg", { className: "animate-spin -ml-1 mr-2 h-4 w-4", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", children: [(0, jsx_runtime_1.jsx)("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), (0, jsx_runtime_1.jsx)("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })] }), (0, jsx_runtime_1.jsx)("span", { children: "Refreshing version history..." })] })), error && versions.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { className: "bg-red-50 border border-red-200 text-red-700 px-4 py-3 rounded mb-4", role: "alert", children: [(0, jsx_runtime_1.jsx)("p", { className: "font-medium", children: "Error" }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm", children: error })] })), (0, jsx_runtime_1.jsx)("div", { className: "overflow-x-auto", children: (0, jsx_runtime_1.jsxs)("table", { className: "w-full border-collapse", children: [(0, jsx_runtime_1.jsx)("thead", { children: (0, jsx_runtime_1.jsxs)("tr", { className: "bg-gray-100 border-b", children: [(0, jsx_runtime_1.jsx)("th", { className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Version" }), (0, jsx_runtime_1.jsx)("th", { className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Status" }), (0, jsx_runtime_1.jsx)("th", { className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Created" }), (0, jsx_runtime_1.jsx)("th", { className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Deployed" }), (0, jsx_runtime_1.jsx)("th", { className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Metrics" }), (0, jsx_runtime_1.jsx)("th", { className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Changelog" }), (0, jsx_runtime_1.jsx)("th", { className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Actions" })] }) }), (0, jsx_runtime_1.jsx)("tbody", { className: "bg-white divide-y divide-gray-200", children: versions.map((version, index) => ((0, jsx_runtime_1.jsxs)("tr", { className: `hover:bg-gray-50 ${version.version === currentVersion ? 'bg-blue-50' : ''}`, children: [(0, jsx_runtime_1.jsx)("td", { className: "px-6 py-4 whitespace-nowrap", children: (0, jsx_runtime_1.jsxs)("div", { className: "font-medium text-gray-900", children: [version.version, version.version === currentVersion && ((0, jsx_runtime_1.jsx)("span", { className: "ml-2 inline-block px-2 py-1 text-xs font-medium rounded-full bg-blue-100 text-blue-800", children: "Current" }))] }) }), (0, jsx_runtime_1.jsx)("td", { className: "px-6 py-4 whitespace-nowrap", children: (0, jsx_runtime_1.jsx)("span", { className: `inline-block px-2 py-1 text-xs font-medium rounded-full ${version.status === 'active' ? 'bg-green-100 text-green-800' :
                                                version.status === 'archived' ? 'bg-yellow-100 text-yellow-800' :
                                                    version.status === 'failed' ? 'bg-red-100 text-red-800' :
                                                        'bg-gray-100 text-gray-800'}`, children: version.status.charAt(0).toUpperCase() + version.status.slice(1) }) }), (0, jsx_runtime_1.jsx)("td", { className: "px-6 py-4 whitespace-nowrap text-sm text-gray-500", children: formatDate(version.created_at) }), (0, jsx_runtime_1.jsx)("td", { className: "px-6 py-4 whitespace-nowrap text-sm text-gray-500", children: version.deployed_at ? formatDate(version.deployed_at) : '-' }), (0, jsx_runtime_1.jsx)("td", { className: "px-6 py-4 whitespace-nowrap", children: version.metrics ? ((0, jsx_runtime_1.jsxs)("div", { className: "text-sm", children: [(0, jsx_runtime_1.jsxs)("div", { children: ["Accuracy: ", (version.metrics.accuracy * 100).toFixed(1), "%"] }), (0, jsx_runtime_1.jsxs)("div", { children: ["Latency: ", version.metrics.latency, "ms"] }), (0, jsx_runtime_1.jsxs)("div", { children: ["Error rate: ", (version.metrics.error_rate * 100).toFixed(1), "%"] })] })) : ((0, jsx_runtime_1.jsx)("span", { className: "text-sm text-gray-500", children: "No metrics" })) }), (0, jsx_runtime_1.jsx)("td", { className: "px-6 py-4", children: (0, jsx_runtime_1.jsx)("div", { className: "text-sm text-gray-900 max-w-xs truncate", children: version.changelog || '-' }) }), (0, jsx_runtime_1.jsxs)("td", { className: "px-6 py-4 whitespace-nowrap text-sm font-medium", children: [version.rollback_eligible && version.version !== currentVersion && ((0, jsx_runtime_1.jsx)("button", { onClick: () => handleRollback(version.version), className: "text-blue-600 hover:text-blue-900", disabled: loading, children: "Roll back" })), !version.rollback_eligible && version.version !== currentVersion && ((0, jsx_runtime_1.jsx)("span", { className: "text-gray-400 cursor-not-allowed", children: "Roll back" })), version.version === currentVersion && ((0, jsx_runtime_1.jsx)("span", { className: "text-gray-400", children: "Current version" }))] })] }, version.version))) })] }) }), versions.length === 0 && !loading && !error && ((0, jsx_runtime_1.jsxs)("div", { className: "text-center py-8", children: [(0, jsx_runtime_1.jsx)("svg", { className: "w-16 h-16 mx-auto text-gray-400", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1, d: "M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" }) }), (0, jsx_runtime_1.jsx)("h3", { className: "mt-2 text-sm font-medium text-gray-900", children: "No version history" }), (0, jsx_runtime_1.jsx)("p", { className: "mt-1 text-sm text-gray-500", children: "This model doesn't have any version history yet." })] }))] }));
};
exports.ModelVersions = ModelVersions;
//# sourceMappingURL=ModelVersions.js.map