function AdFrameWidget() { return /*#__PURE__*/ React.createElement("div", { id: "frame", className: "w-[120px] h-auto", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("iframe", { "data-aa": "2370400", src: "//ad.a-ads.com/2370400?size=120x600", className: "w-[120px] h-[600px] border-0 p-0 overflow-hidden bg-transparent", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("a", { id: "preview-link", href: "https://aads.com/campaigns/new/?source_id=2370400&source_type=ad_unit&partner=2370400", className: "block text-right text-xs text-[#9C9FA4] hover:text-[#171B26] transition-colors duration-200", __source: { fileName: "", lineNumber: 9, columnNumber: 7 }, __self: this }, "Advertise here")); } function AdFrameWidgetStory() { return /*#__PURE__*/ React.createElement("div", { className: "p-8 bg-[#0D111D]", __source: { fileName: "", lineNumber: 22, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(AdFrameWidget, { __source: { fileName: "", lineNumber: 23, columnNumber: 7 }, __self: this })); } function FileUpload({ onFileSelect, accept = ".pdf,.xml,.txt,.csv", maxSize = 5242880 }) { const [error, setError] = useState(null); const [selectedFile, setSelectedFile] = useState(null); const [isDragging, setIsDragging] = useState(false); const [upload, { loading }] = useUpload(); const handleFile = useCallback(async (file)=>{ if (!file) return; if (!accept.split(",").some((type)=>file.name.toLowerCase().endsWith(type.replace(".", "")))) { setError("Invalid file type. Please upload PDF, XML, TXT, or CSV files only."); return; } if (file.size > maxSize) { setError("File size exceeds 5MB limit."); return; } setSelectedFile(file); setError(null); const { url, error: uploadError } = await upload({ file }); if (uploadError) { setError(uploadError); return; } onFileSelect?.(url); }, [ accept, maxSize, onFileSelect, upload ]); const handleDrop = useCallback((e)=>{ e.preventDefault(); setIsDragging(false); const file = e.dataTransfer.files[0]; handleFile(file); }, [ handleFile ]); const handleDragOver = useCallback((e)=>{ e.preventDefault(); setIsDragging(true); }, []); const handleDragLeave = useCallback((e)=>{ e.preventDefault(); setIsDragging(false); }, []); return /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-3xl mx-auto p-6", __source: { fileName: "", lineNumber: 68, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { onDrop: handleDrop, onDragOver: handleDragOver, onDragLeave: handleDragLeave, className: ` relative overflow-hidden bg-gradient-to-br from-[#EEF2FF] to-[#F8FAFF] border-4 border-dashed rounded-2xl p-16 text-center cursor-pointer transition-all duration-500 ease-bounce shadow-[0_8px_30px_rgb(0,0,0,0.06)] hover:shadow-[0_20px_50px_rgb(0,0,0,0.1)] hover:scale-[1.02] ${isDragging ? "border-[#3B82F6] bg-[#EEF2FF] scale-105 animate-pulse" : "border-[#E5E7EB] hover:border-[#3B82F6]"} `, __source: { fileName: "", lineNumber: 69, columnNumber: 7 }, __self: this }, isDragging && /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-[#3B82F6] opacity-10 rounded-2xl", __source: { fileName: "", lineNumber: 90, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "file", accept: accept, onChange: (e)=>handleFile(e.target.files[0]), className: "hidden", id: "fileInput", __source: { fileName: "", lineNumber: 93, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("label", { htmlFor: "fileInput", className: "cursor-pointer block", __source: { fileName: "", lineNumber: 100, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-8 transform transition-transform duration-300 hover:scale-110", __source: { fileName: "", lineNumber: 101, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-cloud-upload-alt text-8xl text-[#3B82F6]", __source: { fileName: "", lineNumber: 102, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("p", { className: "font-poppins text-xl text-[#4B5563] mb-3", __source: { fileName: "", lineNumber: 104, columnNumber: 11 }, __self: this }, "Drag and drop your file here"), /*#__PURE__*/ React.createElement("p", { className: "font-poppins text-lg text-[#6B7280] mb-2", __source: { fileName: "", lineNumber: 107, columnNumber: 11 }, __self: this }, "- or -"), /*#__PURE__*/ React.createElement("button", { className: "font-poppins px-6 py-3 bg-[#3B82F6] text-white rounded-lg hover:bg-[#2563EB] transition-colors duration-300", __source: { fileName: "", lineNumber: 108, columnNumber: 11 }, __self: this }, "Browse Files"), /*#__PURE__*/ React.createElement("p", { className: "font-poppins text-sm text-[#6B7280] mt-4", __source: { fileName: "", lineNumber: 111, columnNumber: 11 }, __self: this }, "Supported formats: PDF, XML, TXT, CSV (Max 5MB)")), selectedFile && /*#__PURE__*/ React.createElement("div", { className: "mt-8 py-4 px-6 bg-white/70 backdrop-blur-sm rounded-lg inline-block", __source: { fileName: "", lineNumber: 117, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-poppins text-sm text-[#4B5563] flex items-center", __source: { fileName: "", lineNumber: 118, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-file-alt mr-2 text-[#3B82F6]", __source: { fileName: "", lineNumber: 119, columnNumber: 15 }, __self: this }), selectedFile.name)), loading && /*#__PURE__*/ React.createElement("div", { className: "mt-8 font-poppins text-sm text-[#3B82F6] flex items-center justify-center", __source: { fileName: "", lineNumber: 126, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-circle-notch fa-spin mr-2", __source: { fileName: "", lineNumber: 127, columnNumber: 13 }, __self: this }), "Uploading..."), error && /*#__PURE__*/ React.createElement("div", { className: "mt-8 font-poppins text-sm text-red-500 flex items-center justify-center", __source: { fileName: "", lineNumber: 133, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-exclamation-circle mr-2", __source: { fileName: "", lineNumber: 134, columnNumber: 13 }, __self: this }), error))); } function FileUploadStory() { const handleFileSelect = (fileUrl)=>{ console.log("File uploaded:", fileUrl); }; return /*#__PURE__*/ React.createElement("div", { className: "p-8 min-h-screen bg-[#F9FAFB]", __source: { fileName: "", lineNumber: 149, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(FileUpload, { onFileSelect: handleFileSelect, __source: { fileName: "", lineNumber: 150, columnNumber: 7 }, __self: this })); } function ButtonStyling({ variant = "primary", text, keyboardCommand, onClick }) { const buttonClasses = variant === "primary" ? "bg-[#171B26] text-[#EFEFED] border-[#262A36] hover:bg-[#262A36]" : "bg-[#ECECEE] text-[#1E222D] hover:bg-[#D8D8DA]"; return /*#__PURE__*/ React.createElement("button", { className: `inline-block font-inter text-sm px-4 py-2 rounded-lg border ${buttonClasses} transition-colors duration-200`, onClick: onClick, __source: { fileName: "", lineNumber: 13, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 17, columnNumber: 7 }, __self: this }, text), keyboardCommand && /*#__PURE__*/ React.createElement("span", { className: "ml-2 bg-[#262A36] text-[#EFEFED] px-1.5 py-0.5 rounded text-xs", __source: { fileName: "", lineNumber: 19, columnNumber: 9 }, __self: this }, keyboardCommand)); } function ButtonStylingStory() { return /*#__PURE__*/ React.createElement("div", { className: "p-8 space-y-4", __source: { fileName: "", lineNumber: 29, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 30, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-inter text-lg mb-2", __source: { fileName: "", lineNumber: 31, columnNumber: 9 }, __self: this }, "Primary Button:"), /*#__PURE__*/ React.createElement(ButtonStyling, { text: "Click me", keyboardCommand: "⌘K", __source: { fileName: "", lineNumber: 32, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 34, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-inter text-lg mb-2", __source: { fileName: "", lineNumber: 35, columnNumber: 9 }, __self: this }, "Primary Button (without keyboard command):"), /*#__PURE__*/ React.createElement(ButtonStyling, { text: "Submit", __source: { fileName: "", lineNumber: 38, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 40, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-inter text-lg mb-2", __source: { fileName: "", lineNumber: 41, columnNumber: 9 }, __self: this }, "Secondary Button:"), /*#__PURE__*/ React.createElement(ButtonStyling, { variant: "secondary", text: "Cancel", __source: { fileName: "", lineNumber: 42, columnNumber: 9 }, __self: this }))); } function MainComponent() { const [file, setFile] = useState(null); const [fileContent, setFileContent] = useState(""); const [analysis, setAnalysis] = useState(""); const [error, setError] = useState(null); const [isLoading, setIsLoading] = useState(false); const [streamingMessage, setStreamingMessage] = useState(""); const [upload, { loading: uploadLoading }] = useUpload(); const handleFinish = useCallback((message)=>{ setAnalysis(message); setStreamingMessage(""); setIsLoading(false); }, []); const handleStreamResponse = useHandleStreamResponse({ onChunk: setStreamingMessage, onFinish: handleFinish }); const handleFileRead = (e)=>{ const content = e.target.result; setFileContent(content); }; const handleFileChange = (selectedFile)=>{ setFile(selectedFile); const reader = new FileReader(); reader.onload = handleFileRead; reader.readAsText(selectedFile); }; const analyzeContent = async ()=>{ setIsLoading(true); setError(null); try { const response = await fetch("/integrations/chat-gpt/conversationgpt4", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ messages: [ { role: "user", content: `You are an expert in DMARK. Analyze this DMARK report and provide a basic analysis:\n\n${fileContent}` } ], stream: true }) }); handleStreamResponse(response); } catch (err) { setError("Failed to analyze the report"); setIsLoading(false); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#0D111D] py-12 px-4 transition-all duration-300", __source: { fileName: "", lineNumber: 56, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between max-w-[1200px] mx-auto gap-8", __source: { fileName: "", lineNumber: 57, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-1", __source: { fileName: "", lineNumber: 58, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-xl shadow-lg transition-transform duration-300 hover:shadow-xl", __source: { fileName: "", lineNumber: 59, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-8 space-y-8", __source: { fileName: "", lineNumber: 60, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-medium font-roboto text-[#171B26] tracking-tight", __source: { fileName: "", lineNumber: 61, columnNumber: 15 }, __self: this }, "DMARK Report Analyzer"), /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 65, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "transition-all duration-300 ease-in-out", __source: { fileName: "", lineNumber: 66, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "file", accept: ".txt,.xml", onChange: (e)=>{ if (e.target.files) { handleFileChange(e.target.files[0]); } }, className: "block w-full text-sm text-[#9C9FA4] file:mr-4 file:py-3 file:px-6 file:rounded-lg file:border-0 file:text-sm file:font-medium file:bg-[#EFEFED] file:text-[#171B26] hover:file:bg-[#E4E7EA] transition-colors duration-200", __source: { fileName: "", lineNumber: 67, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("button", { onClick: analyzeContent, disabled: !fileContent || isLoading, className: "w-full md:w-auto bg-[#171B26] text-[#EFEFED] px-6 py-3 rounded-lg hover:bg-[#262A36] disabled:bg-[#9C9FA4] disabled:cursor-not-allowed transition-all duration-200 font-roboto", __source: { fileName: "", lineNumber: 79, columnNumber: 17 }, __self: this }, isLoading ? /*#__PURE__*/ React.createElement("span", { className: "flex items-center justify-center", __source: { fileName: "", lineNumber: 85, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-circle-notch fa-spin mr-2", __source: { fileName: "", lineNumber: 86, columnNumber: 23 }, __self: this }), "Analyzing...") : "Analyze Report"), error && /*#__PURE__*/ React.createElement("div", { className: "text-red-500 font-medium font-roboto p-4 bg-red-50 rounded-lg transition-all duration-200", __source: { fileName: "", lineNumber: 95, columnNumber: 19 }, __self: this }, error), (streamingMessage || analysis) && /*#__PURE__*/ React.createElement("div", { className: "mt-8 p-6 bg-[#ECECEE] rounded-lg transition-all duration-300", __source: { fileName: "", lineNumber: 101, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-medium font-roboto text-[#171B26] mb-4", __source: { fileName: "", lineNumber: 102, columnNumber: 21 }, __self: this }, "Analysis Results"), /*#__PURE__*/ React.createElement("div", { className: "prose max-w-none font-roboto text-[#262A36] leading-relaxed", __source: { fileName: "", lineNumber: 105, columnNumber: 21 }, __self: this }, streamingMessage || analysis)))))), /*#__PURE__*/ React.createElement("div", { className: "hidden lg:block", __source: { fileName: "", lineNumber: 114, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement(AdFrameWidget, { __source: { fileName: "", lineNumber: 115, columnNumber: 11 }, __self: this })))); }