function MainComponent() { const [activeTab, setActiveTab] = useState("generate"); const [field, setField] = useState(""); const [skillLevel, setSkillLevel] = useState("beginner"); const [questionType, setQuestionType] = useState("exam"); const [numQuestions, setNumQuestions] = useState(5); const [generatedQuestions, setGeneratedQuestions] = useState([]); const [loading, setLoading] = useState(false); const [error, setError] = useState(null); // Answer questions tab const [userQuestion, setUserQuestion] = useState(""); const [answer, setAnswer] = useState(""); const [answerLoading, setAnswerLoading] = useState(false); const generateQuestions = async ()=>{ if (!field.trim()) { setError("Please enter a field or subject"); return; } setLoading(true); setError(null); try { const prompt = `Generate ${numQuestions} ${questionType} questions for the field of "${field}" at ${skillLevel} level. For each question, provide: 1. The question text 2. If it's multiple choice, provide 4 options (A, B, C, D) 3. The correct answer 4. A brief explanation of the answer Make the questions appropriate for ${questionType === "exam" ? "examination purposes" : questionType === "classwork" ? "classroom activities" : questionType === "homework" ? "homework assignments" : "general text questions"}. Skill level: ${skillLevel} (adjust difficulty accordingly)`; const response = await fetch("/integrations/chat-gpt/conversationgpt4", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ messages: [ { role: "system", content: "You are an expert educator and question writer. Create high-quality, educational questions that are appropriate for the specified skill level and question type." }, { role: "user", content: prompt } ], json_schema: { name: "question_generator", schema: { type: "object", properties: { questions: { type: "array", items: { type: "object", properties: { question: { type: "string" }, type: { type: "string" }, options: { type: "array", items: { type: "string" } }, correct_answer: { type: "string" }, explanation: { type: "string" } }, required: [ "question", "type", "correct_answer", "explanation" ], additionalProperties: false } } }, required: [ "questions" ], additionalProperties: false } } }) }); if (!response.ok) { throw new Error(`Failed to generate questions: ${response.status} ${response.statusText}`); } const data = await response.json(); const parsedQuestions = JSON.parse(data.choices[0].message.content); setGeneratedQuestions(parsedQuestions.questions); } catch (err) { console.error(err); setError("Failed to generate questions. Please try again."); } finally{ setLoading(false); } }; const answerQuestion = async ()=>{ if (!userQuestion.trim()) { setError("Please enter a question"); return; } setAnswerLoading(true); setError(null); try { const response = await fetch("/integrations/chat-gpt/conversationgpt4", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ messages: [ { role: "system", content: "You are a knowledgeable assistant that provides detailed, accurate answers to questions across all fields and subjects. Provide comprehensive explanations that are educational and easy to understand." }, { role: "user", content: userQuestion } ] }) }); if (!response.ok) { throw new Error(`Failed to get answer: ${response.status} ${response.statusText}`); } const data = await response.json(); setAnswer(data.choices[0].message.content); } catch (err) { console.error(err); setError("Failed to get answer. Please try again."); } finally{ setAnswerLoading(false); } }; const downloadQuestions = ()=>{ if (generatedQuestions.length === 0) { setError("No questions to download"); return; } let content = `${questionType.toUpperCase()} QUESTIONS - ${field.toUpperCase()}\n`; content += `Skill Level: ${skillLevel.toUpperCase()}\n`; content += `Generated on: ${new Date().toLocaleDateString()}\n\n`; content += "=".repeat(50) + "\n\n"; generatedQuestions.forEach((q, index)=>{ content += `Question ${index + 1}:\n${q.question}\n\n`; if (q.options && q.options.length > 0) { q.options.forEach((option, optIndex)=>{ content += `${String.fromCharCode(65 + optIndex)}. ${option}\n`; }); content += "\n"; } content += `Correct Answer: ${q.correct_answer}\n`; content += `Explanation: ${q.explanation}\n\n`; content += "-".repeat(30) + "\n\n"; }); const blob = new Blob([ content ], { type: "text/plain" }); const url = URL.createObjectURL(blob); const a = document.createElement("a"); a.href = url; a.download = `${questionType}_questions_${field.replace(/\s+/g, "_")}_${skillLevel}.txt`; document.body.appendChild(a); a.click(); document.body.removeChild(a); URL.revokeObjectURL(url); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gradient-to-br from-blue-50 to-indigo-100 p-4", __source: { fileName: "", lineNumber: 190, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto", __source: { fileName: "", lineNumber: 191, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center mb-8", __source: { fileName: "", lineNumber: 192, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold text-gray-800 mb-2", __source: { fileName: "", lineNumber: 193, columnNumber: 11 }, __self: this }, "AI Question Writer & Answerer"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 196, columnNumber: 11 }, __self: this }, "Generate exam, classwork, and homework questions in any field using AI")), /*#__PURE__*/ React.createElement("div", { className: "flex justify-center mb-8", __source: { fileName: "", lineNumber: 203, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg p-1 shadow-md", __source: { fileName: "", lineNumber: 204, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setActiveTab("generate"), className: `px-6 py-2 rounded-md font-medium transition-colors ${activeTab === "generate" ? "bg-blue-500 text-white" : "text-gray-600 hover:text-blue-500"}`, __source: { fileName: "", lineNumber: 205, columnNumber: 13 }, __self: this }, "Generate Questions"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setActiveTab("answer"), className: `px-6 py-2 rounded-md font-medium transition-colors ${activeTab === "answer" ? "bg-blue-500 text-white" : "text-gray-600 hover:text-blue-500"}`, __source: { fileName: "", lineNumber: 215, columnNumber: 13 }, __self: this }, "Answer Questions"))), error && /*#__PURE__*/ React.createElement("div", { className: "bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded mb-6", __source: { fileName: "", lineNumber: 229, columnNumber: 11 }, __self: this }, error), activeTab === "generate" && /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-lg p-6 mb-8", __source: { fileName: "", lineNumber: 236, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold text-gray-800 mb-6", __source: { fileName: "", lineNumber: 237, columnNumber: 13 }, __self: this }, "Generate Questions"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6 mb-6", __source: { fileName: "", lineNumber: 241, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 242, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700 mb-2", __source: { fileName: "", lineNumber: 243, columnNumber: 17 }, __self: this }, "Field/Subject *"), /*#__PURE__*/ React.createElement("input", { type: "text", value: field, onChange: (e)=>setField(e.target.value), placeholder: "e.g., Mathematics, History, Programming, Biology...", className: "w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500", __source: { fileName: "", lineNumber: 246, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 255, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700 mb-2", __source: { fileName: "", lineNumber: 256, columnNumber: 17 }, __self: this }, "Skill Level"), /*#__PURE__*/ React.createElement("select", { value: skillLevel, onChange: (e)=>setSkillLevel(e.target.value), className: "w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500", __source: { fileName: "", lineNumber: 259, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "beginner", __source: { fileName: "", lineNumber: 264, columnNumber: 19 }, __self: this }, "Beginner"), /*#__PURE__*/ React.createElement("option", { value: "intermediate", __source: { fileName: "", lineNumber: 265, columnNumber: 19 }, __self: this }, "Intermediate"), /*#__PURE__*/ React.createElement("option", { value: "advanced", __source: { fileName: "", lineNumber: 266, columnNumber: 19 }, __self: this }, "Advanced"), /*#__PURE__*/ React.createElement("option", { value: "professional", __source: { fileName: "", lineNumber: 267, columnNumber: 19 }, __self: this }, "Professional"))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 271, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700 mb-2", __source: { fileName: "", lineNumber: 272, columnNumber: 17 }, __self: this }, "Question Type"), /*#__PURE__*/ React.createElement("select", { value: questionType, onChange: (e)=>setQuestionType(e.target.value), className: "w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500", __source: { fileName: "", lineNumber: 275, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "exam", __source: { fileName: "", lineNumber: 280, columnNumber: 19 }, __self: this }, "Exam Questions"), /*#__PURE__*/ React.createElement("option", { value: "classwork", __source: { fileName: "", lineNumber: 281, columnNumber: 19 }, __self: this }, "Classwork Questions"), /*#__PURE__*/ React.createElement("option", { value: "homework", __source: { fileName: "", lineNumber: 282, columnNumber: 19 }, __self: this }, "Homework Questions"), /*#__PURE__*/ React.createElement("option", { value: "text", __source: { fileName: "", lineNumber: 283, columnNumber: 19 }, __self: this }, "Text Questions"))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 287, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700 mb-2", __source: { fileName: "", lineNumber: 288, columnNumber: 17 }, __self: this }, "Number of Questions"), /*#__PURE__*/ React.createElement("select", { value: numQuestions, onChange: (e)=>setNumQuestions(parseInt(e.target.value)), className: "w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500", __source: { fileName: "", lineNumber: 291, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: 5, __source: { fileName: "", lineNumber: 296, columnNumber: 19 }, __self: this }, "5 Questions"), /*#__PURE__*/ React.createElement("option", { value: 10, __source: { fileName: "", lineNumber: 297, columnNumber: 19 }, __self: this }, "10 Questions"), /*#__PURE__*/ React.createElement("option", { value: 15, __source: { fileName: "", lineNumber: 298, columnNumber: 19 }, __self: this }, "15 Questions"), /*#__PURE__*/ React.createElement("option", { value: 20, __source: { fileName: "", lineNumber: 299, columnNumber: 19 }, __self: this }, "20 Questions")))), /*#__PURE__*/ React.createElement("div", { className: "flex gap-4", __source: { fileName: "", lineNumber: 304, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: generateQuestions, disabled: loading, className: "bg-blue-500 hover:bg-blue-600 disabled:bg-blue-300 text-white px-6 py-2 rounded-md font-medium transition-colors", __source: { fileName: "", lineNumber: 305, columnNumber: 15 }, __self: this }, loading ? "Generating..." : "Generate Questions"), generatedQuestions.length > 0 && /*#__PURE__*/ React.createElement("button", { onClick: downloadQuestions, className: "bg-green-500 hover:bg-green-600 text-white px-6 py-2 rounded-md font-medium transition-colors", __source: { fileName: "", lineNumber: 314, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-download mr-2", __source: { fileName: "", lineNumber: 318, columnNumber: 19 }, __self: this }), "Download Questions"))), activeTab === "answer" && /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-lg p-6 mb-8", __source: { fileName: "", lineNumber: 328, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold text-gray-800 mb-6", __source: { fileName: "", lineNumber: 329, columnNumber: 13 }, __self: this }, "Ask Any Question"), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 333, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700 mb-2", __source: { fileName: "", lineNumber: 334, columnNumber: 15 }, __self: this }, "Your Question *"), /*#__PURE__*/ React.createElement("textarea", { value: userQuestion, onChange: (e)=>setUserQuestion(e.target.value), placeholder: "Ask any question in any field - mathematics, science, history, programming, etc...", rows: 4, className: "w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500", __source: { fileName: "", lineNumber: 337, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("button", { onClick: answerQuestion, disabled: answerLoading, className: "bg-purple-500 hover:bg-purple-600 disabled:bg-purple-300 text-white px-6 py-2 rounded-md font-medium transition-colors mb-6", __source: { fileName: "", lineNumber: 346, columnNumber: 13 }, __self: this }, answerLoading ? "Getting Answer..." : "Get Answer"), answer && /*#__PURE__*/ React.createElement("div", { className: "bg-gray-50 rounded-lg p-4", __source: { fileName: "", lineNumber: 355, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-semibold text-gray-800 mb-2", __source: { fileName: "", lineNumber: 356, columnNumber: 17 }, __self: this }, "Answer:"), /*#__PURE__*/ React.createElement("div", { className: "text-gray-700 whitespace-pre-wrap", __source: { fileName: "", lineNumber: 357, columnNumber: 17 }, __self: this }, answer))), activeTab === "generate" && generatedQuestions.length > 0 && /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-lg p-6", __source: { fileName: "", lineNumber: 367, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-6", __source: { fileName: "", lineNumber: 368, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold text-gray-800", __source: { fileName: "", lineNumber: 369, columnNumber: 15 }, __self: this }, "Generated Questions"), /*#__PURE__*/ React.createElement("span", { className: "text-sm text-gray-600", __source: { fileName: "", lineNumber: 372, columnNumber: 15 }, __self: this }, generatedQuestions.length, " questions • ", skillLevel, " level •", " ", field)), /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 378, columnNumber: 13 }, __self: this }, generatedQuestions.map((question, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "border-l-4 border-blue-500 pl-4 py-2", __source: { fileName: "", lineNumber: 380, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-start justify-between mb-2", __source: { fileName: "", lineNumber: 384, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-semibold text-gray-800", __source: { fileName: "", lineNumber: 385, columnNumber: 21 }, __self: this }, "Question ", index + 1), /*#__PURE__*/ React.createElement("span", { className: "text-xs bg-blue-100 text-blue-800 px-2 py-1 rounded", __source: { fileName: "", lineNumber: 388, columnNumber: 21 }, __self: this }, question.type || questionType)), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 mb-3", __source: { fileName: "", lineNumber: 393, columnNumber: 19 }, __self: this }, question.question), question.options && question.options.length > 0 && /*#__PURE__*/ React.createElement("div", { className: "mb-3", __source: { fileName: "", lineNumber: 396, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-sm font-medium text-gray-600 mb-1", __source: { fileName: "", lineNumber: 397, columnNumber: 23 }, __self: this }, "Options:"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-1", __source: { fileName: "", lineNumber: 400, columnNumber: 23 }, __self: this }, question.options.map((option, optIndex)=>/*#__PURE__*/ React.createElement("div", { key: optIndex, className: "text-sm text-gray-600", __source: { fileName: "", lineNumber: 402, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 403, columnNumber: 29 }, __self: this }, String.fromCharCode(65 + optIndex), "."), " ", option)))), /*#__PURE__*/ React.createElement("div", { className: "bg-green-50 rounded p-3", __source: { fileName: "", lineNumber: 413, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-sm", __source: { fileName: "", lineNumber: 414, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-medium text-green-800", __source: { fileName: "", lineNumber: 415, columnNumber: 23 }, __self: this }, "Answer:"), /*#__PURE__*/ React.createElement("span", { className: "text-green-700", __source: { fileName: "", lineNumber: 418, columnNumber: 23 }, __self: this }, " ", question.correct_answer)), /*#__PURE__*/ React.createElement("p", { className: "text-sm mt-1", __source: { fileName: "", lineNumber: 423, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-medium text-green-800", __source: { fileName: "", lineNumber: 424, columnNumber: 23 }, __self: this }, "Explanation:"), /*#__PURE__*/ React.createElement("span", { className: "text-green-700", __source: { fileName: "", lineNumber: 427, columnNumber: 23 }, __self: this }, " ", question.explanation))))))))); }