function MainComponent() { const [executiveOrder, setExecutiveOrder] = useState(""); const [analysis, setAnalysis] = useState(null); const [loading, setLoading] = useState(true); const [streamingMessage, setStreamingMessage] = useState(""); const [activeChatCategory, setActiveChatCategory] = useState(null); const [showImportModal, setShowImportModal] = useState(false); const [isStreaming, setIsStreaming] = useState(false); const [executiveOrders] = useState([ { title: "Executive Order 14067", description: "Ensuring Responsible Development of Digital Assets" }, { title: "Executive Order 14028", description: "Improving the Nation's Cybersecurity" }, { title: "Executive Order 14042", description: "Ensuring Adequate COVID Safety Protocols for Federal Contractors" } ]); React.useEffect(()=>{ const timer = setTimeout(()=>{ setLoading(false); }, 2000); return ()=>clearTimeout(timer); }, []); const handleStreamResponse = useHandleStreamResponse({ onChunk: (chunk)=>{ setIsStreaming(true); setStreamingMessage(chunk); }, onFinish: (message)=>{ try { const parsedAnalysis = JSON.parse(message); setAnalysis(parsedAnalysis); setStreamingMessage(""); setIsStreaming(false); setLoading(false); } catch (e) { console.error("Failed to parse analysis"); setIsStreaming(false); setLoading(false); } } }); const analyzeImpact = async ()=>{ setLoading(true); try { const response = await fetch("/integrations/chat-gpt/conversationgpt4", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ messages: [ { role: "user", content: `Analyze this executive order and its impact: ${executiveOrder}. Provide a detailed analysis in JSON format for each category, including who is most and least impacted.` } ], json_schema: { name: "executive_order_analysis", schema: { type: "object", properties: { travel_and_transportation: { type: "object", properties: { most_impacted: { type: "string" }, least_impacted: { type: "string" } }, required: [ "most_impacted", "least_impacted" ], additionalProperties: false }, healthcare_experiences: { type: "object", properties: { most_impacted: { type: "string" }, least_impacted: { type: "string" } }, required: [ "most_impacted", "least_impacted" ], additionalProperties: false }, phone_and_internet: { type: "object", properties: { most_impacted: { type: "string" }, least_impacted: { type: "string" } }, required: [ "most_impacted", "least_impacted" ], additionalProperties: false }, workplace_life: { type: "object", properties: { most_impacted: { type: "string" }, least_impacted: { type: "string" } }, required: [ "most_impacted", "least_impacted" ], additionalProperties: false }, food_and_dining: { type: "object", properties: { most_impacted: { type: "string" }, least_impacted: { type: "string" } }, required: [ "most_impacted", "least_impacted" ], additionalProperties: false }, demographics: { type: "object", properties: { most_impacted: { type: "string" }, least_impacted: { type: "string" } }, required: [ "most_impacted", "least_impacted" ], additionalProperties: false } }, required: [ "travel_and_transportation", "healthcare_experiences", "phone_and_internet", "workplace_life", "food_and_dining", "demographics" ], additionalProperties: false } }, stream: true }) }); handleStreamResponse(response); } catch (error) { console.error("Failed to analyze:", error); } finally{ setLoading(false); } }; const renderAnalysisSection = (title, data, category)=>{ if (!data) return null; return /*#__PURE__*/ React.createElement("div", { className: "bg-white p-6 rounded-lg shadow-md flex flex-col justify-between", __source: { fileName: "", lineNumber: 151, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 152, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold mb-4 font-roboto", __source: { fileName: "", lineNumber: 153, columnNumber: 11 }, __self: this }, title), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 154, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 155, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h4", { className: "font-medium font-roboto text-green-600", __source: { fileName: "", lineNumber: 156, columnNumber: 15 }, __self: this }, "Most Impacted:"), /*#__PURE__*/ React.createElement("p", { className: "font-roboto", __source: { fileName: "", lineNumber: 159, columnNumber: 15 }, __self: this }, data.most_impacted)), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 161, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h4", { className: "font-medium font-roboto text-blue-600", __source: { fileName: "", lineNumber: 162, columnNumber: 15 }, __self: this }, "Least Impacted:"), /*#__PURE__*/ React.createElement("p", { className: "font-roboto", __source: { fileName: "", lineNumber: 165, columnNumber: 15 }, __self: this }, data.least_impacted)))), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col gap-2", __source: { fileName: "", lineNumber: 169, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setActiveChatCategory(category), className: "w-full bg-[#1a365d] text-white px-4 py-2 rounded font-roboto hover:bg-[#2a466d]", __source: { fileName: "", lineNumber: 170, columnNumber: 11 }, __self: this }, "Chat"), /*#__PURE__*/ React.createElement("button", { className: "w-full text-gray-500 px-4 py-2 rounded border border-gray-300 cursor-not-allowed font-roboto", disabled: true, __source: { fileName: "", lineNumber: 176, columnNumber: 11 }, __self: this }, "Learn more (Coming Soon)"))); }; return /*#__PURE__*/ React.createElement(React.Fragment, null, loading && !executiveOrder && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black flex justify-center items-center z-50", __source: { fileName: "", lineNumber: 190, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "loading-screen text-center flex flex-col items-center", __source: { fileName: "", lineNumber: 191, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "loading-spinner mb-5", __source: { fileName: "", lineNumber: 192, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { viewBox: "0 0 100 100", __source: { fileName: "", lineNumber: 193, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("circle", { cx: "50", cy: "50", r: "45", fill: "none", stroke: "white", strokeWidth: "5", className: "animate-[draw_2s_linear_infinite]", style: { strokeDasharray: "100", strokeDashoffset: "25" }, __source: { fileName: "", lineNumber: 194, columnNumber: 17 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "text-white font-roboto", __source: { fileName: "", lineNumber: 206, columnNumber: 13 }, __self: this }, "An AI Experiment by Mr.Hackathon"))), /*#__PURE__*/ React.createElement("div", { className: "min-h-screen flex flex-col bg-gray-50", __source: { fileName: "", lineNumber: 213, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "fixed top-0 right-0 z-50 p-4", __source: { fileName: "", lineNumber: 214, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-black text-white px-4 py-2 rounded-full font-roboto", __source: { fileName: "", lineNumber: 215, columnNumber: 11 }, __self: this }, "An AI Experiment by Mr.Hackathon")), /*#__PURE__*/ React.createElement("header", { className: "bg-[#1a365d] text-white py-6", __source: { fileName: "", lineNumber: 220, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-4", __source: { fileName: "", lineNumber: 221, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold font-roboto", __source: { fileName: "", lineNumber: 222, columnNumber: 13 }, __self: this }, "Executive Order Impact Analyzer"), /*#__PURE__*/ React.createElement("p", { className: "mt-2 font-roboto", __source: { fileName: "", lineNumber: 225, columnNumber: 13 }, __self: this }, "Understand how policy changes affect your daily life"))), /*#__PURE__*/ React.createElement("main", { className: "flex-grow container mx-auto px-4 py-8 relative", __source: { fileName: "", lineNumber: 231, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto", __source: { fileName: "", lineNumber: 232, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { className: "w-full p-4 border rounded-lg shadow-sm h-32 mb-4 font-roboto", placeholder: "Paste the executive order text here...", value: executiveOrder, onChange: (e)=>setExecutiveOrder(e.target.value), __source: { fileName: "", lineNumber: 233, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex gap-4", __source: { fileName: "", lineNumber: 239, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: analyzeImpact, disabled: loading || isStreaming || !executiveOrder, className: "bg-[#1a365d] text-white px-6 py-3 rounded-lg font-roboto hover:bg-[#2a466d] disabled:opacity-50", __source: { fileName: "", lineNumber: 240, columnNumber: 15 }, __self: this }, loading || isStreaming ? "Generating Impact Analysis..." : "Analyze Impact"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowImportModal(true), className: "bg-[#1a365d] text-white px-6 py-3 rounded-lg font-roboto hover:bg-[#2a466d]", __source: { fileName: "", lineNumber: 249, columnNumber: 15 }, __self: this }, "Import Executive Order")), (loading || isStreaming) && /*#__PURE__*/ React.createElement("div", { className: "mt-8 flex flex-col items-center", __source: { fileName: "", lineNumber: 258, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-16 h-16 border-4 border-[#1a365d] border-t-transparent rounded-full animate-spin", __source: { fileName: "", lineNumber: 259, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "mt-4 text-lg font-roboto text-gray-600", __source: { fileName: "", lineNumber: 260, columnNumber: 17 }, __self: this }, "Analyzing impact...")), !loading && !isStreaming && analysis && /*#__PURE__*/ React.createElement("div", { className: "mt-8", __source: { fileName: "", lineNumber: 267, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-6 font-roboto text-center", __source: { fileName: "", lineNumber: 268, columnNumber: 17 }, __self: this }, "Impact Analysis"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", __source: { fileName: "", lineNumber: 271, columnNumber: 17 }, __self: this }, renderAnalysisSection("Travel & Transportation", analysis.travel_and_transportation, "Travel & Transportation"), renderAnalysisSection("Healthcare Experiences", analysis.healthcare_experiences, "Healthcare Experiences"), renderAnalysisSection("Phone & Internet", analysis.phone_and_internet, "Phone & Internet"), renderAnalysisSection("Workplace Life", analysis.workplace_life, "Workplace Life"), renderAnalysisSection("Food & Dining", analysis.food_and_dining, "Food & Dining"), renderAnalysisSection("Demographics", analysis.demographics, "Demographics")))), activeChatCategory && /*#__PURE__*/ React.createElement("div", { className: "fixed top-0 right-0 h-full w-96 bg-white shadow-lg transform transition-transform duration-300 ease-in-out z-50", __source: { fileName: "", lineNumber: 308, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4 h-full flex flex-col", __source: { fileName: "", lineNumber: 309, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-4", __source: { fileName: "", lineNumber: 310, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold font-roboto", __source: { fileName: "", lineNumber: 311, columnNumber: 19 }, __self: this }, "Coming Soon"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setActiveChatCategory(null), className: "text-gray-500 hover:text-gray-700", __source: { fileName: "", lineNumber: 314, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 318, columnNumber: 21 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "flex-grow flex items-center justify-center", __source: { fileName: "", lineNumber: 321, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-gray-500 font-roboto", __source: { fileName: "", lineNumber: 322, columnNumber: 19 }, __self: this }, "Chat feature coming soon!")))), showImportModal && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 331, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg p-6 max-w-2xl w-full mx-4 max-h-[80vh] overflow-y-auto", __source: { fileName: "", lineNumber: 332, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-4", __source: { fileName: "", lineNumber: 333, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold font-roboto", __source: { fileName: "", lineNumber: 334, columnNumber: 19 }, __self: this }, "Import Executive Order"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowImportModal(false), className: "text-gray-500 hover:text-gray-700", __source: { fileName: "", lineNumber: 337, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 341, columnNumber: 21 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "grid gap-4", __source: { fileName: "", lineNumber: 344, columnNumber: 17 }, __self: this }, executiveOrders.map((order, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "bg-gray-50 p-4 rounded-lg", __source: { fileName: "", lineNumber: 346, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("h4", { className: "font-semibold mb-2 font-roboto", __source: { fileName: "", lineNumber: 347, columnNumber: 23 }, __self: this }, order.title), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 mb-3 font-roboto", __source: { fileName: "", lineNumber: 350, columnNumber: 23 }, __self: this }, order.description), /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setExecutiveOrder(order.title + "\n" + order.description); setShowImportModal(false); }, className: "bg-[#1a365d] text-white px-4 py-2 rounded font-roboto hover:bg-[#2a466d]", __source: { fileName: "", lineNumber: 353, columnNumber: 23 }, __self: this }, "Import"))))))), /*#__PURE__*/ React.createElement("footer", { className: "bg-[#1a365d] text-white py-4", __source: { fileName: "", lineNumber: 372, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-4 text-center font-roboto", __source: { fileName: "", lineNumber: 373, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 374, columnNumber: 13 }, __self: this }, "© 2025 Executive Order Impact Analyzer. All rights reserved."))), /*#__PURE__*/ React.createElement("footer", { className: "fixed bottom-4 right-4", __source: { fileName: "", lineNumber: 378, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-blue-500 text-white px-2 py-1 rounded text-sm font-roboto", __source: { fileName: "", lineNumber: 379, columnNumber: 11 }, __self: this }, "BETA"))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 385, columnNumber: 7 }, __self: this }, ` @keyframes draw { 50% { stroke-dashoffset: -100; } } .loading-spinner { width: 60px; height: 60px; } .loading-spinner svg { animation: rotate 2s linear infinite; } @keyframes rotate { 100% { transform: rotate(360deg); } } .loading-text { font-family: 'Roboto' !important; font-weight: normal; } `)); }