"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.PromptLibrary = 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 Input_1 = require("../forms/Input");
const Textarea_1 = require("../forms/Textarea");
const PromptLibrary = ({ onPromptSelect, onPromptSave, allowCustomPrompts = true, showUsageStats = true, categories = ['General', 'Code', 'Writing', 'Analysis', 'Creative'], }) => {
    const [prompts, setPrompts] = (0, react_1.useState)([]);
    const [filteredPrompts, setFilteredPrompts] = (0, react_1.useState)([]);
    const [searchTerm, setSearchTerm] = (0, react_1.useState)('');
    const [selectedCategory, setSelectedCategory] = (0, react_1.useState)('All');
    const [showCreateModal, setShowCreateModal] = (0, react_1.useState)(false);
    const [isLoading, setIsLoading] = (0, react_1.useState)(true);
    (0, react_1.useEffect)(() => {
        const fetchPrompts = async () => {
            setIsLoading(true);
            try {
                // Mock data
                const mockPrompts = [
                    {
                        id: '1',
                        title: 'Code Review Assistant',
                        description: 'Analyze code for best practices, performance, and security issues',
                        content: 'Please review the following {language} code for:\n1. Best practices\n2. Performance optimizations\n3. Security vulnerabilities\n4. Code readability\n\nCode:\n```{language}\n{code}\n```',
                        category: 'Code',
                        tags: ['review', 'security', 'performance'],
                        variables: ['language', 'code'],
                        usageCount: 45,
                        lastUsed: new Date('2024-01-15'),
                        author: 'System',
                    },
                    {
                        id: '2',
                        title: 'Technical Documentation',
                        description: 'Generate comprehensive technical documentation',
                        content: 'Create detailed technical documentation for {project_name}:\n\n## Overview\n{overview}\n\n## Features\n{features}\n\n## Installation\n{installation_steps}\n\n## Usage\n{usage_examples}\n\n## API Reference\n{api_details}',
                        category: 'Writing',
                        tags: ['documentation', 'technical', 'api'],
                        variables: ['project_name', 'overview', 'features', 'installation_steps', 'usage_examples', 'api_details'],
                        usageCount: 23,
                        lastUsed: new Date('2024-01-14'),
                        author: 'User',
                    },
                ];
                setPrompts(mockPrompts);
                setFilteredPrompts(mockPrompts);
            }
            catch (error) {
                console.error('Failed to fetch prompts:', error);
            }
            finally {
                setIsLoading(false);
            }
        };
        fetchPrompts();
    }, []);
    (0, react_1.useEffect)(() => {
        let filtered = prompts;
        if (searchTerm) {
            filtered = filtered.filter(prompt => prompt.title.toLowerCase().includes(searchTerm.toLowerCase()) ||
                prompt.description.toLowerCase().includes(searchTerm.toLowerCase()) ||
                prompt.tags.some(tag => tag.toLowerCase().includes(searchTerm.toLowerCase())));
        }
        if (selectedCategory !== 'All') {
            filtered = filtered.filter(prompt => prompt.category === selectedCategory);
        }
        setFilteredPrompts(filtered);
    }, [prompts, searchTerm, selectedCategory]);
    const allCategories = ['All', ...categories];
    return ((0, jsx_runtime_1.jsx)(Card_1.Card, { className: "prompt-library", children: (0, jsx_runtime_1.jsxs)("div", { className: "p-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex justify-between items-center mb-6", children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-lg font-semibold", children: "Prompt Library" }), allowCustomPrompts && ((0, jsx_runtime_1.jsx)(Button_1.Button, { onClick: () => setShowCreateModal(true), children: "Create Prompt" }))] }), (0, jsx_runtime_1.jsxs)("div", { className: "mb-6 space-y-4", children: [(0, jsx_runtime_1.jsx)(Input_1.Input, { type: "text", placeholder: "Search prompts...", value: searchTerm, onChange: (e) => setSearchTerm(e.target.value), className: "w-full" }), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-wrap gap-2", children: allCategories.map((category) => ((0, jsx_runtime_1.jsx)("button", { onClick: () => setSelectedCategory(category), className: `px-3 py-1 rounded-full text-sm font-medium transition-colors ${selectedCategory === category
                                    ? 'bg-blue-500 text-white'
                                    : 'bg-gray-100 text-gray-700 hover:bg-gray-200'}`, children: category }, category))) })] }), isLoading ? ((0, jsx_runtime_1.jsx)("div", { className: "space-y-4", children: [...Array(3)].map((_, i) => ((0, jsx_runtime_1.jsxs)("div", { className: "animate-pulse border rounded-lg p-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "h-4 bg-gray-200 rounded w-1/3 mb-2" }), (0, jsx_runtime_1.jsx)("div", { className: "h-3 bg-gray-200 rounded w-full mb-3" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex space-x-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "h-6 bg-gray-200 rounded w-16" }), (0, jsx_runtime_1.jsx)("div", { className: "h-6 bg-gray-200 rounded w-16" })] })] }, i))) })) : ((0, jsx_runtime_1.jsx)("div", { className: "space-y-4", children: filteredPrompts.map((prompt) => ((0, jsx_runtime_1.jsx)(PromptCard, { prompt: prompt, showUsageStats: showUsageStats, onSelect: onPromptSelect }, prompt.id))) })), showCreateModal && ((0, jsx_runtime_1.jsx)(CreatePromptModal, { categories: categories, onSave: (prompt) => {
                        onPromptSave?.(prompt);
                        setShowCreateModal(false);
                    }, onClose: () => setShowCreateModal(false) }))] }) }));
};
exports.PromptLibrary = PromptLibrary;
const PromptCard = ({ prompt, showUsageStats, onSelect }) => {
    return ((0, jsx_runtime_1.jsxs)("div", { className: "border border-gray-200 rounded-lg p-4 hover:border-gray-300 transition-colors", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex justify-between items-start mb-2", children: [(0, jsx_runtime_1.jsx)("h4", { className: "font-medium text-gray-900", children: prompt.title }), (0, jsx_runtime_1.jsx)("span", { className: "px-2 py-1 bg-blue-100 text-blue-800 text-xs rounded-full", children: prompt.category })] }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-gray-600 mb-3", children: prompt.description }), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-wrap gap-1 mb-3", children: prompt.tags.map((tag) => ((0, jsx_runtime_1.jsxs)("span", { className: "px-2 py-1 bg-gray-100 text-gray-700 text-xs rounded", children: ["#", tag] }, tag))) }), prompt.variables.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { className: "mb-3", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-xs text-gray-500", children: "Variables: " }), (0, jsx_runtime_1.jsx)("span", { className: "text-xs text-gray-700", children: prompt.variables.map(v => `{${v}}`).join(', ') })] })), (0, jsx_runtime_1.jsxs)("div", { className: "flex justify-between items-center", children: [showUsageStats && ((0, jsx_runtime_1.jsxs)("div", { className: "text-xs text-gray-500", children: ["Used ", prompt.usageCount, " times", prompt.lastUsed && ` • Last used ${prompt.lastUsed.toLocaleDateString()}`] })), (0, jsx_runtime_1.jsx)(Button_1.Button, { size: "sm", onClick: () => onSelect?.(prompt), children: "Use Prompt" })] })] }));
};
const CreatePromptModal = ({ categories, onSave, onClose }) => {
    const [title, setTitle] = (0, react_1.useState)('');
    const [description, setDescription] = (0, react_1.useState)('');
    const [content, setContent] = (0, react_1.useState)('');
    const [category, setCategory] = (0, react_1.useState)(categories[0] || 'General');
    const [tags, setTags] = (0, react_1.useState)('');
    const extractVariables = (content) => {
        const matches = content.match(/\{([^}]+)\}/g);
        return matches ? [...new Set(matches.map(m => m.slice(1, -1)))] : [];
    };
    const handleSave = () => {
        if (!title.trim() || !content.trim())
            return;
        const variables = extractVariables(content);
        const tagArray = tags.split(',').map(tag => tag.trim()).filter(Boolean);
        onSave({
            title: title.trim(),
            description: description.trim(),
            content: content.trim(),
            category,
            tags: tagArray,
            variables,
            author: 'User',
        });
    };
    return ((0, jsx_runtime_1.jsx)("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50", children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-white rounded-lg p-6 w-full max-w-2xl max-h-[90vh] overflow-y-auto", children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-lg font-semibold mb-4", children: "Create New Prompt" }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [(0, jsx_runtime_1.jsx)(Input_1.Input, { type: "text", placeholder: "Prompt title", value: title, onChange: (e) => setTitle(e.target.value) }), (0, jsx_runtime_1.jsx)(Textarea_1.Textarea, { placeholder: "Description", value: description, onChange: (e) => setDescription(e.target.value), rows: 2 }), (0, jsx_runtime_1.jsxs)("div", { className: "flex space-x-4", children: [(0, jsx_runtime_1.jsx)("select", { value: category, onChange: (e) => setCategory(e.target.value), className: "border rounded px-3 py-2", children: categories.map((cat) => ((0, jsx_runtime_1.jsx)("option", { value: cat, children: cat }, cat))) }), (0, jsx_runtime_1.jsx)(Input_1.Input, { type: "text", placeholder: "Tags (comma-separated)", value: tags, onChange: (e) => setTags(e.target.value), className: "flex-1" })] }), (0, jsx_runtime_1.jsx)(Textarea_1.Textarea, { placeholder: "Prompt content (use {variable_name} for variables)", value: content, onChange: (e) => setContent(e.target.value), rows: 8 }), extractVariables(content).length > 0 && ((0, jsx_runtime_1.jsxs)("div", { className: "text-sm text-gray-600", children: ["Variables detected: ", extractVariables(content).map(v => `{${v}}`).join(', ')] }))] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex justify-end space-x-3 mt-6", children: [(0, jsx_runtime_1.jsx)(Button_1.Button, { variant: "outline", onClick: onClose, children: "Cancel" }), (0, jsx_runtime_1.jsx)(Button_1.Button, { onClick: handleSave, disabled: !title.trim() || !content.trim(), children: "Save Prompt" })] })] }) }));
};
exports.default = exports.PromptLibrary;
//# sourceMappingURL=PromptLibrary.js.map